/* Styles existants */
#rgnr-pot-product-options-table-container {
    width: 100%;
}

.rgnr-pot-product-options-table {
    width: 212%;
    border-collapse: collapse;
    margin-top: 39% !important;
    left: -109% !important;
    position: relative;
}

.rgnr-pot-product-options-table th, .rgnr-pot-product-options-table td {
    border: 1px solid #ddd;
    padding: 12px; 
    text-align: center;
}

.rgnr-pot-product-options-table th {
    background-color: #f2f2f2;
    text-align: left;
}

.rgnr-pot-product-options-table td.quantity,
.rgnr-pot-product-options-table th.quantity {
    width: 150px; 
}

.rgnr-pot-product-options-table td.action,
.rgnr-pot-product-options-table th.action {
    width: 233px; 
}

.add-to-cart-button,
.out-of-stock-button {
    display: inline-block;
    padding: 10px 20px;
    margin: 0 auto;
    color: #fff;
    background-color: #f60;
    border: none;
    cursor: pointer;
    text-align: center;
    font-size: 14px;
}

.out-of-stock-button {
    background-color: #ccc; /* Griser le bouton pour les produits en rupture de stock */
    cursor: not-allowed;
}

/* Styles pour tablettes */
@media screen and (max-width: 768px) {
    .rgnr-pot-product-options-table {
        width: 100%;
        margin-top: 20px !important;
        left: 0 !important;
    }
    
    .rgnr-pot-product-options-table th, .rgnr-pot-product-options-table td {
        padding: 6px !important;
        font-size: 12px !important;
    }
    
    .rgnr-pot-product-options-table td.quantity,
    .rgnr-pot-product-options-table th.quantity {
        width: 100px !important; 
    }

    .rgnr-pot-product-options-table td.action,
    .rgnr-pot-product-options-table th.action {
        width: 150px !important; 
        align-items: center ;
    }

    .button.pvtfw_variant_table_cart_btn {
        padding: 10px 6px ;
        font-size: 10px;
        width: 80px !important; /* Ajustez cette valeur selon vos besoins */
        height: auto !important; /* Assurez-vous que la hauteur s'ajuste automatiquement */
    }

    /* Réduction de la taille des champs de quantité pour les tablettes */
    .woocommerce .quantity .qty {
        width: 60px !important; /* Réduire la largeur */
        height: 30px !important; /* Réduire la hauteur */
        padding: 4px !important; /* Réduire le padding */
        font-size: 10px !important; /* Réduire la taille de la police */
        box-sizing: border-box !important; /* Assurez-vous que la largeur inclut le padding */
        max-width: 100% !important; /* Assurez-vous qu'il ne dépasse pas la largeur du parent */
        margin: 0 !important; /* Supprimez les marges */
    }

    .qty {
        min-width: 60px !important; /* Réduire la min-width */
        height: 30px !important; /* Réduire la hauteur */
        padding: 4px !important; /* Réduire le padding */
        font-size: 10px !important; /* Réduire la taille de la police */
    }
}

/* Styles pour mobiles */
@media screen and (max-width: 600px) {
    .rgnr-pot-product-options-table {
        width: 100%;
        margin-top: 20px !important;
        left: 0 !important;
    }
    
    .rgnr-pot-product-options-table th, .rgnr-pot-product-options-table td {
        padding: 0px !important;
        font-size: 10px !important;
    }
    
    .rgnr-pot-product-options-table td.quantity,
    .rgnr-pot-product-options-table th.quantity {
        width: 50px !important; 
    }

    .rgnr-pot-product-options-table td.action,
    .rgnr-pot-product-options-table th.action {
        width: 500px !important; 
    }

    .button.pvtfw_variant_table_cart_btn {
        padding: 11px 3px ;
        font-size: 8px;
        width: 50px !important; 
        height: auto !important; 
    }

    .woocommerce .quantity .qty {
        width: 50px !important; /* Réduire la largeur */
        height: 20px !important; /* Réduire la hauteur */
        padding: 2px !important; /* Réduire le padding */
        font-size: 8px !important; /* Réduire la taille de la police */
        box-sizing: border-box !important; /* Assurez-vous que la largeur inclut le padding */
        max-width: 100% !important; /* Assurez-vous qu'il ne dépasse pas la largeur du parent */
        margin: 0 !important; /* Supprimez les marges */
    }

    .qty {
        min-width: 50px !important; /* Réduire la min-width */
        height: 20px !important; /* Réduire la hauteur */
        padding: 2px !important; /* Réduire le padding */
        font-size: 8px !important; /* Réduire la taille de la police */
    }
}

.button.wc-forward {
    background-color: #FEA376 !important;
    color: #fff !important;
    border: none !important;
    padding: 8px 15px !important;
    font-size: 16px !important;
    font-family: 'Poppins', sans-serif !important;
    cursor: pointer !important;
    border-radius: 45px !important;
    text-align: center !important;
    text-decoration: none !important;
    display: inline-block !important;
    float: right !important;
}

.button.wc-forward:hover,
.button.wc-forward:focus,
.button.wc-forward:active {
    background-color: #FEA376 !important; /* Garder la même couleur au hover */
    color: #fff !important; /* Garder la même couleur de texte au hover */
    text-decoration: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
} 

/* CSS pour griser le bouton */
.disabled {
    background-color: #ddd; /* Couleur grisée */
    cursor: not-allowed; /* Empêcher le curseur de pointer */
    opacity: 0.5; /* Rendre le bouton semi-transparent */
}