/* Styles pour les notifications WooCommerce */
.woocommerce-message, 
.woocommerce-error, 
.woocommerce-info {
    background-color: #E7E7E7 !important; /* Fond blanc */
    color: black !important; /* Texte noir */
	text-transform: uppercase;
    font-size: 16px !important;
    text-align: center !important;
    border-radius: 15px !important; /* Coins arrondis */
    padding: 15px !important;
    border: 1px solid #A8A8A8;
    position: relative; /* Pour éviter les superpositions */
    animation: fadeIn 0.5s ease-out, fadeOut 2s ease-in 4s; /* Apparition & Disparition */
}

/* Supprime l'icône de validation (✔) et autres symboles WooCommerce */
.woocommerce-message::before,
.woocommerce-error::before,
.woocommerce-info::before {
    display: none !important;
}

/* Ajuster le texte à l'intérieur */
.woocommerce-message p, 
.woocommerce-error p, 
.woocommerce-info p {
    margin: 0 !important;
}

/* Supprimer l'arrière-plan gris */
.variations td, .variations th {
    background-color: transparent !important;
    border: none !important;
}

/* Supprimer le texte "Taille vêtement" */
.variations th {
    display: none !important;
}

/* Ajuster l'alignement des boutons */
.variations td {
    padding: 0 !important;
}

/* Cacher le bouton "Effacer" des variations */
.reset_variations {
    display: none !important;
}

/* Cacher l'affichage du stock sur les pages produit */
.woocommerce-variation-availability {
    display: none !important;
}

/* Forcer les swatches à être carrés parfaits */
.cfvsw-swatches-option {
    width: 40px !important;  /* Ajuste selon tes besoins */
    height: 40px !important; /* Même valeur que width pour assurer un carré */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 0 !important; /* Supprime tout arrondi */
}

/* Ajuster le texte à l'intérieur des boutons */
.cfvsw-swatches-option .cfvsw-swatch-inner {
    font-size: 14px; /* Ajuste la taille du texte si besoin */
    font-weight: normal;
}

/* 🛒 Conteneur du titre "PANIER" */
.custom-cart-container {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px; /* Ajoute un espace sous "PANIER" */
}
.custom-cart-container {
    margin-left: 25px; /* Ajuste la valeur selon ton besoin */
}

.custom-cart-title {
    justify-content: center;
    padding: 6px 12px;
    border: 1px solid black;
    border-radius: 0px;
    font-weight: bold;
    font-size: 18px;
    text-transform: uppercase;
    color: black;
}

/* Style de "TOTAL PANIER" */
.total-panier-container {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    border: 1px solid black;
    border-radius: 0px;
    font-weight: bold;
    font-size: 18px;
    text-transform: uppercase;
    color: black;
    margin-bottom: 10px;
}

/* 🏷️ Réaligner les éléments du panier */
.woocommerce-cart-form .cart_item {
    display: flex;
    flex-direction: column; /* Affichage vertical */
    align-items: flex-start;
    gap: 25px;
    border-bottom: 1px solid #ddd;
}


/* ❌ Déplacer la croix de suppression en haut à droite */
.woocommerce-cart-form .product-remove {
    align-self: flex-start; /* Aligner en haut */
    margin-left: auto; /* La pousser à droite */
}


/* Supprimer les conteneurs gris */
.woocommerce-cart-form .cart_item > td {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}
/* Ajuster le conteneur de la croix */
.woocommerce-cart-form .product-remove {
    width: auto;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
}

.woocommerce-cart-form .product-remove a {
    font-size: 20px; /* Diminue la taille de la croix */
    font-weight: normal; /* Réduit l'épaisseur */
}

/* ✅ Styles pour aligner correctement les titres avec les valeurs */
.custom-cart-label {
    display: block;
    font-size: 15px;
    font-weight: bold;
}

/* ✅ Espacer la quantité du titre */
.custom-cart-label input.qty {
    margin-left: 10px;
}

/* ✅ Assurer que chaque section est bien alignée */
.woocommerce-cart-form .cart_item {
    display: flex;
    flex-direction: column; /* Met en colonne */
    align-items: flex-start;
    gap: 5px;
}

@media screen and (max-width: 768px) {
    /* Masquer les data-title de WooCommerce sur mobile */
    .woocommerce-cart-form .product-name::before,
    .woocommerce-cart-form .product-price::before,
    .woocommerce-cart-form .product-quantity::before,
    .woocommerce-cart-form .product-subtotal::before {
        content: none !important;
    }
}

@media screen and (max-width: 768px) {
    .woocommerce-cart-form .cart_item {
        display: flex;
        flex-direction: column;
        align-items: flex-start; /* Aligner à gauche */
		width: 100%; /* Prendre toute la largeur */
		
    }

    .woocommerce-cart-form .product-remove {
        align-self: flex-end; /* Garder la croix de suppression alignée en haut à droite */
    }
}

