@media only screen and (max-width: 1024px) {
    
    
    .add-to-cart-button-outer {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        position: relative !important;
        top: auto !important;
        left: 50% !important;
        transform: none !important;
        width: 100% !important;
        margin: 10px 0 !important;
        clear: both;
    }

    
    .add-to-cart-button-inner a.qbutton.add-to-cart-button {
        display: inline-block !important; 
        opacity: 1 !important;
        visibility: visible !important;
        background-color: #c0d731 !important;
        color: #fff !important;
        padding: 8px 5px !important;
        font-size: 11px !important;   
        line-height: 1.1 !important;
        height: auto !important;
        min-width: 125px;             
        max-width: 95%;               
        text-align: center;
        box-sizing: border-box;
        text-transform: uppercase;
        font-weight: 700;
        border-radius: 2px;
        white-space: nowrap; 
        border-color: transparent !important;
    }
    
    .add-to-cart-button-inner a.qbutton.add-to-cart-button:hover {
        background-color: transparent !important;
        color: #45a4dc !important;
        height: auto !important;
        min-width: 125px;             
        max-width: 95%;               
        text-align: center;
        border-color: #45a4dc !important;
        display: inline-block !important; 
        opacity: 1 !important;
        visibility: visible !important;
        padding: 8px 5px !important;
        font-size: 11px !important;   
        line-height: 1.1 !important;          
        text-align: center;
        box-sizing: border-box;
        text-transform: uppercase;
        font-weight: 700;
        border-radius: 2px;
        white-space: nowrap;
    }
    
    .add-to-cart-button-inner .qode-eo-icon-holder {
        position: absolute !important; /* El icono flotará para no empujar el texto */
        right: 10px !important;
    }
    
}
/* Reemplazar la cruz de agotado por una nueva en color azul #45a4dc */
.variable-item-span .variable-item-span-button:before {
    background-image: url("data:image/svg+xml;utf8,") !important;
    filter: none !important; 
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    opacity: 1 !important;
}
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).disabled .variable-item-contents {
    overflow: hidden; /* Asegura que la cruz no se salga del cuadro */
}

/* Forzamos el reemplazo de la cruz de agotado */
.woo-variation-swatches .variable-items-wrapper .variable-item.disabled .variable-item-contents:before,
.woo-variation-swatches .variable-items-wrapper .variable-item.disabled .variable-item-contents:after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48bGluZSB4MT0iMCIgeTE9IjEwMCIgeDI9IjEwMCIgeTI9IjAiIHN0cm9rZT0iIzQ1YTRkYyIgc3Ryb2tlLXdpZHRoPSI0Ii8+PGxpbmUgeDE9IjAiIHkxPSIwIiB4Mj0iMTAwIiB5Mj0iMTAwIiBzdHJva2U9IiM0NWE0ZGMiIHN0cm9rZS13aWR0aD0iNCIvPjwvc3ZnPg==") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    filter: none !important;
    opacity: 1 !important;
    z-index: 10 !important;
}

/* Ocultamos cualquier línea diagonal gris que el plugin ponga por defecto */
.woo-variation-swatches .variable-items-wrapper .variable-item.disabled {
    text-decoration: none !important;
}