.quickview.sr-qv {
  --sr-pp-border: var(--sr-qv-border);
  --sr-pp-surface: var(--sr-qv-surface);
  --sr-pp-text: var(--sr-qv-text);
  --sr-pp-accent: var(--sr-qv-accent);
  --sr-pp-accent-soft: var(--sr-qv-accent-soft);
  --sr-pp-muted: var(--sr-qv-muted);
}

/* Compact choice buttons; native selects remain the form's source of truth. */
:is(#main.sr-product, .quickview.sr-qv) .product-variants:has(.sr-variant-buttons){grid-template-columns:1fr;gap:16px}
:is(#main.sr-product, .quickview.sr-qv) .sr-variant-buttons .sr-variant-native{display:none}
:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choices{display:flex;flex-wrap:wrap;gap:8px}
:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choice{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;height:52px;min-height:52px;padding:8px 18px;border:1px solid var(--sr-pp-border);border-radius:10px;background:var(--sr-pp-surface);color:var(--sr-pp-text);font:inherit;font-size:13px;font-weight:650;line-height:1.35;cursor:pointer;transition:border-color .18s,background-color .18s,color .18s}
:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choice:hover{border-color:var(--sr-pp-accent);background:var(--sr-pp-accent-soft)}
:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choice[aria-checked="true"]{border-color:var(--sr-pp-accent);background:var(--sr-pp-accent-soft);color:var(--sr-pp-accent);box-shadow:inset 0 0 0 1px var(--sr-pp-accent)}
:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choice.is-sold-out:not([aria-checked="true"]){border-style:dashed;color:var(--sr-pp-muted);background:var(--sr-product-unavailable-bg,#f8f9f8)}
:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choice small{font-size:10px;font-weight:500;line-height:1.2}
:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choice:focus-visible{outline:2px solid var(--sr-pp-accent);outline-offset:3px}
:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choice:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:767px){:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choice{padding:6px 14px;font-size:12px;height:48px;min-height:48px}:is(#main.sr-product, .quickview.sr-qv) .product-variants:has(.sr-variant-buttons){gap:16px}}
@media(prefers-reduced-motion:reduce){:is(#main.sr-product, .quickview.sr-qv) .sr-variant-choice{transition:none}}
