@import "icomoon/style.css";

/* La bande bleue est le conteneur de positionnement */
#footer-container-first .footer-newsletter-bg-full{ position: relative; }

/* Slot à droite de la bande bleue */
#ag-widget-footer{
  position: absolute;
  right: 32px;
  top: 24px;
  width: 130px;   /* ajuste si besoin */
}

/* Mobile : badge centré sous le formulaire */
@media (max-width: 991.98px){
  #ag-widget-footer{
    position: static;
    margin-top: 16px;
    width: 100%;
    display: flex;
    justify-content: center;
  }
}

/* Si le script force un "position:fixed" sur son conteneur, on le neutralise
   UNIQUEMENT quand il est dans #ag-widget-footer */
#ag-widget-footer [style*="position:fixed"],
#ag-widget-footer .ag-floating,
#ag-widget-footer .ag-float{
  position: static !important;
  left:auto !important; right:auto !important; top:auto !important; bottom:auto !important;
  z-index:auto !important; transform:none !important;
}



/* 1) Empêche tout débordement horizontal */
@media (max-width: 767.98px){
  html, body, #wrapper{ overflow-x:hidden; }
}

body#product .product_header_container .page-title {
  text-transform: uppercase;
	font-size: 34px !important; /* Taille de police à 28px */
  font-weight: 900 !important; /* Graisse à 900 */
	padding-right: 20px;
}

/* --- PRODUIT --- */
.thumbnail-container {
  position: relative;
}

.product-old-price-top {
  position: absolute;
  top: 40px;
  left: 10px;
  font-size: 0.75rem;
  color: #999;
  z-index: 2;
  background: white;
  padding: 2px 4px;
  border-radius: 3px;
}

.product-old-price-top .regular-price {
  text-decoration: line-through;
  margin-left: 4px;
}

.product-miniature {
  min-height: 390px;
}



/* --- SWIPER SLIDER ARROWS --- */
.elementor-swiper-button i,
.elementor-swiper-button svg,
.elementor-swiper-button::after {
  display: none !important;
}

.elementor-swiper-button {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 2px solid #264aa5;
  background-color: #fff;
  display: flex !important;
  justify-content: center;
  align-items: center;
  transition: all 0.3s ease;
  z-index: 5;
  position: absolute !important;
  top: 100%;
  margin-top: 24px;
}
.products.elementor-products-carousel {
  position: relative;
}

.elementor-swiper-button-prev {
  left: 0;
}

.elementor-swiper-button-next {
  left: 54px;
}

.elementor-swiper-button-prev::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #264aa5;
  border-left: 2px solid #264aa5;
  transform: rotate(-45deg);
}

.elementor-swiper-button-next::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #264aa5;
  border-right: 2px solid #264aa5;
  transform: rotate(45deg);
}

.elementor-swiper-button:hover {
  background-color: #264aa5;
}

.elementor-swiper-button:hover::before {
  border-color: #fff;
}


@media (min-width: 1024px) {
  /* Force .news-head en flex pour aligner le titre et les flèches côte à côte */
  .elementor-element-qifkg9i .news-head {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important; /* Alignement à gauche pour garder les flèches près du titre */
    gap: 12px; /* Réduit l'écart entre le titre et les flèches */
  }

  /* Annule le positionnement absolu des flèches pour qu'elles restent inline avec le titre */
  .elementor-element-qifkg9i .news-head .elementor-swiper-button {
    position: static !important;
    top: auto !important;
    margin-top: 0 !important;
    transform: translateY(0) !important; /* Garde l'ajustement vertical si besoin */
  }

  /* Bloc des flèches : flex pour les aligner horizontalement */
  .elementor-element-qifkg9i .news-head-nav {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important; /* Espace réduit entre prev et next */
    margin-left: 10px !important; /* Espace léger entre le titre et les flèches */
  }

  /* S'assure que les flèches ne débordent pas et restent visibles */
  .elementor-element-qifkg9i .news-head-nav .elementor-swiper-button {
    width: 44px !important;
    height: 44px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }
}

/* Mobile : ajustements fins (conserver le comportement existant) */
@media (max-width: 767px) {
  .elementor-element-qifkg9i .news-head {
    justify-content: center !important; /* Centre si nécessaire */
  }

  .elementor-element-qifkg9i .news-head-nav {
    gap: 8px !important; /* Espace entre flèches pour mobile */
  }

  .elementor-element-qifkg9i .news-head .elementor-swiper-button {
    width: 40px !important; /* Légèrement plus petit sur mobile */
    height: 40px !important;
  }
}

/* Masque la flèche d'origine si besoin, sinon garde ton CSS précédent */

/* Bouton TOUT VOIR — plus haut, moins large */
.slider-see-all-btn{
  position:absolute;
  top:calc(100% + 32px);
  left:116px;

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

  height:44px;                 /* +haut */
  padding:0 18px;              /* -large (était 10px 34px) */
  white-space:nowrap;          /* évite le retour à la ligne */

  background:#265BA6;
  color:#fff !important;
  border:none;
  border-radius:9999px;        /* pastille propre */
  font-size:13px;              /* un poil plus compact */
  font-weight:600;
  text-decoration:none !important;
  box-shadow:0 2px 12px rgba(40,88,166,.08);
  transition:background .2s;
  z-index:6;
  margin-top:0;
}

/* Hover (option) */
.slider-see-all-btn:hover{ background:#FF7234; }

@media (max-width: 700px) {
  .slider-see-all-btn {
    position: static;
    display: block;
    margin: 32px auto 0 auto;
    width: 90vw;
    max-width: 360px;
    text-align: center;
  }
}


/* Assure que le parent a position: relative */
.products.elementor-products-carousel {
  position: relative !important;
}

/* Responsive : en dessous des flèches sur mobile */
@media (max-width: 700px) {
  .slider-see-all-btn {
    left: 0;
    right: 0;
    margin: 80px auto 0 auto;
    width: 90vw;
    max-width: 360px;
    display: block;
    text-align: center;
  }
}


/* --- HEADER : Langue + Devise --- */
#_desktop_language_selector {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 6px;
  min-height: 60px;
  text-align: right;
}
#_desktop_language_selector .language-selector {
  margin-right: 17px; /* ou ajuste cette valeur */
	margin-left: 17px; /* ou ajuste cette valeur */
}


.language-selector,
.currency-selector {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  line-height: 1;
}


.col-header-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.language-selector {
  position: relative;
  cursor: pointer;
}

.language-list {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  z-index: 999;
  padding: 0.5rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.language-selector:hover .language-list {
  display: block;
}

.language-list li {
  margin-bottom: 0.25rem;
}

.language-list li:last-child {
  margin-bottom: 0;
}

.language-selector .language-list a {
  padding: 0.5rem 1rem;
  transition: background 0.2s;
  border-radius: 4px;
}

.language-selector .language-list a:hover {
  background-color: #f1f1f1;
  color: #000;
  text-decoration: none;
}


@font-face {
  font-family: 'DK Dirrrty';
  src: url('/themes/warehousechild/assets/fonts/DK_Dirrrty.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* Style pour le conteneur du slogan */
.header-slogan-text {
  font-family: 'DK Dirrrty', sans-serif;
  font-size: 20px;
  color: #FF7234; /* Couleur orange */
  font-weight: normal;
  line-height: 1.35; /* Maintien du rendu existant */
  white-space: nowrap;
}

/* Style pour le lien dans header-slogan-text */
.header-slogan-text a {
  color: #FF7234 !important; /* Force la couleur orange pour le lien */
  text-decoration: none !important; /* Supprime le soulignement */
  display: inline-block; /* Respecte white-space: nowrap */
}

/* Style pour le hover du lien */
.header-slogan-text a:hover {
  color: #255BA6 !important; /* Bleu au survol */
  text-decoration: none !important; /* Pas de soulignement au survol */
}

/* === HOME UNIQUEMENT : affichage articles Blog Home === */
:is(.page-index, body#index, body.page-home) .blogcard-img-wrapper {
  position: relative;
  width: 100%;
  height: 320px; /* Fixe sur desktop */
  max-width: 100%;
  border-radius: 10px;
  overflow: hidden;
  background: #f0f0f0;
  display: block;
}

:is(.page-index, body#index, body.page-home) .blogcard-img-wrapper img.img-fluid.photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
  z-index: 1;
}

:is(.page-index, body#index, body.page-home) .blogcard-overlay-content {
  position: absolute;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
  z-index: 2;
  background: rgba(255,255,255,0.94);
  border-radius: 5px;
  padding: 22px 26px 18px 26px;
  min-width: 220px;
  max-width: 93%;
  width: 430px;
  box-shadow: 0 8px 32px 0 rgba(0,0,0,0.07);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

:is(.page-index, body#index, body.page-home) .blogcard-overlay-content h3 {
  font-size: 1.18rem;
  font-weight: bold;
  color: #151a1e;
  margin-bottom: 12px;
  margin-top: 0;
  line-height: 1.21;
}

:is(.page-index, body#index, body.page-home) .blogcard-overlay-content p {
  color: #232323;
  font-size: 1rem;
  margin-bottom: 0;
  line-height: 1.3;
}

:is(.page-index, body#index, body.page-home) .blogcard-readmore {
  margin-top: 13px;
  margin-left: auto;
  font-weight: bold;
  color: #265BA6;
  text-decoration: underline;
  font-size: 1rem;
  transition: color 0.18s;
}

:is(.page-index, body#index, body.page-home) .blogcard-readmore:hover {
  color: #FF7234;
}

/* === HOME BLOG UNIQUEMENT : styles responsive === */
@media (max-width: 1023px) {
  :is(.page-index, body#index, body.page-home) .blogcard-img-wrapper {
    height: 220px; /* Hauteur réduite sur mobile */
  }

  :is(.page-index, body#index, body.page-home) .blogcard-overlay-content {
    width: 90vw;            /* 90% de l'écran */
    max-width: 300px;       /* limite max */
    min-width: 0;           /* autorise le rétrécissement */
    padding: 15px 20px 12px 20px;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
  }

  :is(.page-index, body#index, body.page-home) .blogcard-overlay-content h3 {
    font-size: 1rem;
  }

  :is(.page-index, body#index, body.page-home) .blogcard-overlay-content p {
    font-size: 0.95rem;
  }

  /* Empilement des blocs sur mobile (home uniquement) */
  :is(.page-index, body#index, body.page-home) .blog-container .blogcard-img-wrapper {
    width: 100% !important;
    margin-bottom: 20px !important;
  }
}

/* === HOME UNIQUEMENT : grille des cartes === */
:is(.page-index, body#index, body.page-home) .blog-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

@media (min-width: 1024px) {
  :is(.page-index, body#index, body.page-home) .blog-container .blogcard-img-wrapper {
    width: 33.33%; /* 3 blocs côte à côte sur desktop */
  }
}

/* HOME — limiter la description à 2 lignes dans la cartouche */
:is(.page-index, body#index, body.page-home)
.blogcard-overlay-content p[itemprop="description"].d-inline{
  /* on remplace l'inline par une boîte multi-ligne clampable */
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;          /* ✂️ max 2 lignes */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;             /* autorise les retours à la ligne */
  line-height: 1.3;                /* garde la densité de texte */
  max-height: calc(2 * 1.3em);     /* petit fallback si le clamp n'est pas supporté */
}

/* (optionnel) s'assurer que le lien reste en bas à droite de la cartouche */
:is(.page-index, body#index, body.page-home) .blogcard-overlay-content{
  display:flex; flex-direction:column;
}
:is(.page-index, body#index, body.page-home) .blogcard-readmore{
  margin-top: 13px; margin-left:auto;
}

/* === BLOG LISTING force grid quand la classe est présente === */
.blog-grid-on{
  display: grid !important;
  grid-template-columns: 1fr;     /* mobile */
  gap: 28px;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* 2 colonnes ≥768px */
@media (min-width: 768px){
  .blog-grid-on{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* 3 colonnes ≥1200px (enlève ce bloc si tu veux rester en 2 colonnes) */
@media (min-width: 1200px){
  .blog-grid-on{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}

/* Les items ne forcent jamais 100% */
.blog-grid-on > .blog-grid-item{
  width: auto !important;
  max-width: none !important;
  flex: initial !important;
  padding: 0 !important; /* on laisse le gap gérer l'espacement */
}
/* ================================
   PAGE BLOG UNIQUEMENT — Cartes blog
   (mêmes styles que home, adaptés à la grille 3 colonnes)
   Couvre Presta 1.7 / Warehouse
   ================================ */

:is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-img-wrapper{
  position: relative;
  width: 100%;
  height: 280px;                 /* un peu plus compact que la home (320px) */
  max-width: 100%;
  border-radius: 18px;
  overflow: hidden;
  background: #f0f0f0;
  display: block;
}

:is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-img-wrapper img.img-fluid.photo{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
  z-index: 1;
  display: block;
}

:is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-overlay-content{
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  z-index: 2;

  background: rgba(255,255,255,0.90);
  border-radius: 5px;
  padding: 18px 22px 14px 22px;

  /* largeur “cartouche” contrôlée (un peu plus étroite qu’en home) */
  width: clamp(220px, 88%, 380px);
  max-width: calc(100% - 36px); /* marge visuelle de 18px de chaque côté */
  min-width: 220px;

  box-shadow: 0 8px 32px 0 rgba(0,0,0,0.07);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

/* Titres / texte identiques à la home (légers ajustements) */
:is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-overlay-content h3{
  font-size: 1.08rem;
  font-weight: bold;
  color: #151a1e;
  margin: 0 0 10px 0;
  line-height: 1.22;
}

:is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-overlay-content p{
  color: #232323;
  font-size: 0.98rem;
  margin: 0;
  line-height: 1.3;
}

/* Lien “Lire la suite” comme en home */
:is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-readmore{
  margin-top: 12px;
  margin-left: auto;
  font-weight: bold;
  color: #255BA6;
  text-decoration: underline;
  font-size: 0.98rem;
  transition: color .18s;
}
:is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-readmore:hover{
  color: #ff7234;
}

/* Clamp description à 2 lignes (le <p> est “d-inline” dans ton TPL) */
:is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list)
.blogcard-overlay-content p[itemprop="description"].d-inline{
  display: -webkit-box !important;   /* remplace l'inline pour autoriser le clamp */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;             /* ✂️ max 2 lignes */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  line-height: 1.3;
  max-height: calc(2 * 1.3em);       /* fallback */
}

/* ================================
   Responsive
   ================================ */
@media (max-width: 1023px){
  :is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-img-wrapper{
    height: 220px;
  }
  :is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-overlay-content{
    width: clamp(220px, 90vw, 340px);
    padding: 14px 18px 12px 18px;
    bottom: 14px;
  }
  :is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-overlay-content h3{
    font-size: 1rem;
  }
  :is(.page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list) .blogcard-overlay-content p{
    font-size: .95rem;
  }
}

/* ================================
   NEWSLETTER FULL-BLEED (desktop + mobile)
   Scopé : n'affecte QUE le bloc newsletter
================================== */

#footer-container-main,
#checkout-footer {

    margin-top: 30px;
}

/* Section fond pleine largeur */
.footer-newsletter-bg-full{
  position: relative;
  background: url('/img/cms/imgi_112_footer_skioccas.png') no-repeat center center !important;
  background-size: cover !important;

  /* vrai plein écran même dans un .container */
  width: 100vw !important;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  max-width: none !important;

  padding: clamp(22px, 6vw, 48px) 0;
  z-index: 1;
  overflow: hidden; /* évite le scroll horizontal parasite */
}

/* Colonne contenu */
.footer-newsletter-bg-full .block-newsletter.newsletter-left{
  max-width: 680px;
  margin-left: 0;
  margin-right: auto;
  padding: 0 24px;   /* évite le texte collé au bord */
  background: transparent;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Titres/texte */
.footer-newsletter-bg-full .footer-newsletter-title{
  font-family:'DK Dirrrty', sans-serif;
  font-size: clamp(30px, 4.2vw, 30px);
  color:#FF7234;


  letter-spacing:1px;
  line-height:1.1;
  margin:0 0 10px;
  text-align:left;
}
.footer-newsletter-bg-full .footer-newsletter-desc{
  font-family:'Poppins', Arial, sans-serif;
  font-size: clamp(15px, 2.6vw, 14px);
  color:#fff;
  line-height:1.5;
  margin:0 0 20px;
  text-align:left;
}

/* Formulaire : en ligne puis empilé en mobile */
.footer-newsletter-bg-full .newsletter-input-group,
.footer-newsletter-bg-full .input-group{
  display:flex;
  align-items:stretch;
  gap:12px;
  flex-wrap:nowrap;
}
.footer-newsletter-bg-full .block-newsletter input[type="email"],
.footer-newsletter-bg-full .block-newsletter input[type="text"],
.footer-newsletter-bg-full .newsletter-input-group .form-control,
.footer-newsletter-bg-full .input-group .form-control{
  flex:1 1 auto;
  min-width:0;
  height:44px;
  border:none;
  border-radius:30px;
  padding:0 24px;
  font-size:18px;           /* ≥16px : évite le zoom iOS */
  background:#fff;
  color:#333;
  box-shadow:0 2px 12px rgba(0,0,0,.09);
}
.footer-newsletter-bg-full .block-newsletter ::placeholder{
  color:#aaa;
  opacity:1;
  font-size:17px;
  font-family:'Poppins', Arial, sans-serif;
}
.footer-newsletter-bg-full .block-newsletter button[type="submit"],
.footer-newsletter-bg-full .block-newsletter .btn-primary{
  height:44px;
  border-radius:50px;
  background:#265BA6;
  color:#fff;
  font-weight:700;
  font-size:13px;
  letter-spacing:.03em;
  text-transform:uppercase;
  padding:0 30px;
  min-width:155px;
  box-shadow:0 4px 18px rgba(41,98,255,.15);
  transition:background .18s;
  white-space:nowrap;
}
.footer-newsletter-bg-full .block-newsletter button[type="submit"]:hover,
.footer-newsletter-bg-full .block-newsletter .btn-primary:hover{
  background:#FF7234;
}

/* Harmonisation wrappers Bootstrap éventuels (scopé) */
.footer-newsletter-bg-full .input-group-append,
.footer-newsletter-bg-full .newsletter-input-group .input-group-append{
  display:flex;
  align-items:center;
}

/* Responsive */
@media (max-width:991px){
  .footer-newsletter-bg-full .block-newsletter.newsletter-left{ padding: 0 20px; }
}
@media (max-width:575px){
  .footer-newsletter-bg-full .newsletter-input-group,
  .footer-newsletter-bg-full .input-group{
    flex-direction:column;
    gap:10px;
    align-items:stretch;
  }
  .footer-newsletter-bg-full .block-newsletter input[type="email"],
  .footer-newsletter-bg-full .block-newsletter input[type="text"],
  .footer-newsletter-bg-full .block-newsletter button[type="submit"],
  .footer-newsletter-bg-full .block-newsletter .btn-primary{
    width:100%;
    min-width:0;
    margin:0;
  }
  .footer-newsletter-bg-full .block-newsletter.newsletter-left{ padding: 0 16px; }
}

/* Masque le doublon du module (scopé par sécurité) */
.footer-newsletter-bg-full .ps-emailsubscription-conditions{ display:none; }


/* masque le doublon du module */
.ps-emailsubscription-conditions{display:none}

footer .ps-emailsubscription-block .newsletter-input-group .btn-subscribe,
#checkout-footer .ps-emailsubscription-block .newsletter-input-group .btn-subscribe {
    color: #fff !important;
}


/* Badge rond plus petit et texte gras */
.product-discount-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: #FF6A28;
  color: white;
  font-size: 0.9rem;
  font-weight: bold;
  border-radius: 50%;
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

/* Alignement du prix barré + prix final */
.product-price-and-shipping {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

.product-price-line {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.product-old-price-bottom {
  font-size: 1rem;
  color: #888;
  display: flex;
  align-items: center;
  gap: 4px;
}

.product-old-price-bottom .regular-price {
  color: #999;
  text-decoration: line-through;
}

/* Ajout de padding haut image */
.thumbnail-container .product-thumbnail {
  padding-top: 20px;
}

.elementor-widget-banner .elementor-iqit-banner {

    border-radius: 10px;
}
.elementor-iqit-banner .elementor-iqit-banner-title {

    padding-left: 0px;
}

.elementor-button.elementor-size-medium {
  position: absolute;
  bottom: 20px; /* depuis le bas du bloc */
  left: 20px;
padding: 15px 30px;
}


/* Footer Desktop & Mobile sous NL */
.footer-brand-block .follow-us {
  font-family: 'DK Dirrrty', sans-serif;
  font-size: 20px;
  color: #f15a29; /* Orange utilisé actuellement */
  text-transform: uppercase;
  letter-spacing: 1px;
}


.footer-logo {
  max-width: 160px;
  margin-bottom: 20px;
}

.footer-social-block {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 15px 0;
}

.footer-social-block .follow-us {
  font-family: 'DK Dirrrty', sans-serif;
  color: #f55a2c;
	font-size: 20px;

  margin: 0;
}

.footer-social-line {
  flex-grow: 1;
  height: 1px;
  background: #265ba6;
}

.footer-social-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #265ba6;
  color: #265ba6;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  text-decoration: none;
  font-size: 14px;
  transition: all 0.3s ease; /* pour un effet plus fluide */
}

.footer-social-icon:hover {
  color: #ff7234;      /* couleur de l’icône */
  border-color: #ff7234; /* si tu veux aussi changer la bordure */
}


.footer-payment-icons img {
  height: 32px;
  margin-right: 8px;
}

/* --- Colonne droite --- */
/* Bloc besoin d’aide */
.footer-support-box {
  border: 2px solid #265BA6;
  border-radius: 8px;
  padding: 15px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 320px;
  margin: 0 auto 30px auto;
}

.footer-support-box .support-icon {
  font-size: 30px;
  color: #f26522;
}

.footer-support-box .support-text {
  font-size: 14px;
}

.footer-support-box .support-text a {
  color: #265BA6;
  text-decoration: none;
  font-weight: 500;
}


/* Bloc FAQ */
.footer-faq-box {
  text-align: center;
  max-width: 320px;
  margin: 0 auto;
}

.footer-faq-box .footer-faq-title {
  font-weight: 700;
  font-size: 15px;
  margin-bottom: 10px;
}

.footer-faq-box .footer-faq-btn {
  display: inline-block;
  padding: 12px 60px;
  font-weight: bold;
  font-size: 16px;
  color: #fff !important; /* Texte blanc forçé */
  background-color: #265BA6;
  border-radius: 40px;
  text-decoration: none;
  transition: background 0.3s;
  text-align: center;
}

.footer-faq-box .footer-faq-btn:hover {
  background-color: #1f4c91;
}



/* Structure en flex pour forcer l’ordre */
.footer-container .row {
  display: flex;
  flex-wrap: wrap;
}

/* Remettre l’ordre normal à tous */
.footer-container .row > .col {
  order: 2;
}

/* Custom bloc gauche → premier */
#iqithtmlandbanners-block-2 {
  order: 0;
}

/* Contact → deuxième */
.block-iqitlinksmanager {
  order: 1;
}

/* Services → troisième */
.block-iqitcontactpage {
  order: 2;
}

/* Custom bloc aide/FAQ → dernier */
#iqithtmlandbanners-block-3 {
  order: 3;
}
/* Desktop seulement : on peut masquer */
@media (min-width: 769px){
  #iqithtmlandbanners-block-2 .block-title,
  #iqithtmlandbanners-block-3 .block-title { display:none; }
}

/* ===== Footer mobile (≤768px) — version clean ===== */
@media (max-width:768px){

  /* === Bloc 1 : Logo + social + paiements === */
  #footer-container-main #iqithtmlandbanners-block-2 .block-title{
    display:none !important; /* on masque le titre */
  }
  #footer-container-main #iqithtmlandbanners-block-2 .block-content{
    text-align:center; /* centrage global du contenu */
  }
  #footer-container-main #iqithtmlandbanners-block-2 .footer-logo{
    display:inline-block;
    max-width:220px;
    width:80%;
    height:auto;
    margin:0 auto 14px;
  }
  #footer-container-main #iqithtmlandbanners-block-2 .footer-social-block{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    margin:10px 0 14px;
    flex-wrap:wrap;
  }
  #footer-container-main #iqithtmlandbanners-block-2 .footer-social-line{
    flex:0 1 32%;
    max-width:160px;
    height:2px;
    background:#ccc;
  }
  #footer-container-main #iqithtmlandbanners-block-2 .footer-social-icon{
    width:36px;
    height:36px;
    font-size:16px;
  }
@media (max-width: 768px){
  /* Centre le bloc d’icônes de paiement */
  #footer-container-main #iqithtmlandbanners-block-2 .footer-payment-icons{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 8px 0;
    gap: 0;               /* pas d’espace parasite */
    font-size: 0;         /* neutralise le &nbsp; après l’image */
  }

  /* Image responsive et centrée (fallback si flex est écrasé) */
  #footer-container-main #iqithtmlandbanners-block-2 .footer-payment-icons img{
    height: 32px;
    width: auto;
    max-width: 100%;
    display: block;
    margin: 0 auto;       /* au cas où le parent ne serait plus en flex */
  }
}


  /* === Blocs 2 & 3 : collapse natif Warehouse === */
  /* On garde le chevron du thème → on supprime tout ajout custom */
  #footer-container-main .block-iqitlinksmanager .block-title::after{
    content:none !important;
    background:none !important;
    -webkit-mask:none !important;
            mask:none !important;
  }
  /* Zone de clic confortable, sans bordure doublon */
  #footer-container-main .block-iqitlinksmanager .block-title{
    padding:16px 4px;
    margin:0;
    border:0 !important;
    display:flex;
    align-items:center;
    justify-content:space-between;
    text-transform:uppercase;
    font-weight:800;
    letter-spacing:.2px;
  }
  /* Séparateurs propres */
 /*  #footer-container-main .block-iqitlinksmanager{
    border-top:1px solid #eaeaea;
  }
  #footer-container-main .block-iqitlinksmanager:last-of-type{
    border-bottom:1px solid #eaeaea;
  }
  /* Contenu interne : marges cohérentes */
  #footer-container-main .block-iqitlinksmanager .block-content{
    padding:6px 0 14px 0;
  }

  /* === Bloc 4 : FAQ / Contact toujours visible === */
  #footer-container-main #iqithtmlandbanners-block-3 .block-title{
    display:none !important;
  }
  #footer-container-main #iqithtmlandbanners-block-3 .block-content{
    display:block !important;
    height:auto !important;
    visibility:visible !important;
    opacity:1 !important;
  }
  #footer-container-main .footer-faq-col,
  #footer-container-main .footer-questions-box{
    display:flex;
    flex-direction:column;
    align-items:center;
  }
  #footer-container-main .footer-btn{
    width:95vw;
    max-width:520px;
    margin-left:auto;
    margin-right:auto;
  }
}

