/* Talk out loud: ElevenLabs voice agent (assets/js/voice.js). Entry row in the typed chat + the widget dock. */

/* Entry row inside the Ask sheet */
.vc-entry{margin-top:10px;min-width:0}
.vc-btn{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:10px 14px;border:1px solid rgba(214,178,110,.45);border-radius:var(--r-sm);background:var(--acc-dim);color:var(--fg);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,background .2s}
.vc-btn:hover{border-color:var(--acc);background:rgba(214,178,110,.18)}
.vc-btn:active{transform:scale(.99)}
.vc-btn[disabled]{cursor:progress;opacity:.8}
.vc-ic{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--grad-gold);color:var(--acc-ink)}
.vc-ic .ic{width:19px;height:19px;stroke-width:2}
.vc-btn[aria-busy="true"] .vc-ic{animation:vc-breathe 1.2s ease-in-out infinite}
.vc-tx{display:grid;gap:2px;min-width:0}
.vc-label{font-weight:600;font-size:15px;line-height:1.25}
.vc-sub{color:var(--muted);font-size:13.5px;line-height:1.4;overflow-wrap:anywhere}
.vc-msg{display:flex;align-items:flex-start;gap:8px;margin-top:8px;padding:8px 12px;border:1px solid var(--line2);border-radius:var(--r-sm);background:var(--panel);color:var(--fg)}
.vc-msg[hidden]{display:none}
.vc-msg .ic{width:16px;height:16px;flex:none;margin-top:2px;color:var(--acc)}
.vc-note{margin-top:6px}
@keyframes vc-breathe{0%,100%{box-shadow:0 0 0 0 var(--acc-glow)}50%{box-shadow:0 0 0 8px rgba(214,178,110,0)}}

/* Widget dock. The widget positions itself as a fixed overlay; the transform makes this box its
   containing block, so it stays between the header and the floating Report and Help agent buttons.
   pointer-events:none lets taps pass through the empty area; the widget's own controls opt back in. */
