/* VoltVault Support chat (2026-10-17). Self-hosted, replaces the tawk.to embed.
   Uses the white redesign v4 tokens (--v4-ink, --accent, --bg-2, --line, --radius),
   so html[data-theme="dark"] restyles it automatically. */
.vvc-root{--vvc-ink:var(--v4-ink,#1d1d1f);--vvc-ink-fg:var(--v4-ink-fg,#fff);--vvc-bg:var(--panel,#fff);--vvc-soft:var(--bg-2,#f5f5f7);--vvc-line:var(--line,rgba(0,0,0,.08));--vvc-line-2:var(--line-2,rgba(0,0,0,.14));--vvc-text:var(--text,#1d1d1f);--vvc-muted:var(--muted,#515154);--vvc-accent:var(--accent,#0066cc);--vvc-accent-fg:var(--accent-d,#fff);--vvc-ok:#1f9d55;font-family:var(--body,-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif);color:var(--vvc-text);-webkit-font-smoothing:antialiased}
.vvc-root *,.vvc-root *::before,.vvc-root *::after{box-sizing:border-box}
.vvc-launch{position:fixed;right:20px;bottom:20px;z-index:60;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;height:48px;padding:12px 16px;border:1px solid var(--text,#1d1d1f);border-radius:12px;background:var(--text,#1d1d1f);color:var(--bg,#fff);font:600 16px/1.4 var(--body,inherit);letter-spacing:-.01em;white-space:nowrap;cursor:pointer}
.vvc-launch:hover{filter:brightness(.9)}
:root{--vv-help-reserve:0px}
.vvc-header-slot{display:inline-flex;flex:none}
/* overflow-x:hidden creates an ancestor scroll container and breaks WebKit sticky.
   Clip sideways overflow without stealing the document's vertical scrollport. */
html:has(header.site.vvc-help-header),body:has(header.site.vvc-help-header){overflow-x:clip!important;overflow-y:visible!important}
header.site.vvc-help-header{position:sticky!important;top:0!important;z-index:80}
.vvc-header-slot .vvc-launch{position:static!important;inset:auto!important;margin:0!important;transform:none!important;opacity:1!important;pointer-events:auto!important;box-shadow:none!important;background:var(--bg,#fff);color:var(--text,#1d1d1f)}
.vvc-launch .vvc-txt{display:inline!important}
.vvc-launch .vvc-dot,.vvc-cart-icon{display:none}
.vvc-launch:focus-visible,.vvc-x:focus-visible,.vvc-chip:focus-visible,.vvc-send:focus-visible,.vvc-mail button:focus-visible{outline:3px solid var(--vvc-accent);outline-offset:2px}
.vvc-input:focus,.vvc-mail input:focus{outline:none;border-color:var(--vvc-accent);box-shadow:0 0 0 3px rgb(var(--accent-rgb,0 102 204) / .18)}
.vvc-launch svg{width:22px;height:22px;flex:none}
.vvc-launch .vvc-dot{position:absolute;left:34px;top:12px;width:9px;height:9px;border-radius:50%;background:var(--vvc-ok);box-shadow:0 0 0 2px var(--vvc-ink)}
.vvc-panel{position:fixed;right:20px;bottom:20px;z-index:1001;width:min(392px,calc(100vw - 40px));height:min(640px,calc(100vh - 100px));display:flex;flex-direction:column;background:var(--vvc-bg);border:1px solid var(--vvc-line);border-radius:var(--radius,20px);box-shadow:0 2px 6px rgba(0,0,0,.05),0 28px 64px -24px rgba(0,0,0,.35);overflow:hidden;transform-origin:bottom right;animation:vvc-in .2s ease}
.vvc-panel[hidden]{display:none}
@keyframes vvc-in{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.vvc-head{display:flex;align-items:center;gap:12px;padding:16px 16px 14px 18px;border-bottom:1px solid var(--vvc-line);background:var(--vvc-bg)}
.vvc-mark{width:36px;height:36px;border-radius:10px;background:var(--vvc-ink);color:var(--vvc-ink-fg);display:grid;place-items:center;font:700 17px/1 var(--font,inherit);flex:none;position:relative}
.vvc-mark::after{content:"";position:absolute;right:-2px;bottom:-2px;width:11px;height:11px;border-radius:50%;background:var(--vvc-ok);border:2px solid var(--vvc-bg)}
.vvc-title{flex:1;min-width:0}
.vvc-title h2{margin:0;font:700 16px/1.2 var(--font,inherit);letter-spacing:-.02em;color:var(--vvc-text)}
.vvc-title p{margin:3px 0 0;font-size:13px;line-height:1.3;color:var(--vvc-muted)}
.vvc-x{width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:var(--vvc-muted);display:grid;place-items:center;cursor:pointer;flex:none}
.vvc-x:hover{background:var(--vvc-soft);color:var(--vvc-text)}
.vvc-x svg{width:18px;height:18px}
.vvc-log{flex:1;min-height:0;overflow-y:auto;padding:18px 16px 8px;display:flex;flex-direction:column;gap:10px;overscroll-behavior:contain;scroll-behavior:smooth}
.vvc-head,.vvc-form,.vvc-foot{flex-shrink:0}
.vvc-msg{max-width:86%;font-size:15px;line-height:1.45;word-wrap:break-word;white-space:pre-wrap}
.vvc-msg .vvc-who{display:block;font-size:12px;font-weight:600;color:var(--vvc-muted);margin:0 0 4px 2px}
.vvc-msg .vvc-b{display:block;padding:10px 14px;border-radius:18px}
.vvc-bot{align-self:flex-start}
.vvc-bot .vvc-b{background:var(--vvc-soft);color:var(--vvc-text);border-top-left-radius:6px}
.vvc-me{align-self:flex-end}
.vvc-me .vvc-b{background:var(--vvc-ink);color:var(--vvc-ink-fg);border-top-right-radius:6px}
.vvc-b a{color:var(--vvc-accent);text-decoration:underline;text-underline-offset:2px}
.vvc-me .vvc-b a{color:inherit}
.vvc-typing .vvc-b{display:inline-flex;gap:4px;align-items:center;padding:14px 16px}
.vvc-typing i{width:6px;height:6px;border-radius:50%;background:var(--vvc-muted);opacity:.5;animation:vvc-dot 1s infinite}
.vvc-typing i:nth-child(2){animation-delay:.15s}.vvc-typing i:nth-child(3){animation-delay:.3s}
@keyframes vvc-dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:.9;transform:translateY(-2px)}}
.vvc-chips{display:flex;flex-wrap:wrap;gap:8px;padding:2px 0 6px}
.vvc-chip{border:1px solid var(--vvc-line-2);background:var(--vvc-bg);color:var(--vvc-text);border-radius:999px;padding:8px 13px;font:500 14px/1.2 var(--body,inherit);cursor:pointer;transition:background .15s,border-color .15s}
.vvc-chip:hover{background:var(--vvc-soft);border-color:var(--vvc-ink)}
.vvc-mail{align-self:stretch;flex-shrink:0;margin:8px 16px 10px;border:1px solid var(--vvc-line);border-radius:16px;padding:12px;background:var(--vvc-bg);display:flex;flex-direction:column;gap:8px}
.vvc-mail label{font-size:13px;font-weight:600;color:var(--vvc-text)}
.vvc-mail .vvc-row{display:flex;gap:8px}
.vvc-mail input{flex:1;min-width:0;height:42px;border:1px solid var(--vvc-line-2);border-radius:12px;padding:0 12px;font:16px var(--body,inherit);background:var(--vvc-bg);color:var(--vvc-text)}
.vvc-mail button{height:42px;border:0;border-radius:12px;padding:0 14px;background:var(--vvc-ink);color:var(--vvc-ink-fg);font:600 14px var(--body,inherit);cursor:pointer;white-space:nowrap}
.vvc-mail small{font-size:12px;color:var(--vvc-muted)}
.vvc-form{display:flex;align-items:flex-end;gap:8px;padding:10px 12px 8px;border-top:1px solid var(--vvc-line);background:var(--vvc-bg)}
.vvc-input{flex:1;min-width:0;resize:none;max-height:120px;min-height:44px;border:1px solid var(--vvc-line-2);border-radius:22px;padding:11px 16px;font:16px/1.35 var(--body,inherit);color:var(--vvc-text);background:var(--vvc-soft)}
.vvc-input::placeholder{color:var(--vvc-muted)}
.vvc-send{width:44px;height:44px;flex:none;border:0;border-radius:50%;background:var(--vvc-accent);color:var(--vvc-accent-fg);display:grid;place-items:center;cursor:pointer;transition:opacity .15s}
.vvc-send:disabled{opacity:.4;cursor:default}
.vvc-send svg{width:18px;height:18px}
.vvc-foot{margin:0;padding:0 16px 12px;font-size:11.5px;line-height:1.4;color:var(--vvc-muted);text-align:center;background:var(--vvc-bg)}
.vvc-foot a{color:inherit}
.vvc-count{font-size:11px;color:var(--vvc-muted);align-self:center;min-width:0}
.vvc-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.vvc-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
@media (max-width:600px){
  .vvc-launch{right:16px;bottom:16px;height:48px;min-width:116px;padding:12px}
  .vvc-launch>svg{display:none}
  header.site.vvc-help-header .nav{display:flex;flex-wrap:nowrap;gap:8px;min-height:64px;height:64px;padding:8px 20px;align-items:center}
  header.site.vvc-help-header .brand{gap:0!important;font-size:20px!important;flex:none;min-width:0;white-space:nowrap}
  header.site.vvc-help-header .brand .mark{display:none!important}
  header.site.vvc-help-header .v4-actions{display:flex;align-items:center;gap:6px;min-width:0;margin-left:auto}
  header.site.vvc-help-header .cartlink{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;min-width:44px;height:48px;padding:0!important;font-size:0!important;border:0;background:transparent}
  header.site.vvc-help-header .cartlink{order:2;color:var(--text,#1d1d1f)!important}
  header.site.vvc-help-header .cartlink .vvc-cart-icon{display:inline-flex;font-size:16px}
  header.site.vvc-help-header .cartlink [data-cart-count]{position:absolute;top:0;right:-2px;min-width:18px;height:18px;padding:0 3px;border-radius:9px;font-size:16px!important;line-height:18px!important}
  header.site.vvc-help-header .nav-toggle{order:3;width:44px;min-width:44px;height:48px;padding:0;display:flex;align-items:center;justify-content:center}
  header.site.vvc-help-header .theme-toggle{min-width:44px;min-height:44px;margin:8px}
  .vvc-panel{inset:0;right:0;bottom:0;width:100%;height:100%;height:100dvh;border-radius:0;border:0}
  .vvc-head{padding-top:max(14px,env(safe-area-inset-top))}
  .vvc-form{padding-bottom:max(8px,env(safe-area-inset-bottom))}
}
/* A sideways phone needs the viewport height, not the floating panel's 100px reserve.
   Compact chrome keeps the answer, email row and question controls available together. */
@media (max-height:500px) and (min-width:601px){
  .vvc-panel{right:0;bottom:0;width:min(600px,100vw);height:100vh;height:100dvh;border-radius:0}
  .vvc-head{padding:8px 12px}
  .vvc-log{padding:8px 12px 6px}
  .vvc-mail{margin:4px 12px 6px;padding:8px;gap:6px}
  .vvc-form{padding:6px 12px}
  .vvc-foot{padding:0 12px 6px}
}
@media (prefers-reduced-motion:reduce){.vvc-panel,.vvc-typing i{animation:none}.vvc-launch,.vvc-log{transition:none;scroll-behavior:auto}}
@media print{.vvc-root{display:none}}

@media(max-width:600px){
 html body header.site.vvc-help-header .brand :is(span:not(.mark),b){font-size:20px!important}
}
@media(max-width:374px){
 header.site.vvc-help-header .brand,html body header.site.vvc-help-header .brand :is(span:not(.mark),b){font-size:16px!important}
 header.site.vvc-help-header .nav{padding-left:12px;padding-right:12px}
 header.site.vvc-help-header .v4-actions{gap:4px}
 .vvc-header-slot .vvc-launch{min-width:108px;padding-left:8px;padding-right:8px}
}
@media(max-width:350px){
 header.site.vvc-help-header .brand,html body header.site.vvc-help-header .brand :is(span:not(.mark),b){font-size:16px!important}
 header.site.vvc-help-header .nav{padding-left:8px;padding-right:8px;gap:4px}
 header.site.vvc-help-header .v4-actions{gap:0}
 .vvc-header-slot .vvc-launch{min-width:100px;padding-left:4px;padding-right:4px}
}

/* Header help owns layout space; no checkout/PDP bottom-position overrides. */