/* ===================================================================
   CVT assistant — chat widget
   Brand tokens mirror styles.css so the widget stays in step with the site.
   =================================================================== */

.cvtc {
  --c-blue:#1A4A7D; --c-blue-deep:#123A66; --c-accent:#F26B3A; --c-accent-deep:#C2410C;
  --c-ink:#15243A; --c-slate:#5B6B80; --c-slate-2:#8CA0B5;
  --c-line:#E3EAF2; --c-paper:#F7FAFD; --c-tint:#EAF1F8;
  --c-radius:16px;
  --c-shadow:0 24px 60px -18px rgba(21,36,58,.34);
  font-family:'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}

/* ---------- launcher ---------- */
.cvtc__launcher{
  position:fixed; right:22px; bottom:22px; z-index:2147483000;
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 22px; border:0; border-radius:999px; cursor:pointer;
  background:var(--c-accent); color:#fff;
  font:600 15px/1.2 'Hanken Grotesk', Arial, sans-serif; white-space:nowrap;
  box-shadow:0 14px 34px -10px rgba(242,107,58,.6);
  transition:transform .18s ease, box-shadow .18s ease, background .2s ease;
}
.cvtc__launcher:hover{ transform:translateY(-2px); background:#e35f2f;
  box-shadow:0 18px 40px -10px rgba(242,107,58,.7); }
.cvtc__launcher:focus-visible{ outline:3px solid var(--c-blue); outline-offset:3px; }
.cvtc__launcher[hidden]{ display:none; }
.cvtc__launcher svg{ flex:0 0 auto; }

/* ---------- panel ---------- */
.cvtc__panel{
  position:fixed; right:22px; bottom:22px; z-index:2147483001;
  width:390px; max-width:calc(100vw - 32px);
  height:min(620px, calc(100vh - 44px));
  display:flex; flex-direction:column; overflow:hidden;
  background:#fff; border:1px solid var(--c-line); border-radius:var(--c-radius);
  box-shadow:var(--c-shadow);
  opacity:0; transform:translateY(12px) scale(.98); pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
}
.cvtc__panel.is-open{ opacity:1; transform:none; pointer-events:auto; }

/* ---------- header ---------- */
.cvtc__head{
  display:flex; align-items:center; gap:9px; padding:15px 14px 15px 16px;
  background:var(--c-blue); color:#fff; flex:0 0 auto;
}
.cvtc__avatar{
  width:38px; height:38px; border-radius:11px; flex:0 0 auto;
  background:rgba(255,255,255,.14); display:flex; align-items:center; justify-content:center;
}
.cvtc__ht{ flex:1; min-width:0; }
.cvtc__title{ font-family:'Schibsted Grotesk', Arial, sans-serif; font-weight:700; font-size:15.5px; }
.cvtc__status{ display:flex; align-items:center; gap:6px; font-size:12px; color:#BBD3E9; margin-top:2px; }
.cvtc__dot{ width:7px; height:7px; border-radius:50%; background:#8CA0B5; flex:0 0 auto; }
.cvtc__dot--live{ background:#3DD68C; box-shadow:0 0 0 3px rgba(61,214,140,.22); }
.cvtc__dot--wait{ background:#E8A13A; }
.cvtc__dot--err{ background:#E5484D; }
.cvtc__hbtn{
  width:34px; height:34px; border:0; border-radius:9px; cursor:pointer; flex:0 0 auto;
  background:rgba(255,255,255,.12); color:#fff; display:flex; align-items:center; justify-content:center;
  transition:background .2s ease;
}
.cvtc__hbtn:hover{ background:rgba(255,255,255,.24); }
.cvtc__hbtn:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
.cvtc__hbtn[aria-pressed="true"]{ background:var(--c-accent); }

/* end-chat control */
.cvtc__endbtn{
  flex:0 0 auto; border:1px solid rgba(255,255,255,.34); background:transparent; color:#fff;
  font:600 12.5px 'Hanken Grotesk', Arial, sans-serif; padding:7px 12px; border-radius:999px;
  cursor:pointer; white-space:nowrap; transition:background .2s, border-color .2s;
}
.cvtc__endbtn:hover{ background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.6); }
.cvtc__endbtn:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
.cvtc__endbtn[hidden]{ display:none; }
.cvtc__restart{ border-color:var(--c-accent); color:var(--c-accent-deep); font-weight:700; }

/* ---------- messages ---------- */
.cvtc__log{
  flex:1 1 auto; overflow-y:auto; padding:18px 16px 8px;
  background:var(--c-paper); display:flex; flex-direction:column; gap:12px;
  overscroll-behavior:contain;
}
.cvtc__msg{ max-width:86%; padding:11px 14px; border-radius:14px; font-size:14.5px; line-height:1.5; white-space:pre-wrap; word-wrap:break-word; }
.cvtc__msg--ai{ align-self:flex-start; background:#fff; color:var(--c-ink); border:1px solid var(--c-line); border-bottom-left-radius:5px; }
.cvtc__msg--me{ align-self:flex-end; background:var(--c-blue); color:#fff; border-bottom-right-radius:5px; }
.cvtc__msg--sys{ align-self:center; background:var(--c-tint); color:var(--c-slate); font-size:12.5px; text-align:center; border-radius:10px; padding:8px 12px; max-width:100%; }
.cvtc__msg--err{ align-self:center; background:#FDECEC; color:#A3242A; font-size:12.5px; text-align:center; border-radius:10px; padding:8px 12px; }

.cvtc__typing{ align-self:flex-start; display:none; gap:4px; padding:12px 15px; background:#fff;
  border:1px solid var(--c-line); border-radius:14px; border-bottom-left-radius:5px; }
.cvtc__typing.is-on{ display:flex; }
.cvtc__typing i{ width:7px; height:7px; border-radius:50%; background:var(--c-slate-2); animation:cvtc-b 1.2s infinite ease-in-out; }
.cvtc__typing i:nth-child(2){ animation-delay:.15s } .cvtc__typing i:nth-child(3){ animation-delay:.3s }
@keyframes cvtc-b{ 0%,60%,100%{ transform:translateY(0); opacity:.45 } 30%{ transform:translateY(-4px); opacity:1 } }

/* ---------- suggestion chips ---------- */
.cvtc__chips{ display:flex; flex-wrap:wrap; gap:8px; padding:4px 16px 12px; background:var(--c-paper); }
.cvtc__chip{
  border:1px solid var(--c-line); background:#fff; color:var(--c-blue);
  font:600 13px 'Hanken Grotesk', Arial, sans-serif; padding:8px 13px; border-radius:999px; cursor:pointer;
  transition:border-color .2s, color .2s, background .2s;
}
.cvtc__chip:hover{ border-color:var(--c-accent); color:var(--c-accent-deep); background:#fff8f5; }
.cvtc__chip:focus-visible{ outline:2px solid var(--c-accent); outline-offset:2px; }

/* ---------- composer ---------- */
.cvtc__foot{ flex:0 0 auto; border-top:1px solid var(--c-line); background:#fff; padding:12px 14px 10px; }
.cvtc__row{ display:flex; align-items:flex-end; gap:9px; }
.cvtc__input{
  flex:1; resize:none; max-height:110px; min-height:42px;
  border:1.5px solid var(--c-line); border-radius:12px; padding:11px 13px;
  font:400 14.5px/1.45 'Hanken Grotesk', Arial, sans-serif; color:var(--c-ink); background:#fff;
  transition:border-color .2s;
}
.cvtc__input:focus{ outline:none; border-color:var(--c-blue); }
.cvtc__input::placeholder{ color:var(--c-slate-2); }
.cvtc__input:disabled{ background:var(--c-paper); color:var(--c-slate-2); cursor:not-allowed; }
.cvtc__send{
  width:42px; height:42px; flex:0 0 auto; border:0; border-radius:12px; cursor:pointer;
  background:var(--c-accent); color:#fff; display:flex; align-items:center; justify-content:center;
  transition:background .2s, opacity .2s;
}
.cvtc__send:hover:not(:disabled){ background:#e35f2f; }
.cvtc__send:disabled{ opacity:.4; cursor:not-allowed; }
.cvtc__send:focus-visible{ outline:3px solid var(--c-blue); outline-offset:2px; }
.cvtc__note{ margin-top:8px; font-size:11.5px; color:var(--c-slate-2); text-align:center; line-height:1.45; }
.cvtc__note a{ color:var(--c-slate); text-decoration:underline; }

/* ---------- mobile ---------- */
@media (max-width:560px){
  .cvtc__panel{ right:0; bottom:0; width:100%; max-width:100%; height:100dvh; border-radius:0; border:0; }
  .cvtc__launcher{ right:16px; bottom:16px; padding:13px 18px; font-size:14px; }
}

/* ---------- accessibility ---------- */
@media (prefers-reduced-motion:reduce){
  .cvtc__panel,.cvtc__launcher{ transition:none; }
  .cvtc__typing i{ animation:none; }
}
.cvtc__sr{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0; }
