/* Fond global du site */
body {
  background-color: #FFFFFF !important;
  color: #000000 !important;
}

/* Liens par défaut */
a {
  color: #000000 !important; 
  text-decoration: none;
  transition: color 0.3s ease, text-shadow 0.3s ease, background-color 0.3s ease;
}

/* Hover cuivre/doré brillant sur tous les liens */
a:hover,
a:focus {
  color: #b87333 !important; /* cuivre */
  text-shadow: 0 0 5px rgba(184, 115, 51, 0.6),
               0 0 10px rgba(184, 115, 51, 0.4);
}

/* Boutons par défaut */
button,
.btn,
input[type="submit"],
input[type="button"] {
  background-color: #000000 !important; 
  color: #ffffff !important;
  border: none !important;
  transition: background-color 0.3s ease, color 0.3s ease, text-shadow 0.3s ease;
}

/* Hover cuivre/doré brillant pour boutons */
button:hover,
.btn:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
  background-color: #b87333 !important; 
  color: #ffffff !important; 
  text-shadow: 0 0 8px rgba(184, 115, 51, 0.7),
               0 0 15px rgba(184, 115, 51, 0.5);
}

/* Icônes interactives (ex: panier, loupe, favoris) */
.icon,
.material-icons,
.fas,
.far {
  color: #000000 !important;
  transition: color 0.3s ease, text-shadow 0.3s ease;
}

.icon:hover,
.material-icons:hover,
.fas:hover,
.far:hover {
  color: #b87333 !important;
  text-shadow: 0 0 8px rgba(184, 115, 51, 0.7),
               0 0 15px rgba(184, 115, 51, 0.5);
}

/* Supprimer le voile foncé sur les images produit au survol */
.product-thumbnail::before,
.thumbnail-container::before,
.thumbnail-container .leo-hover {
  background: none !important;
  opacity: 0 !important;
  display: none !important;
}

/* Titre du bloc catégories (colonne gauche) — CUITRE PERMANENT */
#left-column .block-categories .title_block,
#left-column .block-categories .title_block a,
#left-column .block .title_block,
#left-column .block .title_block a,
.block-categories .block-title,
.block-categories .block-title a,
.block-categories .title_block,
.block-categories .title_block a {
  color: #b87333 !important;              /* cuivre/doré */
  text-shadow: 0 0 6px rgba(184,115,51,.6),
               0 0 12px rgba(184,115,51,.4); /* effet “brillant” */
}

/* Désactiver tout hover qui pourrait le repasser en noir */
#left-column .block-categories .title_block:hover,
#left-column .block-categories .title_block a:hover,
.block-categories .block-title:hover,
.block-categories .block-title a:hover,
.block-categories .title_block:hover,
.block-categories .title_block a:hover {
  color: #b87333 !important;
  text-shadow: 0 0 6px rgba(184,115,51,.6),
               0 0 12px rgba(184,115,51,.4);
}

/* === Forcer le menu "Trier par" à rester BLANC (tous états) === */

/* 1) Cible large : conteneurs de tri utilisés par LEO/PS */
.products-sort-order,
.leo-sortby,
.sort-by-row,
.js-sort-products {
  /* rien ici, juste pour la portée */
}

/* 2) Le menu et tout son contenu : fond toujours blanc */
.products-sort-order .dropdown-menu,
.leo-sortby .dropdown-menu,
.sort-by-row .dropdown-menu,
.js-sort-products .dropdown-menu,
.products-sort-order .dropdown-menu *,
.leo-sortby .dropdown-menu *,
.sort-by-row .dropdown-menu *,
.js-sort-products .dropdown-menu * {
  background-color: #ffffff !important;
}

/* 3) Les items (liens) en état normal */
.products-sort-order .dropdown-menu .dropdown-item,
.leo-sortby .dropdown-menu .dropdown-item,
.sort-by-row .dropdown-menu .dropdown-item,
.js-sort-products .dropdown-menu .dropdown-item,
.products-sort-order .dropdown-menu li > a,
.leo-sortby .dropdown-menu li > a,
.sort-by-row .dropdown-menu li > a,
.js-sort-products .dropdown-menu li > a {
  color: #000000 !important;
  background-color: #ffffff !important;
}

