/* ═══════════════════════════════════════════════════════════════════════════════════════
   THE ASSISTANT
   A real panel, not a bubble in the corner that everyone has learned to ignore. Full sheet
   on a phone, floating panel on a laptop, and a launcher that says what it is rather than
   showing a speech-bubble icon.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ── launcher ─────────────────────────────────────────────────────────────────────── */
.va-launch{position:fixed;right:18px;/* --va-lift is set at runtime to the height of any bar fixed to the bottom of the   page, so the launcher sits above it rather than on top of it. On the application   form it was covering more than half the Continue button and eating the clicks. */bottom:calc(18px + var(--va-lift, 0px));z-index:1300;display:flex;align-items:center;gap:12px;
  background:#E8001D;color:#fff;border:none;border-radius:99px;padding:9px 20px 9px 9px;cursor:pointer;
  font-family:inherit;font-size:15px;font-weight:700;letter-spacing:-.01em;text-align:left;
  /* Black shadow, not a red glow: on the red stats band a red glow disappears, a black one
     still reads as a raised object. */
  box-shadow:0 12px 30px -6px rgba(0,0,0,.55),0 3px 8px rgba(0,0,0,.4),0 0 0 2px rgba(255,255,255,.14);
  transition:transform .2s,box-shadow .2s,background .2s;}
.va-launch:hover{background:#C5001A;transform:translateY(-2px);
  box-shadow:0 18px 40px -8px rgba(0,0,0,.6),0 4px 10px rgba(0,0,0,.45),0 0 0 2px rgba(255,255,255,.2);}
