/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/





.wd-page-wrapper {
    position: relative;
    background-color: #ffffff26 !important;
}
.single-product .wd-page-content {
    background-color: transparent !important;
    
}


.wd-search-requests.wd-hide-md {display:none !important}


.wd-content-layout {
    padding-block: 0px !important;
}


/* ==========================================================================
   DA LA CANNABISSERIE - LOOK RETRO / COMIC
   ========================================================================== */

/* 1. Le Badge de Réduction en Étoile (Starburst) */
.product-wrapper .product-labels.labels-rounded-sm {
    top: 15px;
    left: 15px;
    z-index: 3;
}

.product-wrapper .product-labels .onsale.product-label {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><polygon points='50,5 63,18 81,13 83,31 98,37 89,52 97,68 81,71 77,88 60,82 48,96 36,81 19,86 17,69 2,64 11,49 3,34 19,31 23,14 40,19' fill='%23cc2b5e' stroke='%23000000' stroke-width='4' stroke-linejoin='round'/></svg>");
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent !important;
    color: #ffffff !important;
    font-weight: 800;
    font-size: 14px;
    width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0 !important;
    padding: 0;
    margin: 0;
    /* Petit effet de rotation vintage comme sur l'image */
    transform: rotate(-12deg);
    filter: drop-shadow(2px 2px 0px rgba(0,0,0,0.15));
}

/* 2. Le Bouton "Ajouter au Panier" */
.product-wrapper .wd-add-btn .add_to_cart_button {
    background-color: #0e3d26 !important; /* Vert forêt profond */
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 5px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.2s ease;
    box-shadow: 0px 3px 0px #000000; /* Effet de relief plat style BD */
}

.product-wrapper .wd-add-btn .add_to_cart_button:hover {
    background-color: #155435 !important;
    transform: translateY(1px);
    box-shadow: 0px 2px 0px #000000;
}

/* 3. Les Prix (Style de l'image) */
.product-wrapper .wrap-price .price del {
    color: #7a7a7a !important;
    font-size: 0.9em;
}

.product-wrapper .wrap-price .price ins {
    color: #cc2b5e !important; /* Reprise du rose/rouge promo */
    font-weight: 800 !important;
    text-decoration: none;
    font-size: 1.2em;
    margin-left: 6px;
}

/* 4. Titre et interactions secondaires */
.product-wrapper .wd-entities-title a {
    color: #111111;
    font-weight: 700;
}

.product-wrapper .wd-entities-title a:hover {
    color: #0e3d26;
}


}


/* ==========================================================================
   DA LA CANNABISSERIE - FICHE PRODUIT UNIQUE
   ========================================================================== */

/* Positionnement du badge sur la galerie principale */
.wd-gallery-images .product-labels.labels-rounded-sm {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 10; /* Assure que le badge passe bien au-dessus du swiper */
}

/* L'étoile de promo (Starburst) version fiche produit */
.wd-gallery-images .product-labels .onsale.product-label {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><polygon points='50,5 63,18 81,13 83,31 98,37 89,52 97,68 81,71 77,88 60,82 48,96 36,81 19,86 17,69 2,64 11,49 3,34 19,31 23,14 40,19' fill='%23cc2b5e' stroke='%23000000' stroke-width='4' stroke-linejoin='round'/></svg>");
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent !important;
    color: #ffffff !important;
    font-weight: 800;
    font-size: 16px; /* Un poil plus grand pour la lisibilité */
    width: 75px;     /* Proportionné à la grande image */
    height: 75px;    /* Proportionné à la grande image */
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0 !important;
    padding: 0;
    margin: 0;
    
    /* Rotation rétro (-12deg) et ombre plate style BD */
    transform: rotate(-12deg);
    filter: drop-shadow(3px 3px 0px rgba(0,0,0,0.2));
}

/* Ajustement optionnel : s'assurer que le container parent gère bien le positionnement absolu */
.wd-carousel-inner {
    position: relative;
}


/* ==========================================================================
   DA LA CANNABISSERIE - IMAGE PRODUIT EN ROND (STYLE BD)
   ========================================================================== */

/* 1. Transformation du bloc de l'image en cercle parfait */
.wd-gallery-images figure.woocommerce-product-gallery__wrapper.wd-carousel {
    border-radius: 50% !important;
    overflow: hidden !important;
    background-color: #ffffff !important; /* Fond blanc demandé */
    
    /* Le contour de couleur (Vert forêt) */
    border: 10px solid #0e3d26 !important; 
    
    /* Le contour noir ultra-marqué style Bande Dessinée */
    box-shadow: 0 0 0 3px #000000 !important; 
    
    /* Force le conteneur à rester un carré parfait pour que le radius fasse un rond */
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    max-width: 550px; /* Ajustez cette valeur pour calibrer la taille max sur grand écran */
    margin: 0 auto !important;
    
    /* Règle les petits bugs d'affichage de l'overflow caché sur certains navigateurs */
    transform: translateZ(0); 
}

/* 2. Ajustement des images à l'intérieur du cercle */
.wd-gallery-images .wd-carousel-item img {
    width: 100% !important;
    height: 100% !important;
    /* 'cover' va remplir le cercle (comme sur votre capture). 
       Si vos images sont déjà détourées sur fond transparent, vous pourrez tester 'contain' */
    object-fit: cover !important; 
}

/* 3. Ajustement des flèches de navigation pour qu'elles épousent le contour du rond */
.wd-gallery-images .wd-nav-arrows {
    padding: 0 10px;
    z-index: 5;
}

/* 4. Repositionnement léger de l'étoile de réduction pour qu'elle morde sur le rond */
.wd-gallery-images .product-labels.labels-rounded-sm {
    top: 10px;
    left: 10px;
    z-index: 6;
}



/* ==========================================================================
   DA LA CANNABISSERIE - BLOC DROIT FICHE PRODUIT
   ========================================================================== */