/* 4) Survol / focus : reste blanc + cuivre pour le texte */
.products-sort-order .dropdown-menu .dropdown-item:hover,
.products-sort-order .dropdown-menu .dropdown-item:focus,
.products-sort-order .dropdown-menu li > a:hover,
.products-sort-order .dropdown-menu li > a:focus,
.leo-sortby .dropdown-menu .dropdown-item:hover,
.leo-sortby .dropdown-menu .dropdown-item:focus,
.leo-sortby .dropdown-menu li > a:hover,
.leo-sortby .dropdown-menu li > a:focus,
.sort-by-row .dropdown-menu .dropdown-item:hover,
.sort-by-row .dropdown-menu .dropdown-item:focus,
.sort-by-row .dropdown-menu li > a:hover,
.sort-by-row .dropdown-menu li > a:focus,
.js-sort-products .dropdown-menu .dropdown-item:hover,
.js-sort-products .dropdown-menu .dropdown-item:focus,
.js-sort-products .dropdown-menu li > a:hover,
.js-sort-products .dropdown-menu li > a:focus {
  background-color: #ffffff !important;
  color: #b87333 !important; /* cuivre */
  text-shadow: 0 0 5px rgba(184,115,51,.6), 0 0 10px rgba(184,115,51,.4);
}

/* 5) Item sélectionné (active / selected / current) : blanc + cuivre */
.products-sort-order .dropdown-menu .dropdown-item.active,
.products-sort-order .dropdown-menu .dropdown-item:active,
.products-sort-order .dropdown-menu .dropdown-item.selected,
.products-sort-order .dropdown-menu .dropdown-item.current,
.products-sort-order .dropdown-menu li.active > a,
.products-sort-order .dropdown-menu li.selected > a,
.products-sort-order .dropdown-menu li.current > a,
.leo-sortby .dropdown-menu .dropdown-item.active,
.leo-sortby .dropdown-menu .dropdown-item:active,
.leo-sortby .dropdown-menu .dropdown-item.selected,
.leo-sortby .dropdown-menu li.active > a,
.leo-sortby .dropdown-menu li.selected > a,
.sort-by-row .dropdown-menu .dropdown-item.active,
.sort-by-row .dropdown-menu .dropdown-item:active,
.sort-by-row .dropdown-menu .dropdown-item.selected,
.sort-by-row .dropdown-menu li.active > a,
.sort-by-row .dropdown-menu li.selected > a,
.js-sort-products .dropdown-menu .dropdown-item.active,
.js-sort-products .dropdown-menu .dropdown-item:active,
.js-sort-products .dropdown-menu .dropdown-item.selected,
.js-sort-products .dropdown-menu li.active > a,
.js-sort-products .dropdown-menu li.selected > a {
  background-color: #ffffff !important;
  color: #b87333 !important;
  text-shadow: 0 0 5px rgba(184,115,51,.6), 0 0 10px rgba(184,115,51,.4);
}

/* 6) Enlever toute surcouche verte/ombre du thème */
.products-sort-order .dropdown-menu,
.leo-sortby .dropdown-menu,
.sort-by-row .dropdown-menu,
.js-sort-products .dropdown-menu {
  border-color: #eaeaea !important;
  box-shadow: none !important;
}

/* 7) Cas de fallback Bootstrap global si d’autres menus injectent du vert */
.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active,
.dropdown-menu .dropdown-item.selected {
  background-color: #ffffff !important;
  color: #b87333 !important;

}

/************ 2) RÉSEAUX SOCIAUX — forcer la couleur de l’icône ************/
/* Ancre : fond blanc + anneau cuivre + icône cuivre */
.ps-socialfollow a,
.ps_socialfollow a,
.block-social a,
.social-links a,
.social-icons a,
.ap-social a,
#footer .social a,
[class*="social"] a {
  background:#fff !important;
  border:1px solid #b87333 !important;
  color:#b87333 !important;              /* clé = currentColor pour les svg */
  transition:all .25s ease !important;
}

/* Icônes en <i> (FontAwesome) */
.ps-socialfollow a i,
.block-social a i,
.social-links a i,
.social-icons a i,
.ap-social a i,
#footer .social a i {
  color:#b87333 !important;
}

/* Icônes en ::before (souvent le cas sur ps_socialfollow) */
.ps-socialfollow a::before,
.block-social a::before,
#footer .social a::before,
.social-links a::before,
.social-icons a::before,
.ap-social a::before {
  color:#b87333 !important;
  background:transparent !important;
  border-color:#b87333 !important;
}