/* Toujours afficher le contenu du bloc 1 (logo) */
#footer-container-main #iqithtmlandbanners-block-2 .block-content{
  display:block !important;
  height:auto !important;
}


/* Structure parent centré */
.footer-faq-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

/* Titre centré */
.footer-questions-title {
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: 16px;
  letter-spacing: -1px;
  font-family: inherit;
  text-align: center;
}

/* Conteneur boutons centré */
.footer-questions-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

/* Boutons */
.footer-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 210px;
  margin: 0 auto 16px auto;
  border-radius: 30px;
  font-size: 1rem;
  font-weight: bold;
  text-align: center;
  transition: 0.16s;
  text-decoration: none !important;
  padding: 0;
  height: 44px;
  border: none;
  outline: none;
  box-sizing: border-box;
  cursor: pointer;
  letter-spacing: 0;
}

/* FAQ */
.footer-btn-faq {
  background: #2858A6;
  color: #fff !important;
  border: none;
  margin-bottom: 12px;
}
.footer-faq-title {
  font-size: 1.23rem;          /* Taille de police (augmente/diminue à ta guise) */
  font-weight: 700;         /* Bien bold, change 700→900 selon rendu voulu */
  color: #000000;           /* Rappelle la couleur du bouton FAQ */
  letter-spacing: -0.5px;
  margin-bottom: 24px;
  text-align: center;
  font-family: inherit;     /* Ou ta police spécifique si besoin */
  line-height: 1.2;
  text-transform: uppercase; /* Optionnel si tu veux TOUT EN MAJUSCULE */
}

.footer-btn-faq:hover {
  background: #FF7234;
}

/* Contact */
.footer-btn-contact {
  background: #fff;
  color: #23272F !important;
  border: 2px solid #2858A6;
  position: relative;
}
.footer-btn-contact:hover {
  border-color: #FF7234;
  background: #ffffff;
}

/* Icône dans le bouton contact */
.footer-btn-icon {
  display: flex;
  align-items: center;
  margin-right: 12px;
  width: 22px;
  height: 22px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%23FF7234" fill-rule="evenodd" d="M12 3.75c-3.241 0-5.756 2.03-6.185 4.5H8a.75.75 0 0 1 .75.75v7a.75.75 0 0 1-.75.75H5A2.75 2.75 0 0 1 2.25 14v-3a2.75 2.75 0 0 1 2.035-2.656C4.667 4.84 8.074 2.25 12 2.25s7.333 2.59 7.715 6.094A2.75 2.75 0 0 1 21.75 11v3a2.75 2.75 0 0 1-2.045 2.659A4.75 4.75 0 0 1 15 20.75h-1.145a2 2 0 1 1 0-1.5H15a3.25 3.25 0 0 0 3.163-2.5H16a.75.75 0 0 1-.75-.75V9a.75.75 0 0 1 .75-.75h2.185c-.429-2.47-2.944-4.5-6.185-4.5m-7 6c-.69 0-1.25.56-1.25 1.25v3c0 .69.56 1.25 1.25 1.25h2.25v-5.5zM20.25 11c0-.69-.56-1.25-1.25-1.25h-2.25v5.5H19c.69 0 1.25-.56 1.25-1.25z" clip-rule="evenodd"/></svg>') no-repeat center/contain;
}



/* Responsive */
@media (max-width: 600px) {
  .footer-btn {
    width: 95vw;
    min-width: 0;
    height: 48px;
    font-size: 1rem;
    border-radius: 28px;
  }
  .footer-btn-contact .footer-btn-icon svg {
    height: 22px;
    width: 22px;
    margin-right: 10px;
  }
}

/* Blog à Propos Home */  
.about-bloc-white {
  background: #fff;
  padding: 30px 30px;
  border-radius: 12px;
  box-shadow: 0 5px 20px rgba(0,0,0,0.08);
  max-width: 520px;
  margin-left: 60px; /* Décalage gauche sur desktop */
  margin-top: 60px;
  margin-bottom: 60px;
}

.about-bloc-white h3 {
  margin: 0 0 15px 0;
    font-size: 28px;
	    font-weight: 900;

}

.about-bloc-white p {
  margin-bottom: 25px;
}

.about-btn {
  display: inline-block;
  font-size: 13px;
  background: #265BA6;
  color: #fff !important;
  border-radius: 30px;
  padding: 15px 30px;
  font-weight: 600;
  border: 2px solid #fff;
  transition: all 0.3s;
  text-decoration: none;
}

.about-btn:hover {
  background: #FF7234;
  color: #fff !important;
}

/* Ajustements pour mobile */
@media (max-width: 767px) {
  .about-bloc-white {
    margin-left: 0; /* Supprime le décalage gauche */
    margin-right: 0;
    margin: 30px auto; /* Centre le bloc avec marges automatiques */
    background: rgba(255, 255, 255, 0.9); /* Fond légèrement transparent */
    max-width: 90%; /* Ajuste la largeur maximale pour s'adapter à l'écran */
  }

  .about-bloc-white h3 {
    font-size: 27px; /* Réduit légèrement la taille du titre si nécessaire */
  }

  .about-bloc-white p {
    font-size: 0.95rem; /* Ajuste la taille du texte pour mobile */
  }
}

/* Ajustements pour Amazzing Filter */

#amazzing_filter {
  background: #fff !important;
  border-radius: 10px !important;
  box-shadow: 0 5px 20px rgba(0,0,0,0.08) !important;
  padding: 32px 26px 24px 26px !important;
  margin-top: 16px !important;
  margin-bottom: 16px !important;
  border: none !important;
  max-width: 340px;
  min-width: 240px;
  width: 100%;
}

/* Responsive pour mobile : bloc en pleine largeur */
@media (max-width: 991px) {
  #amazzing_filter {
    max-width: 100vw;
    margin: 0 0 24px 0 !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
  }
}


#amazzing_filter .title_block {
  position: relative;
  padding-left: 40px;
  display: flex;
  align-items: center;
  font-size: 22px !important;
  font-weight: bold !important;
  margin-bottom: 30px !important;
  color: #23272F !important;
  letter-spacing: -1px;
  background: none !important;
  border: none !important;
  text-align: left !important;
}

#amazzing_filter .title_block::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 28px;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background: url('data:image/svg+xml;utf8,<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><g stroke="black" stroke-width="2.2" stroke-linecap="round"><line x1="4" y1="7" x2="24" y2="7"/><line x1="4" y1="14" x2="24" y2="14"/><line x1="4" y1="21" x2="24" y2="21"/><circle cx="8" cy="7" r="2"/><circle cx="18" cy="14" r="2"/><circle cx="12" cy="21" r="2"/></g></svg>') no-repeat center/contain;
  margin-right: 12px;
  pointer-events: none;
}
#amazzing_filter {
  margin-top: 0 !important;
}

body:not(.page-index) #wrapper {
  background: #F6FAFE !important;
}

