/* AIron.Coach — Ask-AI bubble.
 * Shared by the landing (../ask.css) and every docs page. Tokens (--bg, --brand,
 * --line, --mute, --display) are defined by whichever stylesheet loaded first;
 * lp.css and docs.css declare the same set, so this file never redefines them. */

/* ---- floating action button ---- */
.dock-fab{
  position:fixed;right:20px;bottom:20px;z-index:40;
  width:58px;height:58px;padding:0;border:0;border-radius:999px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--brand);color:var(--brand-ink);
  box-shadow:0 16px 38px -12px #F04A25aa;
  transition:transform .18s cubic-bezier(.16,1,.3,1);
}
.dock-fab svg{width:26px;height:26px;display:block}
.dock-fab:hover{transform:translateY(-2px)}
.dock-fab:active{transform:translateY(0) scale(.96)}

/* ---- greeting teaser that sits beside the button until dismissed ---- */
.dock-teaser{
  position:fixed;right:88px;bottom:26px;z-index:40;
  max-width:min(260px,calc(100vw - 120px));
  padding:.7rem 2rem .7rem .85rem;
  background:#10131A;border:1px solid #2A3140;border-radius:12px;
  color:#D5D9E2;font-size:.86rem;line-height:1.4;
  box-shadow:0 18px 44px -18px #000;
}
.dock-teaser .x{
  position:absolute;top:.25rem;right:.3rem;
  border:0;background:none;color:var(--mute);cursor:pointer;
  font-size:1rem;line-height:1;padding:.15rem .3rem;
}
.dock-teaser .x:hover{color:var(--ink)}
@media (max-width:559px){.dock-teaser{display:none}}

