/* ============================================
   Suppression colonne droite - Page catégorie
   ============================================ */

body#category #right-column,
body#category .sidebar[id="right-column"] {
    display: none !important;
}

body#category #content-wrapper {
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* Suppression barre tri/affichage - Tous les listings produits */
#js-product-list-top {
    display: none !important;
}

/* Taille du logo - Desktop */
@media (min-width: 992px) {
  .logo.img-fluid {
    width: 250px !important;
    max-width: 250px !important;
    height: auto !important;
  }
} /* Fermeture indispensable */

/* Suppression marge au-dessus du logo - Header */
.dp-top.home-6.ApRow,
.row.dp-top.ApRow.has-bg.bg-boxed {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Sécurité : ciblage du conteneur header-top */
.header-top {
    margin-top: 0 !important;
    padding-top: 0 !important;
}


/* ------------------------------
   Fiche produit - Description longue
-------------------------------- */

#product .product-tabs.tabs:before {
  background: #332836;
}

#product .product-tabs.tabs .nav-tabs .nav-link {
  color: #ffffff;
}

#product .product-tabs.tabs .nav-tabs .nav-link.active,
#product .product-tabs.tabs .nav-tabs .nav-link:hover {
  color: #bac34e;
}

#product #description .product-description {
  color: #ffffff;
  background: #332836;
  font-size: 16px;
  line-height: 1.75;
  padding: 30px;
  border-radius: 12px;
}

#product #description .product-description p,
#product #description .product-description strong {
  color: #ffffff;
}

#product #description .product-description p {
  margin-bottom: 18px;
}

#product #description .product-description strong {
  font-weight: 700;
}

/* Prix produit */
#product .current-price-value {
  color: #332836 !important;
}

/* Description courte produit */
#product .description-short,
#product .description-short p,
#product .description-short strong {
  color: #000000 !important;
}

/* ------------------------------
   Bloc visuels - h7-box-bn
-------------------------------- */

.row.h7-box-bn,
.row.h7-box-bn.has-bg,
.row.h7-box-bn.bg-boxed,
.row.h7-box-bn.bg-fullwidth,
.row.h7-box-bn.bg-fullwidth-container {
  background: #332836 !important;
  background-color: #332836 !important;
  padding: 10px !important;
  overflow: hidden;
}

/* Pas de fond blanc sur les éléments internes */
.row.h7-box-bn .ApColumn,
.row.h7-box-bn .block,
.row.h7-box-bn .ApImage,
.row.h7-box-bn .block_content {
  background: transparent !important;
  background-color: transparent !important;
}

/* Espace fixe entre les visuels */
.row.h7-box-bn .ApColumn {
  padding-left: 10px !important;
  padding-right: 10px !important;
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

/* Espace vertical entre deux lignes de visuels */
.row.h7-box-bn .block.effect-2.ApImage {
  margin-top: 10px !important;
  margin-bottom: 20px !important;
}



/* Coins arrondis + masque propre */
.row.h7-box-bn .block.effect-2.ApImage,
.row.h7-box-bn .block.effect-2.ApImage a,
.row.h7-box-bn .block.effect-2.ApImage .block_content {
  border-radius: 12px;
  overflow: hidden;
}

/* Images arrondies */
.row.h7-box-bn .block.effect-2.ApImage img {
  border-radius: 12px;
  display: block;
  width: 100%;
  height: auto;
}

/* Neutralisation effet hover */
.row.h7-box-bn .block.effect-2.ApImage:hover,
.row.h7-box-bn .block.effect-2.ApImage:hover a,
.row.h7-box-bn .block.effect-2.ApImage:hover .block_content {
  transform: none !important;
}

/* ------------------------------
   Fiches produits - Masquer breadcrumb complet
-------------------------------- */

body#product .breadcrumb-bg.brcenter.breadcrumb-full,
body#product .breadcrumb.hidden-sm-down {
  display: none !important;
}

/* ------------------------------
   Bouton Ajouter au panier
-------------------------------- */

body#product .btn.btn-primary.add-to-cart {
  background-color: #c62828 !important;
  border: 2px solid #c62828 !important;
  color: #ffffff !important;
}

body#product .btn.btn-primary.add-to-cart:hover,
body#product .btn.btn-primary.add-to-cart:focus,
body#product .btn.btn-primary.add-to-cart:active {
  background-color: #332836 !important;
  border-color: #332836 !important;
  color: #ffffff !important;
}
/* ------------------------------
   Bouton panier Leo - Ajouter au panier
-------------------------------- */

.btn.btn-product.add-to-cart.leo-bt-cart.leo-bt-cart_2.leo-enable {
  background-color: #c62828 !important;
  border: 2px solid #c62828 !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  padding: 14px 34px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  text-align: center !important;
  box-shadow: none !important;
}

/* Texte / icônes internes */
.btn.btn-product.add-to-cart.leo-bt-cart.leo-bt-cart_2.leo-enable span,
.btn.btn-product.add-to-cart.leo-bt-cart.leo-bt-cart_2.leo-enable i {
  color: #ffffff !important;
}

/* Hover */
.btn.btn-product.add-to-cart.leo-bt-cart.leo-bt-cart_2.leo-enable:hover,
.btn.btn-product.add-to-cart.leo-bt-cart.leo-bt-cart_2.leo-enable:focus,
.btn.btn-product.add-to-cart.leo-bt-cart.leo-bt-cart_2.leo-enable:active {
  background-color: #332836 !important;
  border-color: #332836 !important;
  color: #ffffff !important;
}

/* Texte / icônes internes au hover */
.btn.btn-product.add-to-cart.leo-bt-cart.leo-bt-cart_2.leo-enable:hover span,
.btn.btn-product.add-to-cart.leo-bt-cart.leo-bt-cart_2.leo-enable:hover i {
  color: #ffffff !important;
}

/* padding-top */
.product-detail.product-image-no-thumbs-center.product-image-thumbs.no-thumbs {
  padding-top: 20px !important;
}

.menu-pictos li {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 40px;
  padding: 2px 0;
  border-bottom: 1px solid #e5e5e5;
}

.picto {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  display: block;
  background-color: #000;

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;

  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}

.picto-sables-sucres {
  -webkit-mask-size: 106%;
  mask-size: 106%;
}

.picto-cookies-gourmands {
  -webkit-mask-size: 105%;
  mask-size: 105%;
}

.picto-moelleux-chataigne {
  -webkit-mask-size: 109%;
  mask-size: 109%;
}

.picto-macarons-ancienne {
  -webkit-mask-size: 116%;
  mask-size: 116%;
}

.picto-crackers-sales {
  -webkit-mask-size: 112%;
  mask-size: 112%;
}

.picto-biscuits-sans-gluten {
  -webkit-mask-size: 112%;
  mask-size: 112%;
}