/* Mobile ≤ 767px — Hero "NOS SKIS D'OCCASION" */
@media (max-width: 767.98px){
  /* Carte hero */
  .elementor-element-awsxemh .elementor-iqit-banner{
    /* hauteur + padding responsives */
    --hero-h: clamp(280px, 72vw, 360px);
    --pad-x: 12px;
    --pad-y: 16px;

    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important; /* texte en haut */
    align-items: center !important;

    min-height: var(--hero-h) !important;
    padding: var(--pad-y) var(--pad-x) !important;

    background: #264aa5 url('/img/cms/home/img/skioccas-skis-bg.jpg') center/cover no-repeat !important;
    border-radius: 18px !important;
    overflow: hidden;
    box-sizing: border-box;
    margin: 0 8px;
  }

  /* Masque l'image <img> interne (on utilise le background) */
  .elementor-element-awsxemh .elementor-iqit-banner-img img{
    display: none !important;
  }

  /* Contenu : en haut, largeur pleine, pas de transform */
  .elementor-element-awsxemh .elementor-iqit-banner-content{
    position: relative !important;
    top: 0 !important; left: 0 !important; transform: none !important;
    width: 100% !important;
    margin: 0 auto !important;
    text-align: center !important;
    z-index: 2;
  }

  /* Titre plus gros, plus compact */
  .elementor-element-awsxemh .elementor-iqit-banner-title{
    color: #fff !important;
    font-weight: 800 !important;
    font-size: clamp(1.9rem, 6.8vw, 2.3rem) !important; /* ~30–37px */
    line-height: 0.6 !important;
    margin: 6px 0 0 !important;
  }

  /* Cache le bouton/CTA sur mobile */
  .elementor-element-awsxemh .elementor-iqit-banner-content .elementor-button,
  .elementor-element-awsxemh .elementor-iqit-banner-content a.elementor-button,
  .elementor-element-awsxemh .elementor-iqit-banner-content .elementor-button-wrapper{
    display: none !important;
  }
}

/* Réassurances — mobile : 2 colonnes, centrées, sans débord */
@media (max-width: 767px){
  .elementor-section.elementor-element-0of2vrt .elementor-row{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;                 /* espace horizontal + vertical */
    margin: 0 !important;      /* supprime les -8px */
  }
  .elementor-section.elementor-element-0of2vrt .elementor-column{
    width: auto !important;
    max-width: none !important;
    flex: initial !important;
    padding: 0 !important;     /* plus de padding latéral */
    margin: 0 !important;
    box-sizing: border-box;
  }
  /* centre le contenu interne si besoin */
  .elementor-section.elementor-element-0of2vrt .elementor-widget-container{
    text-align: center;
  }
}


/* ======================= */
/* === GESTION DES FLAGS === */
/* ======================= */

/* Style général pour tous les flags */
.product-flags__flag {
  display: inline-block;
  padding: 4px 10px;
  font-size: 0.82rem;
  font-weight: 600;
  text-transform: uppercase;
  border-radius: 0;
  border: 1px solid currentColor;
  line-height: 1.4;
  letter-spacing: 0.02em;
  white-space: nowrap;
  box-sizing: border-box;
}

/* Positionnement des flags du MODULE iqitproductflags sur les miniatures */
.thumbnail-container .product-campagains:not(.product-campagains--promo) {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 5;
  display: flex;
  flex-direction: column !important; /* Forcer l'alignement vertical pour les miniatures */
  gap: 4px; /* Écart réduit */
}

/* Décalage du conteneur du module si PROMO est présent sur les miniatures */
.thumbnail-container .product-campagains--promo + .iqitproductflags-badge-wrapper .product-campagains:not(.product-campagains--promo) {
  top: 30px !important; /* Décalage réduit pour NEUF */
}

/* Positionnement du badge PROMO sur les miniatures */
.thumbnail-container .product-campagains--promo {
  position: absolute;
  top: 10px;
  right: 10px; /* Aligné à droite pour les miniatures */
  z-index: 10;
}

/* Style du badge PROMO sur les miniatures (sans bordure) */
.thumbnail-container .product-campagains--promo .product-flags__flag.flag-promo {
  background-color: #FFE066; /* Jaune moins vif */
  color: #000;
  font-size: 0.82rem !important;
  padding: 4px 8px !important; /* Padding réduit pour compenser la longueur du texte */
  font-weight: 600;
  line-height: 1.4 !important;
  border: none !important; /* Supprimer la bordure noire */
  border-radius: 0;
  display: inline-block;
  white-space: nowrap;
  box-sizing: border-box;
}

/* Style du badge NEUF sur les miniatures (surcharge des styles inline) */
.thumbnail-container .product-campagains:not(.product-campagains--promo) .product-flags__flag {
  font-size: 0.82rem !important;
  padding: 4px 10px !important;
  line-height: 1.4 !important;
  border: 1px solid currentColor !important;
  box-sizing: border-box !important;
}

/* Style du badge PROMO sur la fiche produit (sans bordure) */
.product_header_container .product-campagains--promo .product-flags__flag.flag-promo {
  background-color: #F9E63D;
  color: #000;
  font-size: 0.82rem !important;
  padding: 4px 10px !important;
  font-weight: 600;
  line-height: 1.4 !important;
  border: none !important; /* Supprimer la bordure noire */
  border-radius: 0;
  display: inline-block;
  white-space: nowrap;
  box-sizing: border-box;
}

/* Style du badge NEUF sur la fiche produit */
.product_header_container .product-campagains:not(.product-campagains--promo) .product-flags__flag {
  font-size: 0.82rem !important;
  padding: 4px 10px !important;
  line-height: 1.4 !important;
  border: 1px solid currentColor !important;
  box-sizing: border-box !important;
}

/* Positionnement du conteneur parent pour les miniatures */
.thumbnail-container {
  position: relative;
}

/* Alignement horizontal des badges dans product_header_container sur la fiche produit */
.product_header_container .product-campagains {
  display: inline-block !important; /* Forcer les conteneurs à être en ligne */
  margin-right: 10px; /* Espacement entre les badges */
}

/* Surcharger flex-wrap pour éviter le retour à la ligne */
.product_header_container .product-campagains.d-flex {
  flex-wrap: nowrap !important; /* Empêcher le retour à la ligne */
  gap: 6px !important; /* Espacement entre les badges */
}

/* Positionnement spécifique pour PROMO */
.product_header_container .product-campagains--promo {
  order: 1; /* S'assurer que PROMO est à gauche */
}

/* Positionnement spécifique pour NEUF */
.product_header_container .product-campagains:not(.product-campagains--promo) {
  order: 2; /* NEUF Ã  droite de PROMO */
}

/* S'assurer que .product-flags n'interfère pas */
.product-flags:not(.product-flags__flag) {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
}

/* Mobile : cacher le badge header et recréer PROMO à côté du -% (mais carré) */
@media (max-width: 991.98px){
  .page-product .product_header_container .product-campagains--promo{
    display: none !important;
  }

  .page-product .product-flags{
    position: absolute; top: 12px; left: 12px; z-index: 25;
  }

  .page-product .product-flags::after{
    content: "PROMO";
    position: absolute;
    left: calc(44px + 12px);   /* 44 = diamètre du badge -% en mobile */
    top: 4px;
    padding: 4px 10px;
    background: #F9E63D;
    color: #000;
    border-radius: 0;          /* carré comme en desktop */
    border: none;
    font-weight: 600;
    font-size: 0.82rem;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: .02em;
    white-space: nowrap;
    box-shadow: 0 6px 16px rgba(0,0,0,.08);
    pointer-events: none;
  }
}




/* Style des boutons de déclinaisons (radio-label) */
.product-variants .radio-label {
  width: 64px;
  height: 40px;
  font-size: 15px;
  text-align: center;
  border: 1px solid #ccc;
  border-radius: 3px;
  box-sizing: border-box;
  background-color: #fff;
  color: #000;
  transition: all 0.2s ease;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  position: relative;
  z-index: 1;
}

/* Cache l’input mais garde son effet JS natif */
.input-radio {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  z-index: 2;
}

/* Bouton sélectionné */
.input-radio:checked + .radio-label {
  background-color: #265BA6;
  color: #fff;
  border: 1px solid #265BA6; /* Ajoute la bordure bleue */
}

/* Hover sur les boutons */
.product-variants .radio-label:hover {
  border-color: #265BA6;
}
/* Supprime totalement la bordure forcée */
.product-variants .input-radio:checked + span.radio-label,
.product-variants .input-radio:hover + span.radio-label {
  border: none !important;
}

/* =========================================================
   Indisponibles : grisé + croix + non cliquable
   Couvre :
   - radios texte => <span class="radio-label">
   - pastilles couleur => <span class="color">
   - cas : <li class="attribute-not-in-stock"> OU input[disabled]
   ========================================================= */

/* --- 1) RADIO TEXTE (ex: État d'usure, Taille) --- */
.product-variants ul[id^="group_"] li.attribute-not-in-stock .radio-label,
.product-variants ul[id^="group_"] li:has(> .input-radio[disabled]) .radio-label{
  position: relative;
  background: #f5f6f7 !important;
  color: #9aa1a7 !important;
  border-color: #d8dde1 !important;
  cursor: not-allowed !important;
  opacity: .9;
}

/* Croix sur le label texte */
.product-variants ul[id^="group_"] li.attribute-not-in-stock .radio-label::before,
.product-variants ul[id^="group_"] li.attribute-not-in-stock .radio-label::after,
.product-variants ul[id^="group_"] li:has(> .input-radio[disabled]) .radio-label::before,
.product-variants ul[id^="group_"] li:has(> .input-radio[disabled]) .radio-label::after{
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 80%; height: 2px;
  background: currentColor;
  opacity: .35;
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 1px;
  pointer-events: none;
}
.product-variants ul[id^="group_"] li.attribute-not-in-stock .radio-label::after,
.product-variants ul[id^="group_"] li:has(> .input-radio[disabled]) .radio-label::after{
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* --- 2) COULEURS (ex: <span class="color">) --- */
.product-variants ul[id^="group_"] li.attribute-not-in-stock .color,
.product-variants ul[id^="group_"] li:has(> .input-color[disabled]) .color{
  position: relative;
  filter: grayscale(1);
  opacity: .55;
  cursor: not-allowed !important;
  outline: 1px solid #d8dde1;         /* pour garder un liseré visible */
  outline-offset: 0;
}

/* Croix sur la pastille couleur */
.product-variants ul[id^="group_"] li.attribute-not-in-stock .color::before,
.product-variants ul[id^="group_"] li.attribute-not-in-stock .color::after,
.product-variants ul[id^="group_"] li:has(> .input-color[disabled]) .color::before,
.product-variants ul[id^="group_"] li:has(> .input-color[disabled]) .color::after{
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 85%; height: 2px;
  background: #000;
  opacity: .35;
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 1px;
  pointer-events: none;
}
.product-variants ul[id^="group_"] li.attribute-not-in-stock .color::after,
.product-variants ul[id^="group_"] li:has(> .input-color[disabled]) .color::after{
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* --- 3) Bloquer les clics sur options indisponibles --- */
.product-variants ul[id^="group_"] li.attribute-not-in-stock .input-radio,
.product-variants ul[id^="group_"] li:has(> .input-radio[disabled]) .input-radio,
.product-variants ul[id^="group_"] li.attribute-not-in-stock .input-color,
.product-variants ul[id^="group_"] li:has(> .input-color[disabled]) .input-color{
  pointer-events: none;
}

/* Si une option indisponible reste "checked", on neutralise visuel sélectionné */
.product-variants ul[id^="group_"] li.attribute-not-in-stock .input-radio:checked + .radio-label,
.product-variants ul[id^="group_"] li:has(> .input-radio[disabled]) .input-radio:checked + .radio-label{
  background: #f5f6f7 !important;
  color: #9aa1a7 !important;
  border-color: #d8dde1 !important;
}

/* (Optionnel) assure le rond pour les couleurs non sélectionnées aussi */
.product-variants ul[id^="group_"] .input-color + .color{
  border-radius: 50%;
  display: inline-block;
}




/* ==== TOUCHSPIN QUANTITÉ STYLE ===== */

/* 1) Champ quantité : espace interne suffisant pour ne PAS chevaucher le chiffre */
#product .bootstrap-touchspin { position: relative; }

#product .bootstrap-touchspin input.form-control{
  height: 46px;
  width: 110px;                 /* ne pas descendre en dessous sinon ça serre */
  text-align: center;
  line-height: 46px;
  border-radius: 999px;
  padding-left: 38px;           /* place pour “−” */
  padding-right: 38px;          /* place pour “+” -> évite le chevauchement */
}

/* 2) Boutons +/- correctement centrés (écrase d'anciennes règles) */
#product .bootstrap-touchspin .input-group-btn-vertical{ position: static; }

#product .bootstrap-touchspin .input-group-btn-vertical .btn{
  position: absolute !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%);
  width: 30px;                  /* zone cliquable */
  height: 30px;
  margin: 0;
  border: 0;
  background: transparent;
  display: flex; align-items: center; justify-content: center;
  box-shadow: none;
}

#product .bootstrap-touchspin .bootstrap-touchspin-down{ left: 6px; }
#product .bootstrap-touchspin .bootstrap-touchspin-up{ right: 6px; }

/* 3) Dessine les signes, masque les icônes internes */
#product .bootstrap-touchspin .input-group-btn-vertical .btn i{ display: none; }

#product .bootstrap-touchspin .bootstrap-touchspin-down::after{
  content: "−"; font-size: 20px; line-height: 1; font-weight: 500; color: #111;
  position: relative; top: .5px;   /* micro-align optique */
}
#product .bootstrap-touchspin .bootstrap-touchspin-up::after{
  content: "+"; font-size: 20px; line-height: 1; font-weight: 500; color: #111;
  position: relative; top: 0;      /* monte à .5px si besoin */
}

/* 4) Espace fiable avant le bouton “Ajouter au panier” (conserve ta marge) */
#product .product-quantity .qty{ margin-right: 10px;
    width: 100px;
} /* tu peux passer à 14–16px */

/* ===== TouchSpin quantité — Fiche produit + Panier ===== */

/* Contexte fiche produit ET panier */
#product .bootstrap-touchspin,
.cart-item .bootstrap-touchspin { position: relative; }

/* Champ quantité : même gabarit arrondi */
#product .bootstrap-touchspin input.form-control,
.cart-item .bootstrap-touchspin input.form-control{
  height: 46px;
  width: 110px;               /* ajuste si besoin en panier */
  text-align: center;
  line-height: 46px;
  border-radius: 999px;
  padding-left: 38px;         /* place pour “−” */
  padding-right: 38px;        /* place pour “+” */
}

/* Boutons +/- centrés verticalement */
#product .bootstrap-touchspin .input-group-btn-vertical,
.cart-item .bootstrap-touchspin .input-group-btn-vertical{ position: static; }

#product .bootstrap-touchspin .input-group-btn-vertical .btn,
.cart-item .bootstrap-touchspin .input-group-btn-vertical .btn{
  position: absolute !important;
  top: 50% !important; transform: translateY(-50%);
  width: 30px; height: 30px; margin: 0; border: 0;
  background: transparent; display:flex; align-items:center; justify-content:center;
  box-shadow: none;
}

/* Positions gauche/droite */
#product .bootstrap-touchspin .bootstrap-touchspin-down,
.cart-item .bootstrap-touchspin .bootstrap-touchspin-down{ left: 6px; }
#product .bootstrap-touchspin .bootstrap-touchspin-up,
.cart-item .bootstrap-touchspin .bootstrap-touchspin-up{ right: 6px; }

/* Masque les icônes internes FA et dessine + / − */
#product .bootstrap-touchspin .input-group-btn-vertical .btn i,
.cart-item .bootstrap-touchspin .input-group-btn-vertical .btn i{ display:none; }

#product .bootstrap-touchspin .bootstrap-touchspin-down::after,
.cart-item .bootstrap-touchspin .bootstrap-touchspin-down::after{
  content:"−"; font-size:20px; line-height:1; font-weight:500; color:#111; position:relative; top:.5px;
}
#product .bootstrap-touchspin .bootstrap-touchspin-up::after,
.cart-item .bootstrap-touchspin .bootstrap-touchspin-up::after{
  content:"+"; font-size:20px; line-height:1; font-weight:500; color:#111;
}

/* Espacement (optionnel) */
#product .product-quantity .qty{ margin-right:10px; width:100px; }

/* ——— Responsif : un peu plus compact en petits écrans ——— */
@media (max-width: 575.98px){
  .cart-item .bootstrap-touchspin input.form-control{ width: 96px; }
}

/* Panier — largeur correcte du champ quantité */
.cart-item .bootstrap-touchspin {
  max-width: 90px !important;   /* au lieu de 75px */
}
/* Mini-panier — TouchSpin propre et lisible */
#blockcart-content .cart-products .bootstrap-touchspin{
  position: relative;
  max-width: 90px !important;   /* ↑ au lieu de 75px */
}

#blockcart-content .cart-products .bootstrap-touchspin input.form-control{
  height: 40px;                 /* un peu plus compact que la fiche produit */
  width: 100%;                  /* occupe la largeur max ci-dessus */
  text-align: center;
  line-height: 40px;
  border-radius: 999px;
  padding-left: 32px;           /* place pour “−” */
  padding-right: 32px;          /* place pour “+” */
  color:#111; -webkit-text-fill-color:#111; opacity:1;
}