/* ---- panel ---- */
.dock{
  position:fixed;right:20px;bottom:20px;z-index:41;
  width:min(420px,calc(100vw - 32px));max-height:min(660px,calc(100dvh - 32px));
  display:none;flex-direction:column;overflow:hidden;
  background:#10131A;border:1px solid #2A3140;border-radius:16px;
  box-shadow:0 30px 80px -20px #000;
}
.dock.open{display:flex}
/* phones: the panel takes the screen, so the keyboard never hides the input */
@media (max-width:559px){
  .dock{left:10px;right:10px;bottom:10px;width:auto;max-height:calc(100dvh - 20px);border-radius:14px}
}
.dock-head{
  display:flex;align-items:center;gap:.6rem;padding:.7rem .8rem .7rem 1rem;
  border-bottom:1px solid var(--line);background:var(--bg-2);
}
.dock-head .avatar{
  width:32px;height:32px;border-radius:9px;flex:none;
  display:inline-flex;align-items:center;justify-content:center;
  background:#1D2430;border:1px solid #2A3140;
}
.dock-head .avatar svg{width:18px;height:18px;display:block}
.dock-head .who{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.dock-head strong{font-family:var(--display);font-size:.95rem;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dock-head .sub{color:var(--mute);font-size:.74rem;line-height:1.15}
.dock-head .reset{
  flex:none;border:1px solid #2E3542;background:none;color:var(--mute);cursor:pointer;
  font-family:inherit;font-size:.76rem;line-height:1;padding:.42rem .6rem;border-radius:7px;
}
.dock-head .reset:hover{color:var(--ink);border-color:#3F4858}
.dock-head .x{
  flex:none;border:0;background:none;color:var(--mute);cursor:pointer;
  font-size:1.35rem;line-height:1;padding:.1rem .3rem;
}
.dock-head .x:hover{color:var(--ink)}

/* ---- AI disclosure: the product's whole pitch is that AI never pretends ---- */
.dock-disclosure{
  position:relative;margin:.7rem .8rem 0;padding:.55rem 1.8rem .55rem .75rem;
  background:#1C1509;border:1px solid #3D2E12;border-radius:9px;
  color:#E5CE9C;font-size:.77rem;line-height:1.4;
}
.dock-disclosure .x{
  position:absolute;top:.15rem;right:.25rem;
  border:0;background:none;color:#B39A62;cursor:pointer;
  font-size:1rem;line-height:1;padding:.15rem .3rem;
}
.dock-disclosure .x:hover{color:#E5CE9C}

.dock-log{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.85rem;overscroll-behavior:contain}
.msg{max-width:92%;border-radius:10px;padding:.7rem .9rem;font-size:.95rem;white-space:pre-wrap;overflow-wrap:anywhere}
.msg.you{align-self:flex-end;background:#1D2430;color:var(--ink)}
.msg.bot{align-self:flex-start;background:#171B23;border:1px solid var(--line);color:#D5D9E2}
.msg.err{align-self:flex-start;background:#241214;border:1px solid #4A2328;color:#E8B7BC}

/* ---- suggested questions ---- */
.dock-chips{display:flex;flex-wrap:wrap;gap:.4rem;align-self:stretch}
.dock-chips .chip{
  border:1px solid #333B49;background:#141820;color:#D5D9E2;cursor:pointer;
  border-radius:999px;padding:.42rem .8rem;font-size:.83rem;font-family:inherit;
  text-align:left;line-height:1.3;
}
.dock-chips .chip:hover{border-color:var(--brand);color:var(--ink)}
.dock-chips .chip:disabled{opacity:.5;cursor:default}

/* ---- sources: tiles only for what the answer leaned on, links for the rest ---- */
.srcs{display:flex;flex-direction:column;gap:.4rem;align-self:stretch;margin-top:-.3rem}
.src-card{
  display:flex;gap:.6rem;align-items:center;padding:.45rem .6rem;text-decoration:none;
  background:#141820;border:1px solid var(--line);border-radius:10px;min-width:0;
}
.src-card:hover{border-color:#3A4250}
.src-card img{width:36px;height:36px;object-fit:cover;object-position:top;border-radius:6px;border:1px solid #2A3140;flex:none}
.src-card > div{min-width:0}
.src-card .t{color:var(--ink);font-family:var(--display);font-weight:600;font-size:.86rem;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.src-card .s{color:var(--mute);font-size:.78rem;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.src-more{display:flex;flex-wrap:wrap;gap:.25rem .7rem;align-items:baseline;padding:.1rem .15rem;font-size:.8rem;color:var(--mute)}
.src-more .lbl{color:#6C7686}
.src-more a{color:#B9C0CC;text-decoration:none;border-bottom:1px solid #333B49;line-height:1.5}
.src-more a:hover{color:var(--ink);border-color:var(--brand)}

.dock-form{display:flex;gap:.5rem;padding:.8rem;border-top:1px solid var(--line);background:var(--bg-2)}
.dock-form input{
  flex:1;min-width:0;min-height:44px;padding:.55rem .8rem;border-radius:9px;
  background:#0F1218;border:1px solid #3A4250;color:var(--ink);font-size:16px;font-family:inherit;
}
.dock-form input:focus{outline:2px solid var(--brand);outline-offset:1px;border-color:var(--brand)}
.dock-form button{
  min-height:44px;padding:.55rem 1rem;border:0;border-radius:9px;cursor:pointer;
  background:var(--brand);color:var(--brand-ink);font-family:var(--display);font-weight:700;font-size:.92rem;
}
.dock-form button:disabled{opacity:.55;cursor:wait}
.typing{color:var(--mute);font-size:.9rem;align-self:flex-start}

@media (prefers-reduced-motion:reduce){.dock-fab{transition:none}}

/* ---- Light theme -------------------------------------------------------
   ask.css predates theming and hardcodes a dark surface palette, so rather
   than rewriting every rule we restate the surfaces that actually carry a
   background or a border. Applied for system-light (unless the visitor has
   explicitly chosen dark) and for the [data-theme=light] toggle. Contrast of
   every text pairing below is AA-verified — see shots/contrast.mjs. */
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]){
  --ask-surface:#FFFFFF; --ask-surface-2:#F2F1ED; --ask-line:#E0DFDA;
  --ask-line-hi:#BFBCB4; --ask-ink:#14171D; --ask-text:#2E3440; --ask-mute:#5C6472;
  --ask-you:#EFEDE7; --ask-note:#7A5B12; --ask-note-bg:#FDF6E3; --ask-note-line:#E8D9A8;
}}
:root[data-theme="light"]{
  --ask-surface:#FFFFFF; --ask-surface-2:#F2F1ED; --ask-line:#E0DFDA;
  --ask-line-hi:#BFBCB4; --ask-ink:#14171D; --ask-text:#2E3440; --ask-mute:#5C6472;
  --ask-you:#EFEDE7; --ask-note:#7A5B12; --ask-note-bg:#FDF6E3; --ask-note-line:#E8D9A8;
}


/* Surfaces restated through tokens. --ask-* is defined ONLY in the light blocks
   above, so each fallback below is the original dark value and dark is untouched.
   One rule set, no duplication between the media query and the toggle. */
.dock{background:var(--ask-surface,#10131A);border-color:var(--ask-line,#2A3140)}
.dock-teaser{background:var(--ask-surface,#10131A);border-color:var(--ask-line,#2A3140);color:var(--ask-text,#D5D9E2)}
.dock-head{background:var(--ask-surface-2,#141820);border-bottom-color:var(--ask-line,#2A3140)}
.dock-head strong{color:var(--ask-ink,#F3F1EC)}
.dock-head .sub{color:var(--ask-mute,#6C7686)}
.dock-log{background:var(--ask-surface,#10131A)}
.msg.you{background:var(--ask-you,#1D2430);color:var(--ask-ink,#F3F1EC)}
.msg.bot{background:var(--ask-surface-2,#171B23);border-color:var(--ask-line,#2A3140);color:var(--ask-text,#D5D9E2)}
.dock-chips .chip{border-color:var(--ask-line,#2A3140);color:var(--ask-text,#D5D9E2)}
.dock-chips .chip:hover{border-color:var(--ask-line-hi,#3A4250)}
.dock-disclosure{background:var(--ask-note-bg,#1D1804);border-color:var(--ask-note-line,#3A2F08);color:var(--ask-note,#E5CE9C)}
.dock form{background:var(--ask-surface-2,#141820);border-top-color:var(--ask-line,#2A3140)}
.dock input,.dock textarea{background:var(--ask-surface,#10131A);border-color:var(--ask-line,#2A3140);color:var(--ask-ink,#F3F1EC)}
