/* Smart Ring product panel: match the AI Micro purchase layout. */
body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info {
    background: #f7faff;
    color: #162a43;
    font-family: Inter, "Helvetica Neue", Arial, sans-serif;
}

body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info .product-title {
    font-family: Inter, "Helvetica Neue", Arial, sans-serif;
    font-size: clamp(1.7rem, 2.6vw, 2.5rem);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -0.04em;
    color: #172d4c;
}

body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info .price-item {
    color: #172d4c;
}

body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info .product-form__submit {
    border-color: #3973b6;
    color: #3973b6;
}

body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info .product-form__submit:not(:disabled):hover {
    background: #e9f2fc;
}

body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info .shopline-payment-button__button {
    background: #3973b6;
}

/* Keep unavailable variants visibly unavailable, but make their labels legible. */
body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info variant-radios input.disabled+label {
    color: #7b8da6;
    border-color: #cbd5e3;
}

body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info input[value="Gloss Silver"]+label .product-form--color-swatch-inner {
    background: linear-gradient(135deg, #fbfcff, #aab4c3);
}

body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info input[value="Gloss Black"]+label .product-form--color-swatch-inner {
    background: #242832;
}

body:has(variant-radios[data-url*="/products/smart-ring"]) #shopline-section-main-product-info input[value="Gloss Gold"]+label .product-form--color-swatch-inner {
    background: linear-gradient(135deg, #f7df9b, #a67726);
}