.menu-pictos {
  margin: 0;
  padding: 0;
  list-style: none;
}

.menu-pictos li:last-child {
  border-bottom: none;
}

.picto-sables-sucres {
  -webkit-mask-image: url("../img/pictos/sables-sucres.svg");
  mask-image: url("../img/pictos/sables-sucres.svg");
}

.picto-cookies-gourmands {
  -webkit-mask-image: url("../img/pictos/cookies-gourmands.svg");
  mask-image: url("../img/pictos/cookies-gourmands.svg");
}

.picto-moelleux-chataigne {
  -webkit-mask-image: url("../img/pictos/moelleux-chataigne.svg");
  mask-image: url("../img/pictos/moelleux-chataigne.svg");
}

.picto-macarons-ancienne {
  -webkit-mask-image: url("../img/pictos/macarons-ancienne.svg");
  mask-image: url("../img/pictos/macarons-ancienne.svg");
}

.picto-crackers-sales {
  -webkit-mask-image: url("../img/pictos/crackers-sales.svg");
  mask-image: url("../img/pictos/crackers-sales.svg");
}

.picto-biscuits-sans-gluten {
  -webkit-mask-image: url("../img/pictos/biscuits-sans-gluten.svg");
  mask-image: url("../img/pictos/biscuits-sans-gluten.svg");
}

.why-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  max-width: 980px;
  margin: 35px auto;
  padding: 0 24px;
}

.why-box {
  background: rgba(255, 250, 242, 0.96);
  border: 1px solid rgba(198, 145, 75, 0.35);
  border-radius: 20px;
  padding: 28px 30px;
  box-shadow: 0 10px 26px rgba(35, 20, 12, 0.16);
  text-align: left;
  transition: all 0.25s ease;
}

.why-box:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 34px rgba(35, 20, 12, 0.24);
}

.why-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #f3dfbd;
  color: #6b351f;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  margin-bottom: 16px;
}

.why-box .question-title h5 {
  margin: 0 0 12px 0;
  font-size: 21px;
  line-height: 1.25;
  font-weight: 700;
  color: #6b351f;
}

.why-box .question-content {
  font-size: 15px;
  line-height: 1.65;
  color: #3f342d;
  text-align: left;
}

@media (max-width: 767px) {
  .why-grid {
    grid-template-columns: 1fr;
    padding: 0 18px;
  }

  .why-box {
    padding: 24px 22px;
  }
}

.block-category #category-description {
  margin-top: 1.25rem;
  margin-bottom: 50px;
}

/* ==========================================================
   HEADER VANIG - COMPTE / FAVORIS / PANIER
   Leo App Builder
   ========================================================== */

/* État normal : fond vert + pictos blancs */
.dp-top .header-btn.btn-acc,
.dp-top .header-btn.btn-wl,
.dp-top .header-btn.btn-cart {
  background-color: #2A7A69 !important;
  background-image: none !important;
}

/* Pictos en blanc en normal */
.dp-top .header-btn.btn-acc a,
.dp-top .header-btn.btn-wl a,
.dp-top .header-btn.btn-cart a,
.dp-top .header-btn.btn-acc i,
.dp-top .header-btn.btn-wl i,
.dp-top .header-btn.btn-cart i,
.dp-top .header-btn.btn-acc .fal,
.dp-top .header-btn.btn-wl .fal,
.dp-top .header-btn.btn-cart .fal {
  color: #ffffff !important;
}

/* Survol : fond vert clair */
.dp-top .header-btn.btn-acc:hover,
.dp-top .header-btn.btn-wl:hover,
.dp-top .header-btn.btn-cart:hover {
  background-color: #86A857 !important;
  background-image: none !important;
}

/* Survol : pictos compte / favoris / panier en violet */
.dp-top .header-btn.btn-acc:hover a,
.dp-top .header-btn.btn-wl:hover a,
.dp-top .header-btn.btn-cart:hover a,
.dp-top .header-btn.btn-acc:hover i,
.dp-top .header-btn.btn-wl:hover i,
.dp-top .header-btn.btn-cart:hover i,
.dp-top .header-btn.btn-acc:hover .fal,
.dp-top .header-btn.btn-wl:hover .fal,
.dp-top .header-btn.btn-cart:hover .fal {
  color: #332836 !important;
}

/* Compteurs / prix panier : toujours blanc, même au survol */
.dp-top .header-btn .ap-total,
.dp-top .header-btn .ap-total-wishlist,
.dp-top .header-btn .cart-products-count,
.dp-top .header-btn.btn-cart span,
.dp-top .header-btn.btn-cart:hover span,
.dp-top .header-btn.btn-cart .ap-total,
.dp-top .header-btn.btn-cart:hover .ap-total,
.dp-top .header-btn.btn-cart .cart-products-count,
.dp-top .header-btn.btn-cart:hover .cart-products-count {
  color: #ffffff !important;
}
/* Prix du panier en blanc */
.dp-top #_desktop_cart .cart-total-value,
.dp-top #_desktop_cart a .cart-total-value,
.dp-top .blockcart .cart-total-value,
.dp-top .blockcart a .cart-total-value {
  color: #ffffff !important;
}
/* ==========================================================
   ADAPTATION MOBILE VANIG
   Smartphones et petites tablettes
   ========================================================== */