/* 1. Fil d'ariane (Breadcrumbs) */
.elementor-797 .wd-breadcrumbs {
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.elementor-797 .wd-breadcrumbs a, 
.elementor-797 .wd-breadcrumbs .wd-last {
    color: #0e3d26 !important; /* Vert forêt discret */
}

/* 2. Titre du Produit */
.elementor-797 .product_title {
    color: #111111 !important;
    font-size: 42px !important; /* Donne de l'impact comme sur la maquette */
    line-height: 1.1;
    margin-bottom: 10px !important;
}

/* 3. Courte Description (Le sous-titre accrocheur) */
.elementor-797 .woocommerce-product-details__short-description p {
    color: #0e3d26 !important; /* Vert foncé texturé */
    font-weight: 700 !important;
    font-size: 16px;
    margin-bottom: 20px;
}



/* 5. Le Sélecteur de Quantité [- 1 +] style BD */
.elementor-797 .quantity {
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    display: inline-flex !important;
    overflow: hidden;
    background: #ffffff !important;
    height: 50px !important;
    box-shadow: 2px 2px 0px rgba(0,0,0,0.1);
}
.elementor-797 .quantity .btn {
    background: #f4f4f4 !important;
    color: #000000 !important;
    font-weight: 800 !important;
    font-size: 20px !important;
    width: 45px !important;
    border: none !important;
    transition: background 0.2s;
}
.elementor-797 .quantity .btn:hover {
    background: #e5e5e5 !important;
}
.elementor-797 .quantity input.qty {
    border-left: 2px solid #000000 !important;
    border-right: 2px solid #000000 !important;
    border-top: none !important;
    border-bottom: none !important;
    font-weight: 800 !important;
    font-size: 18px !important;
    color: #000000 !important;
    width: 55px !important;
}

/* 6. Bouton "Ajouter au Panier" Principal */
.elementor-797 .single_add_to_cart_button {
    background-color: #0e3d26 !important; /* Vert forêt profond */
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    font-size: 22px !important; /* Ajusté pour éviter que ce soit disproportionné sur mobile */
    font-weight: 800 !important;
    text-transform: uppercase !important;
    padding: 0 35px !important;
    height: 50px !important;
    box-shadow: 0px 4px 0px #000000 !important; /* Ombre plate 3D type bande dessinée */
    transition: transform 0.1s ease, box-shadow 0.1s ease, background-color 0.2s !important;
    margin-left: 15px;
}
.elementor-797 .single_add_to_cart_button:hover {
    background-color: #155435 !important;
    transform: translateY(2px) !important;
    box-shadow: 0px 2px 0px #000000 !important;
}

/* Alignement propre de la ligne quantité + bouton */
.elementor-797 .cart {
    display: flex;
    align-items: center;
    margin-bottom: 25px;
}

/* 7. Bouton "Ajouter à mes favoris" en dessous */
.elementor-797 .wd-single-wishlist-btn .wd-wishlist-btn a {
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    padding: 10px 20px !important;
    background: #ffffff !important;
    color: #000000 !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 0.5px;
    box-shadow: 0px 3px 0px #000000 !important;
    transition: all 0.1s ease;
}
.elementor-797 .wd-single-wishlist-btn .wd-wishlist-btn a:hover {
    background: #f9f9f9 !important;
    transform: translateY(1px);
    box-shadow: 0px 2px 0px #000000 !important;
}

/* 8. Compteur de visiteurs (Le petit bonus rétro) */
.elementor-797 .wd-visits-count {
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    background-color: #fff9e6 !important; /* Un léger fond jauni style vieux papier/BD */
    color: #000000 !important;
    box-shadow: 3px 3px 0px rgba(0,0,0,0.15);
}
.elementor-797 .wd-visits-count .wd-info-number {
    color: #cc2b5e !important;
    font-weight: 900;
}



/* ==========================================================================
   DA LA CANNABISSERIE - SIDEBAR / STICKY NAV RETRO
   ========================================================================== */

/* 1. Le Conteneur Global du Menu Sidebar */
.wd-sticky-nav {
    background-color: #0e3d26 !important; /* Vert forêt profond de la DA */
    border: 3px solid #000000 !important; /* Contour noir épais style BD */
    border-radius: 12px !important;
    box-shadow: 5px 5px 0px #000000 !important; /* Ombre plate 3D */
    overflow: hidden !important;
    padding: 0 !important;
}

/* 2. Le Header du Menu ("Menu") */
.wd-sticky-nav-title {
    background-color: #000000 !important; /* Fond noir pour trancher */
    color: #ffffff !important;
    font-family: "Bangers", sans-serif !important; /* Style comics */
    font-size: 22px !important;
    text-transform: uppercase;
    letter-spacing: 5px;
    text-align: center;
    padding: 15px 10px !important;
    border-bottom: 3px solid #000000 !important;
}

/* 3. Les Éléments de la Liste (li) */
ul.wd-nav-sticky {
    padding: 10px 0 !important;
    margin: 0 !important;
}

ul.wd-nav-sticky li.menu-item {
    margin: 6px 0 !important;
    position: relative;
}

/* 4. Les Liens du Menu (a) */
ul.wd-nav-sticky li.menu-item > a.woodmart-nav-link {
    color: #ffffff !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 0.8px;
    padding: 12px 20px !important;
    display: flex;
    align-items: center;
    gap: 12px;
    border: none !important;
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Ajustement des icônes SVG/Images dans le menu */
ul.wd-nav-sticky li.menu-item img.wd-nav-img {
    width: 22px !important;
    height: 22px !important;
    margin-right: 0 !important;
    transition: transform 0.2s ease;
    /* Optionnel : si tu veux forcer les icônes en blanc comme la capture, décommente la ligne dessous */
    filter: brightness(0) invert(1); 
}

/* 5. Effet Hover & État Actif (Le fameux bandeau Magenta de la capture) */
ul.wd-nav-sticky li.menu-item:hover > a.woodmart-nav-link,
ul.wd-nav-sticky li.menu-item.current-menu-item > a.woodmart-nav-link,
ul.wd-nav-sticky li.menu-item.wd-opened > a.woodmart-nav-link {
    background-color: #cc2b5e !important; /* Le rose/magenta vif */
    color: #ffffff !important;
    padding-left: 26px !important; /* Léger glissement mécanique au survol */
    
    /* Bordures noires horizontales pour isoler l'élément actif */
    border-top: 2px solid #000000 !important;
    border-bottom: 2px solid #000000 !important;
}

ul.wd-nav-sticky li.menu-item:hover img.wd-nav-img {
    transform: scale(1.15) rotate(-5deg); /* Petite animation pop de l'icône */
}

/* ==========================================================================
   BONUS : Les Dropdowns / Méga Menus qui sortent de la Sidebar
   ========================================================================== */
.wd-sticky-nav .wd-dropdown-menu {
    border: 3px solid #000000 !important;
    box-shadow: 6px 6px 0px #000000 !important;
    border-radius: 12px !important;
    background-color: #fffaf0 !important; /* Fond crème/vintage de la capture */
    padding: 25px !important;
}

/* Titres internes des dropdowns */
.wd-sticky-nav .wd-dropdown-menu .woodmart-title-container,
.wd-sticky-nav .wd-dropdown-menu .banner-title {
    font-family: "Bangers", sans-serif !important;
    color: #111111 !important;
    letter-spacing: 1px;
}



/* ==========================================================================
   DA LA CANNABISSERIE - LE BOUTON SHOP STYLE BD FLAMBOYANT
   ========================================================================= */

.btn.Boutonshop {
    /* 1. Couleurs & Visibilité Pop */
    background-color: #cc2b5e !important; 
    color: #ffffff !important;            
    
    /* 2. Structure BD Typique */
    border: 3px solid #000000 !important; 
    border-radius: 8px !important;        
    
    /* 3. Ombre portée plate (Flat Shadow 3D) */
    box-shadow: 4px 4px 0px #000000 !important; 
    
    /* 4. Typographie "Hurlante" */
    font-family: "Banger", sans-serif !important; 
    font-weight: 900 !important;
    text-transform: uppercase !important;
    font-size: 15px !important;          
    letter-spacing: 1px !important;
    
    /* 5. Comportement & Espacement */
    padding: 15px 35px !important;
    transition: all 0.15s ease-out !important; 
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    top: 0;
    left: 0;
}

/* 6. Interaction au Survol (Hover) : Effet de pression mécanique */
.btn.Boutonshop:hover {
    background-color: #e03a6f !important; 
    
    /* Le bouton s'enfonce : on réduit l'ombre et on déplace le bouton */
    box-shadow: 1px 1px 0px #000000 !important; 
    top: 3px !important;  
    left: 3px !important; 
}

/* ==========================================================================
   ADAPTATION MOBILE (Écrans en dessous de 768px de large)
   ========================================================================= */

@media (max-width: 768px) {
    .btn.Boutonshop {
        /* On réduit drastiquement le padding pour gagner de la place */
        padding: 8px 18px !important; 
        
        /* On baisse très légèrement la taille de la police */
        font-size: 13px !important; 
        
        /* On affine la bordure et l'ombre pour ne pas alourdir le design mobile */
        border-width: 2px !important;
        box-shadow: 3px 3px 0px #000000 !important;
    }

    /* Sur mobile, on gère l'effet "enfoncé" lors de l'appui (active) plutôt qu'au survol (hover) */
    .btn.Boutonshop:active {
        box-shadow: 1px 1px 0px #000000 !important;
        top: 2px !important;
        left: 2px !important;
    }
}

/* ==========================================================================
   DA LA CANNABISSERIE - BARRE DE NAVIGATION MOBILE (STRIP BD)
   ========================================================================== */

/* 1. Le conteneur principal de la barre (Le cadre du strip) */
.wd-toolbar {
    background-color: #ffffff !important; /* Fond blanc éclatant pour la lisibilité */
    border-top: 3px solid #000000 !important; /* Grosse ligne d'encre noire en haut */
    box-shadow: 0px -4px 0px rgba(0, 0, 0, 0.1) !important; /* Ombre plate inversée (vers le haut) */
    padding: 0 !important;
    height: 65px !important; /* Hauteur confortable pour les pouces */
}

/* 2. Les éléments de la barre (Les cases de la BD) */
.wd-toolbar .wd-tools-element {
    border-right: 2px solid #000000 !important; /* Ligne de séparation entre chaque icône */
    height: 100% !important;
}

/* On enlève la bordure sur le tout dernier élément (Mon compte) pour ne pas casser le design */
.wd-toolbar .wd-tools-element:last-child {
    border-right: none !important;
}

/* 3. Les liens et le comportement au toucher */
.wd-toolbar .wd-tools-element a {
    color: #111111 !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100% !important;
    transition: background-color 0.1s ease, color 0.1s ease;
}

/* Effet "pression de bouton" lorsqu'on clique sur un élément */
.wd-toolbar .wd-tools-element a:active,
.wd-toolbar .wd-tools-element.wd-active a {
    background-color: #f4f4f4 !important; /* Léger gris de fond au clic */
    color: #cc2b5e !important; /* L'icône et le texte passent en Magenta */
}

/* 4. La typographie des labels ("Menu", "Boutique", "Panier"...) */
.wd-toolbar .wd-toolbar-label {
    font-family: "Cairo", sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    font-size: 11px !important; /* Petit mais très gras pour être lisible */
    letter-spacing: 0.5px !important;
    margin-top: 4px !important;
    transition: color 0.2s;
}

/* 5. Le badge du Panier (La touche Pop) */
.wd-toolbar .wd-cart-number {
    background-color: #cc2b5e !important; /* Rose/Magenta vif */
    color: #ffffff !important;
    font-weight: 900 !important;
    font-size: 11px !important;
    
    /* Structure BD pour le badge */
    border: 2px solid #000000 !important;
    border-radius: 50% !important;
    box-shadow: 2px 2px 0px rgba(0,0,0,0.2) !important;
    
    /* Centrage parfait des chiffres */
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 22px !important;
    height: 22px !important;
    
    /* Positionnement débordant sur l'icône */
    position: absolute;
    top: -5px;
    right: -12px;
}

/* Masquer le mot "élément" généré par Woodmart pour ne garder que le chiffre */
.wd-toolbar .wd-cart-number span {
    display: none !important;
}

/* 6. Mise en avant de la case "Boutique" (Optionnel mais stylé) */
/* Ça applique un fond Vert Forêt au bouton Boutique pour le faire ressortir comme CTA principal */
.wd-toolbar .wd-toolbar-shop {
    background-color: #0e3d26 !important;
}

.wd-toolbar .wd-toolbar-shop a {
    color: #ffffff !important;
}

.wd-toolbar .wd-toolbar-shop a:active {
    background-color: #155435 !important;
}


/* ==========================================================================
   DA LA CANNABISSERIE - LA PAGE PANIER (STYLE COMICS)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. MESSAGES D'ALERTE (Ex: "Panier mis à jour")
   -------------------------------------------------------------------------- */
.woocommerce-message, .woocommerce-info {
    background-color: #0e3d26 !important; /* Vert Forêt */
    color: #ffffff !important;
    border: 3px solid #000000 !important;
    border-radius: 8px !important;
    box-shadow: 5px 5px 0px #000000 !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.woocommerce-message::before {
    color: #cc2b5e !important; /* Petite touche de magenta sur l'icône de succès */
}

/* --------------------------------------------------------------------------
   2. LE TABLEAU DES PRODUITS (Partie Gauche)
   -------------------------------------------------------------------------- */
/* La "Case" globale du tableau */
.woocommerce-cart-form {
    background-color: #ffffff !important;
    border: 4px solid #000000 !important;
    border-radius: 12px !important;
    padding: 25px !important;
    box-shadow: 8px 8px 0px #000000 !important;
}

/* Les En-têtes du tableau (Produit, Prix, Quantité...) */
.woocommerce-cart-form th {
    font-family: "Bangers", sans-serif !important;
    font-size: 24px !important;
    color: #111111 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    border-bottom: 3px solid #000000 !important;
    padding-bottom: 15px !important;
}

/* Lignes séparatrices entre les produits */
.woocommerce-cart-form .cart_item td {
    border-bottom: 2px dashed #000000 !important; /* Pointillés style coupon/BD */
    padding: 20px 10px !important;
    vertical-align: middle !important;
}

/* L'image miniature du produit */
.woocommerce-cart-form .product-thumbnail img {
    border: 2px solid #000000 !important;
    border-radius: 8px !important;
    box-shadow: 3px 3px 0px #000000 !important;
}

/* Noms et Prix dans le tableau */
.woocommerce-cart-form .product-name a {
    font-weight: 800 !important;
    color: #0e3d26 !important;
    font-size: 18px !important;
    text-transform: uppercase;
}
.woocommerce-cart-form .product-name a:hover {
    color: #cc2b5e !important;
}

.woocommerce-cart-form .product-price .amount,
.woocommerce-cart-form .product-subtotal .amount {
    font-weight: 900 !important;
    font-size: 20px !important;
    color: #cc2b5e !important; /* Le Magenta pour les prix */
}

/* Le bouton (X) pour retirer un produit */
.woocommerce-cart-form .product-remove .remove {
    background-color: #cc2b5e !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 50% !important;
    width: 32px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    font-weight: 900 !important;
    font-size: 20px !important;
    box-shadow: 2px 2px 0px #000000 !important;
    transition: all 0.1s ease !important;
}
.woocommerce-cart-form .product-remove .remove:hover {
    transform: translateY(2px) !important;
    box-shadow: 0px 0px 0px #000000 !important;
}

/* La section "Code Promo" */
.woocommerce-cart-form .coupon {
    margin-top: 20px;
}
.woocommerce-cart-form .coupon .input-text {
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    font-weight: 700 !important;
    height: 45px !important;
    text-transform: uppercase;
}
.woocommerce-cart-form .coupon .button {
    background-color: #0e3d26 !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    height: 45px !important;
    box-shadow: 3px 3px 0px #000000 !important;
}

/* --------------------------------------------------------------------------
   3. LE BLOC "TOTAL PANIER" (Partie Droite)
   -------------------------------------------------------------------------- */
/* L'encart type Ticket de caisse / Info BD */
.cart_totals {
    background-color: #fff9e6 !important; /* Le jaune papier vintage de ta maquette */
    border: 4px solid #000000 !important;
    border-radius: 12px !important;
    padding: 30px !important;
    box-shadow: 8px 8px 0px #000000 !important;
}

/* Titre du bloc "Total panier" */
.cart_totals h2 {
    font-family: "Bangers", sans-serif !important;
    font-size: 34px !important;
    color: #111111 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    border-bottom: 3px solid #000000 !important;
    padding-bottom: 15px !important;
    margin-bottom: 20px !important;
}

/* Lignes Sous-total / Expédition */
.cart_totals th {
    font-weight: 800 !important;
    color: #111111 !important;
    text-transform: uppercase !important;
}

/* Le Total final (Énorme) */
.cart_totals .order-total .amount {
    font-size: 32px !important;
    color: #cc2b5e !important;
    font-weight: 900 !important;
}

/* Les options de livraison (Boutons radio) */
.woocommerce-shipping-methods li label {
    font-weight: 700 !important;
    color: #222222 !important;
}

/* --------------------------------------------------------------------------
   4. LE BOUTON D'ACTION "VALIDER LA COMMANDE"
   -------------------------------------------------------------------------- */
/* Il hérite du look surpuissant du "Boutonshop" */
.cart_totals .checkout-button {
    background-color: #cc2b5e !important; 
    color: #ffffff !important;
    border: 3px solid #000000 !important;
    border-radius: 8px !important;
    box-shadow: 5px 5px 0px #000000 !important; 
    font-family: "Cairo", sans-serif !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    font-size: 22px !important;          
    letter-spacing: 1px !important;
    padding: 18px 20px !important;
    width: 100% !important; /* Prend toute la largeur de l'encart */
    display: block !important;
    text-align: center !important;
    margin-top: 35px !important;
    transition: all 0.15s ease-out !important;
}

/* Interaction d'enfoncement mécanique au clic/survol */
.cart_totals .checkout-button:hover {
    background-color: #e03a6f !important;
    box-shadow: 1px 1px 0px #000000 !important; 
    transform: translateY(4px) translateX(4px) !important;
}


/* ==========================================================================
   DA LA CANNABISSERIE - CHECKOUT : CHOIX DE LIVRAISON / RETRAIT
   ========================================================================== */

/* 1. L'encart global (Le Bon de Commande BD) */
#coderockz_woo_delivery_setting_wrapper_internal {
    background-color: #fff9e6 !important; /* Fond jaune papier vintage */
    border: 4px solid #000000 !important; /* Grosse bordure noire */
    border-radius: 12px !important;
    padding: 30px !important;
    box-shadow: 8px 8px 0px #000000 !important; /* Ombre plate 3D */
    margin-bottom: 40px !important;
    position: relative;
}

/* 2. Le Titre Principal ("Livraison / Retrait en boutique") */
#coderockz-woo-delivery-public-delivery-details h3 {
    font-family: "Bangers", sans-serif !important;
    font-size: 32px !important;
    color: #111111 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    border-bottom: 3px solid #000000 !important; /* Ligne de séparation nette */
    padding-bottom: 15px !important;
    margin-bottom: 25px !important;
    margin-top: 0 !important;
}

