/* ============================================================================
   assistant.css — "Steph", the floating enquiry bubble (contract clause 7).

   A circular monogram bubble, not a labelled pill. The name renders in the
   panel header next to the role line — "Virtual assistant" — which is what
   keeps a patient from believing they are messaging Dr. Steph herself.
   ============================================================================ */
.asst{ position:fixed; right:clamp(1rem,3vw,1.75rem); bottom:clamp(1rem,3vw,1.75rem); z-index:1400; }

/* --- the bubble --------------------------------------------------------- */
.asst-launch{
  position:relative;
  width:64px; height:64px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--deep);
  box-shadow:0 6px 24px rgba(15,33,31,.35), 0 2px 6px rgba(15,33,31,.28);
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.asst-launch:hover{ transform:translateY(-2px); box-shadow:0 10px 32px rgba(15,33,31,.4), 0 3px 8px rgba(15,33,31,.3); }
.asst-launch:active{ transform:scale(.94); }

.asst-monogram{
  position:relative;
  font-family:var(--font-display); font-style:italic; font-weight:400;
  font-size:1.75rem; line-height:1; color:var(--white);
  display:inline-flex; flex-direction:column; align-items:center;
  transform:translateY(-2px);
}
.asst-mono-swoosh{ width:30px; height:8px; margin-top:2px; overflow:visible; }
.asst-mono-swoosh path{
  fill:none; stroke:var(--mint); stroke-width:9; stroke-linecap:round;
}

/* Live status dot: mint while the clinic is open, muted after hours. */
.asst-launch-dot{
  position:absolute; top:4px; right:4px;
  width:12px; height:12px; border-radius:50%;
  background:#8a8f92; border:2px solid var(--deep);
}
.asst.is-clinic-open .asst-launch-dot{ background:var(--mint); }

/* Gentle attention pulse, a few seconds after load, motion-safe only. */
@media (prefers-reduced-motion: no-preference){
  .asst-launch::after{
    content:""; position:absolute; inset:0; border-radius:50%;
    box-shadow:0 0 0 0 rgba(108,219,214,.45);
    animation:asstPulse 3.2s var(--ease) 2s 2;
  }
  @keyframes asstPulse{
    0%{ box-shadow:0 0 0 0 rgba(108,219,214,.45); }
    70%{ box-shadow:0 0 0 16px rgba(108,219,214,0); }
    100%{ box-shadow:0 0 0 0 rgba(108,219,214,0); }
  }
}

/* --- the panel ---------------------------------------------------------- */
.asst-panel{
  position:absolute; right:0; bottom:calc(100% + .875rem);
  width:min(24rem, calc(100vw - 2rem));
  max-height:min(34rem, calc(100vh - 6rem));
  display:flex; flex-direction:column;
  background:var(--paper); border:1px solid var(--line);
  border-radius:18px; box-shadow:var(--shadow-2); overflow:hidden;
  transform-origin:bottom right;
}
.asst-panel[hidden]{ display:none; }
@media (prefers-reduced-motion: no-preference){
  .asst-panel{ animation:asstPop 260ms cubic-bezier(.2,.9,.3,1.15); }
  @keyframes asstPop{ from{ opacity:0; transform:scale(.92) translateY(8px); } }
}

.asst-head{
  display:flex; align-items:center; gap:.875rem;
  padding:1rem 1.125rem; background:var(--deep); color:var(--ink-on-dark);
}
.asst-avatar{
  flex:0 0 auto;
  width:40px; height:40px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--mint); color:var(--ink);
  font-family:var(--font-display); font-style:italic; font-size:1.25rem;
}
.asst-head > div{ flex:1; min-width:0; }
.asst-title{ display:block; font-family:var(--font-display); font-size:1.1875rem; font-weight:400; }
/* 12px floor, same as .ba-pill — this line carries the clinic-hours status. */
.asst-status{ display:block; font-family:var(--font-ui); font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; color:rgba(244,244,241,.65); margin-top:.125rem; }
.asst-close{ width:40px; height:40px; font-size:1.375rem; line-height:1; color:var(--ink-on-dark); border-radius:50%; }
.asst-close:hover{ background:rgba(255,255,255,.12); }

