/*
Theme Name:   Bricks Child Theme
Theme URI:    https://bricksbuilder.io/
Description:  Use this child theme to extend Bricks.
Author:       Bricks
Author URI:   https://bricksbuilder.io/
Template:     bricks
Version:      1.1
Text Domain:  bricks
*/
/* ==========================================================================
   LOADER - Page loading avec barre de progression et texte animé
   ========================================================================== */

/* Overlay du loader */
#page-loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    z-index: 999999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 1;
    visibility: visible;
    transition: opacity 0.6s ease-out, visibility 0.6s ease-out;
}

/* État caché (après chargement) */
#page-loader.loaded {
    opacity: 0;
    visibility: hidden;
}

/* Conteneur du texte animé */
.loader-text {
    font-size: 13px;
    font-weight: 400;
    color: #000000;
    margin-bottom: 30px;
    letter-spacing: 0.5px;
    overflow: hidden;
    opacity: 1;
    transition: opacity 0.4s ease-out;
    text-align: center;
    line-height: 1.6;
}

/* État caché pour le texte */
.loader-text.hide {
    opacity: 0;
}

/* Saut de ligne dans le texte */
.loader-text br {
    display: block;
    content: "";
    margin: 0.3em 0;
}

/* Animation des mots qui apparaissent */
.loader-text .word {
    display: inline-block;
    opacity: 0;
    transform: translateY(15px);
    animation: fadeInUp 0.4s ease-out forwards;
}

.loader-text .word:nth-child(1) {
    animation-delay: 0.05s;
}

.loader-text .word:nth-child(2) {
    animation-delay: 0.25s;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Conteneur de la barre de progression */
.loader-progress-container {
    width: 250px;
    height: 1px;
    background-color: rgba(0, 0, 0, 0.1);
    overflow: hidden;
    opacity: 1;
    transition: opacity 0.4s ease-out;
}

/* État caché pour la barre */
.loader-progress-container.hide {
    opacity: 0;
}

/* Barre de progression */
.loader-progress-bar {
    width: 0%;
    height: 100%;
    background-color: #000000;
    transition: width 0.2s ease-out;
}

/* Responsive pour mobile */
@media (max-width: 767px) {
    .loader-text {
        font-size: 11px;
        padding: 0 20px;
        text-align: center;
    }
    
    .loader-progress-container {
        width: 180px;
    }
}

/* ==========================================================================
   MENU STICKY - Highlight au scroll
   ========================================================================== */

/* Menu sticky - Highlight au scroll */
.sticky-menu-titre {
    transition: color 0.3s ease, opacity 0.3s ease;
    opacity: 0.5;
}

.sticky-menu-titre.active {
    color: #ffffff;
    opacity: 1;
    font-weight: bold;
}

.sticky-menu-titre.text-dark {
    color: #000000 !important;
    opacity: 0.5;
}

.sticky-menu-titre.text-dark.active {
    opacity: 1;
}

/* ==========================================================================
   CORRECTION TYPO FICHE PRODUIT
   ========================================================================== */

/* Taille du titre dans les produits associés sur la fiche produit */
.single-product .related.products ul.products li.product .woocommerce-loop-product__title {
    font-size: 12px; /* Ajustez la taille souhaitée */
}

/* ==========================================================================
   GALERIE PRODUIT - ANTI-FOUC
   ========================================================================== */

/* Transition douce pour les vignettes de la galerie */
.flex-control-thumbs {
    transition: visibility 0.1s ease-in-out, opacity 0.1s ease-in-out;
}

/* Éviter le flash pendant le chargement de la galerie */
.flex-control-thumbs li {
    transition: transform 0.2s ease-in-out;
}

/* Masquer la visionneuse principale qui est remplacée par PhotoSwipe */
.woocommerce-product-gallery__wrapper {
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* ==========================================================================
   LIRE LA SUITE
   ========================================================================== */

/* The container div */
.expandable {
    position: relative;
}

/* The paragraph itself */
.expandable p {
    max-height: 6em; /* Approx 4 lines */
    overflow: hidden;
    transition: max-height 0.4s ease-out;
    margin-bottom: 0;
    position: relative; /* Needed for the pseudo-element */
}

/* Fade-out effect */
.expandable p::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2em; /* Fine-tuned height */
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
    pointer-events: none; /* Allows clicking through the gradient */
    transition: opacity 0.4s ease-out;
}

.expandable.expanded p::after {
    opacity: 0;
}

.expandable.expanded p {
    max-height: 1000px;
}

/* Style for the link */
.read-more-link {
    cursor: pointer;
    color: #888; /* Grey color */
    text-decoration: underline;
    font-weight: normal;
    display: inline-block;
    margin-top: 5px;
}

.read-more-link:hover {
    color: #555; /* Darker grey on hover */
}

/* ==========================================================================
   Styles Globaux
   ========================================================================== */

/* Masquer l'outline de focus pour tous les éléments */
*:focus {
    outline: none !important;
    box-shadow: none !important; /* Au cas où un box-shadow est utilisé pour le focus */
}

/* Règle spécifique pour les liens pour être certain */
a, a:hover, a:focus, a:active {
     outline: none !important;
     box-shadow: none !important;
}

/* ==========================================================================
   Styles pour les Bandes de Catégories de Produits avec Défilement Horizontal
   ========================================================================== */

/* Conteneur parent pour chaque bande individuelle */
.bande-categorie-produit {
    margin-bottom: 10px; 
    overflow: hidden; 
}

/* Conteneur principal de la bande qui défile horizontalement */
.contenu-bande {
    display: flex;       
    flex-wrap: nowrap;   
    overflow-x: auto;    
    overflow-y: hidden;  
    padding-bottom: 5px;
    scroll-behavior: smooth;

    /* Masquage de la barre de défilement */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE et Edge */
}
.contenu-bande::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
}