/* Boutons +/- centrés verticalement */
#blockcart-content .cart-products .bootstrap-touchspin .input-group-btn-vertical{ position: static; }
#blockcart-content .cart-products .bootstrap-touchspin .input-group-btn-vertical .btn{
  position:absolute !important; top:50% !important; transform:translateY(-50%);
  width:26px; height:26px; margin:0; border:0; background:transparent;
  display:flex; align-items:center; justify-content:center; box-shadow:none;
}
#blockcart-content .cart-products .bootstrap-touchspin .bootstrap-touchspin-down{ left:6px; }
#blockcart-content .cart-products .bootstrap-touchspin .bootstrap-touchspin-up{ right:6px; }

/* Masque les icônes internes et dessine + / − */
#blockcart-content .cart-products .bootstrap-touchspin .input-group-btn-vertical .btn i{ display:none; }
#blockcart-content .cart-products .bootstrap-touchspin .bootstrap-touchspin-down::after{
  content:"−"; font-size:18px; line-height:1; font-weight:500; color:#111; position:relative; top:.5px;
}
#blockcart-content .cart-products .bootstrap-touchspin .bootstrap-touchspin-up::after{
  content:"+"; font-size:18px; line-height:1; font-weight:500; color:#111;
}

/* (Option) encore plus compact en très petit écran */
@media (max-width: 480px){
  #blockcart-content .cart-products .bootstrap-touchspin{ max-width: 84px !important; }
  #blockcart-content .cart-products .bootstrap-touchspin input.form-control{ height: 36px; line-height:36px; }
}


/* ===== Mobile : quantité + bouton côte à côte, cœur dessous ===== */
@media (max-width: 767.98px){
  /* La ligne qui contient qty / bouton / wishlist */
  #product .product-add-to-cart .product-quantity.row{
    display: flex !important;
    flex-wrap: wrap;                 /* permet de passer le cœur en dessous */
    align-items: center;
  }

  /* Colonne quantité : fixe, à gauche */
  #product .product-add-to-cart .product-quantity.row .col-add-qty{
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;      /* annule col-12 sur mobile */
    margin-right: 12px;              /* petit espace avant le bouton */
  }

  /* Colonne bouton : prend tout le reste à droite */
  #product .product-add-to-cart .product-quantity.row .col-add-btn{
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;      /* annule col-12 */
    min-width: 0;                    /* évite débordements */
  }
  #product .product-add-to-cart .product-quantity.row .col-add-btn .add .btn{
    width: 100%;                     /* bouton rouge pleine colonne */
  }

  /* Cœur/wishlist : passe à la ligne suivante */
  #product .product-add-to-cart .product-quantity.row .col-add-wishlist{
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 12px;
  }
}

.product-discount-tag {
  font-size: 0.95rem;
  padding: 4px 10px;
  border: 1px solid #FF6A28;
  color: #FF6A28;
  border-radius: 4px;
  font-weight: 500;
  line-height: 1.2;
  background: transparent;
  white-space: nowrap;
  display: inline-block;
}

.tax-label-inline {
  display: inline-block;
  margin-left: 6px;
  font-size: 0.85rem;
  color: #666;
  vertical-align: middle;
}

.product-price-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
	margin-top: 20px;
}

.product-price-line > * {
  flex-shrink: 0;
}

/* Fixe le header en haut de l'écran */
#mobile-header-sticky {
  position: sticky;
  top: 0; /* Fixe le header en haut de l'écran */
  z-index: 1000; /* Assure que le header reste au-dessus du contenu */
  background-color: #fff; /* Fond blanc pour éviter la transparence du contenu sous-jacent */
  width: 100%; /* S'assure que le header couvre toute la largeur */
}

#mobile-header-sticky .container {
  padding: 0 15px; /* Ajuste le padding si nécessaire pour mobile */
}

@media (max-width: 767px) {
  #mobile-header-sticky {
    position: sticky; /* Confirme le sticky sur mobile */
    top: 0;
    z-index: 1000;
  }

  /* Ajuste la hauteur si les éléments débordent */
  #mobile-header-sticky .row-mobile-header {
    min-height: 60px; /* Hauteur minimale pour éviter que le header ne soit écrasé */
  }
}

@media (max-width: 767px) {
  .elementor-section.elementor-element-lljgw66 .elementor-row {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: center;
    align-items: stretch;
    gap: 10px;
  }

  .elementor-section.elementor-element-lljgw66 .elementor-column {
    flex: 1 1 33.333%;
    max-width: 33.333%;
  }

  .elementor-section.elementor-element-lljgw66 .elementor-image-box-wrapper {
    text-align: center;
  }

  .elementor-section.elementor-element-lljgw66 .elementor-widget-image-box img {
    margin-left: auto;
    margin-right: auto;
  }
}
@media (max-width: 767px) {
  .elementor-section.elementor-element-lljgw66 .elementor-widget-image-box .elementor-image-box-img {
    display: flex;
    justify-content: center;
  }

  .elementor-section.elementor-element-lljgw66 .elementor-widget-image-box img {
    margin: 0 auto;
  }

  .elementor-section.elementor-element-lljgw66 .elementor-image-box-content {
    text-align: center;
  }
}
/* HOME (mobile) — Paire "Chaussures" : bannière -> carrousel */
@media (max-width: 767px){
  /* Sécurise le parent pour que l'ordre s'applique, mais uniquement sur cette ligne */
  .page-index .elementor-row:has(> .elementor-element.elementor-element-3tgw43j){
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
  }

  /* 1) Bannière "NOS CHAUSSURES..." en premier */
  .page-index .elementor-element.elementor-element-3tgw43j{
    order: 1 !important;
    width: 100% !important;
    margin-bottom: 14px !important; /* petit espace sous la bannière */
  }

  /* 2) Carrousel "Chaussures" en second */
  .page-index .elementor-element.elementor-element-1lcrc94{
    order: 2 !important;
    width: 100% !important;
  }
}


/* HOME (mobile) — cacher les flèches du carrousel "Chaussures" uniquement */
@media (max-width: 767px){
  .page-index .elementor-element.elementor-element-1lcrc94
  .swiper-button,
  .page-index .elementor-element.elementor-element-1lcrc94
  .swiper-button-prev,
  .page-index .elementor-element.elementor-element-1lcrc94
  .swiper-button-next,
  .page-index .elementor-element.elementor-element-1lcrc94
  .elementor-swiper-button,
  .page-index .elementor-element.elementor-element-1lcrc94
  .elementor-swiper-button-prev,
  .page-index .elementor-element.elementor-element-1lcrc94
  .elementor-swiper-button-next{
    display: none !important;
  }

  /* laisser la pagination visible sous le slider */
  .page-index .elementor-element.elementor-element-1lcrc94 .swiper-pagination{
    display: block !important;
    position: static !important;
    margin-top: 8px;
  }
}
/* HOME (mobile) — cacher les flèches du carrousel "Skis" (col 68c8m1b) */
@media (max-width: 767px){
  .page-index .elementor-element.elementor-element-68c8m1b
  .swiper-button,
  .page-index .elementor-element.elementor-element-68c8m1b
  .swiper-button-prev,
  .page-index .elementor-element.elementor-element-68c8m1b
  .swiper-button-next,
  .page-index .elementor-element.elementor-element-68c8m1b
  .elementor-swiper-button,
  .page-index .elementor-element.elementor-element-68c8m1b
  .elementor-swiper-button-prev,
  .page-index .elementor-element.elementor-element-68c8m1b
  .elementor-swiper-button-next{
    display: none !important;
  }

  /* laisser la pagination visible sous le slider */
  .page-index .elementor-element.elementor-element-68c8m1b .swiper-pagination{
    display: block !important;
    position: static !important;
    margin-top: 8px;
  }
}
/* Masquer le footer des cartes blog (listing home + page blog) */
:is(.page-index, .page-blog, body#module-ph_simpleblog-list, body.module-ph_simpleblog-list)
.simpleblog__listing__post__wrapper .simpleblog__listing__post__wrapper__footer{
  display: none !important;
}
/* HOME (mobile) — espace au-dessus de la bannière "Chaussures" */
@media (max-width: 767px){
  /* option 1 : marge sur la bannière elle-même */
  .page-index .elementor-element.elementor-element-3tgw43j .elementor-iqit-banner{
    margin: 16px 8px 14px !important; /* top | left-right | bottom */
  }

  /* (sécurité) si un style override la marge du bloc, on peut aussi pousser la colonne */
  .page-index .elementor-element.elementor-element-3tgw43j{
    margin-top: 16px !important;
  }
}
/* HOME (mobile) — arrondis nets sur le slider "marques" (widget 7f8wiry) */
@media (max-width: 767px){
  /* 1) Le conteneur du widget : round + clip (fallback + clip-path pour le GPU) */
  .page-index .elementor-element.elementor-element-7f8wiry .elementor-widget-container{
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
    clip-path: inset(0 round 18px);
  }

  /* 2) Les couches Swiper internes doivent hériter de l'arrondi ET clipper */
  .page-index .elementor-element.elementor-element-7f8wiry .elementor-brands,
  .page-index .elementor-element.elementor-element-7f8wiry .elementor-brands-carousel-wrapper,
  .page-index .elementor-element.elementor-element-7f8wiry .elementor-brands-carousel,
  .page-index .elementor-element.elementor-element-7f8wiry .swiper-container,
  .page-index .elementor-element.elementor-element-7f8wiry .swiper{
    border-radius: inherit;
    overflow: hidden;
    clip-path: inset(0 round 18px);
  }

  /* 3) Évite que des marges négatives carrent les coins */
  .page-index .elementor-element.elementor-element-7f8wiry .swiper-wrapper{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* 4) Images block pour empêcher un petit "gap" aux coins */
  .page-index .elementor-element.elementor-element-7f8wiry .swiper-slide img{
    display: block;
  }
}

 /* Navigation mobile article blog */
@media (max-width: 767px){
  /* Titre + nav à droite */
  .page-index .elementor-element.elementor-element-qifkg9i .elementor-widget-container{
    display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px;
  }
  .page-index .home-blog--nav{ display:flex; gap:10px; }
  .page-index .home-blog--nav .hb-btn{
    width:42px; height:42px; border-radius:9999px;
    display:flex; align-items:center; justify-content:center;
    background:#fff; border:2px solid #264aa5; color:#264aa5;
  }
  .page-index .home-blog--nav .hb-btn[disabled]{ opacity:.35; border-color:#d9e2ff; }

  /* Track sans Swiper (scroll-snap) */
  .page-index .home-blog-track{ display:flex; gap:16px; overflow:hidden; scroll-snap-type:x mandatory; }
  .page-index .home-blog-slide{ flex:0 0 100%; scroll-snap-align:start; }

  /* Cache une éventuelle pagination du widget */
  .page-index .elementor-element.elementor-element-l4lw36m .swiper-pagination{ display:none !important; }
}
@media (min-width: 768px){
  .page-index .home-blog--nav{ display:none; }
}

/* MOBILE — barre nav sous les carrousels Skis/Chaussures */
@media (max-width: 767px){
  .page-index .mc-bar{
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    margin:14px 8px 20px !important; position:relative; z-index:10;
  }
  .page-index .mc-arrows{ display:flex; gap:10px; }

  .page-index .mc-btn{
    width:42px; height:42px; border-radius:9999px;
    display:flex; align-items:center; justify-content:center;
    background:#fff; border:2px solid #255BA6; color:#255BA6;
    transition:background-color .18s,color .18s,border-color .18s,box-shadow .18s;
    -webkit-tap-highlight-color:transparent;
  }
  .page-index .mc-btn:not([disabled]):hover,
  .page-index .mc-btn:not([disabled]):focus-visible,
  .page-index .mc-btn:not([disabled]):active{
    background:#000; color:#fff; border-color:#000;
  }
  .page-index .mc-btn[disabled]{ opacity:.35; border-color:#d9e2ff; }

  .page-index .mc-cta{
    display:inline-flex; align-items:center; justify-content:center;
    min-height:44px; padding:12px 18px; border-radius:9999px;
    background:#255BA6; color:#fff !important; font-weight:700; text-transform:uppercase;
    text-decoration:none !important; box-shadow:0 6px 16px rgba(31,60,144,.18);
    transition:background-color .18s,color .18s,box-shadow .18s;
  }
  .page-index .mc-cta:hover,
  .page-index .mc-cta:focus-visible,
  .page-index .mc-cta:active{
    background:#FF7234; color:#fff !important;
  }

  /* évite que le slider recouvre la barre */
  .page-index .elementor-element.elementor-element-68c8m1b .swiper,
  .page-index .elementor-element.elementor-element-68c8m1b .swiper-container,
  .page-index .elementor-element.elementor-element-1lcrc94 .swiper,
  .page-index .elementor-element.elementor-element-1lcrc94 .swiper-container{
    margin-bottom:0 !important; overflow:visible !important;
  }
}
@media (min-width:768px){
  .page-index .mc-bar{ display:none; }
}


/* ===== Mega-menu (desktop) : panneau centré, 3/4 largeur, arrondi ===== */
@media (min-width: 1024px){

  /* S'assure que le wrapper peut positionner le panneau */
  #iqitmegamenu-wrapper, .iqitmegamenu-wrapper, .menu, .header-nav { position: relative; }

  /* Sélecteurs des panneaux (Iqit/Warehouse couvrent en général ceux-ci) */
  .iqitmegamenu .iqitmegamenu-submenu,
  .iqitmegamenu .megamenu-submenu,
  .iqitmegamenu .mega-dropdown-menu,
  .iqitmegamenu .submenu,
  .menu .mega-dropdown-menu {
    position: absolute !important;          /* pas en full-width fixed */
    left: 50% !important;
    transform: translateX(-50%) !important; /* centre sous la barre */
    right: auto !important;

    width: min(1200px, 75vw) !important;     /* 3/4 de page avec cap */
    border-radius: 20px !important;
    overflow: hidden;                         /* pour que l'arrondi découpe bien */
    box-shadow: 0 16px 48px rgba(0,0,0,.16) !important;
    background: #fff;                         /* fond propre, comme ta maquette */
    padding: 26px 28px !important;

    /* hauteur de sécurité pour éviter qu'il ne touche le bas d'écran */
    max-height: calc(100vh - 160px);
    overflow-y: auto;
    z-index: 1002;                            /* au-dessus du reste */
  }

  /* Supprime les styles full-width que posent certains thèmes */
  .iqitmegamenu .iqitmegamenu-submenu,
  .iqitmegamenu .mega-dropdown-menu { width: auto; }

  /* Colonne visuelle de droite (image “Coup de cœur”) : garde les coins ronds */
  .iqitmegamenu .iqitmegamenu-submenu img,
  .iqitmegamenu .mega-dropdown-menu img { border-radius: 12px; display: block; }

  /* Le parent immédiat ne doit pas couper notre panneau arrondi */
  .iqitmegamenu li, .menu li { overflow: visible !important; }
}

/* Mega-menu — panneau 3/4 centré + coins arrondis et clip */
@media (min-width:1024px){
  /* Le panneau */
  #iqitmegamenu-wrapper .cbp-hrsub{
    position:absolute !important;
    width:min(1200px,75vw) !important;
    border-radius:10px !important;
    box-shadow:0 16px 48px rgba(0,0,0,.16) !important;
    background:#fff !important;
    overflow:hidden !important;               /* <-- découpe les coins */
    z-index:1002;
  }

  /* Propager le radius au conteneur interne */
  #iqitmegamenu-wrapper .cbp-hrsub-inner,
  #iqitmegamenu-wrapper .cbp-hrsub .iqitmegamenu-submenu-container{
    border-radius:inherit !important;
    overflow:hidden;                          /* évite que l’intérieur “mange” l’arrondi */
    padding:26px 28px;                        /* marge interne comme sur ta maquette */
    background:#fff;
  }

  /* Si le module dessine un fond via ::before en plein rectangle, on le clippe aussi */
  #iqitmegamenu-wrapper .cbp-hrsub::before,
  #iqitmegamenu-wrapper .cbp-hrsub-inner::before{
    border-radius:inherit !important;
  }

  /* Empêche les <li> parents de couper le panneau arrondi */
  .iqitmegamenu li{ overflow:visible !important; }
}
/* Menu desktop : supprimer tout fond au hover/ouvert et afficher seulement un trait orange */
@media (min-width:1024px){

  /* 1) Neutralise les fonds posés par le thème, sur li + a + pseudo-éléments */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab:hover,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.cbp-hropen,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.active,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab:hover > a.nav-link,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.cbp-hropen > a.nav-link,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.active > a.nav-link{
    background: transparent !important;
    box-shadow: none !important;
  }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab::before,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab::after,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link::before{
    content: none !important;
    background: none !important;
  }

  /* 2) Trait orange (animation propre, ne change pas la hauteur) */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link{
    position: relative;
  }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link::after{
    content:"";
    position:absolute; left:0; right:0; bottom:0; height:3px;
    background:#FF7134; border-radius:2px;
    transform:scaleX(0); transform-origin:left; transition:transform .18s ease;
  }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab:hover > a.nav-link::after,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.cbp-hropen > a.nav-link::after,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.active > a.nav-link::after{
    transform:scaleX(1);
  }

  /* Plan B (certains thèmes font encore un fond via un sélecteur plus large) */
  header .cbp-hrmenu-tab:hover > a.nav-link,
  header .cbp-hrmenu-tab.cbp-hropen > a.nav-link,
  header .cbp-hrmenu-tab.active > a.nav-link{
    background: transparent !important;
  }
}
/* Menu desktop : garder le texte blanc au hover/ouvert/actif */
@media (min-width:1024px){
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab:hover > a.nav-link,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.cbp-hropen > a.nav-link,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.active > a.nav-link {
    color:#fff !important;
  }
  /* forcer l’héritage sur le span + icônes */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link .cbp-tab-title{ color:inherit !important; }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link i,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link svg{
    color: inherit !important; fill: currentColor !important;
  }
}
/* Mega-menu — Titres de colonnes = texte ENTIER (pas de truncate) */
@media (min-width:1024px){
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-menu-column .cbp-menu-column-inner > .cbp-column-title.nav-link.transition-300{
    color:#265BA6 !important;
    font-size: 1.05rem;        /* ajuste librement */
    font-weight: 800;          /* ajuste librement */
    white-space: normal !important;      /* <<< plus de 1 ligne forcée */
    overflow: visible !important;        /* <<< plus d’ellipse */
    text-overflow: clip !important;
    display: block;                       /* garde la mise en forme propre */
    max-width: none !important;
    line-height: 1.25;
  }
  /* sécurité si les colonnes sont en flex : autorise l’enfant à s’élargir */
  #iqitmegamenu-wrapper .cbp-menu-column .cbp-menu-column-inner{ min-width: 0; }
}