.asst-log{ flex:1; overflow-y:auto; padding:1.25rem; display:flex; flex-direction:column; gap:1rem; }
.asst-msg{ font-size:var(--fs-sm); line-height:1.55; }
.asst-msg--bot p{ background:var(--paper-2); padding:.75rem 1rem; border-radius:14px 14px 14px 4px; max-width:92%; width:fit-content; }
.asst-msg--you p{ background:var(--deep); color:var(--ink-on-dark); padding:.75rem 1rem; border-radius:14px 14px 4px 14px; margin-left:auto; max-width:85%; width:fit-content; }
.asst-msg--form{ display:block; }

.asst-actions{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.75rem; }
.asst-btn{
  padding:.5rem .875rem; min-height:40px; display:inline-flex; align-items:center;
  border:1px solid var(--line-strong); border-radius:var(--r-pill);
  font-family:var(--font-ui); font-size:var(--fs-xs);
  text-transform:uppercase; letter-spacing:.08em;
  transition:border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.asst-btn:hover{ border-color:var(--ink); }
.asst-btn--book{ background:var(--mint); border-color:var(--mint); color:var(--ink); font-weight:600; }
.asst-btn--book:hover{ background:var(--mint-deep); border-color:var(--mint-deep); }

.asst-form{ display:flex; gap:.5rem; padding:1rem 1.125rem; border-top:1px solid var(--line); background:var(--white); }
.asst-form[hidden]{ display:none; }
.asst-form input{ flex:1; padding:.75rem .875rem; min-height:44px; border:1px solid var(--line-strong); border-radius:var(--r-pill); }
.asst-send{
  padding:.75rem 1.125rem; min-height:44px; background:var(--deep); color:var(--ink-on-dark);
  border-radius:var(--r-pill); font-family:var(--font-ui); font-size:var(--fs-xs);
  text-transform:uppercase; letter-spacing:var(--track-ui);
}
.asst-send:hover{ background:#000; }

/* The enquiry form must be self-contained: the widget mounts on EVERY page,
   including ones that never load page.css, so .field is fully styled here. */
.asst-enq .field{ display:block; margin-bottom:.875rem; }
.asst-enq .field span{
  display:block; margin-bottom:.375rem;
  font-family:var(--font-ui); font-size:.6875rem;
  text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
}
.asst-enq .field input,
.asst-enq .field textarea{
  display:block; width:100%; padding:.6875rem .875rem; min-height:44px;
  border:1px solid var(--line-strong); border-radius:10px;
  background:var(--white); font-size:var(--fs-sm);
}
.asst-enq .field textarea{ min-height:5rem; resize:vertical; }
.asst-enq .form-status{ margin-top:.625rem; font-size:var(--fs-xs); color:var(--muted); min-height:1.2em; }
.asst-enq .form-status.is-error{ color:#B42318; }
.asst-enq .btn{ margin-top:.25rem; }

.asst-typing{ display:flex; gap:4px; align-items:center; }
.asst-typing span{ width:6px; height:6px; border-radius:50%; background:var(--muted); animation:asstBlink 1.2s infinite; }
.asst-typing span:nth-child(2){ animation-delay:.2s; }
.asst-typing span:nth-child(3){ animation-delay:.4s; }
@keyframes asstBlink{ 0%,80%,100%{ opacity:.25 } 40%{ opacity:1 } }

/* ============================================================================
   COOKIE / CONSENT BANNER (contract clause 1: "privacy policy, terms and
   cookie notice"). Analytics do NOT load until this is accepted.
   ============================================================================ */
.consent{
  position:fixed; left:0; right:0; bottom:0; z-index:1450;
  background:var(--deep); color:var(--ink-on-dark);
  padding:1.25rem var(--pad);
  display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between;
}
.consent[hidden]{ display:none; }
.consent p{ font-size:var(--fs-sm); max-width:62ch; color:rgba(244,244,241,.86); }
.consent a{ text-decoration:underline; text-underline-offset:3px; }
.consent-actions{ display:flex; flex-wrap:wrap; gap:.625rem; }
.consent .btn{ min-height:44px; padding:.75rem 1.5rem; }
.consent .btn-ghost{ color:var(--ink-on-dark); border-color:rgba(244,244,241,.45); }
.consent .btn-ghost:hover{ background:var(--ink-on-dark); color:var(--ink); }

@media (max-width:520px){
  .asst{ right:.875rem; bottom:.875rem; }
  .asst-launch{ width:58px; height:58px; }
  .asst-monogram{ font-size:1.5rem; }
}