/* Medpoint Size Swatches — out-of-stock visual + stock summary */

.wd-swatches-product .wd-swatch.mss-out-of-stock {
    position: relative;
    opacity: 0.7;
}

.wd-swatches-product .wd-swatch.mss-out-of-stock .wd-swatch-text {
    color: inherit;
}

.wd-swatches-product .wd-swatch.mss-out-of-stock::before,
.wd-swatches-product .wd-swatch.mss-out-of-stock::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 2;
    border-radius: inherit;
}

.wd-swatches-product .wd-swatch.mss-out-of-stock::before {
    background-image: linear-gradient(
        to top right,
        transparent 0,
        transparent calc(50% - 1px),
        rgba(120, 120, 120, 0.55) calc(50% - 1px),
        rgba(120, 120, 120, 0.55) calc(50% + 1px),
        transparent calc(50% + 1px),
        transparent 100%
    );
}

.wd-swatches-product .wd-swatch.mss-out-of-stock::after {
    background-image: linear-gradient(
        to bottom right,
        transparent 0,
        transparent calc(50% - 1px),
        rgba(120, 120, 120, 0.55) calc(50% - 1px),
        rgba(120, 120, 120, 0.55) calc(50% + 1px),
        transparent calc(50% + 1px),
        transparent 100%
    );
}

.wd-swatches-product .wd-swatch.mss-out-of-stock:hover {
    opacity: 0.75;
}

/* Make sure the swatch stays clickable and shows hover feedback */
.wd-swatches-product .wd-swatch.mss-out-of-stock {
    cursor: pointer;
}