/* Premier bloc enfant de .contenu-bande : Conteneur du titre de la catégorie */
.contenu-bande > .brxe-block:first-child { 
    flex: 0 0 auto; 
    margin-right: 0px; 
    align-self: flex-start; 
}

/* Deuxième bloc enfant de .contenu-bande : Conteneur des produits WooCommerce */
.contenu-bande > .brxe-block:nth-child(2) { 
    flex: 0 0 auto; 
}

/* Liste des produits WooCommerce (ul.products) */
.contenu-bande .brxe-woocommerce-products ul.products {
    display: flex;
    flex-wrap: nowrap;    
    list-style: none;
    padding-left: 0;
    margin-top: 0; 
    margin-bottom: 0; 
}

/* Vignettes des produits (li.product) */
.contenu-bande .brxe-woocommerce-products ul.products li.product {
    flex: 0 0 auto; 
    width: 120px;       
    height: auto;      
    margin-right: 15px; 
    margin-bottom: 0; 
    overflow: hidden; 
    display: flex;
    flex-direction: column; 
    position: static !important; 
}
.contenu-bande .brxe-woocommerce-products ul.products li.product:last-child {
    margin-right: 0; 
}

/* Lien du produit (englobe image et titre) */
.contenu-bande .brxe-woocommerce-products ul.products li.product a {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    height: 100%; 
}

/* Image du produit */
.contenu-bande .brxe-woocommerce-products ul.products li.product img {
    display: block;
    width: 100%;
    height: 150px; 
    object-fit: cover; 
}

/* Masquage des éléments WooCommerce non désirés (prix, bouton, étoiles) */
.contenu-bande .brxe-woocommerce-products ul.products li.product .price,
.contenu-bande .brxe-woocommerce-products ul.products li.product .button,
.contenu-bande .brxe-woocommerce-products ul.products li.product .star-rating {
    display: none !important;
}

/* ==========================================================================
   Boutons avec soulignement animé au survol 
   ========================================================================== */
.btn-icon-noir,
.btn-icon-blanc {
  position: relative;
  display: inline-flex;
  text-decoration: none;
  background: transparent;
  border: none;
  padding: 8px 16px;
  transition: color 0.3s ease;
  align-items: center; /* Centre verticalement */
}

.btn-icon-noir i,
.btn-icon-blanc i {
  display: inline-block;
  font-size: inherit; /* Optionnel : garde la taille du texte */
  line-height: 1;
}

/* Ligne animée en pseudo-élément */
.btn-icon-noir::after,
.btn-icon-blanc::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0.2em;
  width: 90%;
  height: 1px;
  background-color: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}

/* Animation au hover */
.btn-icon-noir:hover::after,
.btn-icon-blanc:hover::after {
  transform: scaleX(1);
}

/* ==========================================================================
   Personnalisation de la Lightbox (PhotoSwipe)
   ========================================================================== */

/* Masquer la légende sous les images dans la lightbox */
.pswp__caption {
    display: none !important;
}

/* Masquer toute la barre d'outils supérieure de la lightbox */
.pswp__top-bar {
    display: none !important;
}

/* ==========================================================================
   Personnalisation des cartes de produits pour le carrousel de suggestions (V2 - Spécificité augmentée)
   ========================================================================== */

/* 1. Masquer le prix et le bouton d'origine avec une plus grande spécificité */
body .woocommerce ul.products li.product .price,
body .woocommerce ul.products li.product .button.add_to_cart_button {
    display: none !important;
}

/* 2. Préparer la carte pour le survol */
body .woocommerce ul.products li.product {
    position: relative;
    overflow: hidden; /* Assure que les superpositions ne dépassent pas */
}