/* Mega-menu — Liens de catégories sous le titre (héritent la couleur) */
#iqitmegamenu-wrapper .cbp-hrsub .cbp-category-link-w a{
  color: inherit;
  font-size: 0.98rem;          /* ajuste */
  font-weight: 500;            /* ajuste */
  text-decoration: none;
  line-height: 0.35;
}
/* Mega-menu (desktop) — titres entiers + liens pleine largeur + espacement propre */
@media (min-width:1024px){

  /* Titres de colonne (ex : "Fixations de ski") */
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-menu-column .cbp-menu-column-inner > .cbp-column-title.nav-link.transition-300{
    color:#265BA6 !important;
    font-size:1.05rem;          /* ajuste au besoin */
    font-weight:800;            /* ajuste au besoin */
    line-height:1.25;
    white-space:normal !important;     /* plus de troncature */
    overflow:visible !important;
    text-overflow:clip !important;
    display:block;
    margin-bottom:10px;
  }

  /* La "row" des catégories : supprime les gouttières qui mangent la largeur */
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-categories-row{
    margin-left:0 !important; margin-right:0 !important;
    --bs-gutter-x: 0; /* Bootstrap */
  }
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-categories-row > [class*="col-"]{
    padding-left:0 !important; padding-right:0 !important;
  }

  /* Liens de catégorie : largeur 100% + wrap normal + espacement vertical */
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-category-link-w{ width:100%; max-width:none; }
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-category-link-w a{
    display:block;
    width:100%; max-width:none;
    color:inherit;
    font-size:0.98rem;          /* ajuste au besoin */
    font-weight:500;            /* ajuste au besoin (moins gras) */
    line-height:1.35;           /* évite tout écrasement sur 2 lignes */
    white-space:normal;
    text-decoration:none;
    padding:6px 0;              /* respire un peu */
  }
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-category-link-w a:hover{
    color:#264aa5;              /* option : hover */
  }

  /* Liens “à puce” (liste verticale type .cbp-valinks) : mêmes règles */
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-valinks li a{
    display:block; width:100%;
    font-size:0.98rem; font-weight:500; line-height:1.35;
    padding:6px 0; white-space:normal;
  }

  /* Sécurité : laisser l’enfant s’élargir si le conteneur est en flex */
  #iqitmegamenu-wrapper .cbp-menu-column .cbp-menu-column-inner{ min-width:0; }
}
/* Mega-menu (desktop) — titres propres + liens compacts */
@media (min-width:1024px){

  /* Titre de colonne */
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-menu-column .cbp-menu-column-inner > .cbp-column-title.nav-link.transition-300{
    color:#265BA6 !important;
    font-size:16px;        /* ajuste si besoin */
    font-weight:600;       /* ajuste si besoin */
    line-height:1.25;
    display:block;
    margin-bottom:10px;
    white-space:normal;    /* plus de troncature */
  }

  /* Liens de catégorie (une ligne si ça tient, sinon wrap) */
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-category-link-w a{
    display:block;
    width:100%;
    color:inherit;
    font-size:14px;        /* ajuste si besoin */
    font-weight:400;       /* ajuste si besoin */
    line-height:0.25;      /* plus serré */
    padding:2px 0;         /* ↓ espacement vertical ~-75% */
    text-decoration:none;
    white-space:normal;
  }

  /* Listes verticales éventuelles (› …) */
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-valinks li a{
    display:block;
    width:100%;
    font-size:14px;
    font-weight:400;
    line-height:1.25;
    padding:2px 0;         /* idem : compact */
    text-decoration:none;
    white-space:normal;
  }
}
  /* Titre entete colonne menu */

@media (min-width:1024px){
  #iqitmegamenu-wrapper .mm-subhead{
    display:flex; align-items:center; justify-content:space-between;
    margin:0 0 18px; padding:0 2px;
  }
  #iqitmegamenu-wrapper .mm-subhead-title{
    font-weight:900; font-size:16px; line-height:1.1;
    color:#000000; letter-spacing:.2px;
  }
  /* Bouton bleu, texte blanc, sans bordure */
#iqitmegamenu-wrapper .mm-subhead-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 9999px;
  font-weight: 700;
  text-decoration: none;
  color: #fff !important;          /* texte blanc */
  background: #255BA6 !important;  /* bleu */
  border: none !important;         /* pas de bordure */
  transition: background-color .18s, color .18s;
}

/* Hover = fond orange, texte blanc */
#iqitmegamenu-wrapper .mm-subhead-cta:hover {
  background: #FF7234 !important;  /* orange */
  color: #fff !important;          /* blanc */
}

}
@media (min-width:1024px){
  /* place le CTA juste à côté du titre, même ligne */
  #iqitmegamenu-wrapper .mm-subhead{
    display:flex;
    align-items:baseline;        /* aligne sur la ligne de base du titre */
    justify-content:flex-start;  /* plus d’espace entre, on les regroupe */
    gap:12px;                    /* petit espace entre titre et CTA */
    margin:0 0 18px; padding:0 2px;
    flex-wrap:wrap;              /* si ça ne tient pas, le CTA passe à la ligne */
  }
  #iqitmegamenu-wrapper .mm-subhead-title{ margin:0; }

  /* bouton compact pour tenir à côté du titre */
  #iqitmegamenu-wrapper .mm-subhead-cta{
    padding:6px 10px;
    border-radius:9999px;
    font-weight:700;
    line-height:1;
   
  }
  #iqitmegamenu-wrapper .mm-subhead-cta:hover{
    background:#ffffff; color:#ff7134; 
  }
}
/* Mega-menu — réduire l’espace sous le titre panneau */
@media (min-width:1024px){
  /* moins d’air entre l’en-tête et le contenu */
  #iqitmegamenu-wrapper .mm-subhead{
    margin: 0 0 8px;       /* ← avant : ~18px */
    gap: 12px;             /* titre + CTA collés proprement */
  }

  /* resserrer l’écart avant/après le titre de colonne */
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-menu-column .cbp-menu-column-inner > .cbp-column-title.nav-link.transition-300{
    margin-top: 0;
    margin-bottom: 25px;    /* ← avant : 10px */
  }

  /* au cas où une marge serait posée sur la 1ʳᵉ row du contenu */
  #iqitmegamenu-wrapper .iqitmegamenu-submenu-container > .menu_row:first-child{
    margin-top: 0;
  }

  /* liens déjà compactés ; on peut encore réduire le gap vertical de la grille */
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-categories-row{ row-gap: 2px; }
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-category-link-w a{
    padding: 2px 0;        /* cohérent avec ta compaction précédente */
  }
}
@media (min-width:1024px){
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-valinks li a::before,
  #iqitmegamenu-wrapper .cbp-hrsub .cbp-valinks li::before{
    content:none !important;
  }
}
/* Sous-menus = liens normaux (inline), aucune puce/chevron, pas de padding/marge forçés */
@media (min-width:1024px){
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree{
    list-style: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
  }

  /* supprime les marqueurs/chevrons où qu'ils soient */
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree li::before,
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree li > a::before,
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree li > .cbp-category-link-w > a::before{
    content: none !important;
    display: none !important;
  }

  /* réinitialise le <li> */
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree li{
    margin: 0 !important;
    padding: 0 !important;
    text-indent: 0 !important;
  }

  /* le lien redevient "normal" (inline) */
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree li > a,
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree li > .cbp-category-link-w > a{
    display: inline !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: normal !important;   /* annule 0.25 / 0.35 précédents */
    background: none !important;
    border: 0 !important;
    white-space: normal !important;
  }

  /* au cas où le thème stylise l’état sélectionné */
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree li.current > a,
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree li.active > a,
  #iqitmegamenu-wrapper .cbp-hrsub ul.cbp-links.cbp-category-tree li.selected > a{
    background: none !important;
    padding: 0 !important;
  }
}

/* ===== Overlay méga-menu (desktop) — réactivation sans casser le hover ===== */
/* ===== Overlay méga-menu (desktop) : sous le header, pas dessus ===== */

/* 0) coupe l'ancien overlay posé sur le wrapper pour éviter les doublons */
@media (min-width:1024px){
  #iqitmegamenu-wrapper::after{ content:none !important; }
}

/* 1) overlay global sur le body, invisible par défaut */
@media (min-width:1024px){
  body::after{
    content:"";
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.60);   /* intensité du voile */
    opacity: 0;
    transition: opacity .15s ease;
    pointer-events: none;          /* ne bloque jamais la souris */
    z-index: 900;                  /* ← sous le header */
  }

  /* 2) affiche le voile quand un onglet OU le panneau est survolé/ouvert */
  body:has(#iqitmegamenu-wrapper .cbp-hrmenu-tab:hover)::after,
  body:has(#iqitmegamenu-wrapper .cbp-hrsub:hover)::after,
  body:has(#iqitmegamenu-wrapper .cbp-hropen)::after{
    opacity: 1;
  }

  /* 3) header + sous-menu au-dessus du voile */
  #header, #iqitmegamenu-wrapper{ position: relative; z-index: 1001; }
  #iqitmegamenu-wrapper .cbp-hrsub{ z-index: 1002 !important; }
}

/* ==== Espace entre la barre du menu et le sous-menu ==== */
@media (min-width:1024px){
  /* règle générale (Warehouse/Iqit) */
  :root{ --mm-gap: 12px; } /* ajuste 8–20px selon ton goût */

  /* Décale le panneau vers le bas */
  #iqitmegamenu-wrapper .cbp-hrsub,
  .iqitmegamenu .iqitmegamenu-submenu,
  .iqitmegamenu .megamenu-submenu,
  .iqitmegamenu .mega-dropdown-menu,
  .iqitmegamenu .submenu,
  .menu .mega-dropdown-menu{
    top: calc(100% + var(--mm-gap)) !important; /* crée l'espace */
  }

  /* “Tunnel de hover” pour ne pas couper le survol */
  #iqitmegamenu-wrapper .cbp-hrsub::before,
  .iqitmegamenu .iqitmegamenu-submenu::before,
  .iqitmegamenu .megamenu-submenu::before,
  .iqitmegamenu .mega-dropdown-menu::before,
  .iqitmegamenu .submenu::before,
  .menu .mega-dropdown-menu::before{
    content:"";
    position:absolute;
    left:0; right:0;
    top: calc(-1 * var(--mm-gap));
    height: var(--mm-gap);           /* zone « vide » au-dessus du panneau */
    background: transparent;
    pointer-events: auto;            /* garde l’état ouvert pendant la traversée */
  }
}

/* ===== Fix flicker méga-menu : "pont" entre l’onglet et le panneau ===== */
@media (min-width:1024px){
  :root{ --mm-gap: 12px; } /* doit matcher la valeur que tu utilises déjà */

  /* 1) Le panneau reste décalé de --mm-gap */
  #iqitmegamenu-wrapper .cbp-hrsub{
    top: calc(100% + var(--mm-gap)) !important;
  }

  /* 2) TUNNEL côté onglet (li) : prolonge le hover vers le bas */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab{ position: relative; }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab::after{
    content:"";
    position:absolute;
    left:0; right:0;
    top:100%;
    height: var(--mm-gap);        /* remplit l’espace vide */
    pointer-events: auto;         /* garde le "mouseenter" actif */
    background: transparent;
    /* debug temporaire : background: rgba(255,0,0,.08); */
  }

  /* 3) Si le JS écoute le <a>, on couvre aussi ce cas */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link{ position:relative; }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link::after{
    content:"";
    position:absolute;
    left:0; right:0;
    top:100%;
    height: var(--mm-gap);
    pointer-events:auto;
    background: transparent;
  }

  /* 4) (déjà en place) tunnel côté panneau — on garde */
  #iqitmegamenu-wrapper .cbp-hrsub::before{
    content:"";
    position:absolute;
    left:0; right:0;
    top: calc(-1 * var(--mm-gap));
    height: var(--mm-gap);
    pointer-events:auto;
    background: transparent;
  }
}
/* ===== Méga-menu (desktop) : centre unique sous la barre, pour tous les onglets ===== */
@media (min-width:1024px){
  /* le wrapper sert de repère */
  #iqitmegamenu-wrapper{ position:relative; }

  /* tous les types de sous-menus utilisés par Iqit/Warehouse */
  #iqitmegamenu-wrapper .cbp-hrsub,
  .iqitmegamenu .iqitmegamenu-submenu,
  .iqitmegamenu .megamenu-submenu,
  .iqitmegamenu .mega-dropdown-menu,
  .iqitmegamenu .submenu,
  .menu .mega-dropdown-menu{
    position:absolute !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;   /* ← centrage réel */
    margin-left:0 !important;                /* annule les décalages hérités */
    inset-inline-start: auto !important;     /* coupe les règles RTL potentielles */
    
    /* largeur cohérente (facultatif si déjà défini chez toi) */
    width:min(1200px,75vw) !important;
  }

  /* sécurité : certains thèmes posent des règles sur l’onglet actif */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.cbp-hropen .cbp-hrsub{
    left:50% !important; transform:translateX(-50%) !important;
  }
}

/* Desktop ≥1024 — Sous-menu ancré sous le 1er lien (gauche du wrapper) */
@media (min-width:1024px){
  /* 0) le repère */
  #iqitmegamenu-wrapper{ position: relative; }

  /* 1) les onglets ne doivent PAS être le containing block */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab{ position: static !important; }

  /* 2) tunnel anti-flicker posé sur le <a> (et plus sur le <li>) */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link{ position: relative; }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link::after{
    content:""; position:absolute; left:0; right:0; top:100%;
    height: var(--mm-gap,12px); pointer-events:auto; background:transparent;
  }

  /* 3) sous-menu : ancré au wrapper (gauche 0), pas à l’onglet */
  #iqitmegamenu-wrapper .cbp-hrsub{
    position: absolute !important;
    left: 0 !important; right: auto !important; transform: none !important;
    top: calc(100% + var(--mm-gap,12px)) !important;
    width: min(1200px, 75vw) !important;   /* ajuste si besoin (100% pour coller au container) */
  }

  /* 4) tunnel côté panneau (on garde) */
  #iqitmegamenu-wrapper .cbp-hrsub::before{
    content:""; position:absolute; left:0; right:0;
    top: calc(-1 * var(--mm-gap,12px)); height: var(--mm-gap,12px);
    pointer-events:auto; background:transparent;
  }
}


/* Mobile ≤ 767px — NOS SKIS D’OCCASION */
@media (max-width:767px){
  /* Masquer le bouton */
  .elementor-element.elementor-element-ybiyyk1 
    .elementor-iqit-banner .elementor-iqit-banner-content > div,
  .elementor-element.elementor-element-ybiyyk1 
    .elementor-iqit-banner .elementor-button-link{
    display:none !important;
  }

  /* Remonter le titre */
  .elementor-element.elementor-element-ybiyyk1 
    .elementor-iqit-banner .elementor-iqit-banner-title{
    margin-top:-20px !important;   /* ajuste la valeur (-15 / -25px) */
	font-size:30px !important;
  }
}

.mbr{display:none}
@media (max-width:767px){
  .mbr{display:block} /* force le retour à la ligne en mobile */
  .elementor-element.elementor-element-ybiyyk1 
    .elementor-iqit-banner .elementor-iqit-banner-title{
    margin-top:-20px !important; /* remonte le titre si besoin */
    text-align:center !important;
  }
}