/* 3. Les Labels (Les titres au-dessus des champs) */
#coderockz_woo_delivery_setting_wrapper_internal label {
    font-weight: 800 !important;
    color: #111111 !important;
    text-transform: uppercase !important;
    font-size: 14px !important;
    margin-bottom: 8px !important;
    display: block !important;
    letter-spacing: 0.5px;
}

/* L'astérisque obligatoire en Magenta vif */
#coderockz_woo_delivery_setting_wrapper_internal label .required {
    color: #cc2b5e !important;
    font-size: 18px !important;
}

/* --------------------------------------------------------------------------
   4. LES CHAMPS DE SAISIE (Dates, et Listes déroulantes Select2)
   -------------------------------------------------------------------------- */
/* Champ de date classique (Flatpickr) */
#coderockz_woo_delivery_setting_wrapper_internal input.input-text {
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    height: 50px !important;
    font-weight: 700 !important;
    color: #111111 !important;
    box-shadow: 3px 3px 0px rgba(0,0,0,0.15) !important;
    padding-left: 15px !important;
    background-color: #ffffff !important;
    transition: all 0.2s;
}

#coderockz_woo_delivery_setting_wrapper_internal input.input-text:focus {
    border-color: #cc2b5e !important;
    box-shadow: 3px 3px 0px #cc2b5e !important;
    outline: none !important;
}