@media screen and (max-width: 768px) {
    /* S'assure que le panier utilise toute la largeur */
    .woocommerce-cart-form, 
    .woocommerce-cart-form table, 
    .woocommerce-cart-form .shop_table {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
    }

    /* Empêche l'écrasement des éléments */
    .woocommerce-cart-form .cart_item {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        padding: 10px 0;
    }

    /* Empêcher un conteneur de restreindre l'espace */
    .woocommerce {
        width: 100% !important;
        max-width: none !important;
    }

    /* Vérifier si un flexbox contraint les éléments */
    .woocommerce-cart-form .cart_item,
    .woocommerce-cart-form .cart {
        display: block !important;
    }
}

.woocommerce-cart-form {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
}

/* Suppression de la bordure autour du conteneur Stripe */
.payment_box.payment_method_woocommerce_payments {
    border: none !important;
    box-shadow: none !important;
}

/* Suppression de la bordure sur le fieldset (peut être le responsable) */
fieldset.wc-payment-form {
    border: none !important;
    box-shadow: none !important;
}

/* Suppression de la bordure sur le conteneur StripeElement */
.wcpay-upe-form {
    border: none !important;
    box-shadow: none !important;
}

/* Suppression de la bordure potentielle sur d'autres niveaux */
.wcpay-upe-element.StripeElement {
    border: none !important;
    box-shadow: none !important;
}

/* Ajouter un espace entre les boutons radio et les labels */
.wc_payment_methods .wc_payment_method {
    gap: 25px; /* Espace entre la case et le texte */
    margin-bottom: 30px; /* Espacement vertical entre les méthodes de paiement */
}

/* Style de la case à cocher des CGV */
.woocommerce-form__label-for-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
	text-transform: uppercase;
}

/* Ajustement de la case à cocher */
.woocommerce-form__input-checkbox {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

/* Ajout d'un espacement sous la case */
.woocommerce-review-order-before-submit {
    margin-bottom: 15px;
}

/* Style des gros titres des sections */
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3,
.woocommerce-checkout-review-order h3 {
	display: inline-block; /* Pour que la bordure entoure uniquement le texte */
    padding: 6px 12px;
    border: 1px solid black;
    border-radius: 0px;
    font-size: 18px; /* Ajuste la taille si nécessaire */
    font-weight: bold;
    text-transform: uppercase; /* Optionnel pour un effet plus marqué */
}

/* Appliquer le style aux titres des sections checkout */
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3,
.woocommerce-checkout-review-order h3,
#order_review_heading { /* Ajout du titre manquant */
    display: inline-block; /* Assure que la bordure entoure uniquement le texte */
    padding: 6px 12px;
    border: 1px solid black;
    border-radius: 0px;
    font-size: 18px; /* Ajuste la taille si nécessaire */
    font-weight: bold;
    text-transform: uppercase; /* Optionnel pour un effet plus marqué */
}

.woocommerce-MyAccount-content {
    width: 100% !important;
}


/* Appliquer les styles aux champs de saisie */
.woocommerce-EditAccountForm input.woocommerce-Input,
.woocommerce-EditAccountForm select {
    background-color: transparent !important; /* Enlever l’arrière-plan */
    border: none !important; /* Enlever le contour */
    box-shadow: none !important; /* Enlever les ombres éventuelles */
    outline: none !important; /* Enlever le focus outline */
    width: 100%;
    padding: 5px;
    font-size: 14px;
    background-color: #CECECE !important;
    color: #000 !important;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
    margin-bottom: 15px;
}

/* Mettre les libellés en majuscules */
.woocommerce-EditAccountForm label {
    color: black !important;
    text-transform: uppercase !important;
	font-size: 14px;
}

/* Style des placeholders */
.woocommerce-EditAccountForm input::placeholder {
    text-transform: uppercase;
    color: #E7E7E7 !important;
}

/* Supprimer le halo au focus */
.woocommerce-EditAccountForm input.woocommerce-Input:focus,
.woocommerce-EditAccountForm select:focus {
    box-shadow: none !important;
    outline: none !important;
}

/* Ajuster les lignes du formulaire */
.woocommerce-form-row {
    border: none !important;
    margin-bottom: 10px !important;
}

/* Style spécifique pour le champ de sélection de devise */
select[name="wcpay_selected_currency"] {
    background-color: #CECECE !important;
    color: #000 !important;
    padding: 5px;
    border-radius: 0px;
}