/* Mobile ≤ 767px — centrer le titre pour la colonne ybiyyk1 */
@media (max-width:767px){
  /* 1) Centrer au niveau du conteneur parent (écrase un éventuel left) */
  .elementor-element.elementor-element-ybiyyk1 .elementor-widget-container,
  .elementor-element.elementor-element-ybiyyk1 .elementor-iqit-banner,
  .elementor-element.elementor-element-ybiyyk1 .elementor-iqit-banner .elementor-iqit-banner-content{
    text-align:center !important;
  }

  /* 2) Remonter le titre et garantir le centrage même si un style résiste */
  .elementor-element.elementor-element-ybiyyk1 .elementor-iqit-banner .elementor-iqit-banner-title{
    margin-top:-20px !important;   /* ajuste -15 / -25px */
    display:inline-block;          /* permet le centrage via text-align du parent */
    margin-left:auto;              /* filet de sécurité */
    margin-right:auto;
  }
}
/* Desktop ≥1024px — Bannière CHAUSSURES DE SKI (widget ldmyu4t) */
@media (min-width:1024px){
  /* Remonter le bloc texte (contenu aligné en bas) */
  .elementor-element.elementor-element-ldmyu4t 
    .elementor-iqit-banner .elementor-iqit-banner-content{
    transform: translateY(-14px); /* ajuste -10 Ã  -20px si besoin */
  }
  /* Si le widget positionne au bottom:0; préfère ceci à la place :
  .elementor-element.elementor-element-ldmyu4t 
    .elementor-iqit-banner .elementor-iqit-banner-content{
    bottom: 14px;
  } */

  /* Titre : un chouïa d’air au-dessus du bouton */
  .elementor-element.elementor-element-ldmyu4t 
    .elementor-iqit-banner .elementor-iqit-banner-title{
    margin-bottom: 10px; /* 8–14px selon rendu */
  }

  /* Bouton : espace au-dessus pour l’aérer */
  .elementor-element.elementor-element-ldmyu4t 
    .elementor-iqit-banner .elementor-iqit-banner-content > div,
  .elementor-element.elementor-element-ldmyu4t 
    .elementor-iqit-banner .elementor-button-link{
    margin-top: 12px;      /* 10–16px selon rendu */
    display: inline-block; /* garantit que la marge s’applique */
  }
}


/* ===== Desktop ≥1024px — Bloc marques (section 5rvvul2, widget 7f8wiry) ===== */
@media (min-width:1024px){
  /* Le wrapper du carrousel sert de référence et ne clippe pas */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper{
    position: relative !important;
    overflow: visible !important;
    z-index: 1 !important;
  }

  /* Le slider reste sous les flèches */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .swiper,
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .swiper-container{
    position: relative !important;
    z-index: 1 !important;
    overflow: visible !important;
  }

  /* Flèches : style, centrage vertical et superposition */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button{
    /* variables de réglage */
    --btn: 44px;          /* diamètre du bouton */
    --tweak: -10px;       /* offset horizontal (+/- pour sortir/rentrer) */

    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin-top: -0.5px !important;      /* micro-ajustement vertical */
    z-index: 999 !important;

    width: var(--btn); height: var(--btn);
    border-radius: 9999px;
    display: flex; align-items: center; justify-content: center;

    background: #fff !important;
    border: 2px solid #264aa5 !important;
    color: #264aa5 !important;
    box-shadow: none !important;
    opacity: 1 !important;              /* jamais transparent */
    pointer-events: auto !important;
    transition: background-color .18s, color .18s, border-color .18s;
  }

  /* Position latérale : à cheval sur la bordure du cadre */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button-prev{
    left: calc((var(--btn) / -2) + var(--tweak)) !important;
    right: auto !important;
  }
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button-next{
    right: calc((var(--btn) / -2) + var(--tweak)) !important;
    left: auto !important;
  }

  /* Hover : fond bleu, flèche blanche (comme la maquette) */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button:not([aria-disabled="true"]):hover{
    background:#264aa5 !important;
    border-color:#264aa5 !important;
    color:#fff !important;
  }

  /* Désactivées : pas de fade */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button.swiper-button-disabled,
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button[aria-disabled="true"]{
    opacity:1 !important;
    background:#fff !important;
    border-color:#264aa5 !important;
    color:#264aa5 !important;
  }

  /* S’assure que l’icône suive la couleur (si SVG) */
  .elementor-brands-carousel-wrapper > .elementor-swiper-button i,
  .elementor-brands-carousel-wrapper > .elementor-swiper-button svg{
    color: inherit !important;
    fill: currentColor !important;
    stroke: currentColor !important;
  }
}

/* Desktop ≥1024px — décale légèrement les flèches à côté du titre */
@media (min-width:1024px){
  /* espace naturel entre le H4 et les flèches */
  .elementor-element-qifkg9i .news-head{
    --gap: 14px;              /* ← augmente (16/18) pour écarter un peu plus */
    gap: var(--gap);
  }
  /* micro décalage fin du bloc flèches par rapport au titre */
  .elementor-element-qifkg9i .news-head-nav{
    --offset: 40px;            /* ← + vers la droite, - vers la gauche */
    margin-left: var(--offset);
  }
  /* (optionnel) réglage vertical si besoin d’un poil plus haut/bas */
  .elementor-element-qifkg9i .news-head .elementor-swiper-button{
    transform: translateY(0);  /* mets 1px ou -1px si nécessaire */
  }
}
/* === Marque - carrousel sous "DÉCOUVREZ..." === */
@media (min-width:1024px){
  /* Le wrapper peut dépasser (pour les flèches) */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper{
    position: relative !important;
    overflow: visible !important;
    z-index: 1 !important;
  }

  /* MAIS le slider DOIT clipper les logos */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper .swiper,
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper .swiper-container,
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper .swiper-container-wrapper{
    overflow: hidden !important; /* <-- la clé */
  }

  /* Slides cadrés et centrés */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .swiper-wrapper{
    align-items: center !important;
  }
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .swiper-slide{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 90px !important;   /* hauteur “cadre” */
    padding: 8px !important;   /* un peu d’air */
    box-sizing: border-box !important;
  }

  /* Logos contenus dans le cadre */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .swiper-slide img{
    max-height: 74px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
  }
}
/* === Flèches carrousel marques — hover toujours bleu (#264aa5) === */
@media (min-width:1024px){
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button{
    --blue: #264aa5;
    background:#fff !important;
    border:2px solid var(--blue) !important;
    color:var(--blue) !important;
    /* on garde le hover actif même si disabled */
    pointer-events:auto !important;
  }

  /* HOVER: même si disabled -> fond bleu + flèche blanche */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button:hover,
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button.swiper-button-disabled:hover,
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button[aria-disabled="true"]:hover{
    background:var(--blue) !important;
    border-color:var(--blue) !important;
    color:#fff !important;
  }

  /* État "désactivé" au repos (non hover) : visible */
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button.swiper-button-disabled,
  .elementor-element.elementor-element-5rvvul2
  .elementor-element.elementor-element-7f8wiry
  .elementor-brands-carousel-wrapper > .elementor-swiper-button[aria-disabled="true"]{
    opacity:1 !important;
    background:#fff !important;
    border-color:var(--blue) !important;
    color:var(--blue) !important;
  }

  /* Icônes héritent de la couleur */
  .elementor-brands-carousel-wrapper > .elementor-swiper-button i,
  .elementor-brands-carousel-wrapper > .elementor-swiper-button svg{
    color:inherit !important;
    fill:currentColor !important;
    stroke:currentColor !important;
  }
}

	

.product_header_container #product-availability, .product_p_price_container #product-availability

 {

    display: none;
}

/* Icône “?” à côté du libellé État d’usure (attribut ID 18) */
.product-variants-item-18 .form-control-label .attr-help.extra1-help{
  display:inline-flex; align-items:center; justify-content:center;
  margin-left:8px; font-size:16px; line-height:1;
  color:#264aa5; text-decoration:none; cursor:pointer;
  vertical-align:middle;
}
.product-variants-item-18 .form-control-label .attr-help.extra1-help:hover{ color:#000; }
.product-variants-item-18 .form-control-label .attr-help.extra1-help i{ line-height:1; pointer-events:none; }
.product-variants-item-18 .form-control-label .attr-help.extra1-help .sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;
}
/* ===== Desktop ≥1024px — encadrer la colonne de droite ===== */
@media (min-width:1024px){
  .page-product .col-product-info{
    background:#fff;
    border-radius:10px;
    box-shadow:0 12px 24px rgba(31,60,144,.06);
    padding:24px;
    position:relative;
    z-index:0;
    overflow:visible; /* évite de couper des éléments internes */
  }

  /* Nettoyage : pas de double-fond sur les blocs internes courants */
  .page-product .col-product-info .product-information,
  .page-product .col-product-info .product-prices,
  .page-product .col-product-info .product-actions,
  .page-product .col-product-info .product-variants,
  .page-product .col-product-info .product-add-to-cart{
    background:transparent;
  }

  /* Bords propres */
  .page-product .col-product-info > *:first-child{ margin-top:0; }
  .page-product .col-product-info > *:last-child{  margin-bottom:0; }
}

/* Tablette (optionnel) : carton un peu plus compact */
@media (min-width:768px) and (max-width:1023px){
  .page-product .col-product-info{
    background:#fff;
    border-radius:14px;
    box-shadow:0 10px 20px rgba(31,60,144,.05);
    padding:20px;
  }
}
	
.product-miniature{
 border-radius:10px !important;
}

	
/* 1) Le bloc réassurances reste au-dessus, blanc, avec sa bordure/radius */
.elementor-element.elementor-element-0of2vrt.home-reass{
  position: relative;
  z-index: 2; /* au-dessus de la section bleue */
  /* laisse le background blanc + border + radius gérés par Elementor */
}

/* 2) La section bleue remonte derrière la moitié du bloc précédent */
.elementor-element.elementor-element-qmw0wy4{
  --overlap: 110px; /* ← ajuste la remontée (ex: 80px / 120px / 50%) */
  position: relative;
  z-index: 1; /* derrière le bloc réassurances */
  background-color: #f6fafe !important;

  /* fait “remonter” l’arrière-plan sous le bloc du dessus */
  margin-top: calc(var(--overlap) * -1);

  /* compense la remontée pour ne pas écraser son contenu */
  /* mets ici la marge haute d’origine + la valeur d'overlap */
  padding-top: calc(var(--overlap) + 32px);
}

/* (optionnel) si un overlay Elementor recolore la section, on l’unifie */
.elementor-element.elementor-element-qmw0wy4 > .elementor-background-overlay{
  background: #f6fafe !important;
  opacity: 1 !important;
}

/* Bloc blanc arrondi pour les pages blog */
body.page-blog #content-wrapper,
body#module-ph_simpleblog-single #content-wrapper {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
  padding: 40px 50px; /* espace interne */
  margin: 30px auto;  /* centrage */
}


/* === CMS : bloc blanc arrondi + ombre sur le contenu === */
/* Cible <section id="content" class="page-content page-cms page-cms-XX"> */
#content.page-cms.page-content {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
  padding: 40px 50px;
  margin: 30px auto;      /* centrage + espace haut/bas */
}

/* Optionnel : lisibilité du texte et des listes dans la zone CMS */
#content.page-cms.page-content .rte-content p { margin-bottom: 1rem; }
#content.page-cms.page-content .rte-content ul,
#content.page-cms.page-content .rte-content ol { margin: 0 0 1.1rem 1.25rem; }

/* Images intégrées : coins doux et plein large */
#content.page-cms.page-content .rte-content img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  display: block;
}

/* Responsive */
@media (max-width: 991px){
  #content.page-cms.page-content { padding: 28px 28px; }
}
@media (max-width: 575px){
  #content.page-cms.page-content {
    padding: 22px 18px;
    border-radius: 14px;
    margin: 20px 10px; /* un peu d’air sur mobile */
  }
}

/* Disclaimer photos PDP */
.skidisc-legal-note {
  display: inline-flex;
  align-items: flex-start;
  gap: 6px;

  margin-top: 0.75rem;
  padding: 0.5rem 0.75rem;

  font-size: 0.8125rem;  /* ~13px */
  line-height: 1.4;
  color: #374151;        /* gris foncé (lisible mais pas trop fort) */

  border: 1px solid #e5e7eb; /* gris clair */
  border-radius: 8px;
  background-color: #f9fafb; /* gris très clair */
}

/* Petit pictogramme avant le texte */
.skidisc-legal-note::before {
  content: "!";
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-top: 2px;

  font-weight: 700;
  font-size: 0.75rem;
  line-height: 18px;
  text-align: center;

  color: #b45309;         /* orange foncé */
  background-color: #fef3c7; /* orange clair */
  border-radius: 50%;
  flex-shrink: 0;
}

	/* Fiche produit uniquement */
.page-product .product-prices .discount,
.page-product .product-prices .discount-percentage,
.page-product .product-prices .badge-discount {
  display: none !important;
}

	
	/* MOBILE */
@media (max-width: 991.98px){
  .header-nav .left-nav{ display: none !important; }
  .header-nav .right-nav{ display: none !important; }
}

@media (max-width: 767px){
  #footer .block-toggle>.block-title{ border-bottom: 1px solid #686868; }
  #amazzing_filter .compact-toggle{ display: none !important; }
}

/* (règle fermée correctement) */
.product-flags .discount,
.product-flags .on-sale{
  background: #FF7234;
  color: #fff;
}

/* Ce @media doit être séparé, pas imbriqué */
@media (max-width: 768px){
  .right-nav{ display: none; }
}

/* ===== Badge remise en rond orange ===== */

/* S'assure que le conteneur image est une référence de positionnement */
.product-miniature .thumbnail-container,
.page-product .product-cover{ position:relative; }

/* Place le groupe de badges en haut-gauche de l'image */
.product-miniature .product-flags,
.page-product .product-flags{
  position:absolute; top:12px; left:12px; z-index:5;
  display:flex; gap:8px; list-style:none; margin:0; padding:0;
}

/* Le badge -% uniquement en rond orange */
.product-flags .product-flag.discount{
  background:#ff6a3d !important;      /* orange */
  color:#fff !important;
  border:none !important;
  border-radius:9999px !important;
  width:56px; height:56px;             /* desktop */
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:14px; line-height:1;
  padding:0 !important;
  box-shadow:0 6px 16px rgba(0,0,0,.08);
  text-transform:none;                  /* garde “-18%” propre */
}

/* Taille du badge sur mobile/tablette */
@media (max-width:1023px){
  .product-flags .product-flag.discount{
    width:44px; height:44px; font-size:12px;
  }
}

/* Badge % toujours rond, toutes tailles & variantes */
.product-miniature .product-flags .product-flag.discount,
.product-miniature .product-flags .product-flag.discount-percentage,
.product-miniature .product-flags .product-flag.flag-discount,
.page-product .product-flags .product-flag.discount,
.page-product .product-flags .product-flag.discount-percentage,
.page-product .product-flags .product-flag.flag-discount,
.product-flags .product-flag[class*="discount"] {
  background: #ff6a3d !important;
  color: #fff !important;
  border: none !important;
  border-radius: 9999px !important;   /* rond forcé */
  width: 56px !important;
  height: 56px !important;
  aspect-ratio: 1 / 1 !important;     /* garde le cercle même si width/height bougent */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  box-shadow: 0 6px 16px rgba(0,0,0,.08) !important;
  text-transform: none !important;
  overflow: hidden !important;
}

/* Taille réduite en viewport étroit, mais toujours rond */
@media (max-width:1023px){
  .product-miniature .product-flags .product-flag[class*="discount"],
  .page-product .product-flags .product-flag[class*="discount"],
  .product-flags .product-flag[class*="discount"]{
    width: 44px !important;
    height: 44px !important;
    font-size: 12px !important;
  }
}

/* Tous les pastilles couleur : rond par défaut */
#product .product-variants .input-color + span{
  border-radius: 50% !important;  /* rond même non sélectionné */
  border: none !important;         /* sans bordure si tu veux un look “clean” */
  width: 28px;                     /* adapte la taille si besoin */
  height: 28px;
  display: inline-block;           /* sécurité */
  overflow: hidden;                /* coupe l'image si swatch = image */
}

/* État sélectionné / survol : pas de bordure + option d'anneau de sélection */
#product .product-variants .input-color:checked + span,
#product .product-variants .input-color:hover + span{
  border: none !important;
  /* Option : un anneau autour pour mieux voir la sélection */
  /* box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--brand, #e1121b); */
}

/* Accessibilité clavier : anneau quand le radio a le focus */
#product .product-variants .input-color:focus-visible + span{
  outline: 2px solid var(--brand, #e1121b);
  outline-offset: 2px;
}

/* Déclinaison sélectionnée : bord noir 1px */
#product .product-variants .input-color:checked + span{
  border: 1px solid #000 !important;
  box-sizing: border-box; /* garantit que le bord ne rogne pas le rond */
}


/* Appliquer la couleur au texte et à l'icône */
.elementor-accordion-title .elementor-accordion-icon i.fa,
.elementor-accordion-title span[itemprop="name"] {
  color: #255BA6 !important; /* Couleur bleu pour texte et flèche */
}

/* Remplacer l'icône "+" par une flèche vers le bas */
.elementor-accordion-title .elementor-accordion-icon i.fa::before {
  content: "\f078" !important; /* Font Awesome: fa-chevron-down */
}

/* Flèche vers le haut quand l'accordéon est ouvert */
.elementor-accordion-title.active .elementor-accordion-icon i.fa::before {
  content: "\f077" !important; /* Font Awesome: fa-chevron-up */
}

/* S'assurer que l'icône est bien alignée */
.elementor-accordion-title .elementor-accordion-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
/* Style de l'accordéon pour la page catégorie */
.category-accordion-title {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important; /* Aligne texte et icône à gauche */
  gap: 8px !important; /* Espace entre texte et icône */
  cursor: pointer;
  padding: 10px 0; /* Ajuste selon ton design */
}

