/* Floating AI chat widget - shared across every page. Reads the host page's own CSS custom
   properties (--bg, --card, --line, --text, --muted, --accent, --accent2, --radius) so it always
   matches that page's theme without redefining them here. */

.lkchat-btn{
  position:fixed;right:20px;bottom:20px;z-index:80;
  width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  box-shadow:0 8px 24px rgba(0,0,0,.35);
  display:flex;align-items:center;justify-content:center;
  transition:transform .2s;
}
.lkchat-btn:hover{transform:translateY(-2px)}
.lkchat-btn svg{width:26px;height:26px;stroke:#04211d;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lkchat-btn[aria-expanded="true"] .lkchat-ico-open{display:none}
.lkchat-btn[aria-expanded="false"] .lkchat-ico-close{display:none}

.lkchat-panel{
  position:fixed;right:20px;bottom:88px;z-index:80;
  width:360px;max-width:calc(100vw - 40px);height:520px;
  max-height:calc(100vh - 130px);max-height:calc(100dvh - 130px);
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:0 16px 48px rgba(0,0,0,.45);
  display:flex;flex-direction:column;overflow:hidden;
}
.lkchat-panel[hidden]{display:none}

.lkchat-head{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.lkchat-head strong{font-size:.95rem;color:var(--text)}
.lkchat-head small{display:block;color:var(--muted);font-size:.78rem;margin-top:2px}
.lkchat-close{background:none;border:none;color:var(--muted);cursor:pointer;padding:4px;line-height:1}
.lkchat-close svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round}

.lkchat-body{flex:1;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.lkchat-msg{max-width:85%;padding:9px 13px;border-radius:12px;font-size:.88rem;line-height:1.45;white-space:pre-wrap;word-wrap:break-word}
.lkchat-msg.user{align-self:flex-end;background:linear-gradient(90deg,var(--accent),#38b2ac);color:#04211d}
.lkchat-msg.assistant{align-self:flex-start;background:var(--card2,var(--bg2,#18222e));border:1px solid var(--line);color:var(--text)}
.lkchat-msg.error{align-self:flex-start;background:transparent;border:1px solid var(--line);color:var(--muted)}
.lkchat-msg.error a{color:var(--accent)}
.lkchat-typing{align-self:flex-start;color:var(--muted);font-size:.85rem;padding:4px 4px}

.lkchat-form{border-top:1px solid var(--line);padding:10px;display:flex;gap:8px;align-items:flex-end}
.lkchat-form textarea{
  flex:1;resize:none;height:44px;max-height:84px;overflow-y:hidden;background:var(--bg2,#0f151d);color:var(--text);
  border:1px solid var(--line);border-radius:9px;padding:9px 11px;font:inherit;font-size:16px;
  line-height:1.4;box-sizing:border-box;
}
.lkchat-form textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.lkchat-send{background:linear-gradient(135deg,var(--accent),var(--accent2));border:none;border-radius:9px;width:38px;height:38px;flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.lkchat-send:disabled{opacity:.5;cursor:default}
.lkchat-send svg{width:18px;height:18px;stroke:#04211d;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.lkchat-disclaimer{padding:0 12px 10px;font-size:.72rem;color:var(--muted);text-align:center}
.lkchat-disclaimer a{color:var(--muted);text-decoration:underline}

@media(max-width:480px){
  /* top+bottom anchors instead of a computed height: the browser fills whatever space is
     actually left between them, so this stays correct when the on-screen keyboard shrinks the
     visible area - a height derived from 100vh does not shrink with it on iOS Safari, which
     pushed the panel's top (and its close button) off the top of the screen once the input was
     focused and the keyboard opened. */
  .lkchat-panel{right:12px;left:12px;top:70px;bottom:82px;width:auto;height:auto}
  .lkchat-btn{right:16px;bottom:16px}
  /* The panel's own header already has a close button on this narrow a screen there is no
     room for both without the floating toggle overlapping the panel's bottom edge. */
  .lkchat-btn[aria-expanded="true"]{display:none}
}

@media(prefers-reduced-motion:reduce){
  .lkchat-btn{transition:none}
}
