* {
  box-sizing: border-box;
}

body {
  font-family: Arial, Helvetica, sans-serif;
  background-color: #d9d9d9;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 320px;
  min-height: 100vh;
}

#chat-window-container {
  display: flex;
  width: 600px;
  height: 800px;
  resize: both;
  overflow: auto;
}

/*
From https://fonts.sage.com/sage-ui.css
and/or https://brand.sage.com/

We don't build these fonts into our web component
to avoid blowing out the size. However because
we are integrating into other Sage products where
these fonts are present, we can use them, and fall
back to Arial where they are not.
*/
/* Sage UI font family */
@font-face {
  font-family: "Sage UI";
  src: url("./Sage_UI-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Sage UI";
  src: url("./Sage_UI-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Sage UI";
  src: url("./Sage_UI-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}