.category-accordion-title .accordion-text {
  color: #255BA6 !important; /* Couleur du texte "Voir plus" */
  font-size: 16px !important;
  font-weight: 600 !important;
}

.category-accordion-title .category-accordion-icon {
  order: 2 !important; /* Place l'icône après le texte */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.category-accordion-title .category-accordion-icon i.fa {
  color: #255BA6 !important; /* Couleur de l'icône */
}

.category-accordion-title .category-accordion-icon i.fa::before {
  content: "\f078" !important; /* Font Awesome: fa-chevron-down */
}

.category-accordion-title.active .category-accordion-icon i.fa::before {
  content: "\f077" !important; /* Font Awesome: fa-chevron-up */
}

/* Contenu de l'accordéon */
.category-description-additional {
  padding: 15px 0; /* Espace interne */
  display: none; /* Masqué par défaut (géré par Bootstrap .collapse) */
}

.category-description-additional.show {
  display: block !important; /* Affiché quand ouvert */
}

.category-image img {
  border-radius: 10px !important; /* Coins arrondis comme dans ton CSS */
}

/* Réduit l’espace sous l’image de catégorie */
.category-description-wrapper .category-image {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Réduit aussi l’espace en dessous du wrapper complet */
.category-description-wrapper {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Surcharge spécifique pour le sélecteur "Trier par" */
.select-title.form-control {
  background: #FFFFFF 0% 0% no-repeat padding-box !important;
  border: 1px solid #000000 !important;
  border-radius: 5px !important;
  color: #000000 !important;
  box-shadow: none !important; /* enlève tout éventuel effet */
}
.category-additional-description,
.category-description-wrapper {
    background: none !important;

}

/* Footer newsletter — taille de police de l'input */
#footer .ps-emailsubscription-block .newsletter-input-group
input.form-control.input-subscription[name="email"][type="email"]{
  font-size: 14px !important;
  line-height: 1.4 !important; /* pour un rendu propre */
}
#footer .ps-emailsubscription-block .newsletter-input-group
input.form-control.input-subscription[name="email"][type="email"]::placeholder{
  font-size: inherit; /* placeholder à la même taille */
}

/* Cacher l'image de catégorie en mobile */
@media (max-width: 767.98px){
  body#category .category-image{
    display: none !important;
  }
}
/* Cible uniquement <button> qui possède TOUTES ces classes */
button.loadMore.next.button.lnk_view.btn.btn-primary{
      font-size: 13px;
    font-weight: 600;
	padding: 15px;
}
/* Bouton "Filtrer" en mobile */
@media (max-width: 991.98px){
  a.btn.btn-primary.compact-toggle.type-2.ready.hidden-md-up{
    background: transparent !important;
    color: #265BA6 !important;
    border: 1px solid #265BA6 !important;
  }
}

/* Bouton Filtrer (mobile) avec icône à gauche */
@media (max-width: 991.98px){
  a.btn.btn-primary.compact-toggle.type-2.ready.hidden-md-up{
    display: inline-flex;              /* aligne icône + texte */
    align-items: center;
    gap: 10px;                         /* espace icône/texte */
    background: transparent !important;
    color: #265BA6 !important;
    border: 1px solid #265BA6 !important;
    padding: 10px 16px;
    border-radius: 9999px;
	font-weight: 600;
  }
  a.btn.btn-primary.compact-toggle.type-2.ready.hidden-md-up::before{
    content: "";
    width: 22px; height: 22px;         /* taille de l'icône */
    display: inline-block;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none"><g stroke="%23265BA6" stroke-width="2.2" stroke-linecap="round"><line x1="4" y1="7" x2="24" y2="7"/><line x1="4" y1="14" x2="24" y2="14"/><line x1="4" y1="21" x2="24" y2="21"/><circle cx="8" cy="7" r="2"/><circle cx="18" cy="14" r="2"/><circle cx="12" cy="21" r="2"/></g></svg>') no-repeat center / contain;
    pointer-events: none;
  }

  /* Hover/focus : inversion (fond bleu, texte blanc) + icône blanche */
  a.btn.btn-primary.compact-toggle.type-2.ready.hidden-md-up:hover,
  a.btn.btn-primary.compact-toggle.type-2.ready.hidden-md-up:focus{
    background: #265BA6 !important;
    color: #fff !important;
    border-color: #265BA6 !important;
  }
  a.btn.btn-primary.compact-toggle.type-2.ready.hidden-md-up:hover::before,
  a.btn.btn-primary.compact-toggle.type-2.ready.hidden-md-up:focus::before{
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none"><g stroke="%23ffffff" stroke-width="2.2" stroke-linecap="round"><line x1="4" y1="7" x2="24" y2="7"/><line x1="4" y1="14" x2="24" y2="14"/><line x1="4" y1="21" x2="24" y2="21"/><circle cx="8" cy="7" r="2"/><circle cx="18" cy="14" r="2"/><circle cx="12" cy="21" r="2"/></g></svg>');
  }
}

/* Mobile ≤ 992px — "Trier par" en pilule bleue, comme "Filtres" */
@media (max-width: 991.98px){

  /* le bouton de tri (toutes variantes Warehouse) */
  #js-product-list-top .products-selection .products-sort-order .select-title.expand-more.form-control,
  #js-product-list-top .products-selection .select-title.expand-more.form-control,
  #js-product-list-top .select-title.expand-more.form-control,
  .products-selection .products-sort-order .select-title.expand-more.form-control,
  .select-title.expand-more.form-control.select-title.form-control { /* sur-spécificité */
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: transparent !important;
    color: #265BA6 !important;
    border: 1px solid #265BA6 !important;
    border-radius: 9999px !important;
    padding: 10px 16px !important;
    height: auto !important;
    width: auto !important;
    box-shadow: none !important;
  }

  /* remplace le libellé dynamique par "Trier par" (plusieurs cas de markup) */
  .select-title.expand-more.form-control .select-title-name,
  .select-title.expand-more.form-control > span{
    font-size: 0 !important;             /* masque "Pertinence" */
  }
  .select-title.expand-more.form-control .select-title-name::after,
  .select-title.expand-more.form-control > span::after{
    content: "Trier par";
    font-size: 14px;
    font-weight: 600;
    color: #265BA6;
  }

  /* chevron (s'il existe) en bleu */
  .select-title.expand-more.form-control .fa,
  .select-title.expand-more.form-control i[class*="fa-"]{
    color: #265BA6 !important;
    margin-left: 6px;
  }
}
/* 1) Neutraliser tous les séparateurs existants */
nav.breadcrumb .navigation-pipe,
nav.breadcrumb .separator,
.breadcrumb .navigation-pipe,
.breadcrumb .separator{
  display:none !important;
}

/* ====== Mobile (≤767px) — Alignement titre + bouton sous Elementor Banner ====== */
@media (max-width:767px){

  /* Conteneur de contenu : colonne, aligné à gauche, padding uniforme */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content{
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;  /* bouton aligné exactement sous le texte */
    text-align: left !important;
    gap: 10px !important;                /* espace entre titre/desc/bouton */
    padding: 6px 15px 14px !important;   /* au lieu de padding sur chaque élément */
  }

  /* Neutralise les paddings/margins internes pour s’aligner au conteneur */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content .elementor-iqit-banner-title,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content .elementor-iqit-banner-title,
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content .elementor-iqit-banner-desc,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content .elementor-iqit-banner-desc{
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 30px !important;  }

  /* Le <div> qui enveloppe le bouton dans ton HTML */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content > div,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content > div{
    display: block !important;
    align-self: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  /* Le bouton lui-même (peut être .elementor-button ou .elementor-button-link) */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content .elementor-button,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content .elementor-button,
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content .elementor-button-link,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content .elementor-button-link{
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: flex-start !important;   /* colle sous le texte */
    margin: 0 !important;                /* écrase l’ancien margin-left:15px */
    min-height: 44px !important;
    padding: 10px 16px !important;
  }

  /* Supprime explicitement la vieille règle qui décale le bouton */
  .elementor-iqit-banner-content .elementor-button.elementor-size-small{
    margin-left: 0 !important;
  }
}
/* ====== Mobile (≤767px) — Bannières Elementor fix ====== */
@media (max-width:767px){

  /* Cadre + image en cover */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner{
    position: relative !important;
    min-height: 300px !important;        /* ajuste 340–420px au besoin */
    overflow: hidden !important;
    border-radius: 10px;
  }
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner .elementor-iqit-banner-img,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner .elementor-iqit-banner-img{
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
  }
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner .elementor-iqit-banner-img > img,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner .elementor-iqit-banner-img > img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
  }

  /* Contenu en overlay, remonté */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content{
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;          /* ← remonté */
    padding: clamp(14px, 7vw, 56px) 18px 18px !important;
    text-align: left !important;
  }

  /* Neutralise les paddings + crée l’espace fiable au-dessus du bouton */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content .elementor-iqit-banner-title,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content .elementor-iqit-banner-title,
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content .elementor-iqit-banner-desc,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content .elementor-iqit-banner-desc{
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    margin-bottom: 20px !important;       /* ← ta règle qui marche */
  }

  /* Titre un peu compact */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-title,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-title{
    font-size: 27px; !important;
    line-height: 1.12 !important;
  }

  /* Wrapper du bouton : pas de marge parasite */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content > div,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content > div{
    margin: 0 !important;
    padding: 0 !important;
    align-self: flex-start !important;
  }

  /* Bouton propre */
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content .elementor-button,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content .elementor-button,
  .elementor-element.elementor-element-8o2mx9p .elementor-iqit-banner-content .elementor-button-link,
  .elementor-element.elementor-element-hw3gkfw .elementor-iqit-banner-content .elementor-button-link{
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    min-height: 44px !important;
    padding: 10px 16px !important;
  }

  /* Nettoyage des vieux décalages */
  .elementor-iqit-banner-content .elementor-button.elementor-size-small{
    margin-left: 0 !important;
  }
}
/* ===== Footer mobile (≤767.98px) — purge du carré à gauche, titres décalés ===== */
@media (max-width: 767.98px){

  /* 0) Masquer les titres des blocs 2 et 3 comme prévu (logo/FAQ) */
  #footer-container-main #iqithtmlandbanners-block-2 > h5.block-title,
  #footer-container-main #iqithtmlandbanners-block-3 > h5.block-title{
    display: none !important;
  }

  /* 1) Titres des onglets : vrai décalage + place pour la flèche */
  #footer-container-main .block.block-toggle > h5.block-title{
    position: relative !important;
    display: block !important;
    padding: 16px 40px 16px 20px !important; /* ← texte à droite + espace chevron */
    margin: 0 !important;
    border-top: 1px solid #E1E6EF !important; /* hr au-dessus de chaque titre */
    background: none !important;
    list-style: none !important;              /* si le thème force list-item */
    text-indent: 0 !important;
  }
  #footer-container-main .block.block-toggle:first-of-type > h5.block-title{
    border-top: 0 !important;                 /* pas de hr sur le 1er */
  }
  #footer-container-main .block.block-toggle > .block-content{
    border-bottom: 1px solid #E1E6EF !important;
    padding-bottom: 12px !important;
  }

  /* 2) KILL total des “carrés” ajoutés à gauche (toutes variantes) */
  #footer-container-main .block.block-toggle > h5.block-title::before,
  #footer-container-main .block.block-toggle > h5.block-title > span::before{
    content: none !important;
    display: none !important;
    background: none !important;
    border: 0 !important;
    width: 0 !important; height: 0 !important;
    margin: 0 !important; padding: 0 !important;
  }
  /* au cas où le thème mettrait un vrai élément */
  #footer-container-main .block.block-toggle > h5.block-title > i:first-child,
  #footer-container-main .block.block-toggle > h5.block-title > svg:first-child,
  #footer-container-main .block.block-toggle > h5.block-title > .fa:first-child{
    display: none !important;
  }
  /* si un marqueur de liste était activé */
  #footer-container-main .block.block-toggle > h5.block-title::marker{
    content: "" !important;
  }

  /* 3) Chevron du thème conservé à droite (on s'assure qu'il y reste) */
  #footer-container-main .block.block-toggle > h5.block-title::after,
  #footer-container-main .block.block-toggle > h5.block-title > span::after{
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) rotate(0deg) !important;
    margin: 0 !important;
    line-height: 1 !important;
  }
  #footer-container-main .block.block-toggle.open  > h5.block-title::after,
  #footer-container-main .block.block-toggle.active> h5.block-title::after,
  #footer-container-main .block.block-toggle.open  > h5.block-title > span::after,
  #footer-container-main .block.block-toggle.active> h5.block-title > span::after{
    transform: translateY(-50%) rotate(180deg) !important;
  }
}
/* Mobile (≤767.98px) — Banner "Nos chaussures de ski" : centrage bas-centre */
@media (max-width: 767.98px){
  .page-index .elementor-element.elementor-element-3tgw43j .elementor-iqit-banner-content{
    position: absolute !important;
    left: 50% !important;          /* centre le conteneur */
    right: auto !important;
    bottom: 16px !important;       /* garde l’ancrage bas */
    top: auto !important;
    transform: translateX(-50%) !important; /* recentre réellement */
    width: calc(100% - 30px) !important;    /* respirations latérales */
    padding: 0 15px !important;
    margin: 0 !important;
    text-align: center !important; /* titre + bouton centrés */
    z-index: 2;
  }

  /* espace propre entre titre et bouton */
  .page-index .elementor-element.elementor-element-3tgw43j .elementor-iqit-banner-title{
    margin: 0 0 12px !important;
  }
  .page-index .elementor-element.elementor-element-3tgw43j .elementor-iqit-banner-content > div{
    display: inline-block !important; /* bouton centré dans le texte */
    margin: 0 !important;
  }
}
/* Menu mobile — différencier titre de colonne vs liens */
@media (max-width: 991.98px){
  /* Titre de colonne : SPAN direct du bloc colonne */
  .mobile-menu__row .mobile-menu__column > .mobile-menu__column-title{
    display:block;
    margin: 18px 0 12px;
    color:#255BA6 !important;   /* bleu marque */
    font-weight:800 !important; /* gras */
  }

  /* Liens sous le titre : A dans les items de catégories */
  .mobile-menu__row .mobile-menu__column .cbp-category-link-w a.mobile-menu__column-title{
    color:#111 !important;      /* noir */
    font-weight:500 !important; /* normal/medium */
  }
  .mobile-menu__row .mobile-menu__column .cbp-category-link-w a.mobile-menu__column-title:hover{
    color:#255BA6 !important;   /* hover bleu si tu veux */
  }
}
/* === CTAs dans le menu mobile (Warehouse) === */
@media (max-width: 991.98px){
  .mobile-menu__extras{
    padding: 18px 16px 24px;
  }

  /* Boutons full-width, arrondis, typographie cohérente */
  .mobile-menu__extras .mobile-cta{
    display: block;
    width: 100%;
    border-radius: 9999px;
    padding: 14px 20px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: .2px;
    margin: 0 0 14px;
  }

  /* FAQ = plein bleu */
  .mobile-menu__extras .footer-btn-faq{
    background: #255BA6;
    color: #fff !important;
    border: 0;
  }
  .mobile-menu__extras .footer-btn-faq:hover {
            background-color: #FF7234;
	  }

  /* Contact = contour bleu + icône alignée */
  .mobile-menu__extras .footer-btn-contact{
    background: transparent;
    color: #111 !important;
    border: 2px solid #255BA6;
  }
  .mobile-menu__extras .footer-btn-contact .footer-btn-icon{
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
  }

  /* Sécurité: pas d’effets de menu sur nos CTAs */
  .mobile-menu__row .mobile-menu__column .cbp-category-link-w .mobile-cta{
    color: inherit;
  }
}

/* Masquer le titre "CONTACT MENU" uniquement pour ce bloc */
#iqithtmlandbanners-block-4 > h5.block-title{
  display: none !important;
}
/* Langues au-dessus du megamenu (desktop) */
@media (min-width: 992px){
  #header #_desktop_language_selector,
  #header .language-selector,              /* fallback thèmes/modules */
  #header .dropdown.languages {
    position: relative;
    z-index: 5001;                        /* > barre bleue / overlay */
    overflow: visible;
  }
  #header #_desktop_language_selector .dropdown-menu,
  #header .language-selector .dropdown-menu{
    z-index: 5002 !important;             /* force le menu déroulant devant */
  }

  /* évite tout clipping local */
  #header .header-bottom,
  #header .top-nav{ overflow: visible; }
}

/* Diverses corrections css */
/* Supprime le fond blanc des cartes blog */
.simpleblog__listing__post__wrapper,
.simpleblog__listing__post__wrapper:hover,
.simpleblog__listing__post__wrapper:focus{
  background-color: transparent !important; /* ou: background: none !important; */
}

