/* SV base layout — foundation pass; refine against _Visual Reference on staging */
body { margin: 0; font-family: var(--sv-font); background: var(--sv-bg); color: var(--sv-text); }
/* Overflow armor (0.33.0, Victor-approved): no transient off-screen element
   (admin-bar submenu, drawer parking, mid-hydration card) may ever widen the
   page on phones — that's what let Android Chrome zoom-fit the whole site
   into the "shrunken broken" state. `clip` ONLY (never `hidden` here: hidden
   makes html a scroll container and kills every position:sticky inside). */
@media (max-width: 820px) {
  html { overflow-x: clip; }
}
.sv-container, .sv-header__in, .sv-footer__in { max-width: var(--sv-max-width); margin: 0 auto; padding: 0 20px; }

/* Generic Page (page.php) — About/FAQ/Warranty/Return/Shipping/Locations/etc. */
.sv-page { padding: 40px 0 72px; }
.sv-page__wrap { max-width: 860px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.sv-page__title { font-size: clamp(28px, 4vw, 42px); font-weight: 700; line-height: 1.1; letter-spacing: -.01em; color: var(--sv-text); margin: 0 0 24px; }
.sv-page__content { color: var(--sv-text); font-size: 16.5px; line-height: 1.7; }
.sv-page__content > *:first-child { margin-top: 0; }
.sv-page__content h2 { font-size: 25px; font-weight: 700; line-height: 1.2; margin: 36px 0 12px; }
.sv-page__content h3 { font-size: 20px; font-weight: 700; margin: 28px 0 10px; }
.sv-page__content p { margin: 0 0 18px; }
.sv-page__content a { color: #b9791a; text-decoration: underline; text-underline-offset: 2px; }
html[data-sv-theme="dark"] .sv-page__content a { color: var(--sv-gold); }
.sv-page__content ul, .sv-page__content ol { margin: 0 0 18px; padding-left: 22px; }
.sv-page__content li { margin: 0 0 8px; }
.sv-page__content img { max-width: 100%; height: auto; border-radius: 12px; }
.sv-page__content table { width: 100%; border-collapse: collapse; margin: 18px 0; font-size: 15px; }
.sv-page__content th, .sv-page__content td { border: 1px solid var(--sv-border); padding: 10px 12px; text-align: left; }

.sv-header { background: var(--sv-header-bg); color: var(--sv-header-text); border-bottom: 1px solid var(--sv-header-border); padding: 14px 0 0; position: sticky; top: 0; z-index: 100; }
/* Logged-in staff see the WP admin toolbar (32px / 46px mobile) — offset the
   sticky header so it doesn't slide under it when scrolling. Customers never
   have the toolbar, so this rule never applies to them. */
body.admin-bar .sv-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .sv-header { top: 46px; } }
.sv-header__in { display: flex; align-items: center; gap: 24px; }
.sv-logo-text { font-weight: 800; font-size: 26px; letter-spacing: .02em; color: var(--sv-logo-accent); }
.sv-logo-text span { color: var(--sv-logo-main); }
.sv-header__search { flex: 1; }
.sv-header__search input[type="search"] { width: 100%; padding: 11px 16px; border-radius: var(--sv-radius-chip); border: 1px solid var(--sv-header-search-border); background: var(--sv-header-search-bg); color: var(--sv-header-text); font: 500 14px var(--sv-font); }
.sv-header__search input[type="search"]::placeholder { color: var(--sv-header-muted); opacity: .8; }
.sv-header__buttons { display: flex; align-items: center; gap: 12px; }
.sv-header__icon, .sv-mode-toggle { color: var(--sv-header-text); background: none; border: none; font-size: 19px; cursor: pointer; text-decoration: none; position: relative; }
.sv-cart-badge { position: absolute; top: -7px; right: -9px; background: var(--sv-gold); color: var(--sv-navy); font: 700 10px var(--sv-font); border-radius: 999px; padding: 2px 5px; }

.sv-nav__list { display: flex; justify-content: center; gap: 28px; list-style: none; margin: 12px 0 0; padding: 12px 0; }
.sv-nav__list a { color: var(--sv-header-text); text-decoration: none; font: 500 15px var(--sv-font); }
/* identity items — JS/class decoration ports (sv-nf-nav / sv-lux-nav) come with the nav pass */
.sv-nav__list .sv-nav--nf > a { color: var(--sv-nf-green); }
.sv-nav__list .sv-nav--nf > a:hover { color: var(--sv-nf-green-hover); }

.sv-card { background: var(--sv-card); border: 1px solid var(--sv-border); border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; }
.sv-card__media { position: relative; display: block; }
.sv-card__media img { width: 100%; height: auto; display: block; }
.sv-card__body { padding: 12px 14px 16px; display: flex; flex-direction: column; gap: 6px; }
.sv-card__title { color: var(--sv-text); text-decoration: none; font: 600 14.5px/1.35 var(--sv-font); }
.sv-card__price { font: 600 15px var(--sv-font); }

.sv-footer { background: var(--sv-bg-soft); margin-top: 60px; padding: 48px 0 0; }
.sv-footer__in { display: grid; grid-template-columns: 2.2fr 1fr; gap: 40px; align-items: start; }
.sv-footer__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.sv-footer__col h4 { font: 700 15px var(--sv-font); color: var(--sv-text); margin: 0 0 12px; }
.sv-footer__col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 9px; }
.sv-footer__col a { color: var(--sv-text-muted); text-decoration: none; font: 400 14px var(--sv-font); }
.sv-footer__col a:hover { color: var(--sv-text); }
.sv-footer__newsh { font: 700 clamp(20px, 2.4vw, 28px)/1.15 var(--sv-font); color: var(--sv-text); margin: 0 0 16px; }
.sv-footer__newsform { display: flex; align-items: stretch; background: var(--sv-card); border: 1px solid var(--sv-border); border-radius: 10px; overflow: hidden; max-width: 380px; }
.sv-footer__newsin { flex: 1; border: 0; background: transparent; padding: 13px 15px; font: 400 14px var(--sv-font); color: var(--sv-text); outline: none; min-width: 0; }
.sv-footer__newsbtn { border: 0; background: var(--sv-gold); color: var(--sv-navy); width: 46px; font-size: 18px; cursor: pointer; }
.sv-footer__newsbtn:hover { filter: brightness(1.05); }
.sv-footer__newsmsg { color: var(--sv-text-muted); font: 500 13px var(--sv-font); margin: 8px 0 0; }
.sv-footer__bar { border-top: 1px solid var(--sv-border); margin-top: 44px; }
.sv-footer__barin { max-width: var(--sv-max-width); margin: 0 auto; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.sv-footer__legal { color: var(--sv-text-muted); font: 400 12.5px var(--sv-font); display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.sv-footer__age { opacity: .85; }
.sv-footer__pol { display: inline-flex; gap: 14px; flex-wrap: wrap; }
.sv-footer__pol a { color: var(--sv-text-muted); text-decoration: none; }
.sv-footer__pol a:hover { color: var(--sv-text); text-decoration: underline; }
.sv-footer__pay { display: flex; gap: 6px; flex-wrap: wrap; }
.sv-footer__card { font: 700 10px var(--sv-font); letter-spacing: .03em; color: var(--sv-text-muted); background: var(--sv-card); border: 1px solid var(--sv-border); border-radius: 5px; padding: 4px 7px; text-transform: uppercase; }
@media (max-width: 900px) { .sv-footer__in { grid-template-columns: 1fr; gap: 32px; } }
@media (max-width: 760px) { .sv-nav__list { flex-wrap: wrap; gap: 14px; } .sv-footer__barin { flex-direction: column; align-items: flex-start; } }
/* Mobile footer: link columns collapse into accordions (Shopify mobile
   pattern) — tap a heading to expand; JS toggles .is-open (sv-nav.js). */
@media (max-width: 760px) {
  .sv-footer { padding-top: 24px; }
  .sv-footer__cols { grid-template-columns: 1fr; gap: 0; }
  .sv-footer__col { border-bottom: 1px solid var(--sv-border); }
  .sv-footer__col h4 { display: flex; align-items: center; justify-content: space-between; margin: 0; padding: 15px 2px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .sv-footer__col h4::after { content: ""; flex: none; width: 8px; height: 8px; border-right: 2px solid var(--sv-text-muted); border-bottom: 2px solid var(--sv-text-muted); transform: rotate(45deg); margin-right: 6px; transition: transform .18s ease; }
  .sv-footer__col.is-open h4::after { transform: rotate(225deg); }
  .sv-footer__col ul { display: none; padding: 2px 2px 16px; }
  .sv-footer__col.is-open ul { display: grid; }
  .sv-footer__news { margin-top: 10px; }
}

/* Victor 2026-07-10: the floating points/gift launcher is OFF everywhere
   (was mobile-only) — points get a home in the account page / dock later.
   The loyalty workstream's script still loads; only the bubble is hidden. */
#sv-rewards-widget { display: none !important; }

/* Mobile dock — "Constant ink" D2 (Victor-approved round 4): a near-BLACK
   bar in BOTH modes (identity zone, like the cream tiles and Luxury black —
   it never flips with the theme) with warm-white icons and the gold CART
   rising out of its center. z 180 = under the drawers so they slide over. */
.sv-dock { display: none; }
@media (max-width: 820px) {
  /* z 1020 (0.31.2, Victor: "the navigation bar should never be behind
     anything") — the dock rides ABOVE every drawer including the filters
     plugin's z-999 panel; all drawers stop at its top edge. */
  .sv-dock { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1020; display: grid; grid-template-columns: 1fr 1fr 72px 1fr 1fr; background: #0A0C11; border-top: 1px solid rgba(242,173,68,.35); padding: 7px 4px calc(7px + env(safe-area-inset-bottom)); }
  .sv-dock__item { display: flex; flex-direction: column; align-items: center; gap: 3px; background: none; border: none; color: #F4F1E9; opacity: .92; font: 600 10px var(--sv-font); letter-spacing: .02em; text-decoration: none; cursor: pointer; padding: 3px 0 1px; -webkit-tap-highlight-color: transparent; }
  .sv-dock__item svg { width: 21px; height: 21px; display: block; }
  .sv-dock__item.is-active { color: #F2AD44; opacity: 1; }
  /* the raised gold cart — pokes above the bar, ringed in the bar's ink */
  .sv-dock__cartbtn { position: relative; opacity: 1; }
  .sv-dock__cartwrap { position: absolute; left: 50%; top: -26px; transform: translateX(-50%); width: 54px; height: 54px; border-radius: 50%; background: var(--sv-gold); border: 3px solid #0A0C11; box-shadow: 0 8px 20px rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; color: #15233F; }
  .sv-dock__cartwrap svg { width: 22px; height: 22px; }
  .sv-dock__badge { position: absolute; top: -3px; right: -5px; background: #e2504c; color: #fff; font: 800 10px/1 var(--sv-font); border-radius: 999px; padding: 3px 6px; box-shadow: 0 2px 6px rgba(0,0,0,.35); }
  /* Cart-button morph (0.31.0): CROSSFADE between cart and ▾ (the hard
     display-swap read "weird" — Victor r10). Both icons stack absolutely in
     the circle; body.sv-cart-open fades one out, one in. Selectors carry
     .sv-dock__cartwrap to outrank ".sv-dock__cartwrap svg". */
  .sv-dock__cartwrap .sv-dock__ic-cart, .sv-dock__cartwrap .sv-dock__ic-close { position: absolute; top: 50%; left: 50%; margin: -11px 0 0 -11px; transition: opacity .18s ease, transform .18s ease; }
  .sv-dock__cartwrap .sv-dock__ic-close { opacity: 0; transform: scale(.55); }
  body.sv-cart-open .sv-dock__cartwrap .sv-dock__ic-cart { opacity: 0; transform: scale(.55); }
  body.sv-cart-open .sv-dock__cartwrap .sv-dock__ic-close { opacity: 1; transform: scale(1); }
  /* Menu slot gets the same ▾ while its drawer is open (body.sv-menu-open) */
  .sv-dock__mic { position: relative; width: 21px; height: 21px; display: block; }
  .sv-dock__mic svg { position: absolute; inset: 0; transition: opacity .18s ease, transform .18s ease; }
  .sv-dock__mic .sv-dock__ic-menuclose { opacity: 0; transform: scale(.55); }
  body.sv-menu-open .sv-dock__mic .sv-dock__ic-menu { opacity: 0; transform: scale(.55); }
  body.sv-menu-open .sv-dock__mic .sv-dock__ic-menuclose { opacity: 1; transform: scale(1); }
  /* Living pulse (0.32.0, Victor picked GOLD RINGS): after an add, TWO
     staggered rings radiate outward (~2x the button) until the drawer is
     opened — the rings are the show, the badge sits still. The one-shot
     .is-pulse rules below win while both classes are present (source order). */
  .sv-dock__cartwrap::before { content: ''; position: absolute; inset: -3px; border-radius: 50%; border: 2.5px solid var(--sv-gold); opacity: 0; pointer-events: none; }
  .sv-dock__cartwrap.is-unseen::after { animation: svDockRingOut 2.4s ease-out infinite; }
  .sv-dock__cartwrap.is-unseen::before { animation: svDockRingOut 2.4s ease-out .5s infinite; }
  /* Badge pulse (0.29.1, Victor round-8): when an item lands in the cart the
     count pops and a gold ring ripples out once (.is-pulse from sv-cart.js,
     only on count INCREASE — never on load or removes). */
  .sv-dock__cartwrap::after { content: ''; position: absolute; inset: -3px; border-radius: 50%; border: 2px solid var(--sv-gold); opacity: 0; pointer-events: none; }
  .sv-dock__cartwrap.is-pulse::after { animation: svDockRing .6s ease-out; }
  .sv-dock__cartwrap.is-pulse .sv-dock__badge { animation: svDockPop .45s cubic-bezier(.34, 1.56, .64, 1); }
  @media (prefers-reduced-motion: reduce) {
    .sv-dock__cartwrap.is-pulse::after, .sv-dock__cartwrap.is-pulse .sv-dock__badge,
    .sv-dock__cartwrap.is-unseen::after, .sv-dock__cartwrap.is-unseen::before { animation: none; }
  }
  /* Add-to-cart TOAST (0.31.0) — replaces WooCommerce's white banner on
     mobile: ink pill slides up over the dock, self-dismisses; tap = open
     cart (sv-cart.js). Success notices only; .woocommerce-error untouched. */
  .woocommerce-notices-wrapper .woocommerce-message { display: none; }
  .sv-toast { position: fixed; left: 50%; bottom: calc(68px + env(safe-area-inset-bottom)); transform: translate(-50%, 160%); z-index: 230; max-width: min(86vw, 420px); background: #0A0C11; color: #F4F1E9; border: 1px solid rgba(242,173,68,.4); border-radius: 999px; padding: 10px 16px; font: 700 12.5px var(--sv-font); box-shadow: 0 8px 22px rgba(0,0,0,.45); display: flex; align-items: center; gap: 8px; transition: transform .3s cubic-bezier(.22, .8, .3, 1); cursor: pointer; }
  .sv-toast.is-on { transform: translate(-50%, 0); }
  .sv-toast__tick { color: #28c45e; font-weight: 900; flex: none; }
  .sv-toast__msg { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  @media (prefers-reduced-motion: reduce) { .sv-toast { transition: none; } }
  /* Filter drawer, option C (0.31.0): the tab rides ABOVE the open drawer
     (plugin z 999) and morphs to ▸; a "Show N products" button lives at the
     panel's bottom; content inset right so nothing sits under the tab. */
  .sv-filter-pull.is-open { z-index: 1000; }
  /* 0.31.2: the filter drawer falls in line with the other drawers — it
     stops at the dock's top edge instead of covering it (scoped geometry
     nudge to the plugin's fixed panel; flagged in the dev log). */
  .svf-sidebar.svf-open-drawer { padding-right: 34px !important; box-sizing: border-box !important; top: 0 !important; bottom: calc(56px + env(safe-area-inset-bottom)) !important; height: auto !important; max-height: none !important; }
  .sv-filter-done { display: block; position: sticky; bottom: 0; margin: 12px 0 calc(6px + env(safe-area-inset-bottom)); width: 100%; background: var(--sv-gold); color: var(--sv-navy); border: none; border-radius: 10px; padding: 13px 0; font: 800 13.5px var(--sv-font); cursor: pointer; box-shadow: 0 -6px 14px rgba(12,20,38,.15); }
  /* content clears the dock */
  body { padding-bottom: calc(62px + env(safe-area-inset-bottom)); }
}

/* (0.27.2, Victor) On mobile the FILTER lives on the side like the cart did:
   gold tab under the Menu tab (66px apart — the tabs are ~58px tall, the old
   46px spacing physically overlapped), and the plugin's top "Filter" pill is
   hidden. Tab proxies a click to the hidden .svf-open. */
.sv-filter-pull { display: none; }
@media (max-width: 820px) {
  .svf-topbar { display: none !important; }
  /* 0.30.0: the filter tab moved up to the old Menu spot (42%) — it stands
     alone on the edge now that the Menu tab lives in the dock. The close-
     indent + swipe-to-close + sidebar padding nudge are all retired; the
     plugin's own ✕ closes the drawer. */
  .sv-filter-pull { position: fixed; right: 0; top: 42%; transform: translateY(-50%); z-index: 190; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 11px 8px 11px 6px; background: var(--sv-gold); color: var(--sv-navy); border: none; border-radius: 12px 0 0 12px; box-shadow: -4px 2px 14px rgba(12,20,38,.32); cursor: pointer; }
  .sv-filter-pull svg { width: 15px; height: 15px; display: block; }
}

/* WooCommerce grid — 2/3/4 columns like the live site */
ul.products { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; list-style: none; padding: 20px 0; margin: 0; }
@media (min-width: 700px)  { ul.products { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (min-width: 1100px) { ul.products { grid-template-columns: repeat(4, minmax(0,1fr)); } }
ul.products li.sv-card-li { list-style: none; margin: 0; display: flex; }
ul.products .sv-card { width: 100%; }
.woocommerce-result-count, .woocommerce-ordering { font: 500 13px var(--sv-font); color: var(--sv-text-muted); }
.woocommerce-pagination { text-align: center; margin: 26px 0; }
.woocommerce-pagination .page-numbers { display: inline-flex; gap: 6px; list-style: none; padding: 0; }
.woocommerce-pagination .page-numbers li a, .woocommerce-pagination .page-numbers li span { padding: 8px 13px; border: 1px solid var(--sv-border); border-radius: 8px; text-decoration: none; color: var(--sv-text); }
.woocommerce-pagination .page-numbers li span.current { background: var(--sv-navy); color: #fff; }

/* WooCommerce breadcrumb — subtle, contained (kept on desktop, tidy on mobile) */
.woocommerce-breadcrumb { max-width: var(--sv-max-width); margin: 16px auto 2px; padding: 0 20px; font: 500 13px/1.4 var(--sv-font); color: var(--sv-text-muted); }
.woocommerce-breadcrumb a { color: var(--sv-text-muted); text-decoration: none; }
.woocommerce-breadcrumb a:hover { color: var(--sv-text); text-decoration: underline; text-underline-offset: 2px; }
grep -n "sv-dock__badge {" assets/css/main.css

/* Dock badge pulse keyframes (0.29.1) — top level; the rules that use them
   are scoped to the ≤820 dock block. */
@keyframes svDockRing { 0% { transform: scale(1); opacity: .85; } 100% { transform: scale(1.7); opacity: 0; } }
@keyframes svDockPop { 0% { transform: scale(1); } 45% { transform: scale(1.5); } 100% { transform: scale(1); } }
/* Living-pulse rings (0.32.0, Victor picked gold): double the button's size,
   two staggered rings on a 2.4s period — the approved r11 motion. */
@keyframes svDockRingOut { 0% { transform: scale(1); opacity: .9; } 55% { transform: scale(2.05); opacity: 0; } 100% { transform: scale(2.05); opacity: 0; } }