/* Icônes en SVG */
.ps-socialfollow a svg,
.block-social a svg,
.social-links a svg,
.social-icons a svg,
.ap-social a svg,
#footer .social a svg,
.ps-socialfollow a svg *,
.block-social a svg *,
.social-links a svg *,
.social-icons a svg *,
.ap-social a svg *,
#footer .social a svg * {
  color:#b87333 !important;
  fill:currentColor !important;   /* hérite du cuivre */
  stroke:currentColor !important;
}

/* Hover : disque cuivre + logo blanc */
.ps-socialfollow a:hover,
.block-social a:hover,
.social-links a:hover,
.social-icons a:hover,
.ap-social a:hover,
#footer .social a:hover {
  background:#b87333 !important;
  border-color:#b87333 !important;
  color:#fff !important;
  box-shadow:0 0 10px rgba(184,115,51,.6), 0 0 20px rgba(184,115,51,.4) !important;
}
.ps-socialfollow a:hover i,
.block-social a:hover i,
.social-links a:hover i,
.social-icons a:hover i,
.ap-social a:hover i,
#footer .social a:hover i,
.ps-socialfollow a:hover::before,
.block-social a:hover::before,
#footer .social a:hover::before,
.social-links a:hover::before,
.social-icons a:hover::before,
.ap-social a:hover::before,
.ps-socialfollow a:hover svg,
.block-social a:hover svg,
.social-links a:hover svg,
.social-icons a:hover svg,
.ap-social a:hover svg,
#footer .social a:hover svg,
.ps-socialfollow a:hover svg *,
.block-social a:hover svg *,
.social-links a:hover svg *,
.social-icons a:hover svg *,
.ap-social a:hover svg *,
#footer .social a:hover svg * {
  color:#fff !important; fill:#fff !important; stroke:#fff !important;
}

/* --- 1) Restreindre le style "ronds cuivre" AUX réseaux du pied de page --- */
footer .ps-socialfollow a,
footer .block-social a,
footer .social a,
.footer .social a,
.footer-container .social a {
  background:#fff !important;
  border:1px solid #b87333 !important;
  color:#b87333 !important;
  box-shadow:none !important;
  transition:all .25s ease !important;
}

footer .ps-socialfollow a i,
footer .block-social a i,
footer .social a i,
footer .social a svg,
footer .social a svg * {
  color:inherit !important;
  fill:currentColor !important;
  stroke:currentColor !important;
}

footer .ps-socialfollow a:hover,
footer .block-social a:hover,
footer .social a:hover {
  background:#b87333 !important;
  border-color:#b87333 !important;
  color:#fff !important;
  box-shadow:0 0 10px rgba(184,115,51,.6),0 0 20px rgba(184,115,51,.4) !important;
}
footer .ps-socialfollow a:hover svg,
footer .ps-socialfollow a:hover svg * { fill:#fff !important; stroke:#fff !important; }

/* --- 2) NE PAS toucher aux icônes de partage produit (sprites) --- */
.product-actions .social-sharing a,
.product-information .social-sharing a,
.product-footer .social-sharing a,
.social-sharing a,
.leo-socialshare a,
.ap-social-share a {
  background-color: transparent !important; /* on n'écrase pas le sprite */
  border: none !important;
  box-shadow: none !important;
  color: inherit !important;
}

/* Optionnel : hover léger sur la page produit sans casser les sprites */
.product-actions .social-sharing a:hover,
.product-information .social-sharing a:hover,
.product-footer .social-sharing a:hover,
.social-sharing a:hover,
.leo-socialshare a:hover,
.ap-social-share a:hover {
  filter: brightness(1.08);          /* un petit glow sans supprimer l'image */
  transition: filter .2s ease;
}

/* ======== BACK TO TOP — ÉCRASE TOUT ======== */

/* Conteneur : on neutralise styles inline & overlays */
.ap-backtop, .leo-backtop, .back-to-top, .back_top, .back-top,
#backtop, #back-top, .scrollup, .scrollTop, .btn-scroll-top {
  background: #000 !important;           /* noir par défaut */
  color: #fff !important;                 /* icône blanche */
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  filter: none !important;
  background-image: none !important;
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  z-index: 99999 !important;
}