/* Uniquement pour .product-tabs */
@media (min-width: 992px){
	#product .product-tabs{
  padding: 40px !important;   /* remplace le 16px de la règle groupée */
}
}
#header .container,
#checkout-header .container {
  max-width: 95% !important;
  margin: 0 auto; /* centre le bloc */
}
.elementor-button.elementor-size-small {
  padding: 15px 30px;
}
/* ≤ 767px = mobile */
@media (max-width: 767px){
  body#product .product_header_container .page-title{
    font-size: 28px !important;
  }
}
@media (max-width: 767px) {
  .swiper-container-wrapper .product-carousel {
    padding: 20px; /* adapte la valeur selon ton besoin */
  }
}
/* STEP 1 — Reset ciblé (Mobile ≤ 767.98px) pour la bannière 3tgw43j */
@media (max-width: 767.98px){
  .page-index .elementor-element.elementor-element-3tgw43j .elementor-iqit-banner,
  .page-index .elementor-element.elementor-element-3tgw43j .elementor-iqit-banner-content{
    position: relative !important;
    top: auto !important; bottom: auto !important;
    left: auto !important; right: auto !important;
    transform: none !important;
  }

  .page-index .elementor-element.elementor-element-3tgw43j{
    margin: 0 !important;                /* annule les marges injectées */
  }

  .page-index .elementor-element.elementor-element-3tgw43j .elementor-iqit-banner-content{
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    z-index: 2;
  }
}
/* STEP 2 — Pattern hero (Mobile ≤ 767.98px) pour la bannière 3tgw43j */
@media (max-width: 767.98px){
  .elementor-element-3tgw43j .elementor-iqit-banner{
    /* hauteur + padding responsives */
    --hero-h: clamp(280px, 72vw, 360px);
    --pad-x: 12px;
    --pad-y: 16px;

    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;  /* texte en haut */
    align-items: center !important;

    min-height: var(--hero-h) !important;
    padding: var(--pad-y) var(--pad-x) !important;

    background: #264aa5 url('/img/cms/home/img/skioccas-chaussures-bg-2.jpg') center/cover no-repeat !important;

    border-radius: 18px !important;
    overflow: hidden;
    margin: 0 8px;
    box-sizing: border-box;
  }

  /* On n'utilise que le background, on cache l'<img> interne */
  .elementor-element-3tgw43j .elementor-iqit-banner-img img{
    display: none !important;
  }

  /* Contenu propre */
  .elementor-element-3tgw43j .elementor-iqit-banner-content{
    position: relative !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 auto !important;
  }

  /* Titre lisible et fluide */
  .elementor-element-3tgw43j .elementor-iqit-banner-title{
    color: #fff !important;
    font-weight: 800 !important;
    font-size: clamp(1.9rem, 6.8vw, 2.3rem) !important; /* ~30–37px */
    line-height: 1.1 !important;
    margin: 6px 0 0 !important;
  }

  /* Option : masquer le bouton sur mobile */
  .elementor-element-3tgw43j .elementor-iqit-banner-content .elementor-button,
  .elementor-element-3tgw43j .elementor-iqit-banner-content a.elementor-button,
  .elementor-element-3tgw43j .elementor-iqit-banner-content .elementor-button-wrapper{
    display: none !important;
  }
}
/* Mobile ≤ 767.98px — Banner 3tgw43j : texte en bas */
@media (max-width: 767.98px){
  .elementor-element-3tgw43j .elementor-iqit-banner{
    justify-content: flex-end !important;   /* colle le contenu en bas */
  }
  .elementor-element-3tgw43j .elementor-iqit-banner-content{
    margin-top: auto !important;            /* pousse vers le bas */
    padding-bottom: 18px !important;        /* respiration sous le titre */
  }
}
/* STEP 1 — RESET ciblé (Mobile ≤ 767.98px) */
@media (max-width: 767.98px){
  .elementor-element-3tgw43j .elementor-iqit-banner,
  .elementor-element-3tgw43j .elementor-iqit-banner-content{
    position: relative !important;
    top:auto !important; bottom:auto !important; left:auto !important; right:auto !important;
    transform:none !important;
    margin:0 !important;
  }
}

/* STEP 2 — Nouveau pattern (texte en bas + overlay doux) */
@media (max-width: 767.98px){
  .elementor-element-3tgw43j .elementor-iqit-banner{
    --hero-h: clamp(280px, 72vw, 360px);
    --pad-x: 12px; --pad-y: 16px;

    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;     /* ↓↓↓ texte en bas */
    align-items:center !important;

    min-height:var(--hero-h) !important;
    padding:var(--pad-y) var(--pad-x) !important;
    border-radius:18px !important;
    overflow:hidden;
    margin:0 8px;
  }

  /* petit dégradé bas pour lisibilité */
  .elementor-element-3tgw43j .elementor-iqit-banner::after{
    content:"";
    position:absolute; inset:0;
    background: linear-gradient(to top, rgba(0,0,0,.35) 0%, rgba(0,0,0,0) 55%);
    pointer-events:none;
  }

  /* si tu utilises le background CSS: cacher l'<img> interne */
  .elementor-element-3tgw43j .elementor-iqit-banner-img img{ display:none !important; }

  .elementor-element-3tgw43j .elementor-iqit-banner-content{
    width:100% !important;
    text-align:center !important;
    padding-bottom:18px !important;          /* respiration bas */
    z-index:2;
  }

  .elementor-element-3tgw43j .elementor-iqit-banner-title{
    color:#fff !important;
    font-weight:800 !important;
    font-size: clamp(1.9rem, 6.8vw, 2.3rem) !important;
    line-height: 1.15 !important;           /* ← évite tout clipping */
    margin:0 !important;
    white-space:normal !important;
  }

  /* option : masquer le bouton en mobile */
  .elementor-element-3tgw43j .elementor-iqit-banner-content .elementor-button,
  .elementor-element-3tgw43j .elementor-iqit-banner-content .elementor-button-wrapper{
    display:none !important;
  }
}
/* Mobile ≤ 767.98px — Banner "NOS SKIS D’OCCASION" (awsxemh) */
@media (max-width: 767.98px){
  .elementor-element-awsxemh .elementor-iqit-banner{
    --hero-h: clamp(280px,72vw,360px);
    display:flex !important; justify-content:flex-start !important; align-items:center !important;
    min-height:var(--hero-h) !important;
    padding:22px 12px 14px !important;      /* top | sides | bottom */
    border-radius:18px !important; overflow:hidden; margin:0 8px; position:relative !important;
  }
  .elementor-element-awsxemh .elementor-iqit-banner::after{ display:none !important; } /* coupe tout overlay */
  .elementor-element-awsxemh .elementor-iqit-banner-img img{ display:none !important; } /* on garde le bg CSS */

  .elementor-element-awsxemh .elementor-iqit-banner-content{
    position:relative !important; width:100% !important; text-align:center !important; transform:none !important;
  }
  .elementor-element-awsxemh .elementor-iqit-banner-title{
    color:#fff !important; font-weight:800 !important;
    font-size:clamp(1.9rem,6.8vw,2.3rem) !important;
    line-height:0.69 !important; margin:0 !important; white-space:normal !important; /* interligne serré */
  }
  .elementor-element-awsxemh .elementor-iqit-banner-content .elementor-button,
  .elementor-element-awsxemh .elementor-iqit-banner-content .elementor-button-wrapper{ display:none !important; }
}
.products-grid .product-miniature-layout-2 .product-description{
  padding: 15px !important;
}
.add-to-cart .bag-icon-svg{ margin-right:8px;  }
.product-add-to-cart .add-to-cart {
  width: 100%;
  text-transform: uppercase;
	font-weight: 600;
}

/* ===== Typo titres dans le contenu (blog, elementor post, catégories) ===== */
.simpleblog__post__content,
.elementor .elementor-widget-theme-post-content,
.category-description-wrapper{
  /* H2 — Poppins Black 34 / interligne 40 — marges 20 / 15 */
  /* (noir) */
}
.simpleblog__post__content h2,
.simpleblog__post__content .h2,
.elementor .elementor-widget-theme-post-content h2,
.category-description-wrapper h2{
  font-family: "Poppins", sans-serif !important;
  font-weight: 900 !important;
  font-size: 34px !important;
  line-height: 40px !important;
  margin: 20px 0 15px !important;  /* top / bottom */
  color: #111 !important;
}

/* H3 — Poppins SemiBold 30 / interligne 35 — marges 45 / 25 (noir) */
.simpleblog__post__content h3,
.simpleblog__post__content .h3,
.elementor .elementor-widget-theme-post-content h3,
.category-description-wrapper h3{
  font-family: "Poppins", sans-serif !important;
  font-weight: 600 !important;
  font-size: 30px !important;
  line-height: 35px !important;
  margin: 0px 0 10px !important;
  color: #111 !important;
}

/* H4 — Poppins Bold 20 / interligne 25 — marges 25 / 15 (BLEU) */
.simpleblog__post__content h4,
.elementor .elementor-widget-theme-post-content h4,
.category-description-wrapper h4{
  font-family: "Poppins", sans-serif !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  line-height: 25px !important;
  margin: 25px 0 15px !important;
  color: #255BA6 !important;
}

/* H5 — Poppins Bold 20 / interligne 28 — marges 25 / 15 (noir) */
.simpleblog__post__content h5,
.elementor .elementor-widget-theme-post-content h5,
.category-description-wrapper h5{
  font-family: "Poppins", sans-serif !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  line-height: 28px !important;
  margin: 25px 0 15px !important;
  color: #111 !important;
}

/* ===== Typo titres dans le contenu — Pages CMS ===== */
/* Cible la zone de contenu des pages CMS (rte-content) */
#content.page-cms.page-content .rte-content{
  /* (rappel : conteneur uniquement, pas de styles imposés ici) */
}

/* H2 — Poppins Black 34 / 40 — marges 20 / 15 — noir */
#content.page-cms.page-content .rte-content h2,
#content.page-cms.page-content .rte-content .h2{
  font-family: "Poppins", sans-serif !important;
  font-weight: 900 !important;
  font-size: 34px !important;
  line-height: 40px !important;
  margin: 20px 0 15px !important;
  color: #111 !important;
}

/* H3 — Poppins SemiBold 30 / 35 — marges 45 / 25 — noir */
#content.page-cms.page-content .rte-content h3,
#content.page-cms.page-content .rte-content .h3{
  font-family: "Poppins", sans-serif !important;
  font-weight: 600 !important;
  font-size: 30px !important;
  line-height: 35px !important;
  margin: 45px 0 25px !important;
  color: #111 !important;
}

/* H4 — Poppins Bold 20 / 25 — marges 25 / 15 — BLEU */
#content.page-cms.page-content .rte-content h4{
  font-family: "Poppins", sans-serif !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  line-height: 25px !important;
  margin: 25px 0 15px !important;
  color: #255BA6 !important;
}

/* H5 — Poppins Bold 20 / 28 — marges 25 / 15 — noir */
#content.page-cms.page-content .rte-content h5{
  font-family: "Poppins", sans-serif !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  line-height: 28px !important;
  margin: 25px 0 15px !important;
  color: #111 !important;
}

/* (Optionnel) petits ajustements responsive */
@media (max-width: 575.98px){
  #content.page-cms.page-content .rte-content h2{ font-size: 28px !important; line-height: 34px !important; }
  #content.page-cms.page-content .rte-content h3{ font-size: 24px !important; line-height: 30px !important; }
}


/* Desktop — faire passer le dropdown "Mon compte" devant la barre bleue */
@media (min-width:1024px){
  /* 1) La barre du haut (compte/recherche) au-dessus de la barre bleue */
  #header .header-top{ position:relative; z-index:1105; }

  /* 2) Le dropdown lui-même au-dessus de tout le méga-menu */
  #_desktop_user_info,
  #_desktop_user_info .dropdown{ position:relative; z-index:1106; }
  #_desktop_user_info .dropdown-menu{ z-index:1107 !important; }

  /* 3) La barre bleue et le méga-menu restent en dessous */
  #header .header-nav,
  #iqitmegamenu-wrapper{ position:relative; z-index:1001; }
  #iqitmegamenu-wrapper .cbp-hrsub{ z-index:1002 !important; }

  /* 4) Pas de découpe du dropdown */
  #header, #header .header-top, #header .header-nav, #iqitmegamenu-wrapper{
    overflow:visible !important;
  }
}
/* Desktop ≥1024 — rétablit le trait orange et garde le pont anti-flicker */
@media (min-width:1024px){
  /* 1) Le lien : trait orange sur ::after (aucun tunnel ici) */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link{ position: relative; }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab > a.nav-link::after{
    content:"" !important;
    position:absolute !important;
    left:0; right:0; bottom:0 !important; height:3px !important;
    background:#FF7134; border-radius:2px;
    transform:scaleX(0); transform-origin:left; transition:transform .18s ease;
    pointer-events:none; /* ne capte pas la souris */
  }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab:hover > a.nav-link::after,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.cbp-hropen > a.nav-link::after,
  #iqitmegamenu-wrapper .cbp-hrmenu-tab.active > a.nav-link::after{
    transform:scaleX(1);
  }

  /* 2) Le li : pont anti-flicker (on force pour dépasser les resets !important) */
  #iqitmegamenu-wrapper .cbp-hrmenu-tab{ position: relative; }
  #iqitmegamenu-wrapper .cbp-hrmenu-tab::after{
    content:"" !important;
    position:absolute !important;
    left:0; right:0; top:100% !important;
    height: var(--mm-gap, 12px) !important;
    background: transparent !important;
    pointer-events: auto !important;
  }
}
/* HOME — slider hero (widget .elementor-element-l1t4kuu) */
.page-index .elementor-element-6vcgh72 .elementor-image-carousel-wrapper{
  position: relative !important;
  overflow: visible !important;           /* évite que les flèches soient coupées */
  z-index: 1;
}
.page-index .elementor-element-6vcgh72 .elementor-swiper-button{
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-top: 0 !important;
  z-index: 50 !important;                 /* au-dessus de l’image */
  pointer-events: auto !important;
}
.page-index .elementor-element-6vcgh72 .elementor-swiper-button-prev{
  left: 12px !important;                  /* bord gauche */
  right: auto !important;
}
.page-index .elementor-element-6vcgh72 .elementor-swiper-button-next{
  right: 12px !important;                 /* bord droit */
  left: auto !important;
}

/* Option: si tu veux les boutons un peu plus grands ici */
.page-index .elementor-element-6vcgh72 .elementor-swiper-button{
  width: 48px !important;
  height: 48px !important;
}
/* --- HERO HOME : boutons inchangés, chevrons centrés en pur CSS --- */
.page-index .elementor-element-6vcgh72 .elementor-image-carousel-wrapper{
  position: relative !important;
  overflow: visible !important;
}

/* Boutons (même placement qu'avant) */
.page-index .elementor-element-6vcgh72 .elementor-swiper-button{
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important; /* ne bouge pas */
  width: 40px !important;
  height: 100px !important;
  background: rgba(0,0,0,.78) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  z-index: 50 !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: auto !important;

  /* centre le contenu (le chevron) */
  display: grid !important;
  place-items: center !important;

  /* nettoie l’icône native */
  font-size: 0 !important;
  line-height: 0 !important;
}
.page-index .elementor-element-6vcgh72 .elementor-swiper-button-prev{ left: 0 !important; }
.page-index .elementor-element-6vcgh72 .elementor-swiper-button-next{ right: 0 !important; }

/* Supprime les anciens styles ronds/icônes */
.page-index .elementor-element-6vcgh72 .elementor-swiper-button::before{ content: none !important; }

/* Chevron en pur CSS (deux bordures) */
.page-index .elementor-element-6vcgh72 .elementor-swiper-button::after{
  content: "" !important;
  display: block !important;
  width: 12px;                 /* largeur du chevron */
  height: 12px;                /* hauteur du chevron */
  box-sizing: content-box !important;
  border-right: 3px solid #fff;/* épaisseur/ couleur du trait */
  border-bottom: 3px solid #fff;
  transform: rotate(-45deg);   /* forme ">" par défaut, on inverse à gauche */
}

/* Inversion côté gauche (devient "<") */
.page-index .elementor-element-6vcgh72 .elementor-swiper-button-prev::after{
  transform: rotate(135deg);
}

/* Hover / Focus */
.page-index .elementor-element-6vcgh72 .elementor-swiper-button:hover{
  background: rgba(0,0,0,.88) !important;
}
.page-index .elementor-element-6vcgh72 .elementor-swiper-button:focus-visible{
  outline: 2px solid rgba(255,255,255,.9);
  outline-offset: 2px;
}
.page-index .elementor-element-6vcgh72 .elementor-swiper-button[aria-disabled="true"]{
  opacity: .5; cursor: default;
}

/* Mobile : taille adaptée */
@media (max-width: 767.98px){
  .page-index .elementor-element-6vcgh72 .elementor-swiper-button{
    width: 32px !important;
    height: 72px !important;
  }
  .page-index .elementor-element-6vcgh72 .elementor-swiper-button::after{
    width: 14px;
    height: 14px;
    border-right-width: 2.5px;
    border-bottom-width: 2.5px;
  }
}

/* Mobile : bouton mca */
@media (max-width: 767px){
  .slider-see-all-btn{ display:none !important; } /* cache le bouton desktop */
  .mc-cta{ display:inline-flex !important; }
  .mc-cta[href="#"], .mc-cta:not([href]){ pointer-events:none; } /* sécurité */
}