/* 3. Créer la superposition et l'icône "Ajouter au devis", initialement cachées */
body .woocommerce ul.products li.product a.woocommerce-LoopProduct-link::after {
    content: "+\A Ajouter au devis"; /* Le \A crée un saut de ligne */
    white-space: pre; /* Interprète le saut de ligne */
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* Fond semi-transparent un peu plus sombre */
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px; /* Taille de police pour le texte */
    font-weight: bold;
    line-height: 1.4; /* Espacement des lignes */
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1;
    cursor: pointer; /* Indique que c'est cliquable */
}

/* 4. Afficher la superposition et l'icône au survol */
body .woocommerce ul.products li.product:hover a.woocommerce-LoopProduct-link::after {
    opacity: 1;
}

/* 5. S'assurer que le titre reste lisible et au-dessus de la superposition */
body .woocommerce ul.products li.product .woocommerce-loop-product__title {
    position: relative;
    z-index: 2; /* Place le titre au-dessus de la superposition de survol */
    color: #000; /* Assurez-vous que la couleur du titre ne change pas au survol */
}

body .woocommerce ul.products li.product:hover .woocommerce-loop-product__title {
    color: #000; /* Garde la couleur du titre au survol de l'item */
}

/* Réduire la taille du titre dans le carrousel de suggestions uniquement */
body .woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 14px; /* Ajustez la taille selon vos besoins (14px, 12px, etc.) */
}

/* ==========================================================================
   BANDEAU "AJOUTER AU PANIER" COLLANT
   ========================================================================== */

.sticky-add-to-cart-banner {
    position: fixed;
    top: 0px;
    left: 0;
    width: 100%;
    background-color: #fff;
    z-index: 10;
    transition: transform 0.3s ease-in-out;
    transform: translateY(-100%);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 20px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.sticky-add-to-cart-banner.is-visible {
    transform: translateY(0);
}

.sticky-add-to-cart-banner .product-info {
    display: flex;
    align-items: center;
}

.sticky-add-to-cart-banner .product-info img {
    margin-right: 15px;
}

.sticky-add-to-cart-banner .add-to-cart-section .woocommerce-variation-add-to-cart {
    display: flex;
    align-items: center;
}

.sticky-add-to-cart-banner .quantity {
    display: flex;
    align-items: center;
    margin-right: 10px;
}

.sticky-add-to-cart-banner .quantity .minus {
    order: 1;
}

.sticky-add-to-cart-banner .quantity input.qty {
    order: 2;
    height: 40px;
    width: 60px;
    text-align: center;
    font-size: 12px;
}

.sticky-add-to-cart-banner .quantity .plus {
    order: 3;
}

.sticky-add-to-cart-banner .quantity .minus,
.sticky-add-to-cart-banner .quantity .plus {
    cursor: pointer;
    padding: 5px;
    line-height: 1;
    height: 40px;
    display: flex;
    align-items: center;    
}


.sticky-add-to-cart-banner .quantity .minus svg,
.sticky-add-to-cart-banner .quantity .plus svg {
    width: 16px;
    height: 16px;
}

.sticky-add-to-cart-banner .quantity input[type=number] {
    -moz-appearance: textfield;
}

.sticky-add-to-cart-banner .quantity input[type=number]::-webkit-inner-spin-button, 
.sticky-add-to-cart-banner .quantity input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

/* ==========================================================================
   PRIX SUR DEVIS
   ========================================================================== */

/* Style pour le texte "SUR DEVIS" sur la fiche produit */
.single-product .price-on-request {
    font-size: 0.8em;
    font-weight: normal;
    color: #8b8b8b;
    display: inline-block;
    width: 200px;
    text-align: left;
    text-transform: uppercase;
}


/* ==========================================================================
   Personnalisation de la fiche produit
   ========================================================================== */
   #back-top {
  position: relative;
  height: 80px; /* ajuste selon la hauteur souhaitée pour la zone du loader */
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px; /* Ajoute de l'espace entre les boutons */
}

#back-top .bricks-ajax-loader {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* ==========================================================================
   MENU OFFCANVAS 
   ========================================================================== */


.offcanvas-wrapper {
    display: flex;
    flex-direction: row;
    height: 100vh;
    overflow: hidden;
}

/* IDs STAGING : #brxe-30420f (contenu global) et #brxe-uopqzn (bande scrollable) */
#brxe-30420f,
#brxe-uopqzn.menu-band-products {
    flex-grow: 1;
    flex-shrink: 1;
    height: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 20px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

#brxe-30420f::-webkit-scrollbar,
#brxe-uopqzn.menu-band-products::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

/* ==========================================================================
   ARCHIVES PRODUITS & CARTES PRODUITS
   ========================================================================== */

/* --- STRUCTURE GLOBALE DES ARCHIVES --- */

/* Wrapper principal archives produits */
#produits-wrapper {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 40px;
  align-items: start;
}