.vc-dock{position:fixed;z-index:47;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + var(--head) + var(--sub));bottom:calc(var(--tabs) + env(safe-area-inset-bottom,0px) + 76px);transform:translateZ(0);pointer-events:none;color-scheme:dark}
.vc-dock.vc-pulse{animation:vc-in .5s var(--ease)}
@keyframes vc-in{0%{opacity:.4;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}
@media (min-width:1024px){
  /* Desktop: no header or tab bar; the Help agent button sits bottom-right at 24px, about 64px tall. */
  .vc-dock{left:var(--rail);top:0;bottom:100px}
}
/* Live map: the call keeps going. The dock moves to the open middle of the map: below the layer chips,
   zoom buttons, count and hint at the top, above the Help agent tile, locate and Report here buttons in
   the bottom-right column. */
body[data-page="map"] .vc-dock{top:calc(env(safe-area-inset-top,0px) + var(--head) + var(--sub) + 128px);bottom:calc(var(--tabs) + env(safe-area-inset-bottom,0px) + 210px)}
@media (min-width:1024px){
  body[data-page="map"] .vc-dock{top:calc(var(--sub) + 110px);bottom:212px}
}
/* "From the guide" card (assets/js/voicetools.js): numbers and links the voice guide puts on screen.
   Phones: under the header and section tabs, ending above the widget (a 264x104 box drawn 32px in from the
   bottom-right of the dock), so the widget's own controls stay clear.
   Desktop: bottom-left of the content area; the widget and the Ask button sit bottom-right. */
.vt-card{position:fixed;z-index:48;left:16px;right:16px;top:calc(env(safe-area-inset-top,0px) + var(--head) + var(--sub) + 10px);max-height:min(62vh,calc(100dvh - var(--head) - var(--sub) - var(--tabs) - 232px));overflow-y:auto;overscroll-behavior:contain;min-width:0;padding:12px 14px 14px;border:1px solid var(--acc-line);border-radius:var(--r);background:linear-gradient(180deg,var(--glass-hi),rgba(9,18,31,.94));backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);box-shadow:var(--shadow),0 0 0 4px rgba(6,12,24,.45);color:var(--fg);font:400 15px/1.45 var(--body);animation:vc-in .3s var(--ease)}
.vt-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.vt-eyebrow{display:inline-flex;align-items:center;gap:6px;font:500 11.5px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}
.vt-eyebrow .ic{width:14px;height:14px}
.vt-x{flex:none;display:grid;place-items:center;width:36px;height:36px;margin:-6px -6px -6px 0;border:1px solid var(--line2);border-radius:50%;background:transparent;color:var(--muted);cursor:pointer}
.vt-x .ic{width:15px;height:15px}
.vt-x:hover,.vt-x:focus-visible{border-color:var(--acc);color:var(--fg)}
.vt-title{margin:6px 0 2px;font:400 19px/1.25 var(--display);letter-spacing:.01em;overflow-wrap:anywhere}
.vt-note{margin:4px 0 0;color:var(--muted);font-size:14px;line-height:1.45;overflow-wrap:anywhere}
.vt-items{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.vt-item{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;padding:8px 12px;border:1px solid var(--line2);border-radius:var(--r-sm);background:rgba(13,24,43,.6);color:var(--fg);text-decoration:none;transition:border-color .2s,background .2s}
.vt-item:hover,.vt-item:focus-visible{border-color:var(--acc);background:var(--acc-dim);color:var(--fg)}
.vt-item>.ic{flex:none;width:17px;height:17px;color:var(--acc)}
.vt-tx{display:grid;gap:1px;min-width:0}
.vt-tx b{font-weight:600;font-size:15px;line-height:1.3;overflow-wrap:anywhere}
.vt-tx span{color:var(--muted);font-size:13.5px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.vt-tel.vt-first{border-color:rgba(248,230,184,.7);background:var(--grad-gold);color:var(--acc-ink)}
.vt-tel.vt-first .vt-tx span,.vt-tel.vt-first>.ic{color:var(--acc-ink)}
.vt-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.vt-act{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border:1px solid var(--line2);border-radius:999px;background:transparent;color:var(--fg);font:600 14px/1 var(--body);cursor:pointer}
.vt-act .ic{width:15px;height:15px;color:var(--acc)}
.vt-act:hover,.vt-act:focus-visible{border-color:var(--acc)}
.vt-sos{border-color:rgba(246,103,107,.6);background:linear-gradient(180deg,rgba(60,14,20,.94),rgba(24,8,12,.96))}
.vt-sos .vt-eyebrow{color:#ffb4b6}
.vt-sos .vt-acts{display:none}
.vt-sos .vt-item.vt-first{border-color:transparent;background:var(--red-strong);color:#fff;font-size:18px}
.vt-sos .vt-item.vt-first .vt-tx b{font-size:20px;letter-spacing:.02em}
.vt-sos .vt-item.vt-first>.ic,.vt-sos .vt-item.vt-first .vt-tx span{color:#fff}
/* "What it can do" card, shown when voice opens (voice.js showIntro). */
.vt-bul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:5px}
.vt-bul li{display:flex;align-items:flex-start;gap:8px;font-size:14.5px;line-height:1.4}
.vt-bul li .ic{flex:none;width:16px;height:16px;margin-top:2px;color:var(--acc);stroke-width:2.2}
.vt-intro .vt-note{color:var(--fg);font-weight:600;font-size:15px}
.vt-foot{display:flex;align-items:center;gap:8px;margin:10px 0 0;padding:7px 10px;border:1px solid rgba(239,74,79,.45);border-radius:var(--r-sm);background:var(--red-dim);font-size:14px;font-weight:600}
.vt-foot .ic{flex:none;width:15px;height:15px;color:#ff9b9e}
@media (min-width:1024px){
  .vt-card{left:calc(var(--rail) + 24px);right:auto;top:auto;bottom:24px;width:380px;max-height:calc(100vh - 140px)}
}
/* On the live map the card stays above the voice controls (phones) and off the legend (desktop). */
@media (max-width:1023px){
  body[data-page="map"] .vt-card{max-height:max(140px,calc(100dvh - var(--head) - var(--sub) - var(--tabs) - 364px))}
}
@media (min-width:1024px){
  body[data-page="map"] .vt-card{left:calc(var(--rail) + 12px);top:calc(var(--sub) + 100px);bottom:auto;max-height:calc(100vh - var(--sub) - 200px)}
}
body[data-page="admin"] .vt-card{display:none}

/* Not on the admin screens or in print. */
body[data-page="admin"] .vc-dock{display:none}
@media print{.vc-dock,.vc-entry,.vt-card{display:none}}