/* ---------- GLOBAL ---------- */
html {
  min-height: 100%;
}

/* let the page grow */
body {
  min-height: 100%;
  /* no hard stop at 100 vh */
  margin: 0;
  font-family: 'Asap Condensed', Arial, sans-serif;
  color: #fff;
  background: linear-gradient(to top left, #525252 0%, #2D2D2D 100%) fixed;
  background-repeat: no-repeat;
}

p {
  line-height: 1.5;
}

a {
  color: #ffffff;
  text-decoration: underline;
}

/* hide mobile copy on desktop */
.desc-mobile {
  display: none;
}

.outer-shell {
  min-height: calc(100% - 60px);
  display: flex;
  justify-content: center;
}

.container {
  max-width: 1600px;
  width: 75%;
  min-width: 820px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 50px;
  box-sizing: border-box;
}

/* LEFT COLUMN */
.left-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-right: 40px;
}

.logo {
  width: 150px;
  height: 70px;
  object-fit: contain;
  margin-bottom: 20px;
}

.desc-desktop {
  max-width: 450px;
}

/* RIGHT COLUMN */
.chat-wrapper {
  width: 500px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.chat-wrapper iframe {
  width: 500px;
  border: none;
}

/* height set by JS */
.disclaimer {
  font-size: 10px;
  text-align: center;
  margin-top: 8px;
  line-height: 1.5;
}

/* FOOTER */
.footer {
  position: absolute;
  left: 0;
  bottom: 10px;
  width: 100%;
  text-align: center;
  font-size: 12px;
}

#banner {
  align-items: center;
  background-color: black;
  display: flex;
  height: 50px;
}

#webchat {
  width: 100%;
  border: none;
  box-sizing: border-box;
}



#webchat,
#webchat .webchat__send-box-text-box,
#webchat .webchat__link-definitions__list-item-body,
#webchat * {
  --webchat__font--primary: 'Asap Condensed', 'Arial', sans-serif !important;
}

#webchat .webchat__send-box-text-box {
  font-family: 'Asap Condensed', Arial, sans-serif !important;
}

#webchat .webchat__link-definitions__list-item-body {
  font-family: 'Asap Condensed', Arial, sans-serif !important;
}

/* ---------- MOBILE ---------- */
@media(max-width:767px) {
  .outer-shell {
    min-height: 0;
  }

  /* let it flow */
  .container {
    flex-direction: column;
    align-items: center;
    padding: 20px;
    width: 100%;
    min-width: 0;
  }

  .left-area {
    align-items: center;
    margin: 0 0 20px;
  }

  .logo {
    width: 120px;
    height: auto;
    margin-bottom: 20px;
  }

  .desc-desktop {
    display: none;
  }

  .chat-wrapper {
    width: 100%;
  }

  .chat-wrapper iframe {
    width: 100%;
    height: 80vh;
  }

  .desc-mobile {
    display: block;
    margin-top: 20px;
    padding: 0 10px;
  }

  .footer {
    position: static;
    padding: 10px 0 20px;
  }
}

/* target just the reference-modal body, not regular chat bubbles */
.webchat__modal-dialog__body,
.webchat__modal-dialog__body * {
  /* block highlight / copy */
  user-select: none !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  /* optional – hides long-press copy menu on iOS */
  -webkit-touch-callout: none !important;
}

.webchat__modal-dialog__box {
  width:      200px !important;
  max-width:  200px !important;
  min-width:  200px !important;   /* defeats the built-in 608 px */
  height:     70px  !important;
  max-height: 70px  !important;
}

/* 1 )  The summary header “3 references” bar  */
#webchat .webchat__link-definitions__header,
#webchat .webchat__link-definitions__header * {
  display: none !important;
}

/* 2 )  The expandable list that holds the links */
#webchat .webchat__link-definitions {
  display: none !important;
}

/* 3 )  The little [1], [2], [3] superscripts that appear inside the answer bubble */
#webchat .webchat__citation-link {
  display: none !important;
}

/* ── hide the superscript citation buttons inside every bubble ───────── */
#webchat button.webchat__render-markdown__citation,
#webchat .webchat__render-markdown__citation {
  display: none !important;
}

/* you can keep the earlier rules if you also want the expandable
   reference panel at the bottom of the answer to stay hidden       */
#webchat .webchat__link-definitions,
#webchat .webchat__link-definitions__header,
#webchat .webchat__link-definitions__header *,
#webchat .webchat__citation-link {          /* old class name, safe to leave */
  display: none !important;
}

.ac-textBlock,
.ac-factTitle,
.ac-factValue,
.ac-input {
  font-family: 'Asap Condensed', Arial, sans-serif !important;
}

.ac-horizontal-separator {
  border-bottom-color: #666 !important;
  border-bottom-width: 2px !important;
}

.webchat__suggested-actions__button-text {
  font-family: 'Asap Condensed', Arial, sans-serif !important;
  font-size: 14px !important;
}