/* Masquer les filtres sur tablette et mobile */
@media screen and (max-width: 991px) {
  #produits-wrapper .filtres {
    display: none !important;
  }

  #produits-wrapper {
    grid-template-columns: 1fr;
  }
}

/* --- GRILLE PRODUITS RESPONSIVE --- */

#all-produits {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
  width: 100%;
}

#all-produits > * {
  min-width: 0; /* Empêche les débordements */
}

/* Limiter à 3 cartes produits par ligne sur desktop */
@media screen and (min-width: 992px) {
  #all-produits {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* --- CARTE PRODUIT (STRUCTURE) --- */

.product-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  box-sizing: border-box;
}

/* Titres longs */
.titre-card,
.woocommerce-loop-product__title {
  word-break: break-word;
  hyphens: auto;
  overflow-wrap: break-word;
}

/* --- IMAGE WRAPPER (Container des images) --- */

.image-wrapper {
  position: relative;
  width: 100%;
  padding-bottom: 100%; /* Ratio carré 1:1 - Ajustez selon vos besoins */
  overflow: hidden;
  display: block;
}

/* Images principale et hover */
.img-principale,
.img-hover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.4s ease;
  z-index: 1;
}

.img-hover {
  opacity: 0;
  z-index: 2;
}

/* Effet hover sur les images */
.image-wrapper:hover .img-hover {
  opacity: 1;
}

.image-wrapper:hover .img-principale {
  opacity: 0;
}

/* --- ICÔNE HOVER (panier) --- */

.hover-icon {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  width: 32px;
  height: 32px;
  background-color: white;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.3s ease;
  text-decoration: none;
  border: none;
  padding: 0;
}

.hover-icon i {
  font-size: 14px;
  color: #111;
}

.image-wrapper:hover .hover-icon {
  opacity: 1;
  transform: translateY(0);
}

/* --- VARIANTE : Carte avec icône uniquement (sans swap d'image) --- */

.product-card-icone .image-wrapper:hover .img-hover {
  opacity: 0; /* Garde l'image de survol cachée */
}

.product-card-icone .image-wrapper:hover .img-principale {
  opacity: 1; /* Garde l'image principale visible */
}

/* --- WOOCOMMERCE : Overlay "Ajouter au devis" --- */

/* Masquer le prix et le bouton WooCommerce */
body .woocommerce ul.products li.product .price,
body .woocommerce ul.products li.product .button.add_to_cart_button {
    display: none !important;
}

/* Préparer la carte pour le survol */
body .woocommerce ul.products li.product {
    position: relative;
    overflow: hidden;
}

/* Overlay "Ajouter au devis" au survol */
body .woocommerce ul.products li.product a.woocommerce-LoopProduct-link::after {
    content: "+\A Ajouter au devis";
    white-space: pre;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.4;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1;
    cursor: pointer;
}

body .woocommerce ul.products li.product:hover a.woocommerce-LoopProduct-link::after {
    opacity: 1;
}

/* Titre WooCommerce : toujours lisible */
body .woocommerce ul.products li.product .woocommerce-loop-product__title {
    position: relative;
    z-index: 2;
    color: #000;
}

body .woocommerce ul.products li.product:hover .woocommerce-loop-product__title {
    color: #000;
}

/* --- ENCARTS VISUELS DANS LA GRILLE --- */

.encart {
  grid-column: span 2;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  height: 100%;
  box-sizing: border-box;
}

/* Masquer l'encart 2 par défaut */
#encart-2 {
    display: none;
}

.encart img {
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

/* Encarts adaptables en mobile : span 1 au lieu de 2 */
@media screen and (max-width: 575px) {
  .encart {
    grid-column: span 1;
  }
}

/* ==========================================================================
   EFFETS PARALLAXE
   ========================================================================== */

.img-slide {
    min-height: 60vh; /* Hauteur minimale pour que l'effet soit visible */
    background-size: cover;
    background-position: 50% 0%; /* Position de départ pour un effet plus prononcé */
    background-repeat: no-repeat;
}

/* ==========================================================================
   Mini-panier - Style uniquement (comportement natif Bricks)
   ========================================================================== */

/* Conteneur du mini-panier - État fermé par défaut */
.custom-mini-panier .cart-detail,
.cart-detail-ewslyr,
.cart-detail-vqjvfo {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    width: 350px !important;
    max-width: 90vw !important;
    height: 100vh !important;
    background-color: #fff !important;
    box-shadow: -5px 0 15px rgba(0,0,0,0.2) !important;
    z-index: 99999 !important;
    
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;

    /* Caché à droite hors écran */
    transform: translateX(100%) !important;
    visibility: hidden !important;
    
    /* Animation fluide */
    transition: transform 0.4s ease-out, visibility 0.4s !important;
}

/* État ouvert - Classe ajoutée par Bricks au clic */
.cart-detail-ewslyr.active,
.cart-detail-vqjvfo.active,
.custom-mini-panier .cart-detail.active {
    transform: translateX(0) !important;
    visibility: visible !important;
}

/* Header du mini-panier */
.custom-mini-panier .mini-cart-header,
.cart-detail-ewslyr .mini-cart-header,
.cart-detail-vqjvfo .mini-cart-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    border-bottom: 1px solid #eee;
    flex-shrink: 0;
}

