/*
 * WLC Custom Product Badge Styles (Definitive Fix)
 */

/* 
 * This is the base style for ALL custom badges.
 * It uses the visual styling of your Pre-order tag but forces the 
 * z-index to 9, which we know works correctly from the "Sale!" tag.
 * The '!important' flag guarantees this rule will override any other styles.
*/
.wpo-preorder-bubble,
.wlc-outofstock-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    z-index: 9 !important; /* This is the definitive fix */
    background-color: rgb(56, 173, 169); /* Pre-order color */
    color: #ffffff !important;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    text-transform: uppercase;
    border-radius: 4px;
    display: block;
}

/* 
 * This rule targets ONLY our "Out of Stock" badge to change its color
 * from the pre-order green/blue to a neutral grey.
*/
.wlc-outofstock-badge {
    background-color: #888888 !important; 
}