@media (max-width: 767px) {

  /* ------------------------------
     Structure générale
  -------------------------------- */

  body#category #content-wrapper {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  /* Suppression des éventuels débordements horizontaux
     #page reste volontairement hors de cette règle : le panier Leo doit pouvoir dépasser. */
  body,
  main {
    overflow-x: hidden;
  }

  /* ------------------------------
     Header et logo
  -------------------------------- */

  .dp-top.home-6.ApRow,
  .row.dp-top.ApRow.has-bg.bg-boxed,
  .header-top {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .logo.img-fluid {
    width: 180px !important;
    max-width: 80vw !important;
    height: auto !important;
    display: block;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Boutons compte, favoris et panier */
  .dp-top .header-btn.btn-acc,
  .dp-top .header-btn.btn-wl,
  .dp-top .header-btn.btn-cart {
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 8px !important;
  }

  /* Masquage éventuel du prix pour éviter de surcharger le header */
  .dp-top #_mobile_cart .cart-total-value,
  .dp-top #_desktop_cart .cart-total-value {
    font-size: 12px !important;
    white-space: nowrap;
  }

  /* ------------------------------
     Fiche produit
  -------------------------------- */

  .product-detail.product-image-no-thumbs-center.product-image-thumbs.no-thumbs {
    padding-top: 10px !important;
  }

  /* Description longue */
  #product #description .product-description {
    font-size: 15px !important;
    line-height: 1.65 !important;
    padding: 20px 16px !important;
    border-radius: 10px !important;
  }

  #product #description .product-description p {
    margin-bottom: 14px !important;
  }

  /* Navigation des onglets produit */
  #product .product-tabs.tabs .nav-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    width: 100% !important;
  }

  #product .product-tabs.tabs .nav-tabs .nav-item {
    width: 100% !important;
    margin: 0 !important;
  }

  #product .product-tabs.tabs .nav-tabs .nav-link {
    display: block !important;
    width: 100% !important;
    padding: 12px 15px !important;
    text-align: center !important;
  }

  /* Bouton Ajouter au panier principal */
  body#product .btn.btn-primary.add-to-cart {
    width: 100% !important;
    min-height: 50px !important;
    padding: 13px 16px !important;
    white-space: normal !important;
  }

  /* Bouton Ajouter au panier Leo */
  .btn.btn-product.add-to-cart.leo-bt-cart.leo-bt-cart_2.leo-enable {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 50px !important;
    padding: 12px 18px !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
  }

  /* ------------------------------
     Bloc des visuels
  -------------------------------- */

  .row.h7-box-bn,
  .row.h7-box-bn.has-bg,
  .row.h7-box-bn.bg-boxed,
  .row.h7-box-bn.bg-fullwidth,
  .row.h7-box-bn.bg-fullwidth-container {
    padding: 8px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .row.h7-box-bn .ApColumn {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding: 8px !important;
  }

  .row.h7-box-bn .block.effect-2.ApImage {
    margin-top: 5px !important;
    margin-bottom: 10px !important;
  }

  .row.h7-box-bn .block.effect-2.ApImage,
  .row.h7-box-bn .block.effect-2.ApImage a,
  .row.h7-box-bn .block.effect-2.ApImage .block_content,
  .row.h7-box-bn .block.effect-2.ApImage img {
    border-radius: 10px !important;
  }

  /* ------------------------------
     Menu avec pictogrammes
  -------------------------------- */

  .menu-pictos li {
    gap: 11px !important;
    min-height: 48px !important;
    padding: 6px 0 !important;
  }

  .picto {
    flex: 0 0 30px !important;
    width: 30px !important;
    height: 30px !important;
  }

  /* ------------------------------
     Blocs "Pourquoi..."
  -------------------------------- */

  .why-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    width: 100% !important;
    margin: 25px auto !important;
    padding: 0 12px !important;
  }

  .why-box {
    padding: 20px 18px !important;
    border-radius: 16px !important;
  }

  /* Pas d'animation de déplacement sur écran tactile */
  .why-box:hover {
    transform: none !important;
  }

  .why-icon {
    width: 44px !important;
    height: 44px !important;
    font-size: 23px !important;
    margin-bottom: 12px !important;
  }

  .why-box .question-title h5 {
    font-size: 19px !important;
    line-height: 1.3 !important;
    margin-bottom: 10px !important;
  }

  .why-box .question-content {
    font-size: 14px !important;
    line-height: 1.6 !important;
  }

  /* ------------------------------
     Description des catégories
  -------------------------------- */

  .block-category #category-description {
    margin-top: 15px !important;
    margin-bottom: 30px !important;
  }

  .block-category #category-description img {
    max-width: 100% !important;
    height: auto !important;
  }
}
/* ==========================================================
   AFFICHAGE DU BOUTON COMPTE SUR MOBILE
   À ajouter tout en bas du CSS personnalisé
   ========================================================== */

@media (max-width: 767px) {

  /* Réaffiche les différentes variantes possibles du bloc compte */
  .dp-top #_mobile_user_info,
  .dp-top #_desktop_user_info,
  .dp-top .user-info,
  .dp-top .userinfo-selector,
  .dp-top .header-btn.btn-acc {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Bouton Compte */
  .dp-top .header-btn.btn-acc {
    align-items: center !important;
    justify-content: center !important;

    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;

    padding: 0 !important;
    margin: 0 8px !important;

    background-color: #2A7A69 !important;
    border-radius: 50% !important;
    overflow: visible !important;
  }

  /* Lien interne */
  .dp-top .header-btn.btn-acc > a,
  .dp-top .header-btn.btn-acc .popup-title,
  .dp-top .header-btn.btn-acc .header-btn-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    height: 100% !important;

    padding: 0 !important;
    margin: 0 !important;
    color: #ffffff !important;
  }

  /* Icône du compte */
  .dp-top .header-btn.btn-acc i,
  .dp-top .header-btn.btn-acc .fal,
  .dp-top .header-btn.btn-acc .fa,
  .dp-top .header-btn.btn-acc [class*="icon-"] {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #ffffff !important;
    font-size: 19px !important;
    line-height: 1 !important;
  }

  /* Masque uniquement le texte éventuel pour garder un header compact */
  .dp-top .header-btn.btn-acc .name-simple,
  .dp-top .header-btn.btn-acc .account-text,
  .dp-top .header-btn.btn-acc .title {
    display: none !important;
  }

  /* Survol / appui */
  .dp-top .header-btn.btn-acc:hover,
  .dp-top .header-btn.btn-acc:focus,
  .dp-top .header-btn.btn-acc:active {
    background-color: #86A857 !important;
  }

  .dp-top .header-btn.btn-acc:hover i,
  .dp-top .header-btn.btn-acc:focus i,
  .dp-top .header-btn.btn-acc:active i {
    color: #332836 !important;
  }
}
/* ==========================================================
   MENUS MOBILE : ciblage précis
   ========================================================== */

@media (max-width: 767px) {
  .ApMegamenu .leo-megamenu .navbar-toggler.hidden-lg-up {
    display: none !important;
  }

  .ApMegamenu .leo-megamenu .navbar-header {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }
}
/* Bloc "Ils nous font confiance" - correction padding desktop */
@media (min-width: 768px) {
  .row.box-testi.home-4.trust-title-row {
    padding: 25px 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}
/* ==========================================================
   MENU MOBILE VANIG
   Maintien du menu ID 4 dans le flux et au-dessus du slider
   ========================================================== */

@media (max-width: 767px) {

  /* Instance mobile réelle du menu "Découvrez nos produits" */
  [data-megamenu-id="31152958052953335"] {
    display: block !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    overflow: visible !important;
    z-index: 30 !important;
  }

  /* Conteneur direct généré par Leo App Builder */
  #memgamenu-form_31152958052953335 {
    display: block !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    z-index: 30 !important;
  }

  /* Colonne mobile : pleine largeur et hauteur conservée */
  .ApColumn:has([data-megamenu-id="31152958052953335"]) {
    display: block !important;
    position: relative !important;
    float: none !important;
    clear: both !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    z-index: 30 !important;
  }

  /* Ligne mobile : empêche le slider de remonter par-dessus */
  .ApRow:has([data-megamenu-id="31152958052953335"]) {
    display: block !important;
    position: relative !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
    overflow: visible !important;
    z-index: 30 !important;
  }

  /* Bouton du menu vertical mobile */
  [data-megamenu-id="31152958052953335"] .verticalmenu-button {
    display: flex !important;
    position: relative !important;
    align-items: center !important;
    width: calc(100% - 24px) !important;
    min-height: 46px !important;
    margin: 0 12px !important;
    box-sizing: border-box !important;
    z-index: 31 !important;
  }

  /* Le slider reste sous le menu dans l'ordre d'empilement */
  .ApSlideShow,
  .bannercontainer,
  .iview {
    position: relative !important;
    z-index: 1 !important;
  }
}
/* ==========================================================
   FOND VERT DU MENU MOBILE
   ========================================================== */