.woocommerce-EditAccountForm fieldset legend {
    text-transform: uppercase !important;
    font-weight: bold; /* Optionnel : met en gras pour plus de visibilité */
    color: black !important; /* Ajuste la couleur si nécessaire */
}

.woocommerce-EditAccountForm fieldset {
    border: none !important;
    padding: 0 !important; /* Enlève tout espace interne si besoin */	
    margin: 0 !important; /* Supprime les marges si besoin */

}

#account_email {
    margin-bottom: 20px !important;
}

/* Styliser le bouton de la page Modifier le compte */
.woocommerce-EditAccountForm button.woocommerce-Button {
    text-transform: uppercase !important;
    width: 100% !important;
    padding: 10px !important;
    border-radius: 5px !important;
    font-size: 16px !important;
    background-color: #000000 !important; /* Arrière-plan noir */
    color: white !important; /* Texte blanc */
    cursor: pointer !important;
    border: none !important;
    transition: background-color 0.3s ease;
}

/* Effet au survol */
.woocommerce-EditAccountForm button.woocommerce-Button:hover {
    background-color: #333333 !important; /* Gris foncé au survol */
}

.woocommerce-Button.wc-forward {
    display: none !important;
}

/* Appliquer le même style que le bouton "Enregistrer les modifications" */
.woocommerce-EditAccountForm .delete-account-button {
    text-transform: uppercase !important;
    width: 100% !important;
    padding: 10px !important;
    border-radius: 5px !important;
    font-size: 16px !important;
    background-color: #000000 !important; /* Arrière-plan noir */
    color: white !important; /* Texte blanc */
    cursor: pointer !important;
    border: none !important;
    transition: background-color 0.3s ease;
    display: block !important;
    text-align: center !important;
    margin-top: 10px !important;
}

/* Effet au survol */
.woocommerce-EditAccountForm .delete-account-button:hover {
    background-color: #333333 !important; /* Gris foncé au survol */
}


/* Supprimer les bordures et l'arrière-plan de la table */
.woocommerce-orders-table {
    background-color: transparent !important;
    border: none !important;
}

/* Supprimer les bordures des cellules et des en-têtes */
.woocommerce-orders-table th,
.woocommerce-orders-table td {
    border: none !important;
}

/* Mettre le texte en majuscules */
.woocommerce-orders-table th span,
.woocommerce-orders-table td {
    text-transform: uppercase !important;
}

/* Supprimer l'arrière-plan du bouton "Voir" */
.woocommerce-orders-table .woocommerce-button {
    background-color: transparent !important;
    border: 1px solid #000 !important; /* Ajoute une bordure fine si besoin */
    color: #000 !important; /* Assure un bon contraste */
    text-transform: uppercase !important;
}

/* Effet au survol du bouton */
.woocommerce-orders-table .woocommerce-button:hover {
    background-color: #000 !important;
    color: #fff !important;
}

.woocommerce-orders-table a {
    color: black !important; /* Noir */
    text-decoration: none; /* Supprime le soulignement */
}

.woocommerce-orders-table a:hover {
    color: grey !important; /* Gris au survol */
}


/* Appliquer les styles aux champs de saisie dans edit-address */
.woocommerce-address-fields__field-wrapper input,
.woocommerce-address-fields__field-wrapper select {
    background-color: transparent !important; /* Enlever l’arrière-plan */
    border: none !important; /* Enlever le contour */
    box-shadow: none !important; /* Enlever les ombres éventuelles */
    outline: none !important; /* Enlever le focus outline */
    width: 100%;
    padding: 5px;
    font-size: 16px;
    background-color: #CECECE !important;
    color: #000 !important;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
    margin-bottom: 15px;
}

/* Mettre les libellés en majuscules */
.woocommerce-address-fields__field-wrapper label {
    color: black !important;
    text-transform: uppercase !important;
}

/* Style des placeholders */
.woocommerce-address-fields__field-wrapper input::placeholder {
    text-transform: uppercase;
    color: #CECECE !important;
}

/* Supprimer le halo au focus */
.woocommerce-address-fields__field-wrapper input:focus,
.woocommerce-address-fields__field-wrapper select:focus {
    box-shadow: none !important;
    outline: none !important;
}

/* Ajuster les lignes du formulaire */
.woocommerce-address-fields__field-wrapper .form-row {
    border: none !important;
    margin-bottom: 15px !important;
}

/* Styliser le bouton de sauvegarde */
.woocommerce-address-fields button.button {
    text-transform: uppercase !important;
    width: 100% !important;
    padding: 10px !important;
    border-radius: 5px !important;
    font-size: 16px !important;
    background-color: #000000 !important; /* Arrière-plan noir */
    color: white !important; /* Texte blanc */
    cursor: pointer !important;
    border: none !important;
    transition: background-color 0.3s ease;
}