.mini-cart-title {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
}

.close-cart-button {
    background: none;
    border: none;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    padding: 0 5px;
    color: #888;
    transition: color 0.2s;
    display: none !important;
}

.close-cart-button:hover {
    color: #000;
}

/* Conteneur WooCommerce */
.custom-mini-panier .widget_shopping_cart_content,
.cart-detail-ewslyr .widget_shopping_cart_content,
.cart-detail-vqjvfo .widget_shopping_cart_content {
    height: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
}

/* Liste des produits */
.custom-mini-panier .cart_list,
.cart-detail-ewslyr .cart_list,
.cart-detail-vqjvfo .cart_list {
    flex-grow: 1 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 1rem !important;
    padding-bottom: 120px !important;
}

/* Item produit */
.custom-mini-panier .woocommerce-mini-cart-item,
.cart-detail-ewslyr .woocommerce-mini-cart-item,
.cart-detail-vqjvfo .woocommerce-mini-cart-item {
    display: flex !important;
    gap: 1rem !important;
    padding: 1rem 0 !important;
    border-bottom: 1px solid #eee !important;
    align-items: flex-start !important;
}

.custom-mini-panier .mini-cart-item-image-link,
.cart-detail-ewslyr .mini-cart-item-image-link,
.cart-detail-vqjvfo .mini-cart-item-image-link {
    flex-shrink: 0 !important;
    width: 80px !important;
}

.custom-mini-panier .mini-cart-item-details,
.cart-detail-ewslyr .mini-cart-item-details,
.cart-detail-vqjvfo .mini-cart-item-details {
    flex-grow: 1 !important;
    min-width: 0 !important;
}

.custom-mini-panier .mini-cart-item-name-link,
.cart-detail-ewslyr .mini-cart-item-name-link,
.cart-detail-vqjvfo .mini-cart-item-name-link {
    text-decoration: none !important;
    color: inherit !important;
}

.custom-mini-panier .mini-cart-item-title,
.cart-detail-ewslyr .mini-cart-item-title,
.cart-detail-vqjvfo .mini-cart-item-title {
    font-weight: 600 !important;
    margin-bottom: 0.5rem !important;
    display: block !important;
}

.custom-mini-panier .mini-cart-item-meta,
.cart-detail-ewslyr .mini-cart-item-meta,
.cart-detail-vqjvfo .mini-cart-item-meta {
    font-size: 0.9em !important;
    color: #555 !important;
}

.custom-mini-panier .mini-cart-item-qty,
.cart-detail-ewslyr .mini-cart-item-qty,
.cart-detail-vqjvfo .mini-cart-item-qty {
    font-weight: bold !important;
    margin-top: 0.5rem !important;
    display: block !important;
}

.custom-mini-panier .remove_from_cart_button,
.cart-detail-ewslyr .remove_from_cart_button,
.cart-detail-vqjvfo .remove_from_cart_button {
    margin-left: 1rem !important;
    font-size: 20px !important;
    line-height: 1 !important;
    text-decoration: none !important;
    color: #999 !important;
    transition: color 0.2s;
}

.custom-mini-panier .remove_from_cart_button:hover,
.cart-detail-ewslyr .remove_from_cart_button:hover,
.cart-detail-vqjvfo .remove_from_cart_button:hover {
    color: #e00 !important;
}

/* Masquer le sous-total (affiché dans les boutons) */
.custom-mini-panier .woocommerce-mini-cart__total,
.cart-detail-ewslyr .woocommerce-mini-cart__total,
.cart-detail-vqjvfo .woocommerce-mini-cart__total {
    display: none !important;
}

/* Zone des boutons */
.custom-mini-panier .woocommerce-mini-cart__buttons,
.cart-detail-ewslyr .woocommerce-mini-cart__buttons,
.cart-detail-vqjvfo .woocommerce-mini-cart__buttons {
    flex-shrink: 0 !important;
    margin-top: auto !important;
    
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
    
    width: 100% !important;
    padding: 10px !important;
    background: #fff !important;
    border-top: 1px solid #eee !important;
    box-sizing: border-box !important;
}

.custom-mini-panier .woocommerce-mini-cart__buttons a.button,
.cart-detail-ewslyr .woocommerce-mini-cart__buttons a.button,
.cart-detail-vqjvfo .woocommerce-mini-cart__buttons a.button {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    padding: 10px 15px !important;
    transition: all 0.3s ease !important;
}