/* Même si le conteneur a un style inline (background, box-shadow…) */
.ap-backtop[style], .leo-backtop[style], .back-to-top[style],
#backtop[style], #back-top[style], .scrollup[style] {
  background: #000 !important;
  box-shadow: none !important;
}

/* On neutralise les couches/pseudo-éléments qui imposent une teinte */
.ap-backtop:before, .ap-backtop:after,
.leo-backtop:before, .leo-backtop:after,
.back-to-top:before, .back-to-top:after,
#backtop:before, #backtop:after,
#back-top:before, #back-top:after,
.scrollup:before, .scrollup:after {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  content: none !important;              /* coupe net les triangles décoratifs */
}

/* Icône : font OU SVG OU triangle en bordure */
.ap-backtop i, .leo-backtop i, .back-to-top i, #backtop i, #back-top i,
.scrollup i, .scrollTop i, .btn-scroll-top i,
.ap-backtop svg, .leo-backtop svg, .back-to-top svg, #backtop svg, #back-top svg,
.scrollup svg, .scrollTop svg, .btn-scroll-top svg,
.ap-backtop svg *, .leo-backtop svg *, .back-to-top svg *,
#backtop svg *, #back-top svg *, .scrollup svg *, .scrollTop svg *, .btn-scroll-top svg * {
  color: #fff !important;
  fill: #fff !important;
  stroke: #fff !important;
}

/* Certaines flèches sont faites avec des bordures : on force en blanc */
.ap-backtop i:before, .leo-backtop i:before, .back-to-top i:before,
#backtop i:before, #back-top i:before,
.ap-backtop i:after, .leo-backtop i:after, .back-to-top i:after,
#backtop i:after, #back-top i:after {
  border-color: #fff !important;
}

/* HOVER : cuivre plein + lueur + icône blanche */
.ap-backtop:hover, .leo-backtop:hover, .back-to-top:hover,
#backtop:hover, #back-top:hover, .scrollup:hover, .btn-scroll-top:hover {
  background: #b87333 !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 0 10px rgba(184,115,51,.6), 0 0 20px rgba(184,115,51,.4) !important;
}

.ap-backtop:hover i, .leo-backtop:hover i, .back-to-top:hover i,
#backtop:hover i, #back-top:hover i, .scrollup:hover i, .btn-scroll-top:hover i,
.ap-backtop:hover svg, .leo-backtop:hover svg, .back-to-top:hover svg,
#backtop:hover svg, #back-top:hover svg, .scrollup:hover svg, .btn-scroll-top:hover svg,
.ap-backtop:hover svg *, .leo-backtop:hover svg *, .back-to-top:hover svg *,
#backtop:hover svg *, #back-top:hover svg *, .scrollup:hover svg *, .btn-scroll-top:hover svg * {
  color: #fff !important;
  fill: #fff !important;
  stroke: #fff !important;
}

/* ================================
   1) BOUTONS VUE GRILLE / LISTE
   (Leotheme + Prestashop + fallback)
   ================================ */
.view-mode .btn,
.view-mode button,
.view-mode a,
.leo-view-mode .btn,
.leo-view-mode a,
.ap-view-mode .btn,
.ap-view-mode a,
.display .btn,
.display a,
.display #grid,
.display #list {
  background:#ffffff !important;                 /* base blanche */
  border:1px solid #b87333 !important;           /* bordure cuivre */
  color:#000000 !important;                      /* pictos noirs */
  box-shadow:none !important;
  transition:all .25s ease;
}
.view-mode .btn i,
.view-mode a i,
.leo-view-mode .btn i,
.leo-view-mode a i,
.ap-view-mode .btn i,
.ap-view-mode a i,
.display .btn i,
.display a i { color:inherit !important; }

/* actif + hover => cuivre brillant */
.view-mode .btn.active,
.view-mode a.active,
.view-mode .btn:hover,
.view-mode a:hover,
.leo-view-mode .btn.active,
.leo-view-mode a.active,
.leo-view-mode .btn:hover,
.leo-view-mode a:hover,
.ap-view-mode .btn.active,
.ap-view-mode a.active,
.ap-view-mode .btn:hover,
.ap-view-mode a:hover,
.display .btn.active,
.display a.active,
.display .btn:hover,
.display a:hover,
.display #grid:hover,
.display #list:hover {
  background:#b87333 !important;
  color:#ffffff !important;
  text-shadow:0 0 8px rgba(184,115,51,.7), 0 0 15px rgba(184,115,51,.5);
}
/* =========================================
   TYPOGRAPHIE & ESPACEMENTS – BRÛT (LUXE)
   Titres: Playfair Display | Texte: Inter
   ========================================= */