@media (max-width: 767px) {

  .row.mobile-menu-row {
    background: #2A7A69 !important;
    background-color: #2A7A69 !important;
    padding: 8px 12px !important;
    margin: 0 !important;
  }

  .row.mobile-menu-row > .ApColumn {
    padding: 0 !important;
  }

  .row.mobile-menu-row .verticalmenu-button {
    margin: 0 !important;
  }
}
/* ==========================================================
   PICTOGRAMMES RÉSEAUX SOCIAUX DU FOOTER
   ========================================================== */

/* Conteneurs Facebook et Instagram */
#footer li.facebook,
#footer li.instagram {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin-right: 10px !important;
}

/* Zone cliquable des pictogrammes */
#footer li.facebook > a,
#footer li.instagram > a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  line-height: 1 !important;
  text-decoration: none;
}

/* Taille réelle des icônes générées par le thème */
#footer li.facebook > a::before,
#footer li.instagram > a::before {
  display: block !important;
  width: auto !important;
  height: auto !important;
  font-size: 22px !important;
  line-height: 1 !important;
}

/* Version mobile */
@media screen and (max-width: 767px) {

  #footer li.facebook,
  #footer li.instagram {
    margin-right: 12px !important;
  }

  #footer li.facebook > a,
  #footer li.instagram > a {
    width: 42px !important;
    height: 42px !important;
  }

  #footer li.facebook > a::before,
  #footer li.instagram > a::before {
    font-size: 26px !important;
  }
}
/* Amélioration de la lisibilité du H1 des catégories */
body#category .breadcrumb-bg > .container > h1 {
    display: block;
    width: fit-content;
    max-width: calc(100% - 30px);
    margin: 0 auto;
    padding: 8px 24px;

    color: #ffffff !important;
    background-color: rgba(51, 40, 54, 0.78);

    border-radius: 30px;
    text-align: center;
    line-height: 1.2;

    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.45);
}

/* Adaptation mobile */
@media (max-width: 767px) {
    body#category .breadcrumb-bg > .container > h1 {
        max-width: calc(100% - 20px);
        padding: 7px 16px;
        font-size: 26px !important;
        border-radius: 20px;
    }
}
/* =========================================================
   VOLET MOBILE COMPTE / CONNEXION — VANIG
   ========================================================= */

.group-nav.mobile-screen .ApColumn {
  background-color: #332836 !important;
  color: #ffffff !important;
  min-height: 100vh;
}

/* Suppression des fonds internes du module */
.group-nav.mobile-screen .header-logo-inner,
.group-nav.mobile-screen .wr-close,
.group-nav.mobile-screen .wr-quicklogin,
.group-nav.mobile-screen [class*="quicklogin"],
.group-nav.mobile-screen [class*="login-form"] {
  background-color: transparent !important;
}

/* Titres, textes et libellés */
.group-nav.mobile-screen h1,
.group-nav.mobile-screen h2,
.group-nav.mobile-screen h3,
.group-nav.mobile-screen h4,
.group-nav.mobile-screen h5,
.group-nav.mobile-screen p,
.group-nav.mobile-screen span,
.group-nav.mobile-screen label,
.group-nav.mobile-screen .form-control-label {
  color: #ffffff !important;
}

/* Liens */
.group-nav.mobile-screen a {
  color: #ffffff !important;
}

.group-nav.mobile-screen a:hover {
  color: #b7d8ce !important;
}

/* Croix de fermeture et icônes */
.group-nav.mobile-screen .wr-close,
.group-nav.mobile-screen .wr-close *,
.group-nav.mobile-screen i {
  color: #ffffff !important;
}

.group-nav.mobile-screen svg {
  fill: #ffffff;
}

/* Champs du formulaire */
.group-nav.mobile-screen input,
.group-nav.mobile-screen select,
.group-nav.mobile-screen textarea {
  background-color: #ffffff !important;
  color: #332836 !important;
  border: 1px solid rgba(255, 255, 255, 0.55) !important;
}

/* Texte indicatif des champs */
.group-nav.mobile-screen input::placeholder,
.group-nav.mobile-screen textarea::placeholder {
  color: #777777 !important;
  opacity: 1;
}

/* Séparateurs éventuels */
.group-nav.mobile-screen hr {
  border-color: rgba(255, 255, 255, 0.25) !important;
}
/* =========================================================
   VOLET MOBILE COMPTE / CONNEXION — VANIG
   ========================================================= */

.group-nav.mobile-screen .ApColumn,
.group-nav.mobile-screen .header-logo-inner,
.group-nav.mobile-screen .wr-close,
.group-nav.mobile-screen .wr-quicklogin,
.group-nav.mobile-screen .wr-quicklogin .content,
.group-nav.mobile-screen .wr-quicklogin .content .row,
.group-nav.mobile-screen .leo-quicklogin-form,
.group-nav.mobile-screen .leo-form,
.group-nav.mobile-screen .leo-form.leo-login-form,
.group-nav.mobile-screen .leo-resetpass-form,
.group-nav.mobile-screen .leo-form-inner {
  background: #332836 !important;
  color: #ffffff !important;
}

/* Si le module met du blanc sur certaines colonnes */
.group-nav.mobile-screen .wr-quicklogin [class*="col-"],
.group-nav.mobile-screen .wr-quicklogin [class*="col-sm-"],
.group-nav.mobile-screen .wr-quicklogin [class*="col-md-"],
.group-nav.mobile-screen .wr-quicklogin [class*="col-lg-"] {
  background: #332836 !important;
}

/* Titres, textes, labels */
.group-nav.mobile-screen h1,
.group-nav.mobile-screen h2,
.group-nav.mobile-screen h3,
.group-nav.mobile-screen h4,
.group-nav.mobile-screen h5,
.group-nav.mobile-screen p,
.group-nav.mobile-screen span,
.group-nav.mobile-screen label,
.group-nav.mobile-screen .form-control-label,
.group-nav.mobile-screen .leo-login-title {
  color: #ffffff !important;
}

/* Liens */
.group-nav.mobile-screen a {
  color: #ffffff !important;
}

.group-nav.mobile-screen a:hover {
  color: #b7d8ce !important;
}