.custom-mini-panier .woocommerce-mini-cart__buttons a.button.wc-forward:first-child,
.cart-detail-ewslyr .woocommerce-mini-cart__buttons a.button.wc-forward:first-child,
.cart-detail-vqjvfo .woocommerce-mini-cart__buttons a.button.wc-forward:first-child {
    background-color: #fff !important;
    color: #000 !important;
    border: 1px solid #000 !important;
}

.custom-mini-panier .woocommerce-mini-cart__buttons a.button.wc-forward:first-child:hover,
.cart-detail-ewslyr .woocommerce-mini-cart__buttons a.button.wc-forward:first-child:hover,
.cart-detail-vqjvfo .woocommerce-mini-cart__buttons a.button.wc-forward:first-child:hover {
    background-color: #000 !important;
    color: #fff !important;
}

.custom-mini-panier .woocommerce-mini-cart__buttons a.button.checkout,
.cart-detail-ewslyr .woocommerce-mini-cart__buttons a.button.checkout,
.cart-detail-vqjvfo .woocommerce-mini-cart__buttons a.button.checkout {
    background-color: #000 !important;
    color: #fff !important;
    border: 1px solid #000 !important;
}

.custom-mini-panier .woocommerce-mini-cart__buttons a.button.checkout:hover,
.cart-detail-ewslyr .woocommerce-mini-cart__buttons a.button.checkout:hover,
.cart-detail-vqjvfo .woocommerce-mini-cart__buttons a.button.checkout:hover {
    background-color: #333 !important;
}

/* Responsive */
@media (max-width: 480px) {
    .custom-mini-panier .cart-detail,
    .cart-detail-ewslyr,
    .cart-detail-vqjvfo {
        width: 100vw !important;
    }
}


/* ==========================================================================
   STYLES POUR LES ARTICLES DE BLOG
   ========================================================================== */

/* Paragraphes */
.single-post .brx-content p,
.blog .brx-content p,
.archive .brx-content p,
article p,
.entry-content p,
.post-content p {
  margin: 1.5rem 0;
  line-height: 1.8;
}

/* Premier paragraphe après un titre */
.single-post .brx-content h2 + p,
.single-post .brx-content h3 + p,
.single-post .brx-content h4 + p {
  margin-top: 0.75rem;
}

/* Titres dans les articles */
.single-post .brx-content h2,
.single-post .brx-content h3,
.single-post .brx-content h4,
.wp-block-heading {
  margin-top: 6rem; /* espace considérable au-dessus des titres */
  margin-bottom: 1.5rem;
}

/* Listes à puces et numérotées */
.single-post .brx-content ul,
.single-post .brx-content ol,
.entry-content ul,
.entry-content ol,
.post-content ul,
.post-content ol,
.wp-block-list {
  margin: 2rem 0;
  padding-left: 2rem;
}

/* Espacement important entre les items de liste */
.single-post .brx-content ul li,
.single-post .brx-content ol li,
.entry-content ul li,
.entry-content ol li,
.post-content ul li,
.post-content ol li,
.wp-block-list > li {
    margin-bottom: 3rem; /* espacement clair et généreux entre les items */
    line-height: 1.9; /* garde une belle lisibilité */
    padding-bottom: 0.5rem; /* ajoute un peu d'air en bas de chaque item */
}

/* Pour les sous-listes, espace un peu réduit pour ne pas trop casser le rythme */
.single-post .brx-content ul ul li,
.single-post .brx-content ol ol li,
.entry-content ul ul li,
.entry-content ol ol li,
.wp-block-list .wp-block-list > li {
    margin-bottom: 1.5rem;
}

/* Évite le double espace après le dernier élément */
.single-post .brx-content li:last-child,
.entry-content li:last-child,
.post-content li:last-child {
    margin-bottom: 0;
}


/* Style des puces */
.single-post .brx-content ul li::marker,
.entry-content ul li::marker,
.post-content ul li::marker {
  color: #6c6c6c;
  font-size: 1rem;
}

/* Blockquotes */
.single-post blockquote,
.entry-content blockquote,
.wp-block-quote,
.wp-block-pullquote,
figure.wp-block-pullquote {
  margin: 6rem 0 !important; /* espace considérable au-dessus et en-dessous */
  padding-left: 2rem;
  border-left: 3px solid #ddd;
  font-style: italic;
  color: #555;
}

/* Style spécifique pour les pullquotes */
.wp-block-pullquote,
figure.wp-block-pullquote {
  padding: 2rem !important;
  text-align: center;
}

/* Blockquote à l'intérieur du pullquote */
figure.wp-block-pullquote blockquote {
  margin: 0 !important;
  border-left: none;
  padding-left: 0;
}

/* ==========================================================================
   IMAGES DANS LES ARTICLES
   ========================================================================== */