/* Forcer le style sur les listes déroulantes générées par Select2 */
#coderockz_woo_delivery_setting_wrapper_internal .select2-container--default .select2-selection--single {
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    height: 50px !important;
    box-shadow: 3px 3px 0px rgba(0,0,0,0.15) !important;
    background-color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
}

/* Le texte à l'intérieur de la liste déroulante */
#coderockz_woo_delivery_setting_wrapper_internal .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-weight: 700 !important;
    color: #111111 !important;
    padding-left: 15px !important;
}

/* Flèche de la liste déroulante */
#coderockz_woo_delivery_setting_wrapper_internal .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100% !important;
    right: 10px !important;
}

/* 5. L'état INACTIF (Disabled) pour indiquer qu'il faut d'abord choisir une date */
#coderockz_woo_delivery_setting_wrapper_internal .select2-container--disabled .select2-selection--single {
    background-color: #f4f4f4 !important;
    border: 2px dashed #000000 !important; /* Ligne pointillée fun pour les cases bloquées */
    box-shadow: none !important;
    opacity: 0.8 !important;
}

#coderockz_woo_delivery_setting_wrapper_internal .select2-container--disabled .select2-selection__rendered {
    color: #7a7a7a !important;
}

/* --------------------------------------------------------------------------
   6. LA MODAL (Popup des adresses de boutiques si cliquée)
   -------------------------------------------------------------------------- */