/* Croix de fermeture et icônes */
.group-nav.mobile-screen .wr-close,
.group-nav.mobile-screen .wr-close *,
.group-nav.mobile-screen i {
  color: #ffffff !important;
}

.group-nav.mobile-screen svg {
  fill: #ffffff !important;
}

/* Champs du formulaire */
.group-nav.mobile-screen input,
.group-nav.mobile-screen select,
.group-nav.mobile-screen textarea {
  background: #ffffff !important;
  color: #332836 !important;
  border: 1px solid rgba(255,255,255,0.45) !important;
  box-shadow: none !important;
}

/* Placeholder */
.group-nav.mobile-screen input::placeholder,
.group-nav.mobile-screen textarea::placeholder {
  color: #777777 !important;
  opacity: 1;
}

/* Checkbox + petits textes */
.group-nav.mobile-screen input[type="checkbox"] + label,
.group-nav.mobile-screen .forgot-password,
.group-nav.mobile-screen .register-form,
.group-nav.mobile-screen .create-account,
.group-nav.mobile-screen .leo-callregister {
  color: #ffffff !important;
}

/* Bouton connexion */
.group-nav.mobile-screen .btn,
.group-nav.mobile-screen button,
.group-nav.mobile-screen input[type="submit"] {
  background: #b7c54a !important;
  border-color: #b7c54a !important;
  color: #ffffff !important;
}

/* Supprime les bordures/ombres blanches éventuelles */
.group-nav.mobile-screen .wr-quicklogin *,
.group-nav.mobile-screen .leo-form * {
  box-shadow: none !important;
}
/* =========================================================
   ZONE LANGUE / RÉGLAGES DU VOLET MOBILE
   ========================================================= */

.group-nav.mobile-screen #leo_block_top,
.group-nav.mobile-screen #leo_block_top .popup-title,
.group-nav.mobile-screen #leo_block_top .popup-content,
.group-nav.mobile-screen #leo_block_top .dropdown-menu,
.group-nav.mobile-screen #leo_block_top .row,
.group-nav.mobile-screen #leo_block_top [class*="col-"],
.group-nav.mobile-screen #leo_block_top .language-selector,
.group-nav.mobile-screen #leo_block_top .currency-selector,
.group-nav.mobile-screen #leo_block_top .link,
.group-nav.mobile-screen #leo_block_top ul,
.group-nav.mobile-screen #leo_block_top li {
  background: #332836 !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.15) !important;
}

/* Titres, textes et liens */
.group-nav.mobile-screen #leo_block_top,
.group-nav.mobile-screen #leo_block_top .title,
.group-nav.mobile-screen #leo_block_top span,
.group-nav.mobile-screen #leo_block_top p,
.group-nav.mobile-screen #leo_block_top a,
.group-nav.mobile-screen #leo_block_top li a {
  color: #ffffff !important;
}

/* Survol */
.group-nav.mobile-screen #leo_block_top a:hover,
.group-nav.mobile-screen #leo_block_top li a:hover {
  color: #b7d8ce !important;
}

/* Icônes éventuelles */
.group-nav.mobile-screen #leo_block_top i,
.group-nav.mobile-screen #leo_block_top svg {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* Si le dropdown garde une ombre ou un fond parasite */
.group-nav.mobile-screen #leo_block_top .dropdown-menu {
  box-shadow: none !important;
  background-image: none !important;
}
/* Masquer l’onglet "Détails du produit" */
#product .product-tabs .nav-tabs .nav-item:has(a[href="#product-details"]),
#product .product-tabs .nav-tabs a[href="#product-details"],
#product #product-details {
  display: none !important;
}
/* Titre des produits complémentaires */
.product-accessories .products-section-title,
.product-accessories .products-section-title span {
  text-transform: none !important;
}
/* Masquer les blocs annexes en bas des articles du blog */
#blogpage .extra-blogs {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* Contenance - texte plus visible */
.product-variants .product-variants-item select,
.product-variants .product-variants-item select.form-control,
.product-variants .product-variants-item .form-control-select {
  color: #000 !important;
  font-weight: 500;
}

/* Label "Contenance" */
.product-variants .product-variants-item .control-label,
.product-variants .product-variants-item span {
  color: #000 !important;
}

/* Options du menu déroulant */
.product-variants .product-variants-item select option {
  color: #000 !important;
}
/* ==================================================
   PRIX + DECLINAISON
   ================================================== */

.product-prices .price-combination-label {
    display: inline-block;
    margin-left: 12px;
    padding-left: 12px;

    border-left: 1px solid #d8d8d8;

    color: #332836;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;

    vertical-align: baseline;
}
/* Logos partenaires cliquables */

.partners-logos a {
    display: block;
}

.partners-logos a img {
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.partners-logos a:hover img {
    transform: scale(1.05);
    opacity: 0.85;
}
/* ==================================================
   LE COIN DES PROS - BOUTON À DROITE
   ================================================== */

@media (min-width: 992px) {

    /* Menu Leo en flex sur toute la largeur */
    .leo-megamenu .megamenu.horizontal {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
    }

    .leo-megamenu .megamenu.horizontal > li {
        float: none !important;
    }

    /* On envoie Le coin des Pros complètement à droite */
    .leo-megamenu .megamenu.horizontal > li.menu-coin-pro {
        order: 999 !important;
        margin-left: auto !important;
        margin-right: 20px !important;
    }

    /* Cartouche */
    .leo-megamenu .menu-coin-pro > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        padding: 11px 24px !important;

        background: #c9252b !important;
        border: 1px solid #c9252b !important;
        border-radius: 30px !important;

        color: #fff !important;

        font-weight: 600 !important;
        line-height: 1.2 !important;

        transition:
            background-color .25s ease,
            transform .25s ease,
            box-shadow .25s ease !important;
    }

    /* Texte */
    .leo-megamenu .menu-coin-pro > a .menu-title {
        color: #fff !important;
    }

    /* Hover élégant */
    .leo-megamenu .menu-coin-pro > a:hover {
        background: #332836 !important;
        border-color: #332836 !important;

        transform: translateY(-1px);

        box-shadow: 0 5px 14px rgba(0, 0, 0, .15);
    }

    .leo-megamenu .menu-coin-pro > a:hover .menu-title {
        color: #fff !important;
    }
}
/* ==================================================
   AVIS / PRESSE - BOX TESTI
   ================================================== */

.box-testi {
    padding: 45px 20px !important;
}

/* Carte principale */
.box-testi .block-carousel-container {
    position: relative;
    max-width: 850px;
    margin: 0 auto !important;
    padding: 38px 55px 42px !important;

    background: #ffffff !important;
    border-radius: 18px;

    box-shadow:
        0 12px 35px rgba(51, 40, 54, 0.10);

    text-align: center !important;
}


/* =========================================
   LOGO
   ========================================= */