/* 1) Charger les polices (même si non dispo dans le setup du thème) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Playfair+Display:wght@400;500;600&display=swap');

/* 2) Variables (facile à ajuster) */
:root{
  --brut-text: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --brut-title: 'Playfair Display', Georgia, "Times New Roman", serif;

  --brut-black: #000000;
  --brut-white: #ffffff;

  /* Échelles desktop */
  --h1: 46px;
  --h2: 32px;
  --h3: 24px;
  --h4: 20px;
  --h5: 16px;
  --h6: 14px;

  --body: 16px;
  --small: 14px;

  --lh-body: 1.75;
  --lh-title: 1.15;

  /* Espacements premium */
  --space-1: 8px;
  --space-2: 12px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 40px;
}

/* 3) Base globale */
html { -webkit-text-size-adjust: 100%; }
body{
  font-family: var(--brut-text) !important;
  font-size: var(--body);
  line-height: var(--lh-body);
  color: var(--brut-black);
  background: var(--brut-white);
  letter-spacing: 0.01em;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 4) Paragraphes / listes : confort + luxe */
p{ margin: 0 0 var(--space-3); }
p:last-child{ margin-bottom: 0; }

ul, ol{
  margin: 0 0 var(--space-3);
  padding-left: 1.2em;
}
li{ margin: 0 0 8px; }
li:last-child{ margin-bottom: 0; }

/* 5) Titres (H1→H6) + classes fréquentes Presta/Leo */
h1, h2, h3, h4, h5, h6,
.page-title, .h1, .h2, .h3, .h4, .h5, .h6,
.product-title, .product-name, .category-name{
  font-family: var(--brut-title) !important;
  color: var(--brut-black) !important;
  line-height: var(--lh-title);
  letter-spacing: 0.01em;
  margin: 0 0 var(--space-2);
  font-weight: 500;
}

/* Tailles desktop */
h1, .h1, .page-title{ font-size: var(--h1); }
h2, .h2{ font-size: var(--h2); }
h3, .h3{ font-size: var(--h3); }
h4, .h4{ font-size: var(--h4); }
h5, .h5{ font-size: var(--h5); }
h6, .h6{ font-size: var(--h6); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }

/* Rythme premium : espace avant les titres quand ils ne sont pas en premier */
h2:not(:first-child),
h3:not(:first-child),
h4:not(:first-child){
  margin-top: var(--space-5);
}

/* 6) Ajustements spécifiques pages e-commerce (Leo/Presta) */
.product-description,
.product-information,
#category-description,
.block-category,
.card,
.product-miniature,
.product-price,
.product-short-description{
  font-family: var(--brut-text) !important;
}

/* Titres produits & catégories (souvent surchargés par le thème) */
h1.h1,
.product-title,
h1.product-title,
.page-title,
.category-name{
  font-family: var(--brut-title) !important;
  font-weight: 500 !important;
}

/* 7) Liens (sobre + luxe) */
a{
  color: var(--brut-black) !important;
  text-decoration: none;
  transition: color .25s ease, text-shadow .25s ease;
}
a:hover, a:focus{
  color: #b87333 !important;
  text-shadow: 0 0 6px rgba(184,115,51,.35);
}

/* 8) Micro-typo : textes secondaires */
small, .small, .product-reference, .product-availability, .breadcrumb, .label, .caption{
  font-size: var(--small);
  line-height: 1.6;
}

/* 9) Espacements blocs (évite l’effet “compact”) */
.section, .content, .page-content, .cms-content{
  padding-bottom: var(--space-4);
}
.block, .card, .product-miniature{
  margin-bottom: var(--space-4);
}

/* 10) Responsive (tablette + mobile) */
@media (max-width: 992px){
  :root{
    --h1: 40px;
    --h2: 30px;
    --h3: 22px;
    --h4: 19px;
    --h5: 16px;
    --h6: 13px;
    --body: 16px;
    --lh-body: 1.7;
  }
}