.va-launch[hidden]{display:none;}
/* White disc so the red glyph inside has something to sit on and never merges with the pill. */
.va-launch-dot{position:relative;width:38px;height:38px;border-radius:50%;background:#fff;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;color:#E8001D;}
.va-launch-dot svg{display:block;width:19px;height:19px;}
/* The ring sits OUTSIDE the disc and is clipped nowhere, so it never overlaps the glyph. */
.va-launch-dot:after{content:"";position:absolute;inset:-5px;border-radius:50%;
  border:2px solid rgba(255,255,255,.55);animation:vaRing 2.6s ease-out infinite;pointer-events:none;}
@keyframes vaRing{0%{transform:scale(.88);opacity:.85}70%{transform:scale(1.28);opacity:0}100%{opacity:0}}
.va-launch-t{display:flex;flex-direction:column;align-items:flex-start;line-height:1.25;min-width:0;}
/* Second line cycles through real questions so it reads as a person waiting, not a button. */
.va-launch-q{display:block;font-size:11.5px;font-weight:600;color:rgba(255,255,255,.9);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;max-width:190px;transition:opacity .35s,transform .35s;}
.va-launch-q.swap{opacity:0;transform:translateY(-5px);}
.va-launch-t small{font-size:11.5px;font-weight:500;color:rgba(255,255,255,.85);}

/* ── panel ────────────────────────────────────────────────────────────────────────── */
.va-panel{position:fixed;right:20px;bottom:calc(20px + var(--va-lift, 0px));z-index:1310;width:400px;max-width:calc(100vw - 40px);
  height:min(640px,calc(100vh - 40px));background:#fff;border-radius:22px;overflow:hidden;
  display:none;flex-direction:column;box-shadow:0 30px 80px -20px rgba(0,0,0,.55);
  opacity:0;transform:translateY(12px) scale(.98);transition:opacity .22s,transform .26s cubic-bezier(.16,1,.3,1);}
.va-panel.open{display:flex;}
.va-panel.in{opacity:1;transform:none;}

.va-head{flex:0 0 auto;background:#0B0B0C;color:#fff;padding:16px 18px;display:flex;align-items:center;gap:12px;}
.va-head-ic{position:relative;width:38px;height:38px;border-radius:50%;background:#E8001D;color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.va-head-ic:after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid rgba(232,0,29,.45);
  animation:vaRing 3s ease-out infinite;}
.va-head-t{flex:1;min-width:0;}
.va-head-t b{display:block;font-size:15.5px;font-weight:700;letter-spacing:-.01em;}
.va-head-t span{display:flex;align-items:center;gap:6px;font-size:12px;color:rgba(255,255,255,.55);margin-top:1px;}
.va-head-t i{width:7px;height:7px;border-radius:50%;background:#22C55E;display:inline-block;}
.va-x{width:32px;height:32px;border-radius:50%;border:none;background:rgba(255,255,255,.12);color:#fff;
  font-size:19px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.va-x:hover{background:rgba(255,255,255,.24);}

.va-body{flex:1;min-height:0;overflow-y:auto;padding:18px;background:#F7F7F9;
  display:flex;flex-direction:column;gap:12px;}
.va-msg{max-width:86%;font-size:14.8px;line-height:1.55;padding:12px 15px;border-radius:16px;white-space:pre-wrap;}
.va-msg.bot{align-self:flex-start;background:#fff;color:#1D2939;border:1px solid #EAECF0;border-bottom-left-radius:5px;}
.va-msg.me{align-self:flex-end;background:#E8001D;color:#fff;border-bottom-right-radius:5px;}
.va-msg a{color:inherit;text-decoration:underline;}
.va-msg.bot a{color:#E8001D;}

/* typing */
.va-typing{align-self:flex-start;display:flex;gap:4px;padding:14px 16px;background:#fff;border:1px solid #EAECF0;
  border-radius:16px;border-bottom-left-radius:5px;}
.va-typing i{width:7px;height:7px;border-radius:50%;background:#C4C4CC;animation:vaDot 1.3s infinite;}
.va-typing i:nth-child(2){animation-delay:.18s}.va-typing i:nth-child(3){animation-delay:.36s}
@keyframes vaDot{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* opening suggestions */
.va-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px;}
.va-chip{background:#fff;border:1.5px solid #E4E4EC;border-radius:99px;padding:9px 14px;font-family:inherit;
  font-size:13.5px;font-weight:600;color:#344054;cursor:pointer;transition:border-color .16s,color .16s;}
.va-chip:hover{border-color:#E8001D;color:#E8001D;}

.va-foot{flex:0 0 auto;border-top:1px solid #EAECF0;background:#fff;padding:12px 14px calc(12px + env(safe-area-inset-bottom));}
.va-form{display:flex;align-items:flex-end;gap:9px;}
.va-input{flex:1;border:1.5px solid #E4E4EC;border-radius:14px;padding:12px 14px;font-family:inherit;
  font-size:16px;line-height:1.4;resize:none;max-height:120px;color:#0B0B0C;background:#F7F7F9;}
.va-input:focus{outline:none;border-color:#E8001D;background:#fff;box-shadow:0 0 0 4px rgba(232,0,29,.09);}
.va-send{width:46px;height:46px;flex-shrink:0;border:none;border-radius:14px;background:#E8001D;color:#fff;
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .16s,opacity .16s;}
.va-send:hover{background:#C5001A;}
.va-send:disabled{opacity:.4;cursor:default;}
.va-legal{text-align:center;font-size:11px;color:#98A2B3;margin:8px 0 0;}
.va-legal a{color:#667085;}

@media(max-width:600px){
  /* --va-lift has to be repeated in every breakpoint that sets bottom, or the base
     rule loses the cascade and the launcher drops back onto the action bar. */
  .va-launch{right:14px;bottom:calc(14px + var(--va-lift, 0px));padding:11px 17px 11px 12px;font-size:14.5px;}
  .va-panel{right:0;left:0;bottom:0;width:100%;max-width:none;height:88vh;border-radius:20px 20px 0 0;
    transform:translateY(100%);}
  .va-panel.in{transform:none;}
  .va-body{padding:16px 14px;}
  .va-msg{max-width:90%;}
}
@media(prefers-reduced-motion:reduce){
  .va-launch-dot:after{animation:none;}
  .va-panel{transition:none;}
  .va-typing i{animation-duration:3s;}
}

/* ── voice ────────────────────────────────────────────────────────────────────────
   Speaking is faster than typing on a phone, and someone standing at a car with a
   question is not going to type it. The button only appears where the browser can
   actually do it, so it never sits there dead. */
.va-mic{width:46px;height:46px;flex-shrink:0;border:1.5px solid #E4E4EC;border-radius:14px;background:#F7F7F9;
  color:#475467;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s;}
.va-mic:hover{border-color:#E8001D;color:#E8001D;}
.va-mic[hidden]{display:none;}
.va-mic.live{background:#E8001D;border-color:#E8001D;color:#fff;}
.va-mic.live:after{content:"";position:absolute;}
.va-mic-ring{position:relative;}
.va-mic.live .va-mic-ic{animation:vaPulse 1.1s ease-in-out infinite;}
@keyframes vaPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.18);opacity:.75}}
/* What it heard, live, above the box — so nobody wonders whether it is working. */
.va-heard{font-size:13px;color:#667085;background:#FEF3F2;border:1px solid #FECDCA;border-radius:12px;
  padding:9px 12px;margin-bottom:9px;line-height:1.45;}
.va-heard[hidden]{display:none;}
.va-heard b{color:#E8001D;font-weight:700;}

/* The greeting types itself in, so the panel feels answered rather than pre-written. */
.va-msg.typing-in:after{content:"";display:inline-block;width:2px;height:1em;background:#E8001D;
  margin-left:2px;vertical-align:-2px;animation:vaCaret .8s step-end infinite;}
@keyframes vaCaret{0%,100%{opacity:1}50%{opacity:0}}

@media(max-width:600px){
  /* Clear of the thumb zone and clear of iOS home indicator. */
  .va-launch{right:12px;bottom:calc(12px + env(safe-area-inset-bottom) + var(--va-lift, 0px));padding:10px 17px 10px 10px;font-size:14px;}
  .va-launch-dot{width:33px;height:33px;}
  .va-launch-q{max-width:150px;font-size:11px;}
}