.box-testi .block-carousel-image-container.image > img {
    display: block;

    width: auto !important;
    max-width: 190px !important;
    max-height: 85px;

    margin: 0 auto 28px !important;

    object-fit: contain;

    transition: transform .25s ease;
}

.box-testi .block-carousel-container:hover
.block-carousel-image-container.image > img {
    transform: scale(1.05);
}


/* =========================================
   TEXTE DE L'AVIS
   ========================================= */

.box-testi .descript {
    position: relative;

    max-width: 720px;
    margin: 0 auto !important;

    color: #332836 !important;

    font-size: 19px !important;
    line-height: 1.65 !important;
    font-weight: 400;

    text-align: center !important;
}


/* Grande guillemet décorative */
.box-testi .descript::before {
    content: "“";

    display: block;

    height: 42px;
    margin-bottom: 5px;

    color: #2A7A69;

    font-family: Georgia, serif;
    font-size: 70px;
    line-height: 1;

    opacity: .35;
}


/* Petit accent sous la citation */
.box-testi .descript::after {
    content: "";

    display: block;

    width: 45px;
    height: 3px;

    margin: 28px auto 0;

    background: #2A7A69;
    border-radius: 10px;
}


/* =========================================
   RESPONSIVE
   ========================================= */

@media (max-width: 767px) {

    .box-testi {
        padding: 25px 15px !important;
    }

    .box-testi .block-carousel-container {
        padding: 28px 22px 32px !important;
        border-radius: 14px;
    }

    .box-testi .block-carousel-image-container.image > img {
        max-width: 150px !important;
        max-height: 70px;
        margin-bottom: 20px !important;
    }

    .box-testi .descript {
        font-size: 16px !important;
        line-height: 1.55 !important;
    }

    .box-testi .descript::before {
        font-size: 55px;
        height: 34px;
    }
}
/* ==================================================
   LOGOS PARTENAIRES - CENTRAGE
   ================================================== */

.partners-center .image-item {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.partners-center .image-item > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100%;
}

.partners-center .image-item img {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 auto !important;
}
@media (min-width: 992px) {

  /* Plus d'air entre compte et panier */
  .dp-top .header-btn.btn-acc {
    margin-right: 22px !important;
  }

  /* Très légère augmentation uniquement */
  .dp-top .header-btn.btn-acc,
  #desktop_cart .header-btn.btn-cart {
    width: 48px !important;
    height: 48px !important;
    line-height: 48px !important;
  }

}
/* ==================================================
   WHY BOX - DESKTOP
   Picto + titre / texte pleine largeur dessous
   ================================================== */

@media (min-width: 992px) {

    .why-box {
        display: grid !important;

        grid-template-columns: 70px 1fr;
        grid-template-rows: auto auto;

        column-gap: 18px;
        row-gap: 14px;

        align-items: center;

        padding: 34px 38px !important;
    }


    /* ------------------------------
       PICTO
       ------------------------------ */

    .why-box img {
        grid-column: 1;
        grid-row: 1;

        width: 60px !important;
        height: 60px !important;

        margin: 0 !important;

        object-fit: contain;
    }


    /* ------------------------------
       TITRE
       ------------------------------ */

    .why-box h2,
    .why-box h3,
    .why-box h4,
    .why-box .title {
        grid-column: 2;
        grid-row: 1;

        align-self: center;

        margin: 0 !important;
        padding: 0 !important;

        line-height: 1.2;
    }

} /* fermeture du premier @media WHY BOX desktop */

  /* ==================================================
   WHY BOX - DESKTOP
   Picto + titre / texte pleine largeur dessous
   ================================================== */

@media (min-width: 992px) {

    /* Le conteneur Leo extérieur ne doit PAS être en grid */
    .block.why-box.ApHtml {
        display: block !important;
    }

    .block.why-box.ApHtml > .block_content {
        width: 100%;
    }


    /* =========================================
       VRAIE CARTE
       ========================================= */

    .block.why-box.ApHtml > .block_content > .why-box {
        display: grid !important;

        grid-template-columns: 64px minmax(0, 1fr);
        grid-template-areas:
            "icon title"
            "content content";

        column-gap: 18px;
        row-gap: 16px;

        align-items: center;

        padding: 32px 38px !important;
    }


    /* =========================================
       PICTO
       ========================================= */

    .block.why-box.ApHtml .why-icon {
        grid-area: icon;

        width: 60px;
        height: 60px;

        margin: 0 !important;

        display: flex;
        align-items: center;
        justify-content: center;
    }


    /* =========================================
       TITRE
       ========================================= */

    .block.why-box.ApHtml .question-title {
        grid-area: title;

        margin: 0 !important;
        padding: 0 !important;

        align-self: center;

        text-align: left !important;
    }


    /* =========================================
       TEXTE
       ========================================= */

    .block.why-box.ApHtml .question-content {
        grid-area: content;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        text-align: left !important;
        text-indent: 0 !important;
    }

    .block.why-box.ApHtml .question-content p {
        margin: 0 !important;
        padding: 0 !important;

        text-align: left !important;
        text-indent: 0 !important;
    }

}
/* ==================================================
   FOOTER - CARTE CONTACT
   Version intégrée / élégante
   Desktop
   ================================================== */

@media (min-width: 992px) {

  .footer-contact-card {
    position: relative;

    padding: 26px 30px !important;

    background: rgba(45, 35, 48, 0.96) !important;

    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-radius: 16px;

    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12) !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  /* Accent vertical */
  .footer-contact-card::before {
    content: "";

    position: absolute;
    top: 27px;
    left: 0;

    width: 3px;
    height: 38px;

    background: #2A7A69 !important;

    border-radius: 0 3px 3px 0;
  }

  /* Titre */
  .footer-contact-card .title_block {
    margin: 0 0 20px !important;
    padding: 0 !important;

    color: #ffffff !important;

    font-size: 17px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em;
    line-height: 1.25 !important;
  }

  /* Coordonnées */
  .footer-contact-card p {
    margin: 0 0 14px !important;
    padding: 0 !important;

    color: rgba(255, 255, 255, 0.84) !important;

    font-size: 15px !important;
    line-height: 1.55 !important;

    border: 0 !important;
  }

  .footer-contact-card p:last-child {
    margin-bottom: 0 !important;
  }

  /* Email */
  .footer-contact-card a {
    color: #2A7A69 !important;

    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;

    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;

    text-decoration: none !important;

    border: 0 !important;
    border-bottom: 0 !important;

    transition: color 0.2s ease;
  }

  .footer-contact-card a:hover {
    color: #ffffff !important;
  }

  /* Suppression de décorations parasites */
  .footer-contact-card hr,
  .footer-contact-card p::before,
  .footer-contact-card p::after,
  .footer-contact-card a::before,
  .footer-contact-card a::after {
    display: none !important;
    content: none !important;
  }

}

/* ==========================================================
   HEADER MOBILE VANIG - CORRECTION ISOLÉE
   Desktop inchangé
   ========================================================== */