.coderockz_woo_delivery_location_pickup-modal-wrap {
    border: 4px solid #000000 !important;
    border-radius: 12px !important;
    box-shadow: 8px 8px 0px #000000 !important;
    background-color: #ffffff !important;
    overflow: hidden;
}

.coderockz_woo_delivery_location_pickup-modal-header {
    background-color: #0e3d26 !important; /* Bandeau Vert forêt */
    border-bottom: 3px solid #000000 !important;
    padding: 20px !important;
}

.coderockz_woo_delivery_location_pickup-modal-header h4 {
    color: #ffffff !important;
    font-family: "Bangers", sans-serif !important;
    letter-spacing: 1px !important;
    font-size: 22px !important;
}

/* Le bouton X pour fermer la popup */
.coderockz-woo-delivery-cancel-button-location-pickup-modal {
    background-color: #cc2b5e !important;
    border: 2px solid #000000 !important;
    color: white !important;
    font-weight: 900 !important;
    box-shadow: 2px 2px 0px #000000 !important;
    border-radius: 5px !important;
    width: 35px;
    height: 35px;
    transition: all 0.1s ease;
}

.coderockz-woo-delivery-cancel-button-location-pickup-modal:hover {
    transform: translateY(2px);
    box-shadow: 0px 0px 0px #000000 !important;
}



/* ==========================================================================
   DA LA CANNABISSERIE - CHECKOUT (FACTURATION & PAIEMENT)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. LES TITRES GÉNÉRAUX DE LA PAGE (Elementor / Woodmart)
   -------------------------------------------------------------------------- */
.elementor-839 .woodmart-title-container {
    font-family: "Bangers", sans-serif !important;
    font-size: 36px !important;
    text-transform: uppercase !important;
    color: #111111 !important;
    letter-spacing: 1.5px !important;
    margin-bottom: 20px !important;
}

