/* AI-chattens utseende — EN källa för hela sajten (2026-07-30).
 *
 * Låg som ett block i src/styles/site.css t.o.m. 2026-07-30, då chatten
 * flyttades ut till en publik asset för att kunna ligga på legacy-sidorna
 * under public/ också (de kan inte importera ur Astro-bundlen). Reglerna är
 * portade ordagrant; ENDA ändringen är att varje var() fått ett fallback-värde
 * och att .aiw-msg strong tillkommit (fetstil i modellsvar, se chatt.v1.js).
 *
 * Fallbacken finns för att legacy-sidornas site.v5.css saknar --grey-l (den
 * heter --muted-l där, samma värde #9A9A96). Med fallbacks slipper vi röra
 * site.v5.css, som serveras immutable, och filen renderar rätt oavsett vilket
 * stylesheet som lastats.
 *
 * Formspråket lånas av #top-btn (guldring, mörkt glas) och .modal-card
 * (ink-2, guld-topplinje). Mockupen har ingen chatt.
 *
 * OBS: #top-btn{bottom:88px} ligger kvar i site.css. Den regeln handlar om
 * huvudsajtens topp-knapp som kliver upp för att chatten tar hörnet, och
 * legacy-sidorna har ingen topp-knapp att stapla.
 */
#aiw-toggle{position:fixed;right:22px;bottom:22px;width:54px;height:54px;border-radius:50%;border:1.5px solid var(--gold,#C9A227);background:rgba(13,13,13,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--gold,#C9A227);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:90;transition:background .25s,color .25s,transform .25s var(--spring,cubic-bezier(.34,1.45,.5,1));box-shadow:0 10px 34px rgba(0,0,0,.45)}
#aiw-toggle svg{width:24px;height:24px}
#aiw-toggle:hover{background:var(--gold,#C9A227);color:var(--ink,#111111);transform:translateY(-2px)}
#aiw-toggle:focus-visible{outline:2px solid var(--gold,#C9A227);outline-offset:3px}
#aiw-toggle[aria-expanded="true"]{background:var(--gold,#C9A227);color:var(--ink,#111111)}