@media (max-width: 767px) {

  .row.dp-top.home-6.ApRow,
  .dp-top.home-6.ApRow {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    background: #332836 !important;
    background-color: #332836 !important;
    box-sizing: border-box !important;
  }

  .row.dp-top.home-6.ApRow > .ApColumn,
  .dp-top.home-6.ApRow > .ApColumn {
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }

  .row.dp-top.home-6.ApRow > .ApColumn:nth-child(1),
  .dp-top.home-6.ApRow > .ApColumn:nth-child(1) {
    flex: 0 0 25% !important;
    width: 25% !important;
    max-width: 25% !important;
  }

  .row.dp-top.home-6.ApRow > .ApColumn:nth-child(2),
  .dp-top.home-6.ApRow > .ApColumn:nth-child(2) {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
    justify-content: center !important;
  }

  .dp-top.home-6 .header-logo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .dp-top.home-6 .logo.img-fluid {
    display: block !important;
    width: 130px !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
  }

  .row.dp-top.home-6.ApRow > .ApColumn:nth-child(3),
  .dp-top.home-6.ApRow > .ApColumn:nth-child(3) {
    flex: 0 0 25% !important;
    width: 25% !important;
    max-width: 25% !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    gap: 6px !important;
  }

  .dp-top.home-6 .header-btn.btn-acc,
  .dp-top.home-6 .header-btn.btn-cart {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #2A7A69 !important;
    background-color: #2A7A69 !important;
    border: 0 !important;
    border-radius: 50% !important;
  }

  .dp-top.home-6 .header-btn.btn-acc > a,
  .dp-top.home-6 .header-btn.btn-cart > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .dp-top.home-6 .header-btn a,
  .dp-top.home-6 .header-btn i,
  .dp-top.home-6 .header-btn .fal,
  .dp-top.home-6 .header-btn .fa {
    color: #ffffff !important;
  }

  .dp-top.home-6 .cart-total-value {
    display: none !important;
  }

  .dp-top.home-6 .cart-products-count,
  .dp-top.home-6 .ap-total {
    color: #ffffff !important;
    font-size: 10px !important;
    line-height: 1 !important;
  }
}
/* =========================================================
   VANIG - VERROUILLAGE SCROLL HORIZONTAL MOBILE
   ========================================================= */

@media (max-width: 767px) {

  html.default {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
  }

}

/* =========================================================
   HEADER / MENU AU-DESSUS DU ZOOM PRODUIT
   ========================================================= */

#header,
.header-top,
.dp-top,
.dp-top-menu,
.leo-megamenu,
.leo-megamenu .navbar-nav {
  position: relative;
  z-index: 150 !important;
}

/* Le dropdown conserve son positionnement natif (absolute) ; seul son empilement est relevé. */
.leo-megamenu .dropdown-menu {
  z-index: 1000 !important;
}

/* ==========================================================
   VANIG - PERSONNALISATIONS MIGRÉES DE THEME.CSS
   Règle de maintenance : ne plus ajouter de personnalisation dans theme.css.
   ========================================================== */

/* H1 produit / catégorie */
#product h1,
#product .h1,
#product .product-detail-name,
body#product h1,
body#product .h1,
body#product .product-detail-name {
  font-family: "Mazzard Soft H", sans-serif !important;
}

#category h1,
#category .h1,
#category .block-category > h1,
#category #wrapper .breadcrumb-bg > .container > h1,
body#category h1,
body#category .h1,
body#category .block-category > h1,
body#category #wrapper .breadcrumb-bg > .container > h1 {
  font-family: "Conv_Greatest Richmond 400", cursive !important;
}

#category .block-category > h1,
body#category .block-category > h1 {
  display: block !important;
}

/* Panier Leo mobile : le dropdown doit pouvoir sortir de #page. */
@media (max-width: 991px) {
  #page {
    overflow: visible !important;
  }

  #_desktop_cart .header-btn.btn-cart {
    position: relative;
  }

  #_desktop_cart .cart-products-count {
    position: absolute !important;
    top: -2px;
    right: 0;
    width: 20px;
    height: 20px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    line-height: 1 !important;
    border-radius: 50%;
    text-align: center;
    margin: 0 !important;
    padding: 0 !important;
  }

  .leo-cart-dropdown-action {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }

  .leo-cart-dropdown-action .cart-dropdow-button {
    margin: 0 !important;
  }

  /* Titre home "Plongez au coeur de la Drôme" */
  #content.page-home h2.title-style3 {
    font-size: 38px !important;
    line-height: 1.15 !important;
    padding: 0 15px;
    margin-bottom: 20px;
  }
}