/* --------------------------------------------------------------------------
   2. LE FORMULAIRE DE FACTURATION (Case BD Blanche)
   -------------------------------------------------------------------------- */
.wd-checkout_billing_details_form {
    background-color: #ffffff !important;
    border: 4px solid #000000 !important;
    border-radius: 12px !important;
    padding: 35px !important;
    box-shadow: 8px 8px 0px #000000 !important;
    margin-bottom: 40px !important;
}

/* Les Titres internes (h3) */
.woocommerce-billing-fields h3 {
    font-family: "Bangers", sans-serif !important;
    font-size: 26px !important;
    border-bottom: 3px solid #000000 !important;
    padding-bottom: 10px !important;
    margin-bottom: 25px !important;
    text-transform: uppercase;
}

/* Les Labels des champs (Prénom, Nom...) */
.woocommerce-billing-fields label {
    font-weight: 800 !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    color: #111111 !important;
    margin-bottom: 8px !important;
    display: block;
}

.woocommerce-billing-fields label .required {
    color: #cc2b5e !important; /* L'astérisque obligatoire en Magenta */
    font-size: 18px !important;
}

/* Les Champs de saisie */
.woocommerce-billing-fields input.input-text,
.woocommerce-additional-fields textarea {
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    box-shadow: 3px 3px 0px rgba(0,0,0,0.1) !important;
    height: 50px !important; /* Plus haut pour un meilleur confort tactile */
    background: #ffffff !important;
    font-weight: 700 !important;
    padding-left: 15px !important;
    transition: all 0.2s ease;
}

.woocommerce-additional-fields textarea {
    height: auto !important; /* Sauf pour la zone de notes */
    padding-top: 15px !important;
}

/* État actif des champs */
.woocommerce-billing-fields input.input-text:focus,
.woocommerce-additional-fields textarea:focus {
    border-color: #cc2b5e !important;
    box-shadow: 3px 3px 0px #cc2b5e !important;
    outline: none !important;
}

/* --------------------------------------------------------------------------
   3. LE RÉSUMÉ DE LA COMMANDE (Le Ticket Jaune)
   -------------------------------------------------------------------------- */
.wd-checkout_order_review {
    background-color: #fff9e6 !important; /* Jaune papier vintage */
    border: 4px solid #000000 !important;
    border-radius: 12px !important;
    padding: 25px !important;
    box-shadow: 8px 8px 0px #000000 !important;
    margin-bottom: 40px !important;
}

.woocommerce-checkout-review-order-table th {
    font-family: "Bangers", sans-serif !important;
    font-size: 20px !important;
    text-transform: uppercase !important;
    border-bottom: 3px solid #000000 !important;
    padding-bottom: 15px !important;
    color: #111111 !important;
}

/* Lignes des produits avec pointillés */
.woocommerce-checkout-review-order-table .cart_item td {
    border-bottom: 2px dashed #000000 !important;
    padding: 15px 0 !important;
}

/* Miniature de l'image produit */
.wd-checkout-prod-img img {
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    box-shadow: 2px 2px 0px #000000 !important;
}

/* Nom du produit & Prix */
.wd-checkout-prod-title .cart-product-label {
    font-weight: 800 !important;
    color: #0e3d26 !important; /* Vert Forêt */
    font-size: 16px !important;
}

.woocommerce-checkout-review-order-table .amount {
    font-weight: 900 !important;
    color: #cc2b5e !important; /* Magenta vif pour les montants */
    font-size: 18px !important;
}

.woocommerce-checkout-review-order-table .order-total .amount {
    font-size: 26px !important; /* Le Total final encore plus gros */
}

/* Le bouton (X) pour retirer un produit dans le checkout */
.wd-checkout-remove-btn-wrapp .remove {
    background-color: #cc2b5e !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 50% !important;
    width: 24px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-weight: 900 !important;
    box-shadow: 2px 2px 0px #000000 !important;
}

/* --------------------------------------------------------------------------
   4. LE BLOC DE PAIEMENT & BOUTON COMMANDER
   -------------------------------------------------------------------------- */
.woocommerce-checkout-payment {
    background-color: #ffffff !important;
    border: 4px solid #000000 !important;
    border-radius: 12px !important;
    padding: 30px !important;
    box-shadow: 8px 8px 0px #000000 !important;
}

/* Ligne de la méthode de paiement */
.wc_payment_method {
    border-bottom: 2px dashed #000000 !important;
    padding-bottom: 15px !important;
    margin-bottom: 15px !important;
}

.wc_payment_method label {
    font-weight: 800 !important;
    font-size: 16px !important;
    color: #111111 !important;
    text-transform: uppercase;
}

/* L'encart d'explication de la méthode de paiement ("Payer en argent comptant...") */
.payment_box {
    background-color: #fff9e6 !important;
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    padding: 15px !important;
    margin-top: 15px !important;
    font-weight: 700 !important;
    color: #222222 !important;
    position: relative;
}

/* La politique de confidentialité */
.woocommerce-privacy-policy-text {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #555555 !important;
    margin-top: 20px !important;
}
.woocommerce-privacy-policy-text a {
    color: #0e3d26 !important;
    text-decoration: underline !important;
    font-weight: 800 !important;
}

/* 🚀 LE BOUTON FINAL "COMMANDER" */
#place_order {
    background-color: #0e3d26 !important; /* On le met Vert Forêt pour contraster avec le Magenta des prix */
    color: #ffffff !important;
    border: 4px solid #000000 !important;
    border-radius: 8px !important;
    box-shadow: 6px 6px 0px #000000 !important;
    font-family: "Cairo", sans-serif !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    font-size: 26px !important;
    letter-spacing: 2px !important;
    padding: 22px !important;
    width: 100% !important;
    margin-top: 25px !important;
    transition: all 0.15s ease-out !important;
}

/* Enfoncement mécanique explosif */
#place_order:hover {
    background-color: #155435 !important;
    box-shadow: 2px 2px 0px #000000 !important;
    transform: translateY(4px) translateX(4px) !important;
}