/* Effet au survol */
.woocommerce-address-fields button.button:hover {
    background-color: #333333 !important; /* Gris foncé au survol */
}


/* Appliquer le style du navigateur au champ "Pays/Région" */
.woocommerce-address-fields__field-wrapper select#billing_country {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    width: 100%;
    padding: 5px;
    font-size: 16px;
    background-color: #CECECE !important;
    color: #000 !important;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
    margin-bottom: 15px;
    -webkit-appearance: menulist !important;
    -moz-appearance: menulist !important;
    appearance: menulist !important; /* Rétablir la liste native */
}

/* Au focus, on évite l'effet Select2 */
.woocommerce-address-fields__field-wrapper select#billing_country:focus {
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
}

/* Forcer l'uppercase sur le h2 de l'adresse */
form h2 {
    text-transform: uppercase !important;
    font-weight: bold !important;
    color: black !important;
    font-size: 22px !important;
    letter-spacing: 1px !important;
}

/* Rendre les arrière-plans et contours transparents */
.woocommerce-order-details,
.woocommerce-order-details table,
.woocommerce-order-details th,
.woocommerce-order-details td,
.woocommerce-customer-details,
.woocommerce-customer-details table {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Mettre les textes en majuscules */
.woocommerce-order-details h2,
.woocommerce-customer-details h2,
.woocommerce-order-details th,
.woocommerce-order-details .order-again a {
    text-transform: uppercase !important;
    font-weight: bold !important;
    color: black !important;
}

.woocommerce-order-details td,
.woocommerce-customer-details th,
.woocommerce-customer-details td, {
    text-transform: uppercase !important;
    font-weight: normal !important;
    color: black !important;
}

/* Modifier la couleur des liens */
.woocommerce-order-details a,
.woocommerce-order-details .order-actions-button,
.woocommerce-order-details .order-again a {
    color: black !important;
    text-decoration: none !important;
}


/* Ajuster les boutons */
.woocommerce-order-details .order-actions-button,
.woocommerce-order-details .order-again a {
    text-transform: uppercase !important;
	border: 1px solid black !important;
    background-color: #E7E7E7 !important;
    padding: 8px 12px !important;
    display: inline-block;
    transition: background-color 0.3s ease;
}

/* Effet au survol des boutons */
.woocommerce-order-details .order-actions-button:hover,
.woocommerce-order-details .order-again a:hover {
    background-color: black !important;
    color: white !important;
}

.woocommerce-order-details .order-again {
    display: none !important;
}

/* Mettre tous les textes en majuscules */
.woocommerce-Address-title h2,
.woocommerce-MyAccount-content p,
.woocommerce-MyAccount-content address {
    text-transform: uppercase !important;
}

/* Changer la couleur des liens */
.woocommerce-MyAccount-content a {
	margin-bottom: 15px;
	border: 1px solid black !important;
	border-radius: 5px !important;
    background-color: #E7E7E7 !important;
    padding: 4px 12px !important;
    display: inline-block;
    transition: background-color 0.3s ease;
	text-transform: uppercase !important;
    color: black !important;
    text-decoration: none !important;
}

/* Optionnel : Changer la couleur du lien au survol */
.woocommerce-MyAccount-content a:hover {
    background-color: black !important;
    color: white !important;
}

.woocommerce-form.woocommerce-form-login,
.woocommerce-form.woocommerce-form-register {
    display: none !important;
}
#customer_login .u-column1 h2,
#customer_login .u-column2 h2 {
    display: none !important;
}
/* Capitaliser uniquement le texte de cette section */
.woocommerce-lost-password form,
.woocommerce-lost-password form label,
.woocommerce-lost-password form h2,
.woocommerce-lost-password form input,
.woocommerce-lost-password form button {
    text-transform: uppercase !important;
    color: black !important;
}
/* Styliser le champ de saisie */
.woocommerce-lost-password input[type="text"],
.woocommerce-lost-password input[type="email"] {
    background-color: #CECECE !important;
    border: none !important;
    box-shadow: none !important;
    color: #000 !important;
    padding: 10px;
    font-size: 16px;
    width: 100%;
}

/* Placeholder stylisé */
.woocommerce-lost-password input::placeholder {
    color: #999 !important;
    text-transform: uppercase;
}

/* Styliser le bouton de soumission */
.woocommerce-lost-password button.button {
    background-color: #000 !important;
    color: #fff !important;
    text-transform: uppercase !important;
    padding: 12px 24px !important;
    font-size: 16px !important;
    border: none !important;
    cursor: pointer !important;
    width: 100%;
    transition: background-color 0.3s ease;
}

/* Hover */
.woocommerce-lost-password button.button:hover {
    background-color: #333 !important;
}