/* Espacement vertical global */
.single-post .brx-content img,
.blog .brx-content img,
.archive .brx-content img,
article img,
.entry-content img,
.post-content img,
figure.wp-block-image img {
  display: block;
  margin: 4rem auto;
  width: 100%;
  height: 500px; /* hauteur fixe pour toutes les images */
  object-fit: cover; /* étire et recadre l'image pour remplir la zone */
  object-position: center; /* centre l'image */
}

/* Conteneur fixe 16:9 */
.single-post .brx-content figure.wp-block-image,
.entry-content figure.wp-block-image,
.post-content figure.wp-block-image,
.blog .brx-content figure.wp-block-image,
.archive .brx-content figure.wp-block-image {
  position: relative;
  width: 100%;
  height: 500px; /* hauteur fixe pour tous les conteneurs */
  overflow: hidden;
  margin: 4rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Fallback pour Safari <15 */
@supports not (aspect-ratio: 16/9) {
  .single-post .brx-content figure.wp-block-image::before,
  .entry-content figure.wp-block-image::before {
    content: "";
    display: block;
    padding-top: 56.25%; /* 16:9 ratio */
  }
}

/* Image centrée et recadrée */
.single-post .brx-content figure.wp-block-image img,
.entry-content figure.wp-block-image img,
.post-content figure.wp-block-image img,
.blog .brx-content figure.wp-block-image img,
.archive .brx-content figure.wp-block-image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* étire l'image pour remplir complètement la zone */
  object-position: center;
  margin: 0;
}

/* Légendes */
.single-post .brx-content figcaption,
.entry-content figcaption,
.post-content figcaption {
  margin-top: 1rem;
  font-size: 0.9rem;
  color: #666;
  text-align: center;
}

/* Figures et captions */
.wp-caption,
.wp-block-image {
  margin: 4rem 0;
}

.wp-block-image img {
  margin: 0;
}

/* ==========================================================================
   SOMMAIRE RANK MATH - Soulignement animé
   ========================================================================== */

/* Liens du sommaire avec effet de soulignement animé */
.wp-block-rank-math-toc-block nav ul li a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    transition: color 0.3s ease;
}

/* Ligne animée en pseudo-élément */
.wp-block-rank-math-toc-block nav ul li a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
    height: 1px;
    background-color: currentColor;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

/* Animation au survol */
.wp-block-rank-math-toc-block nav ul li a:hover::after {
    transform: scaleX(1);
}


/* ==========================================================================
   FAQ RANK MATH - Espacement et Toggles
   ========================================================================== */

/* Espacement considérable avant et après le bloc FAQ */
.wp-block-rank-math-faq-block,
.rank-math-faq-block,
.rank-math-list {
    margin-top: 6rem;
    margin-bottom: 6rem;
}

/* Espacement entre les questions */
.rank-math-list-item {
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 1rem;
}

.rank-math-list-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

/* Style de la question (titre cliquable) */
.rank-math-question {
    cursor: pointer;
    position: relative;
    padding-right: 30px;
    transition: color 0.3s ease;
    margin-bottom: 1rem;
    font-weight: 500; /* Medium au lieu de bold */
}

.rank-math-question:hover {
    color: #666;
}

/* Icône toggle (+ / -) */
.rank-math-question::after {
    content: "+";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.5em;
    font-weight: normal;
    line-height: 1;
    transition: transform 0.3s ease;
}

/* État ouvert */
.rank-math-list-item.is-open .rank-math-question::after {
    content: "−";
}

/* Réponse - Cachée par défaut */
.rank-math-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, opacity 0.3s ease;
    opacity: 0;
}

/* Réponse - État ouvert */
.rank-math-list-item.is-open .rank-math-answer {
    max-height: 1000px;
    opacity: 1;
    padding-top: 0.5rem;
}

/* ==========================================================================
   WOOCOMMERCE PRODUCT ADDONS - Masquer les prix et totaux
   ========================================================================== */

/* Masquer tous les prix des addons */
.wc-pao-addon-price,
.wc-pao-addon-container .price,
.product-addon-price,
.product-addons-wrapper .price,
.wc-pao-addon-wrap .wc-pao-addon-price-type,
.wc-pao-addon-wrap .amount,
.product-addon .price-type,
.addon-price,
form.cart .product-addon .woocommerce-Price-amount,
.wc-pao-addons-container .woocommerce-Price-amount,
.wc-pao-addon-name .price,
.wc-pao-addon-description .price,
label[for*="addon"] .price {
    display: none !important;
}

/* Masquer le total des addons */
.wc-pao-addon-totals,
.wc-pao-subtotal-line,
.product-addon-totals,
.addon-total,
.addons-total,
#product-addons-total,
.wc-pao-col2,
p.wc-pao-subtotal-line,
.product-addon-total-price {
    display: none !important;
}

/* Réduire la taille des vignettes addons */
.wc-pao-addon-image-swatch {
    display: inline-block !important;
    margin: 2px !important;
}