#aiw-panel{position:fixed;right:22px;bottom:88px;z-index:95;width:min(400px,calc(100vw - 32px));height:min(560px,72vh);display:flex;flex-direction:column;background:var(--ink-2,#181818);border:1px solid var(--line-d,#2A2A2A);border-top:2px solid var(--gold,#C9A227);border-radius:8px;box-shadow:0 40px 120px rgba(0,0,0,.6);color:var(--on-dark,#F5F5F3);overflow:hidden}
#aiw-panel[hidden]{display:none}
.aiw-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line-d,#2A2A2A)}
.aiw-title{display:block;font-family:'Montserrat',sans-serif;font-weight:700;font-size:15px;letter-spacing:.02em}
.aiw-sub{display:block;font-family:'Montserrat',sans-serif;font-size:10px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--gold,#C9A227);margin-top:3px}
#aiw-close{background:none;border:0;color:var(--grey-l,#9A9A96);font-size:24px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:var(--r,3px)}
#aiw-close:hover{color:var(--on-dark,#F5F5F3)}
#aiw-close:focus-visible{outline:2px solid var(--gold,#C9A227);outline-offset:2px}
.aiw-msgs{flex:1;overflow-y:auto;padding:16px 16px 8px;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin;scrollbar-color:var(--line-d,#2A2A2A) transparent}
.aiw-msg{max-width:86%;padding:10px 13px;border-radius:8px;font-size:14.5px;line-height:1.55;white-space:pre-wrap;word-break:break-word}
.aiw-msg.bot{align-self:flex-start;background:#1E1E1E;border:1px solid var(--line-d,#2A2A2A);border-bottom-left-radius:3px}
.aiw-msg.user{align-self:flex-end;background:var(--paper,#FFFFFF);color:var(--ink,#111111);border-bottom-right-radius:3px}
.aiw-msg.typing{color:var(--grey-l,#9A9A96);letter-spacing:3px;animation:aiwPulse 1.1s ease-in-out infinite}
/* Modellen skriver **fetstil** kring priser och namn. Klienten renderade
   textContent, så asteriskerna syntes rått i bubblan (2026-07-30). */
.aiw-msg strong{font-weight:700}
@keyframes aiwPulse{50%{opacity:.35}}
.aiw-leadbar{display:flex;gap:8px;padding:10px 16px;border-top:1px solid var(--line-d,#2A2A2A)}
.aiw-leadbar button{flex:1;font-family:'Montserrat',sans-serif;font-weight:600;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;padding:10px 8px;border-radius:var(--r,3px);border:1px solid var(--line-d,#2A2A2A);background:transparent;color:var(--on-dark,#F5F5F3);cursor:pointer;transition:border-color .2s,color .2s}
.aiw-leadbar button:hover{border-color:var(--gold,#C9A227);color:var(--gold,#C9A227)}
.aiw-leadbar button:focus-visible{outline:2px solid var(--gold,#C9A227);outline-offset:2px}
/* Ring-länken (ersatte boka-knappen 2026-07-14) speglar knapparnas utseende.
   Låg i ChatWidget.astros <style is:global> före 2026-07-30. */
.aiw-leadbar a{flex:1;font-family:'Montserrat',sans-serif;font-weight:600;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;padding:10px 8px;border-radius:var(--r,3px);border:1px solid var(--line-d,#2A2A2A);background:transparent;color:var(--on-dark,#F5F5F3);text-align:center;text-decoration:none;transition:border-color .2s,color .2s}
.aiw-leadbar a:hover{border-color:var(--gold,#C9A227);color:var(--gold,#C9A227)}
.aiw-leadbar a:focus-visible{outline:2px solid var(--gold,#C9A227);outline-offset:2px}
.aiw-lead{display:none;padding:12px 16px;border-top:1px solid var(--line-d,#2A2A2A);flex-direction:column;gap:8px}
.aiw-lead.show{display:flex}
.aiw-lead input,.aiw-lead textarea{background:#1a1a1a;border:1px solid var(--line-d,#2A2A2A);border-radius:var(--r,3px);color:var(--on-dark,#F5F5F3);font:inherit;font-size:14px;padding:10px 12px;resize:none}
.aiw-lead input:focus-visible,.aiw-lead textarea:focus-visible{outline:2px solid var(--gold,#C9A227);outline-offset:1px;border-color:var(--gold,#C9A227)}
.aiw-lead-row{display:flex;gap:8px}
.aiw-send{flex:1;font-family:'Montserrat',sans-serif;font-weight:600;font-size:12px;letter-spacing:.05em;text-transform:uppercase;padding:11px;border-radius:var(--r,3px);border:0;background:var(--paper,#FFFFFF);color:var(--ink,#111111);cursor:pointer}
.aiw-send:hover{background:var(--gold,#C9A227)}
.aiw-cancel{font-family:'Montserrat',sans-serif;font-weight:600;font-size:12px;letter-spacing:.05em;text-transform:uppercase;padding:11px 14px;border-radius:var(--r,3px);border:1px solid var(--line-d,#2A2A2A);background:transparent;color:var(--grey-l,#9A9A96);cursor:pointer}
.aiw-cancel:hover{color:var(--on-dark,#F5F5F3);border-color:var(--on-dark,#F5F5F3)}
.aiw-lead-status{font-size:13px;color:var(--grey-l,#9A9A96);min-height:1.1em;margin:0}
.aiw-form{display:flex;gap:8px;padding:12px 16px 14px;border-top:1px solid var(--line-d,#2A2A2A)}
.aiw-form input{flex:1;background:#1a1a1a;border:1px solid var(--line-d,#2A2A2A);border-radius:var(--r,3px);color:var(--on-dark,#F5F5F3);font:inherit;font-size:14.5px;padding:11px 13px}
.aiw-form input:focus-visible{outline:2px solid var(--gold,#C9A227);outline-offset:1px;border-color:var(--gold,#C9A227)}
.aiw-form button{width:46px;border-radius:var(--r,3px);border:1px solid var(--gold,#C9A227);background:transparent;color:var(--gold,#C9A227);font-size:18px;cursor:pointer;transition:background .2s,color .2s}
.aiw-form button:hover{background:var(--gold,#C9A227);color:var(--ink,#111111)}
.aiw-form button:focus-visible{outline:2px solid var(--gold,#C9A227);outline-offset:2px}
@media(max-width:820px){
  /* Sticky CTA-baren är borttagen 2026-07-28 (Albins beslut: för säljig på
     mobil — bara chatten och topp-knappen ska finnas där). Mobilen får därmed
     samma stapel som desktop (chatten i hörnet på 22, topp-knappen ovanför på
     88), plus iPhonens hemindikator via env(safe-area-inset-bottom) (0 på
     Android/desktop; kräver viewport-fit=cover i sidans viewport-meta). */
  #aiw-toggle{bottom:calc(22px + env(safe-area-inset-bottom))}
  #aiw-panel{bottom:calc(88px + env(safe-area-inset-bottom));height:min(520px,calc(100dvh - 120px - env(safe-area-inset-bottom)))}
}
@media(prefers-reduced-motion:reduce){.aiw-msg.typing{animation:none}}