/*
 * Conditional attributes are hidden at their complete native attribute-row wrapper so the select,
 * ShopEngine presentation and label disappear together. frontend.js also applies inline
 * display:none !important while N/A is active because ShopEngine/theme layouts can use their own
 * higher-specificity !important row display rules. This stylesheet remains a defensive fallback.
 */
.variations_form .mvc-attribute-not-applicable {
    display: none !important;
}

/*
 * Availability UX (v1.9.14):
 * - First-level image swatches are always browseable. A branch whose every child combination is
 *   unavailable/sold out is visually muted only; it deliberately keeps pointer interaction.
 * - Downstream native dropdown options use the browser's real disabled state so unavailable Size /
 *   Material / Length values cannot be selected.
 */
.variations_form .mvc-first-branch-unavailable {
    opacity: 0.42;
    filter: grayscale(1);
    cursor: pointer !important;
}

.variations_form .mvc-first-branch-browseable {
    cursor: pointer !important;
}

.variations_form select option.mvc-option-unavailable,
.variations_form select option:disabled {
    color: #9a9a9a;
}