/* Témoignages / partenaires sur téléphone */
@media (max-width: 575px) {
  .box-testi > .ApColumn {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .partners-logos .show_image {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .partners-logos .image-item {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center;
  }

  .partners-logos .image-item a {
    display: flex;
    justify-content: center;
    width: 100%;
  }

  .partners-logos .image-item img {
    display: block;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Déclinaisons longues */
  .product-variants .product-variants-item {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .product-variants .product-variants-item .control-label {
    width: 100%;
    margin-bottom: 6px;
  }

  .product-variants .product-variants-item select.form-control-select {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* WHY BOX sans image de fond */
  .row.h7-box-why {
    background-image: none !important;
    background: #332836 !important;
  }

  /* Zone quantité + panier */
  .product-add-to-cart {
    margin-top: 12px;
  }

  .product-add-to-cart .product-quantity,
  .product-add-to-cart .qty {
    margin-bottom: 14px !important;
  }

  .product-add-to-cart .add {
    width: 100%;
  }

  .product-add-to-cart .add .add-to-cart {
    width: 100% !important;
    min-height: 46px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 700;
    line-height: 1.2;
  }
}

/* Déclinaisons tablette / desktop */
@media (min-width: 576px) {
  .product-variants .product-variants-item {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
  }

  .product-variants .product-variants-item .control-label {
    flex: 0 0 auto;
    margin: 0;
  }

  .product-variants .product-variants-item select.form-control-select {
    flex: 1 1 auto;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
  }
}

/* Fiche produit */
#product #main.product-detail {
  padding-top: 30px !important;
}

#product #product-detail {
  display: none !important;
}

/* ==========================================================
   AVIS GOOGLE - VANIG
   Le CSS interne SociableKit reste injecté par le script HTML car le widget utilise un Shadow DOM.
   ========================================================== */

.vanig-reviews-section {
  padding: 35px 20px;
  background: #f8f6f1;
}

.vanig-reviews-container {
  max-width: 1180px;
  margin: 0 auto;
}

.vanig-reviews-head {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 30px;
}

.vanig-reviews-badge {
  display: inline-block;
  background: #2A7A69;
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 30px;
  margin-bottom: 15px;
}

.vanig-reviews-head h2 {
  margin: 0 0 12px;
  font-size: 32px;
  line-height: 1.2;
  color: #2A7A69;
  font-weight: 700;
}

.vanig-reviews-head p {
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: #4e515a;
}

.vanig-google-reviews {
  max-width: 1060px;
  margin: 0 auto;
  padding: 12px;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 8px 25px rgba(42, 122, 105, 0.07);
  overflow: hidden;
}

@media (max-width: 767px) {
  .vanig-reviews-section {
    padding: 25px 12px;
  }

  .vanig-reviews-head h2 {
    font-size: 24px;
  }

  .vanig-reviews-head p {
    font-size: 14px;
    line-height: 1.5;
  }

  .vanig-reviews-badge {
    font-size: 12px;
    padding: 7px 12px;
  }

  .vanig-google-reviews {
    width: 100%;
    padding: 8px;
    border-radius: 12px;
  }
}

/* ==========================================================
   VANIG - BOUTON "BOUTIQUE EN LIGNE"
   Desktop + Mobile
   ========================================================== */

/* ==========================================================
   STYLE COMMUN
   ========================================================== */

.leo-megamenu .megamenu li > a[href*="4-boutique-en-ligne"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #C6914B !important;
    border: 1px solid #C6914B !important;
    border-radius: 30px !important;

    color: #ffffff !important;

    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    white-space: nowrap !important;

    transition:
        background-color .25s ease,
        transform .25s ease,
        box-shadow .25s ease !important;
}

/* Texte interne */
.leo-megamenu .megamenu li > a[href*="4-boutique-en-ligne"] .menu-title {
    color: #ffffff !important;
    text-align: center !important;
    white-space: nowrap !important;
}

/* Hover */
.leo-megamenu .megamenu li > a[href*="4-boutique-en-ligne"]:hover {
    background: #332836 !important;
    border-color: #332836 !important;

    transform: translateY(-1px);

    box-shadow: 0 5px 14px rgba(0, 0, 0, .15);
}

.leo-megamenu .megamenu li > a[href*="4-boutique-en-ligne"]:hover .menu-title {
    color: #ffffff !important;
}


/* ==========================================================
   DESKTOP
   ========================================================== */

@media (min-width: 992px) {

    .leo-megamenu .megamenu.horizontal > li:has(> a[href*="4-boutique-en-ligne"]) {
        flex: 0 0 auto !important;

        width: auto !important;
        min-width: max-content !important;

        float: none !important;

        margin-left: 8px !important;
        margin-right: 8px !important;
    }

    .leo-megamenu .megamenu.horizontal > li > a[href*="4-boutique-en-ligne"] {
        width: auto !important;
        min-width: max-content !important;

        padding: 11px 20px !important;
    }
}


/* ==========================================================
   VANIG - BOUTIQUE EN LIGNE
   MOBILE / TABLETTE
   Ciblage du vrai module Leo mobile
   ========================================================== */

@media (max-width: 991px) {

    /*
     * Module Leo contenant réellement Boutique en ligne.
     * On ne touche ni à Découvrez nos produits,
     * ni aux autres Megamenu.
     */
    .ApMegamenu:has(a[href*="4-boutique-en-ligne"]) {
        display: block !important;

        float: none !important;
        clear: both !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 12px !important;

        box-sizing: border-box !important;
    }


    /* Toute la structure interne prend la largeur disponible */
    .ApMegamenu:has(a[href*="4-boutique-en-ligne"]) .leo-megamenu,
    .ApMegamenu:has(a[href*="4-boutique-en-ligne"]) .leo-top-menu,
    .ApMegamenu:has(a[href*="4-boutique-en-ligne"]) ul.megamenu {
        display: block !important;

        float: none !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }


    /* Le LI ne doit plus être dimensionné comme un item horizontal */
    .ApMegamenu:has(a[href*="4-boutique-en-ligne"])
    li:has(> a[href*="4-boutique-en-ligne"]) {

        display: block !important;

        float: none !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* Le vrai bouton */
    .ApMegamenu:has(a[href*="4-boutique-en-ligne"])
    a[href*="4-boutique-en-ligne"] {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        min-height: 48px !important;

        margin: 8px 0 !important;
        padding: 13px 18px !important;

        background: #C6914B !important;
        border: 1px solid #C6914B !important;
        border-radius: 30px !important;

        color: #ffffff !important;

        font-weight: 600 !important;
        line-height: 1.2 !important;

        text-align: center !important;
        white-space: nowrap !important;

        box-sizing: border-box !important;
    }


    /* Texte */
    .ApMegamenu:has(a[href*="4-boutique-en-ligne"])
    a[href*="4-boutique-en-ligne"] .menu-title {

        display: block !important;
        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #ffffff !important;

        text-align: center !important;
        white-space: nowrap !important;
    }
}

/* ==========================================================
   VANIG - HEADER MOBILE
   Logo à gauche / Compte + Panier à droite
   Restauration version validée
   ========================================================== */

@media (max-width: 767px) {

    /* Colonne vide de gauche : supprimée */
    #form_43464615619146485 > .ApColumn:nth-child(1) {
        display: none !important;
    }

    /* Colonne logo */
    #form_43464615619146485 > .ApColumn:nth-child(2) {
        flex: 0 0 75% !important;
        width: 75% !important;
        max-width: 75% !important;

        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
    }

    /* Colonne compte / panier */
    #form_43464615619146485 > .ApColumn:nth-child(3) {
        flex: 0 0 25% !important;
        width: 25% !important;
        max-width: 25% !important;

        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
    }

    /* Alignement du bloc logo */
    #form_43464615619146485 .header-logo {
        width: 100% !important;

        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
    }

    #form_43464615619146485 .header-logo > a {
        width: 100% !important;

        display: flex !important;
        justify-content: flex-start !important;
    }

    /* Position validée : alignement sur le menu */
    #form_43464615619146485 .header-logo img {
        margin-left: -61px !important;
        margin-right: 0 !important;
    }
}
/* ==========================================================
   VANIG - MENU OFF-CANVAS MOBILE LEO
   Empêche le clone du menu d'apparaître en bas de page
   ========================================================== */

@media (max-width: 991px) {

    /* Menu fermé : le clone Leo ne doit pas exister visuellement */
    body:not(.off-canvas-active) > .off-canvas-nav-megamenu {
        display: none !important;
    }

    /* Menu ouvert : Leo peut afficher son panneau normalement */
    body.off-canvas-active > .off-canvas-nav-megamenu {
        display: block !important;
    }
}

/* VANIG - Correction panier au premier plan sur mobile */
@media (max-width: 767px) {
    .dp-top.home-6 {
        z-index: 300 !important;
    }
}

/* VANIG - Panier au premier plan sur desktop */
@media (min-width: 768px) {
    .dp-top.home-6 {
        z-index: 300 !important;
    }
}