/* ==========================================================================
   DA LA CANNABISSERIE - SIDEBAR / FILTRES SHOP
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. LES WIDGETS (Chaque filtre devient une case de BD)
   -------------------------------------------------------------------------- */
.elementor-widget-wd_sidebar .wd-widget {
    background-color: #ffffff !important;
    border: 3px solid #000000 !important;
    border-radius: 10px !important;
    padding: 25px !important;
    margin-bottom: 30px !important;
    box-shadow: 6px 6px 0px #000000 !important; /* Ombre 3D */
}

/* Titres des Widgets ("Filtrer par prix", "Catégories"...) */
.elementor-widget-wd_sidebar .widget-title {
    font-family: "Bangers", sans-serif !important;
    font-size: 24px !important;
    text-transform: uppercase !important;
    color: #111111 !important;
    letter-spacing: 1.5px !important;
    border-bottom: 3px solid #000000 !important;
    padding-bottom: 10px !important;
    margin-bottom: 25px !important;
}

/* --------------------------------------------------------------------------
   2. LE FILTRE PAR PRIX (Curseur & Bouton)
   -------------------------------------------------------------------------- */
/* La barre de fond du slider */
.widget_price_filter .ui-slider {
    background-color: #f4f4f4 !important;
    border: 2px solid #000000 !important;
    border-radius: 10px !important;
    height: 14px !important;
    margin-bottom: 25px !important;
}

/* La barre de remplissage (La plage sélectionnée) */
.widget_price_filter .ui-slider-range {
    background-color: #0e3d26 !important; /* Vert forêt pour la plage active */
}

/* Les curseurs (Boutons ronds à glisser) */
.widget_price_filter .ui-slider-handle {
    background-color: #cc2b5e !important; /* Magenta vif */
    border: 2px solid #000000 !important;
    border-radius: 50% !important;
    width: 22px !important;
    height: 22px !important;
    top: -6px !important;
    box-shadow: 2px 2px 0px #000000 !important;
    cursor: grab !important;
    transition: transform 0.1s;
}

.widget_price_filter .ui-slider-handle:active {
    cursor: grabbing !important;
    transform: scale(1.1); /* Petit effet de grossissement quand on le saisit */
}

/* Le Bouton "Filtrer" */
.widget_price_filter .price_slider_amount .button {
    background-color: #cc2b5e !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    box-shadow: 3px 3px 0px #000000 !important;
    font-family: "Cairo", sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    padding: 8px 20px !important;
    transition: all 0.1s ease !important;
}

.widget_price_filter .price_slider_amount .button:hover {
    transform: translateY(2px) translateX(2px) !important;
    box-shadow: 1px 1px 0px #000000 !important; /* Enfoncement mécanique */
}

/* Le texte "Prix : 0€ - 120€" */
.widget_price_filter .price_label {
    font-weight: 800 !important;
    color: #111111 !important;
    font-size: 15px !important;
    margin-top: 10px !important;
}
.widget_price_filter .price_label span {
    color: #cc2b5e !important;
    font-weight: 900 !important;
}

/* --------------------------------------------------------------------------
   3. LE FILTRE STATUT (Cases à cocher personnalisées)
   -------------------------------------------------------------------------- */
.wd-widget-stock-status ul li {
    margin-bottom: 12px !important;
}

.wd-widget-stock-status ul li a {
    font-weight: 800 !important;
    color: #222222 !important;
    font-size: 15px !important;
    text-transform: uppercase;
}

/* La fausse case à cocher (carré) */
.wd-widget-stock-status ul li a::before {
    border: 2px solid #000000 !important;
    border-radius: 4px !important;
    width: 20px !important;
    height: 20px !important;
    box-shadow: 2px 2px 0px rgba(0,0,0,0.1) !important;
    transition: all 0.1s ease !important;
}

/* Quand la case est cochée / active */
.wd-widget-stock-status ul li.current-cat a::before,
.wd-widget-stock-status ul li.chosen a::before {
    background-color: #cc2b5e !important;
    border-color: #000000 !important;
    box-shadow: 2px 2px 0px #000000 !important;
}