@media (max-width: 576px){
  :root{
    --h1: 34px;
    --h2: 26px;
    --h3: 20px;
    --h4: 18px;
    --h5: 16px;
    --h6: 12px;
    --body: 16px;
    --lh-body: 1.65;
    --space-5: 28px;
  }

  /* Moins d’espace au-dessus des titres sur mobile */
  h2:not(:first-child),
  h3:not(:first-child),
  h4:not(:first-child){
    margin-top: var(--space-4);
  }
}
/* =========================================
   HOME (Ap PageBuilder / Leo) – TYPO FORCÉE
   Ajoute ce bloc tout en bas de ton CSS
   ========================================= */

/* Forcer la police texte dans les zones ApPageBuilder */
body .appagebuilder,
body .appagebuilder *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
  font-family: var(--brut-text) !important;
}

/* Forcer la police titres dans les zones ApPageBuilder */
body .appagebuilder h1,
body .appagebuilder h2,
body .appagebuilder h3,
body .appagebuilder h4,
body .appagebuilder h5,
body .appagebuilder h6,
body .appagebuilder .ApColumn h1,
body .appagebuilder .ApColumn h2,
body .appagebuilder .ApColumn h3,
body .appagebuilder .ApColumn h4,
body .appagebuilder .ApColumn h5,
body .appagebuilder .ApColumn h6,
body .appagebuilder [class*="title"],
body .appagebuilder [class*="heading"] {
  font-family: var(--brut-title) !important;
  color: var(--brut-black) !important;
  line-height: var(--lh-title) !important;
}

/* Tailles des titres sur la home (mêmes valeurs que le site) */
body .appagebuilder h1 { font-size: var(--h1) !important; }
body .appagebuilder h2 { font-size: var(--h2) !important; }
body .appagebuilder h3 { font-size: var(--h3) !important; }
body .appagebuilder h4 { font-size: var(--h4) !important; }
body .appagebuilder h5 { font-size: var(--h5) !important; }
body .appagebuilder h6 { font-size: var(--h6) !important; }

/* Rythme premium dans les blocs (espaces plus propres) */
body .appagebuilder p { margin-bottom: var(--space-3) !important; }
body .appagebuilder h2:not(:first-child),
body .appagebuilder h3:not(:first-child),
body .appagebuilder h4:not(:first-child) {
  margin-top: var(--space-5) !important;
}

/* Mobile: éviter des titres trop gros dans certains blocs de home */
@media (max-width: 576px){
  body .appagebuilder h1 { font-size: var(--h1) !important; }
  body .appagebuilder h2 { font-size: var(--h2) !important; }
}
/* ================================
   CATÉGORIES : enlever la colonne
   (version SAFE pour Leo/PS 1.7)
   ================================ */

body.page-category #left-column,
body.page-category #right-column,
#category #left-column,
#category #right-column {
  display: none !important;
}

body.page-category #content-wrapper,
body.page-category #center_column,
body.page-category #content,
#category #content-wrapper,
#category #center_column,
#category #content {
  width: 100% !important;
  max-width: 100% !important;
}

body.page-category #columns,
#category #columns {
  width: 100% !important;
}

body.page-category #columns .row #content-wrapper,
#category #columns .row #content-wrapper {
  flex: 0 0 100% !important;
  max-width: 100% !important;
}

body.page-category .product-thumbnail img,
#category .product-thumbnail img {
  width: 100% !important;
  height: auto !important;
  transform: scale(1.08);
  transition: transform .3s ease;
}

body.page-category .product-thumbnail:hover img {
  transform: scale(1.12);
}
/* ================================
   BREADCRUMB -> MENU CUIVRE (toujours visible)
   ================================ */

body.page-category .breadcrumb,
#category .breadcrumb {
  margin-bottom: 14px !important;
}

/* Dernier niveau (catégorie actuelle) en cuivre permanent */
body.page-category .breadcrumb li:last-child,
#category .breadcrumb li:last-child {
  color: #b87333 !important;
  text-shadow: 0 0 6px rgba(184,115,51,.35) !important;
  font-weight: 600 !important;
}

/* liens breadcrumb (Accueil / catégories parentes) */
body.page-category .breadcrumb a,
#category .breadcrumb a {
  color: #b87333 !important;
  text-shadow: 0 0 6px rgba(184,115,51,.25) !important;
  font-weight: 500 !important;
}
/* ================================
   MENU CATEGORIES HORIZONTAL (Sous-catégories)
   ================================ */

