/* Product-page choices share Marvelle's bordered, rounded control language. */
.variant-fixed{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;min-width:0;margin:0;padding:0;color:var(--plum);font:400 13px/1.6 var(--sans);letter-spacing:0;text-transform:none}
.variant-fixed>span{min-width:0;overflow-wrap:anywhere}
.variant-fixed .variant-color-dot{display:inline-block;width:18px;height:18px;flex:0 0 18px;border-radius:50%;background:var(--variant-color);border:1px solid #24121b26}
:is(.product-page, .quick-view, .marvelle-landing) #product-options{grid-template-columns:minmax(0,1fr);gap:22px;margin:22px 0 12px}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choices{min-width:0;margin:0;padding:0;border:0}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choices legend{display:flex;align-items:center;gap:10px;float:none;width:100%;margin:0 0 10px;padding:0;color:var(--plum);font:600 14px/1.5 var(--sans)}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choices legend small{color:#816570;font-size:12px;font-weight:400}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice-list{display:flex;flex-wrap:wrap;gap:10px}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice{position:relative;display:inline-flex;flex:0 1 auto;width:max-content;max-width:100%;min-width:0;margin:0;padding:0;cursor:pointer;font:500 14px/1.4 var(--sans);text-transform:none;letter-spacing:0}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice input{position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice-content{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:9px;max-width:100%;min-height:46px;box-sizing:border-box;padding:10px 14px;border:1px solid #e9e0e4;border-radius:24px;background:#fff;color:var(--plum);text-align:center;transition:border-color .18s,background-color .18s,box-shadow .18s}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice-content>span:not(.variant-color-dot){min-width:0;overflow-wrap:anywhere}
:is(.product-page, .quick-view, .marvelle-landing) .variant-color-dot{width:22px;height:22px;flex:0 0 22px;border-radius:50%;background:var(--variant-color);border:1px solid #24121b26;box-shadow:inset 0 0 0 2px #ffffff40}
/* The selected tick is outside the text flow, so both states keep the same centred fit. */
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice-check{position:absolute;top:-5px;right:-5px;width:18px;height:18px;box-sizing:border-box;padding:2px;border:2px solid #fff;border-radius:50%;background:var(--magenta);color:#fff;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;visibility:hidden}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice input:checked+.variant-choice-content{border-color:var(--magenta);background:#fcf3f9;color:var(--plum);box-shadow:0 0 0 1px var(--magenta)}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice input:checked+.variant-choice-content .variant-choice-check{visibility:visible}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice:hover .variant-choice-content{border-color:var(--magenta)}
:is(.product-page, .quick-view, .marvelle-landing) .variant-choice input:focus-visible+.variant-choice-content{outline:2px solid var(--magenta);outline-offset:4px}
:is(.product-page, .quick-view, .marvelle-landing) .variant-preview-note{margin:20px 0 0;padding:10px 14px;border:1px solid #e9e0e4;border-radius:12px;background:#fcf8fa;color:#775c6b;font:400 12px/1.6 var(--sans)}
:is(.product-page, .quick-view, .marvelle-landing) #pdp-option-status{font-size:13px;line-height:1.6}
@media(max-width:480px){:is(.product-page, .quick-view, .marvelle-landing) .variant-choice-list{gap:9px}:is(.product-page, .quick-view, .marvelle-landing) .variant-choice-content{padding-inline:12px}:is(.product-page, .quick-view, .marvelle-landing) #product-options{scroll-margin-top:150px}}
@media(prefers-reduced-motion:reduce){:is(.product-page, .quick-view, .marvelle-landing) .variant-choice-content{transition:none}}
@media(forced-colors:active){:is(.product-page, .quick-view, .marvelle-landing) .variant-choice input:checked+.variant-choice-content{border-color:Highlight;outline:2px solid Highlight}:is(.product-page, .quick-view, .marvelle-landing) .variant-choice input:checked+.variant-choice-content .variant-choice-check{forced-color-adjust:none;background:Highlight;color:HighlightText;border-color:Canvas}}
