/* consent banner + cookie choices — tokens only; the buttons are the page's own .btn geometry (never re-sized here) */
.cnb{position:fixed;left:0;right:0;bottom:0;z-index:190;background:var(--bg-2);border-top:1px solid var(--line);box-shadow:0 -8px 30px rgba(0,0,0,.18)}
.cnb[hidden],.cnb.cnb--yield{display:none}
.cnb-inner{max-width:1180px;margin:0 auto;padding:14px 20px;display:flex;gap:16px 24px;align-items:center;flex-wrap:wrap}
.cnb-text{margin:0;flex:1 1 420px;font-size:14px;line-height:1.5;color:var(--text)}
.cnb-text a{color:var(--text);text-decoration:underline;text-underline-offset:2px}
.cnb-acts{display:flex;gap:10px;flex-wrap:wrap}
.cnd{border:1px solid var(--line);border-radius:16px;background:var(--bg-2);color:var(--text);padding:24px;max-width:600px;width:calc(100vw - 32px)}
.cnd::backdrop{background:rgba(0,0,0,.5)}
/* SON-6613 — card-and-switch layout: a header with the cookie mark, one bordered card per category, the switch on the right.
   The control is still the native checkbox (same data-consent-cat contract, same JS); role="switch" + CSS draw it. */
.cnd-head{display:flex;gap:16px;align-items:flex-start;margin:0 0 18px}
.cnd-mark{flex:none;width:48px;height:48px;border-radius:12px;border:1px solid var(--line);background:var(--surface);display:flex;align-items:center;justify-content:center;color:var(--muted)}
.cnd h2{margin:2px 0 6px;font-size:22px;line-height:1.2;font-weight:500}
.cnd-intro{margin:0;font-size:14px;line-height:1.5;color:var(--muted)}
.cnd-intro a{color:var(--text);text-decoration:underline;text-underline-offset:2px}
.cnd-list{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:10px}
.cnd-list li{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:14px 16px}
.cnd-list label{display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:center;cursor:pointer}
.cnd-name{grid-column:1;font-size:14.5px;font-weight:500;color:var(--text)}
.cnd-desc{grid-column:1;font-size:13px;line-height:1.45;color:var(--muted)}
.cnd-on{grid-column:1;margin-top:4px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mineral)}
.cnd-list input{grid-column:2;grid-row:1/span 3;-webkit-appearance:none;appearance:none;margin:0;width:44px;height:26px;border-radius:13px;
  background:var(--line-strong);position:relative;cursor:pointer;transition:background .15s}
.cnd-list input::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--muted);transition:left .15s,background .15s}
.cnd-list input:checked{background:var(--mineral)}
.cnd-list input:checked::after{left:21px;background:var(--bg)}
.cnd-list input:disabled{opacity:.55;cursor:default}
.cnd-list input:focus-visible{outline:2px solid var(--mineral);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.cnd-list input,.cnd-list input::after{transition:none}}
.cnd-acts{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
/* SON-5646 — Vy's permissions (vy_messages, vy_voice): processing purposes, not cookie categories (ADR-0093), so their own
   section under the cookie list. The mount is empty here; the Vy drawer runtime fills it (_shared/vy-drawer.js). */
.cnd-vy{margin:0 0 18px;padding-top:14px;border-top:1px solid var(--line)}
.cnd-vy[hidden]{display:none}
.cnd-vy-title{margin:0;font-size:15px;line-height:1.3;font-weight:500;color:var(--text)}
.cnd-vy-title:focus{outline:none}
.cnd-vy-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:10px;font-size:14.5px}
.cnd-vy-name{font-weight:500;color:var(--text)}
.cnd-vy-state{font-size:12.5px;color:var(--muted)}
.cnd-vy-row .btn{margin-left:auto}
.cnd-vy-status{margin:10px 0 0;font-size:13px;line-height:1.45;color:var(--muted)}
.cnd-vy-status:empty{display:none}
/* SON-6342 — a signed-in visitor's one line to the app's Privacy and permissions page (Spec 0100 §4.6). Hidden until the
   script below finds a session and the page answers; the link gets its href only then. */
.cnd-manage{margin:0 0 18px;font-size:14px;line-height:1.45}
.cnd-manage[hidden]{display:none}
.cnd-manage a{color:var(--text);text-decoration:underline;text-underline-offset:2px}
@media (max-width:640px){.cnb-inner{padding:12px 16px}.cnb-acts{width:100%}.cnb-acts .btn{flex:1 1 auto;justify-content:center}}
/* SON-4728 — the banner never covers the Contact Center: while it is up, the desktop launcher and its panel ride above it,
   and on mobile the banner sits above the fixed action bar (whose Contact Center icon it used to cover). Measured by the
   script below; the launcher never waits for a cookie decision. */
html.cnb-open .chat-fab{bottom:calc(var(--contact-center-fab-bottom,26px) + var(--cnb-h,0px)) !important}
html.cnb-open .vy-panel{bottom:calc(var(--contact-center-panel-bottom,98px) + var(--cnb-h,0px)) !important}
.cnb{bottom:var(--cnb-mbar,0px)}