/* La couleur de la petite encoche à l'intérieur */
.wd-widget-stock-status ul li.current-cat a::after,
.wd-widget-stock-status ul li.chosen a::after {
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   4. LE FILTRE PAR CATÉGORIE (Menu de navigation)
   -------------------------------------------------------------------------- */
.wd-product-category-filter .product-categories li {
    margin-bottom: 12px !important;
    padding-bottom: 8px !important;
    border-bottom: 2px dashed #e0e0e0 !important; /* Petits pointillés de séparation */
}

.wd-product-category-filter .product-categories li:last-child {
    border-bottom: none !important;
}

.wd-product-category-filter .product-categories li a {
    font-weight: 800 !important;
    color: #111111 !important;
    font-size: 15px !important;
    text-transform: uppercase !important;
    transition: all 0.2s;
}

/* Interaction au survol d'une catégorie */
.wd-product-category-filter .product-categories li a:hover {
    color: #0e3d26 !important;
    padding-left: 6px !important; /* Glissement subtil vers la droite */
}

/* 🚀 Catégorie Active (Celle où l'on se trouve) */
.wd-product-category-filter .product-categories li.wd-active > a {
    color: #cc2b5e !important; /* Le texte passe en Magenta */
    font-weight: 900 !important;
}

.wd-product-category-filter .product-categories li.wd-active > a::before {
    content: "▶" !important; /* Petite flèche BD devant la catégorie active */
    margin-right: 10px !important;
    font-size: 14px !important;
    color: #0e3d26 !important;
}

/* Sous-catégories (Enfants) */
.wd-product-category-filter .product-categories ul.children {
    margin-top: 12px !important;
    padding-left: 20px !important;
    border-left: 3px solid #000000 !important; /* Ligne verticale noire pour l'arborescence */
}

/* La petite flèche pour ouvrir les sous-catégories */
.wd-cats-toggle {
    color: #000000 !important;
    font-weight: 900 !important;
}



/* ==========================================================================
   DA LA CANNABISSERIE - BARRE D'OUTILS SHOP (RESULTATS, TRI, VUE)
   ========================================================================== */

/* 1. Conteneur global de la barre (Fond blanc et bordure nette) */
.elementor-element-c8a60ba {
    background-color: #ffffff !important;
    border: 3px solid #000000 !important;
    border-radius: 12px !important;
    padding: 15px 25px !important;
    box-shadow: 6px 6px 0px #000000 !important;
    margin-bottom: 30px !important;
}

/* 2. Texte "Affichage de X sur Y résultats" */
.woocommerce-result-count {
    font-family: "Bangers", sans-serif !important;
    font-size: 18px !important;
    color: #111111 !important;
    text-transform: uppercase;
    margin: 0 !important;
}

/* 3. Zone "Afficher" (Le sélecteur de pagination) */
.wd-products-per-page {
    display: flex;
    align-items: center;
    gap: 10px;
}

.wd-label.per-page-title {
    font-weight: 800 !important;
    text-transform: uppercase !important;
    color: #0e3d26 !important; /* Vert Forêt */
    margin-right: 5px;
}

.per-page-variation {
    border: 2px solid #000000 !important;
    border-radius: 4px !important;
    padding: 5px 12px !important;
    font-weight: 800 !important;
    background-color: #ffffff !important;
    color: #111111 !important;
    transition: all 0.1s ease;
}

/* État actif ou survol des boutons per-page */
.per-page-variation:hover,
.per-page-variation.current-variation {
    background-color: #cc2b5e !important; /* Magenta vif */
    color: #ffffff !important;
    box-shadow: 2px 2px 0px #000000 !important;
}

/* On masque les petites bordures verticales de Woodmart (les "per-page-border") */
.per-page-border {
    display: none !important;
}

/* 4. Vue (Grille/Liste) */
.wd-products-shop-view .shop-view {
    border: 2px solid #000000 !important;
    border-radius: 4px !important;
    padding: 6px 12px !important;
    margin-left: 5px !important;
    background-color: #ffffff !important;
    transition: background 0.1s;
}

.wd-products-shop-view .shop-view:hover {
    background-color: #e0e0e0 !important;
}

/* 5. Le Menu de Tri (Sélecteur "Ordre") - C'est ici que le style compte */
.woocommerce-ordering select.orderby {
    border: 3px solid #000000 !important;
    border-radius: 6px !important;
    padding: 8px 35px 8px 15px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    background-color: #ffffff !important;
    cursor: pointer;
    box-shadow: 3px 3px 0px rgba(0,0,0,0.1) !important;
    appearance: none; /* Enlève le style natif OS */
}

/* Petit triangle custom pour le select */
.woocommerce-ordering {
    position: relative;
}

.woocommerce-ordering::after {
    content: "▼" !important;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 10px;
    color: #0e3d26;
}

/* 6. Bouton "Show column" (Responsive mobile) */
.wd-off-canvas-btn .wd-action-btn a {
    background-color: #0e3d26 !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    padding: 8px 15px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    box-shadow: 2px 2px 0px #000000 !important;
}



/* ==========================================================================
   DA LA CANNABISSERIE - FILTRES ACTIFS (BADGES / TAGS BD)
   ========================================================================== */

/* 1. Le conteneur global des filtres */
.wd-shop-active-filters .wd-active-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 15px;
    margin-bottom: 25px !important;
    padding-top: 10px !important;
}

/* On s'assure que la liste Woodmart s'affiche bien à plat */
.widget_layered_nav_filters ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 !important;
    padding: 0 !important;
}

/* 2. Un tag de filtre actif (Ex: "Infusions-tisanes") */
.widget_layered_nav_filters ul li.chosen a {
    background-color: #ffffff !important;
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    padding: 6px 15px 6px 32px !important; /* Espace prévu pour la croix à gauche */
    font-family: "Cairo", sans-serif !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    text-transform: uppercase;
    color: #111111 !important;
    box-shadow: 2px 2px 0px #000000 !important;
    position: relative;
    display: inline-flex;
    align-items: center;
    transition: all 0.15s ease !important;
}

/* La petite croix pour supprimer le filtre */
.widget_layered_nav_filters ul li.chosen a::before {
    content: "✖" !important;
    position: absolute;
    left: 10px;
    color: #cc2b5e !important; /* Croix Magenta vif par défaut */
    font-size: 12px !important;
    font-weight: 900 !important;
}

/* Interaction "Pression" au survol d'un tag */
.widget_layered_nav_filters ul li.chosen a:hover {
    background-color: #cc2b5e !important; /* Le tag devient entièrement Magenta */
    color: #ffffff !important;
    transform: translateY(2px) translateX(2px) !important;
    box-shadow: 0px 0px 0px #000000 !important;
}

/* Au survol, la croix passe en blanc pour rester visible */
.widget_layered_nav_filters ul li.chosen a:hover::before {
    color: #ffffff !important; 
}

/* 3. Bouton "Effacer tous les filtres" */
.wd-clear-filters.wd-action-btn a {
    background-color: #fff9e6 !important; /* Fond jaune vintage pour se démarquer */
    border: 2px solid #000000 !important;
    border-radius: 6px !important;
    padding: 6px 15px !important;
    font-family: "Cairo", sans-serif !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    color: #111111 !important;
    box-shadow: 2px 2px 0px #000000 !important;
    transition: all 0.15s ease !important;
    display: inline-flex;
    align-items: center;
}

/* Remplacement de l'icône "X" basique de Woodmart par une icône fun style Reset/Corbeille */
.wd-clear-filters.wd-action-btn.wd-cross-icon a::before {
    content: "♻" !important; /* Icône de recyclage/reset (très lisible) */
    color: #0e3d26 !important; /* Vert Forêt */
    font-size: 16px !important;
    margin-right: 8px !important;
    font-weight: 900 !important;
}

/* Effet d'enfoncement sur le bouton Effacer */
.wd-clear-filters.wd-action-btn a:hover {
    background-color: #f4f4f4 !important;
    transform: translateY(2px) translateX(2px) !important;
    box-shadow: 0px 0px 0px #000000 !important;
}