/* ============================================================
   Site chat assistant (plan: site chat v1, 2026-09-10). Loaded on every static
   page from the SHELL in build.js beside site.css. Scoped under .idl-chat.
   Light theme only, like every widget on this site. Brand tokens match
   site.css; the values are repeated here because this file can load before
   the page's own tokens are applied.

   The page is zoomed 117% (site.css). Fixed elements are zoomed with it, so
   56px here paints at about 65px, which is the intended size.
   ============================================================ */
.idl-chat {
  --c-blue:#2271B1; --c-blue-deep:#1A5C93; --c-ink:#16263F; --c-soft:#43536B; --c-muted:#6B7C93;
  --c-border:#D9E5F4; --c-border-firm:#BBD2ED; --c-tint:#E7F0FC; --c-page:#F9F9F9; --c-surface:#FFFFFF;
  font-family:'Source Sans 3', system-ui, -apple-system, sans-serif; font-size:15.5px; line-height:1.45; color:var(--c-ink);
}
.idl-chat *, .idl-chat *::before, .idl-chat *::after { box-sizing:border-box; }
.idl-chat p { margin:0; }

.idl-chat-bubble {
  position:fixed; right:22px; bottom:22px; z-index:9000;
  display:inline-flex; align-items:center; gap:8px;
  height:50px; padding:0 18px 0 14px; border-radius:999px; border:0; cursor:pointer;
  background:var(--c-ink); color:#fff;
  font-family:'Archivo', 'Source Sans 3', system-ui, sans-serif; font-size:15px; font-weight:700; letter-spacing:-.01em;
  box-shadow:0 10px 26px -10px rgba(22,38,63,.55); transition:background .13s ease, transform .13s ease;
}
.idl-chat-bubble:hover { background:var(--c-blue); transform:translateY(-1px); }
.idl-chat-bubble:focus-visible { outline:3px solid var(--c-blue); outline-offset:3px; }
.idl-chat-bubble svg { width:22px; height:22px; flex:0 0 auto; }
.idl-chat.is-open .idl-chat-bubble { display:none; }

.idl-chat-panel {
  position:fixed; right:22px; bottom:22px; z-index:9001;
  width:380px; max-width:calc(100vw - 32px); height:560px; max-height:calc(100vh - 44px);
  display:none; flex-direction:column; overflow:hidden;
  background:var(--c-surface); border:1px solid var(--c-border); border-radius:16px;
  box-shadow:0 24px 60px -24px rgba(22,38,63,.5);
}
.idl-chat.is-open .idl-chat-panel { display:flex; }

.idl-chat-head {
  display:flex; align-items:center; gap:10px; padding:12px 14px;
  background:var(--c-tint); border-bottom:1px solid var(--c-border);
}
.idl-chat-head b { font-family:'Archivo', sans-serif; font-size:15.5px; font-weight:700; letter-spacing:-.01em; flex:1; }
.idl-chat-head small { display:block; font-weight:400; font-size:12.5px; color:var(--c-muted); }
.idl-chat-close {
  width:34px; height:34px; border-radius:9px; border:0; background:transparent; color:var(--c-soft); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
}
.idl-chat-close:hover { background:#fff; color:var(--c-blue); }
.idl-chat-close:focus-visible { outline:2px solid var(--c-blue); }

.idl-chat-log { flex:1; overflow-y:auto; padding:14px 14px 6px; display:flex; flex-direction:column; gap:10px; background:var(--c-page); }
.idl-chat-msg { max-width:88%; padding:10px 13px; border-radius:14px; white-space:pre-wrap; overflow-wrap:anywhere; }
.idl-chat-msg.is-user { align-self:flex-end; background:var(--c-blue); color:#fff; border-bottom-right-radius:5px; }
.idl-chat-msg.is-bot { align-self:flex-start; background:var(--c-surface); border:1px solid var(--c-border); border-bottom-left-radius:5px; }
.idl-chat-msg.is-err { align-self:flex-start; background:#FCEBEA; border:1px solid #F0C2BE; color:#8C1D18; }
.idl-chat-msg ul { margin:6px 0 0; padding-left:18px; }
.idl-chat-msg li { margin:2px 0; }
.idl-chat-src { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.idl-chat-src a {
  font-size:13px; font-weight:600; color:var(--c-blue); text-decoration:none;
  background:var(--c-tint); border:1px solid var(--c-border); border-radius:999px; padding:3px 10px;
}
.idl-chat-src a:hover { border-color:var(--c-blue); }
.idl-chat-typing { align-self:flex-start; color:var(--c-muted); font-size:14px; padding:6px 13px; }
.idl-chat-typing::after { content:"…"; animation:idl-chat-dots 1.2s steps(4,end) infinite; }
@keyframes idl-chat-dots { 0% { content:""; } 25% { content:"."; } 50% { content:".."; } 75% { content:"..."; } }

.idl-chat-chips { display:flex; flex-wrap:wrap; gap:6px; padding:0 14px 8px; background:var(--c-page); }
/* display:flex above would beat the hidden attribute; the chips go away after the first message. */
.idl-chat-chips[hidden], .idl-chat-form[hidden] { display:none; }
.idl-chat-chips button {
  font:inherit; font-size:13.5px; font-weight:600; color:var(--c-blue); background:var(--c-surface);
  border:1px solid var(--c-border-firm); border-radius:999px; padding:6px 11px; cursor:pointer;
}
.idl-chat-chips button:hover { border-color:var(--c-blue); background:var(--c-tint); }

.idl-chat-next { display:flex; flex-wrap:wrap; gap:8px; padding:8px 14px; border-top:1px solid var(--c-border); background:var(--c-surface); }
.idl-chat-next a {
  flex:1 1 auto; text-align:center; font-size:13.5px; font-weight:700; text-decoration:none; color:var(--c-blue);
  border:1.5px solid var(--c-border-firm); border-radius:999px; padding:7px 10px; white-space:nowrap;
}
.idl-chat-next a:first-child { background:var(--c-blue); color:#fff; border-color:var(--c-blue); }
.idl-chat-next a:hover { border-color:var(--c-blue); }

.idl-chat-form { display:flex; gap:8px; padding:10px 14px 6px; background:var(--c-surface); }
.idl-chat-form textarea {
  flex:1; resize:none; font:inherit; font-size:16px; color:var(--c-ink); background:var(--c-surface);
  border:1px solid var(--c-border-firm); border-radius:11px; padding:9px 12px; min-height:42px; max-height:110px; line-height:1.4;
}
.idl-chat-form textarea:focus-visible { outline:none; border-color:var(--c-blue); box-shadow:0 0 0 3px rgba(34,113,177,.22); }
.idl-chat-send {
  width:44px; height:42px; border-radius:11px; border:0; background:var(--c-blue); color:#fff; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
}
.idl-chat-send:hover { background:var(--c-blue-deep); }
.idl-chat-send[disabled] { opacity:.55; cursor:progress; }
.idl-chat-send:focus-visible { outline:2px solid var(--c-blue); outline-offset:2px; }
.idl-chat-note { padding:0 14px 10px; font-size:12px; line-height:1.35; color:var(--c-muted); background:var(--c-surface); }

@media (max-width:600px) {
  .idl-chat-panel { right:0; bottom:0; width:100vw; max-width:100vw; height:100vh; height:100dvh; max-height:none; border-radius:0; border:0; }
  .idl-chat-bubble { right:16px; bottom:16px; }
  .idl-chat-next a { font-size:12.5px; }
}
@media (prefers-reduced-motion:reduce) { .idl-chat * { transition:none !important; animation:none !important; } }