.wc-pao-addon-image-swatch img {
    width: 40px !important;
    height: 40px !important;
    object-fit: cover !important;
    border: 2px solid transparent !important;
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
}

.wc-pao-addon-image-swatch:hover img {
    border-color: rgba(0, 0, 0, 0.3) !important;
    transform: scale(1.05) !important;
}

.wc-pao-addon-image-swatch.selected img {
    border-color: #000000 !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) !important;
}

/* ==========================================================================
   RÉSUMÉ PRODUIT - Gestion sticky dynamique
   ========================================================================== */

/* Position sticky de base (valeur par défaut gérée par JS) */
.resume-produit {
    position: sticky;
}


/* ==========================================================================
   VIGNETTE ROLLOVER - Effet popup sur bande-projet
   ========================================================================== */
.bande-projet {
    position: relative;
    overflow: visible !important; /* Important pour que l'image popup soit visible */
}

.vignette-projet {
    cursor: default;
    transition: transform 0.3s ease;
}

.vignette-projet:hover {
    transform: scale(1.02);
}

.vignette-popup-image {
    position: absolute;
    pointer-events: none;
    z-index: 100;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.vignette-popup-image img {
    display: block;
    width: auto;
    height: auto;
    max-width: 400px;
    max-height: 400px;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

/* Responsive pour les petits écrans */
@media (max-width: 991px) {
    .vignette-popup-image img {
        max-width: 300px;
        max-height: 300px;
    }
}

@media (max-width: 767px) {
    .vignette-popup-image {
        display: none; /* Masquer l'effet sur mobile */
    }
}
/* ==========================================================================
   IMPACT STICKY EFFECT
   ========================================================================== */

/* Scroll snap doux (fallback si GSAP ScrollTo non disponible) */
@supports not (scroll-snap-type: y proximity) {
  html {
    scroll-behavior: smooth;
  }
}

/* Par défaut, tous les contenus sont cachés */
.colonne-contenus > .etape-trigger {
  display: none;
}

/* Le contenu actif est affiché */
.colonne-contenus > .etape-trigger.is-active {
  display: block;
}

/* Parallaxe sur les images de titre */
.impact-image-titre {
  will-change: transform;
  transform: translateY(-15%); /* Position de départ */
}

/* ==========================================================================
   CHECKOUT - Alignement des variations/addons
   ========================================================================== */

/* Style pour les variations sur la page checkout et panier */
.woocommerce-checkout .variation,
.woocommerce-cart .variation,
.woocommerce table.shop_table .variation {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    gap: 0.5rem 1rem !important;
    margin: 0.5rem 0 !important;
}

.woocommerce-checkout .variation dt,
.woocommerce-cart .variation dt,
.woocommerce table.shop_table .variation dt {
    font-weight: 600 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
}

.woocommerce-checkout .variation dd,
.woocommerce-cart .variation dd,
.woocommerce table.shop_table .variation dd {
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
}

.woocommerce-checkout .variation dd p,
.woocommerce-cart .variation dd p,
.woocommerce table.shop_table .variation dd p {
    margin: 0 !important;
    padding: 0 !important;
}

/* Pour les mini-variations dans le mini-cart */
.mini-cart-variations {
    font-size: 0.9em !important;
    color: #666 !important;
    line-height: 1.6 !important;
}

.mini-cart-variations > div {
    margin-bottom: 0.25rem !important;
}
/* Masquer la colonne "Sous-total" sur checkout et panier */
.woocommerce-checkout table.shop_table th.product-total,
.woocommerce-checkout table.shop_table td.product-total,
.woocommerce-cart table.shop_table th.product-total,
.woocommerce-cart table.shop_table td.product-total {
    display: none !important;
}

/* ==========================================================================
   ATTRIBUTS PRODUITS - Espacement et alignement
   ========================================================================== */

/* Ligne d'attribut - Plus d'espace entre chaque */
.woocommerce-product-attributes-item {
    margin-bottom: 2rem !important;
    padding-bottom: 2rem !important;
    border-bottom: 1px solid #eee !important;
}

.woocommerce-product-attributes-item:last-child {
    border-bottom: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Label (th) - Alignement en haut */
.woocommerce-product-attributes-item__label {
    vertical-align: top !important;
    padding-top: 0 !important;
    padding-right: 2rem !important;
    font-weight: 600 !important;
}

/* Valeur (td) - Alignement en haut */
.woocommerce-product-attributes-item__value {
    vertical-align: top !important;
    padding-top: 0 !important;
}

/* Paragraphes dans les valeurs - Espacement cohérent */
.woocommerce-product-attributes-item__value p {
    margin: 0 0 1rem 0 !important;
}

.woocommerce-product-attributes-item__value p:last-child {
    margin-bottom: 0 !important;
}