/* The offer assistant is a compact desktop panel and a full-screen mobile view. */
.ai-chat-widget {
  position: fixed;
  z-index: 2200;
  right: 22px;
  bottom: 22px;
}
.chat-toggle {
  display: inline-flex;
  min-width: 150px;
  min-height: 58px;
  align-items: center;
  gap: 11px;
  padding: 8px 20px 8px 9px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  background: #102b39;
  box-shadow: 0 16px 44px rgba(6,32,43,.2);
  color: #fff;
  font-family: var(--offer-sans);
  font-size: .8rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform .35s var(--offer-ease), box-shadow .35s var(--offer-ease);
}
.chat-toggle:hover { transform: translateY(-3px); box-shadow: 0 20px 52px rgba(6,32,43,.26); }
.chat-mark { width: 38px; height: 38px; flex: none; border: 1px solid rgba(255,255,255,.32); border-radius: 50%; background: radial-gradient(circle at 38% 36%,#fff 0 10%,transparent 11%),linear-gradient(145deg,rgba(255,255,255,.16),transparent); }
body.chat-open .chat-toggle { display: none; }

.chat-window {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  width: min(500px,calc(100vw - 28px));
  height: min(720px,calc(100dvh - 44px));
  min-height: 340px;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid rgba(16,43,57,.12);
  border-radius: 24px;
  background: #f1f6f7;
  box-shadow: 0 30px 100px rgba(4,31,43,.24);
  transform-origin: bottom right;
  transition: opacity .38s var(--offer-ease),transform .38s var(--offer-ease),visibility .38s;
}
.chat-window.hidden {
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
  transform: translateY(18px) scale(.97);
}
.chat-header {
  display: flex;
  flex: 0 0 auto;
  min-height: 84px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 16px 15px 20px;
  background: #102b39;
  color: #fff;
}
.chat-brand { display: flex; min-width: 0; align-items: center; gap: 11px; }
.chat-brand-mark {
  display: grid;
  width: 42px;
  height: 42px;
  flex: none;
  place-items: center;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 14px;
  background: rgba(255,255,255,.11);
  color: #fff;
  font-family: var(--offer-display);
  font-size: 2rem;
  line-height: 1;
}
.chat-header small { display: block; overflow: hidden; color: #aac5ce; font-family: var(--offer-utility); font-size: .58rem; font-weight: 700; letter-spacing: .1em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.chat-header h3 { margin: 2px 0 0; color: #fff; font-family: var(--offer-sans); font-size: 1.08rem; font-weight: 600; letter-spacing: -.035em; line-height: 1.2; }
.chat-header-actions { display: flex; flex: none; align-items: center; gap: 3px; }
.chat-header-actions button {
  display: grid;
  min-width: 44px;
  height: 44px;
  place-items: center;
  padding: 0 6px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #d4e2e6;
  font-family: var(--offer-utility);
  font-size: .68rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .3s var(--offer-ease),color .3s var(--offer-ease);
}
.chat-header-actions button:hover { background: rgba(255,255,255,.12); color: #fff; }
.chat-email:not(.active) { display: none; }
.chat-close { font-size: 1.65rem !important; font-weight: 400 !important; line-height: 1; }

.chat-messages {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  flex-direction: column;
  gap: 15px;
  padding: 24px 20px 30px;
  background: #f1f6f7;
  overscroll-behavior: contain;
  scrollbar-color: #b4cad0 transparent;
  scrollbar-width: thin;
}
.chat-message {
  position: relative;
  width: fit-content;
  max-width: calc(100% - 50px);
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid rgba(16,43,57,.075);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(18,62,78,.045);
  color: #173847;
  font-family: var(--offer-sans);
  font-size: .9rem;
  line-height: 1.56;
  overflow-wrap: anywhere;
  word-break: normal;
}
.chat-message.ai { align-self: flex-start; margin-left: 40px; border-top-left-radius: 5px; }
.chat-message.ai::before {
  position: absolute;
  top: 1px;
  left: -41px;
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border-radius: 11px;
  background: #d8e9ec;
  color: #1d5061;
  content: "e";
  font-family: var(--offer-display);
  font-size: 1.45rem;
  line-height: 1;
}
.chat-message.user { align-self: flex-end; border-color: #102b39; border-bottom-right-radius: 5px; background: #102b39; box-shadow: none; color: #fff; }
.chat-message p { margin: 0 0 12px; }
.chat-message p:last-child { margin-bottom: 0; }
.chat-message ul { margin: 9px 0 13px; padding-left: 20px; }
.chat-message li { margin: 5px 0; padding-left: 2px; }
.chat-message h1,.chat-message h2,.chat-message h3,.chat-message h4 { margin: 0 0 8px; color: inherit; font-family: var(--offer-sans); font-size: .93rem; font-weight: 750; letter-spacing: -.015em; line-height: 1.35; }
.chat-message strong { font-weight: 750; }
.chat-inline-link { color: #1c6077; font-weight: 750; text-decoration: underline; text-decoration-color: #a5ccd5; text-underline-offset: 3px; overflow-wrap: anywhere; }
.chat-inline-link:hover { color: #0a4155; text-decoration-color: currentColor; }
.chat-suggestions { display: grid; gap: 8px; width: calc(100% - 40px); margin-left: 40px; }
.suggestion-btn {
  min-height: 44px;
  padding: 11px 14px;
  border: 1px solid #cbdde1;
  border-radius: 13px;
  background: #fff;
  color: #174255;
  font-family: var(--offer-utility);
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
  transition: background .3s var(--offer-ease),transform .3s var(--offer-ease);
}
.suggestion-btn:hover { background: #e7f2f4; transform: translateX(2px); }
.chat-message.typing { width: 72px; min-height: 46px; margin-left: 40px; }
.chat-message.tool-status,.chat-message.tool-error,.chat-message.search-results,.chat-message.webpage-analysis,.chat-message.callback-confirmation { max-width: calc(100% - 40px); margin-left: 40px; }

.chat-form {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 10px;
  padding: 13px 15px;
  border-top: 1px solid #dbe7e9;
  background: #fff;
}
.chat-form input {
  width: 100%;
  min-width: 0;
  height: 52px;
  min-height: 52px;
  flex: 1 1 auto;
  margin: 0;
  padding: 0 16px;
  border: 1px solid #c7d8dc;
  border-radius: 15px;
  background: #f8fbfb;
  box-shadow: none;
  color: #153746;
  font-family: var(--offer-utility);
  font-size: 16px;
  outline: none !important;
  transition: border-color .3s var(--offer-ease),box-shadow .3s var(--offer-ease);
}
.chat-form input:focus { border-color: #3e8298; box-shadow: 0 0 0 3px rgba(62,130,152,.18); }
.chat-form input::placeholder { color: #6a828b; opacity: 1; }
.chat-form button {
  min-width: 76px;
  height: 52px;
  padding: 0 15px;
  border: 0;
  border-radius: 15px;
  background: #102b39;
  color: #fff;
  font-family: var(--offer-utility);
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .3s var(--offer-ease);
}
.chat-form button:hover { background: #356e82; }
.chat-form button:disabled { opacity: .5; cursor: wait; }
.chat-window :focus-visible { outline: 3px solid #75b6cc; outline-offset: 2px; }
.chat-form input:focus-visible { outline: none !important; }

@media (max-width: 760px) {
  .ai-chat-widget { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom,0px)); }
  .chat-toggle { min-width: 56px; width: 56px; min-height: 56px; justify-content: center; padding: 8px; }
  .chat-toggle > span:last-child { display: none; }
  body.chat-open .ai-chat-widget,
  body.chat-open.conversion-form-in-view .ai-chat-widget {
    position: fixed;
    z-index: 5000;
    inset: 0;
    width: 100%;
    height: 100dvh;
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
  body.chat-open .chat-window {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100dvh;
    height: var(--chat-mobile-height,100dvh);
    min-height: 0;
    max-height: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    transform: none;
  }
  .chat-header { min-height: 76px; padding: calc(13px + env(safe-area-inset-top,0px)) 13px 13px 16px; }
  .chat-brand { gap: 9px; }
  .chat-brand-mark { width: 37px; height: 37px; border-radius: 11px; font-size: 1.7rem; }
  .chat-header small { max-width: 160px; font-size: .52rem; }
  .chat-header h3 { font-size: 1rem; }
  .chat-header-actions { gap: 0; }
  .chat-header-actions button { min-width: 44px; height: 44px; font-size: .63rem; }
  .chat-messages { padding: 22px 16px 26px; }
  .chat-message { max-width: calc(100% - 42px); padding: 13px 15px; font-size: .94rem; }
  .chat-message.ai { margin-left: 36px; }
  .chat-message.ai::before { left: -36px; width: 28px; height: 28px; border-radius: 9px; font-size: 1.3rem; }
  .chat-suggestions { width: calc(100% - 36px); margin-left: 36px; }
  .chat-message.typing,.chat-message.tool-status,.chat-message.tool-error,.chat-message.search-results,.chat-message.webpage-analysis,.chat-message.callback-confirmation { margin-left: 36px; }
  .chat-form { padding: 10px 12px calc(10px + env(safe-area-inset-bottom,0px)); }
  .chat-form input,.chat-form button { height: 50px; min-height: 50px; }
}
@media (max-width: 360px) {
  .chat-header small { max-width: 120px; }
  .chat-brand-mark { display: none; }
  .chat-messages { padding-inline: 12px; }
  .chat-form { gap: 8px; padding-inline: 9px; }
  .chat-form button { min-width: 68px; }
}
@media (prefers-reduced-motion: reduce) {
  .chat-window,.chat-toggle,.chat-form input,.chat-form button,.suggestion-btn { transition: none !important; }
}