.shop-variant-options { display: grid; gap: 8px; margin-bottom: 22px; }
.shop-variant-options-label { margin: 0 0 3px; color: var(--shop-muted, #b9bab4); font-size: 13px; font-weight: 600; }
.shop-variant-option { display: grid; grid-template-columns: 56px minmax(0, 1fr) 10px; gap: 12px; align-items: center; padding: 10px; border: 1px solid #41454b; border-radius: 9px; color: inherit; text-decoration: none; background: #171a1f; transition: border-color .15s, background .15s; }
.shop-variant-option:hover { border-color: #a0a0a5; }
.shop-variant-option:focus-visible { outline: 3px solid var(--color-accent, #e31e4f); outline-offset: 3px; }
.shop-variant-option[aria-current="page"] { border: 2px solid var(--color-accent, #e31e4f); padding: 9px; background: #251a23; }
.shop-variant-option-image { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 5px; overflow: hidden; background: #edede9; }
.shop-variant-option-image img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.shop-variant-option-copy { display: grid; gap: 3px; min-width: 0; }
.shop-variant-option-copy strong { font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
.shop-variant-option[aria-current="page"] .shop-variant-option-copy strong { color: #ff7e9c; }
.shop-variant-option-copy small { color: #b9bab4; font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.shop-variant-option-bottom { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.shop-variant-option-bottom b { font-size: 14px; }
.shop-variant-option-stock { width: 9px; height: 9px; border-radius: 50%; background: #b9bab4; align-self: start; margin-top: 3px; }
.shop-variant-option-stock[data-stock-status="available"], .shop-variant-option-stock[data-stock-status="low"] { background: #52cc85; }
.shop-variant-option-stock[data-stock-status="incoming"], .shop-variant-option-stock[data-stock-status="backorder"] { background: #efa83f; }
.shop-variant-option-stock[data-stock-status="unavailable"] { background: #dc8495; }
@media (max-width: 390px) { .shop-variant-option { gap: 9px; grid-template-columns: 44px minmax(0, 1fr) 9px; } .shop-variant-option-image { width: 44px; height: 48px; } }