/* Force l’affichage du bloc sous-catégories si le thème le masque */
body.page-category .subcategories,
#category .subcategories,
body.page-category #subcategories,
#category #subcategories {
  display: block !important;
  margin: 12px 0 18px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* Liste en horizontal */
body.page-category .subcategories ul,
#category .subcategories ul,
body.page-category #subcategories ul,
#category #subcategories ul {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center !important;
}

/* Items */
body.page-category .subcategories li,
#category .subcategories li,
body.page-category #subcategories li,
#category #subcategories li {
  margin: 0 !important;
  padding: 0 !important;
}

/* Liens : cuivre permanent (comme ton ancien style vertical premium) */
body.page-category .subcategories a,
#category .subcategories a,
body.page-category #subcategories a,
#category #subcategories a {
  color: #b87333 !important;
  text-shadow: 0 0 6px rgba(184,115,51,.35) !important;
  font-weight: 500 !important;
  padding: 7px 12px !important;
  border: 1px solid rgba(184,115,51,.35) !important;
  border-radius: 999px !important;
  background: #fff !important;
  display: inline-flex !important;
  transition: all .2s ease !important;
}

/* Hover : glow cuivre */
body.page-category .subcategories a:hover,
#category .subcategories a:hover,
body.page-category #subcategories a:hover,
#category #subcategories a:hover {
  border-color: #b87333 !important;
  box-shadow: 0 0 10px rgba(184,115,51,.35) !important;
}
======================================
   SUPPRIMER IMAGES DES SOUS-CATÉGORIES
   (garde uniquement le texte)
   ====================================== */

/* Cache toutes les images / wrappers d’images */
body.page-category .subcategories img,
#category .subcategories img,
body.page-category #subcategories img,
#category #subcategories img,
body.page-category .subcategories .subcategory-image,
#category .subcategories .subcategory-image,
body.page-category #subcategories .subcategory-image,
#category #subcategories .subcategory-image {
  display: none !important;
}

/* Supprime la place réservée aux images */
body.page-category .subcategories li,
#category .subcategories li,
body.page-category #subcategories li,
#category #subcategories li {
  padding: 0 !important;
  margin: 0 !important;
}

/* Cas LeoTheme : certains thèmes gardent un bloc vide */
body.page-category .subcategory-thumbnail,
body.page-category .subcategory-image,
#category .subcategory-thumbnail,
#category .subcategory-image {
  display: none !important;
}
/* 
/* ======================================
   SOUS-CATÉGORIES : TITRES EN ENTIER + PAS DE TEXTE DESSOUS
   ====================================== */

/* 1) Titre EN ENTIER (pas de "...") */
body.page-category #subcategories .subcategory-name,
body.page-category #subcategories .subcategory-name a,
body.page-category #subcategories h3,
body.page-category #subcategories h3 a,
body.page-category .subcategories .subcategory-name,
body.page-category .subcategories .subcategory-name a,
body.page-category .subcategories h3,
body.page-category .subcategories h3 a,
#category #subcategories .subcategory-name,
#category #subcategories .subcategory-name a,
#category #subcategories h3,
#category #subcategories h3 a,
#category .subcategories .subcategory-name,
#category .subcategories .subcategory-name a,
#category .subcategories h3,
#category .subcategories h3 a {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  max-width: none !important;
  width: auto !important;

  /* annule les clamps Leo/Bootstrap */
  display: inline !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
}

/* 2) Supprimer le texte/description sous les sous-catégories */
body.page-category #subcategories .subcategory-desc,
body.page-category #subcategories .subcategory-description,
body.page-category #subcategories .cat_desc,
body.page-category #subcategories p,
body.page-category .subcategories .subcategory-desc,
body.page-category .subcategories .subcategory-description,
body.page-category .subcategories .cat_desc,
body.page-category .subcategories p,
#category #subcategories .subcategory-desc,
#category #subcategories .subcategory-description,
#category #subcategories .cat_desc,
#category #subcategories p,
#category .subcategories .subcategory-desc,
#category .subcategories .subcategory-description,
#category .subcategories .cat_desc,
#category .subcategories p {
  display: none !important;
}

/* 3) (Optionnel) éviter qu'un bloc vide garde une marge */
body.page-category #subcategories li,
body.page-category .subcategories li,
#category #subcategories li,
#category .subcategories li {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}