/* Solution anti-défilement horizontal modifiée pour permettre le chargement des images */
html, body {
  overflow-x: hidden;
  max-width: 100%;
  width: 100%;
  height: auto !important; /* Permettre à la hauteur de s'adapter au contenu */
  min-height: 100%; /* Assurer que le body prend au moins toute la hauteur de la fenêtre */
}

/* Correction pour le chargement des images en lazy loading */
img {
  opacity: 1 !important;
  visibility: visible !important;
  height: auto !important;
}

img[loading="lazy"],
img.lazy,
img[data-src],
img[data-lazy-src],
img.lazyload {
  opacity: 1 !important;
  visibility: visible !important;
  height: auto !important;
}

/* Assurer que les conteneurs d'images sont correctement dimensionnés */
.product-miniature,
.thumbnail-container,
.product-thumbnail,
.product-cover,
.carousel-item,
.owl-item {
  overflow: visible !important;
  min-height: 0 !important;
}

/* CSS pour aligner les éléments du header sur une seule ligne */
.header-top.tablet-h {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

.header-top.tablet-h .container {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

.header-top.tablet-h .header-top-wrapper {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

.header-top.tablet-h .header-center {
  flex: 1 !important;
  width: auto !important;
  max-width: none !important;
}

.header-top.tablet-h .vertical-center.header-top-nav {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

.header-top.tablet-h .amega-menu {
  width: 100% !important;
}

.header-top.tablet-h #amegamenu {
  width: 100% !important;
}

.header-top.tablet-h .fixed-menu-container {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

.header-top.tablet-h .anav-top {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
}

.header-top.tablet-h .anav-top > li {
  flex: 0 0 auto !important;
}

/* Les styles des niveaux 1-5 ont été déplacés en fin de fichier pour éviter les surcharges */



/* CSS pour réduire les dimensions du carrousel de 10% */

/* Ciblage du conteneur principal du carrousel */
.an_homeslider-block {
  width: 90%; /* Réduction à 90% de la largeur originale */
  margin: 0 auto; /* Centrage du carrousel */
}

/* Ajustement des images dans le carrousel */
.an_homeslider img {
  width: 90%; /* Réduction à 90% de la largeur originale */
  height: auto; /* Maintien du ratio d'aspect */
  margin: 0 auto; /* Centrage des images */
  display: block;
}

/* Ajustement de la description dans le carrousel */
.an_homeslider-desc {
  width: 90%; /* Réduction à 90% de la largeur originale */
  margin: 0 auto; /* Centrage du texte */
}

/* Ajustement des hauteurs responsives du carrousel */
@media (max-width: 1600px) {
  .an_homeslider-block:not(.initialized),
  .an_homeslider-loader {
      height: 371.7px; /* 90% de 413px */
  }
}

@media (max-width: 1366px) {
  .an_homeslider-block:not(.initialized),
  .an_homeslider-loader {
      height: 316.8px; /* 90% de 352px */
  }
}

@media (max-width: 991px) {
  .an_homeslider-block:not(.initialized),
  .an_homeslider-loader {
      height: 229.5px; /* 90% de 255px */
  }
}

@media (max-width: 767px) {
  .an_homeslider-block:not(.initialized),
  .an_homeslider-loader {
      height: 176.4px; /* 90% de 196px */
  }
}

@media (max-width: 580px) {
  .an_homeslider-block:not(.initialized),
  .an_homeslider-loader {
      height: 132.3px; /* 90% de 147px */
  }
}

@media (max-width: 440px) {
  .an_homeslider-block:not(.initialized),
  .an_homeslider-loader {
      height: 99.9px; /* 90% de 111px */
  }
}

@media (max-width: 320px) {
  .an_homeslider-block:not(.initialized),
  .an_homeslider-loader {
      height: 72px; /* 90% de 80px */
  }
}

/* Ajustement de la taille du conteneur de l'owl-carousel */
.an_homeslider.owl-carousel {
  width: 90%;
  margin: 0 auto;
}

/* Ajustement des boutons de navigation */
.an_homeslider .owl-nav {
  width: 90%;
  margin: 0 auto;
}

/* Ajustement des indicateurs de pagination */
.an_homeslider .owl-dots {
  width: 90%;
  margin: 0 auto;
}


@keyframes autoplay {
  0%, 33% {
      opacity: 0;
  }
  33.01%, 33.99% {
      opacity: 1;
  }
  34%, 100% {
      opacity: 0;
  }
}

#abouus-carousel-slide1:checked ~ .abouus-carousel-nav label:nth-child(2)::after {
  animation: autoplay 15s infinite;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

#abouus-carousel-slide2:checked ~ .abouus-carousel-nav label:nth-child(3)::after {
  animation: autoplay 15s infinite;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

#abouus-carousel-slide3:checked ~ .abouus-carousel-nav label:nth-child(1)::after {
  animation: autoplay 15s infinite;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}


/*ajustement titre section block produits pour mobile*/
/* CSS pour ajuster le titre "Le TOP des ventes" en mode mobile */
@media (max-width: 767px) {
.h2.products-section-title {
  font-size: 18px; /* Taille de police réduite */
  white-space: nowrap; /* Empêche le saut de ligne */
  overflow: hidden; /* Cache le contenu qui dépasse */
  text-overflow: ellipsis; /* Ajoute des points de suspension si nécessaire */
  letter-spacing: -0.5px; /* Réduit l'espacement entre les lettres */
}

.h2.products-section-title span {
  font-size: 18px; /* Assure que le span a la même taille */
}
}

/* Pour les très petits écrans */
@media (max-width: 480px) {
.h2.products-section-title, 
.h2.products-section-title span {
  font-size: 16px; /* Taille encore plus petite */
}
}


/*POPUP*/
.banner-link:hover .banner-content,
.banner-link:focus .banner-content {
background: #F5F5F5 !important;
transform: scale(1.08);
z-index: 2;
box-shadow: 0 4px 24px rgba(56,142,60,0.13);
transition: 
  background 0.18s,
  transform 0.18s cubic-bezier(.4,1.3,.5,1),
  box-shadow 0.18s;
will-change: transform;
}

/* Force le fond sur tous les descendants pour écraser tout background blanc hérité */
.banner-link:hover .banner-content *,
.banner-link:focus .banner-content * {
background: #F5F5F5 !important;
transition: background 0.18s;
}


/*FLEX header du module perso*/
/* Colonne logo : largeur auto autour du logo, sans largeur forcée */
.flex-header-logo {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

/* Le logo s'affiche à sa taille d'origine */
.flex-header-logo img.logo {
  display: block;
  height: auto;
  width: auto;
  max-width: 180px; /* adapte à la largeur réelle de ton logo */
  max-height: 90px; /* adapte à la hauteur souhaitée si besoin */
}

/* Colonne 7 : largeur identique à la colonne logo (symétrie visuelle) */
.flex-header-col7 {
  flex: 0 0 180px !important; /* Largeur identique au logo */
  width: 180px !important;
  min-width: 0 !important;
  max-width: 180px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  box-sizing: content-box;
}

/* Réduction de l'espace autour du panier */
.flex-header-col7 .blockcart {
  margin: 0 !important;
  padding: 0 !important;
}

/* Ajuste la taille de l’icône panier si besoin */
.flex-header-col7 .cart-link svg {
  width: 24px !important;
  height: 22px !important;
  display: block;
}

/* Colonne centrale : largeur auto selon le contenu (searchbar) */
.flex-header-col-center {
  flex: 0 0 auto;
  min-width: 0;
  max-width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  margin-left: auto;
  margin-right: auto;
}

.search-center-container {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}



/*fix bouton drawer panier*/
/* Style amélioré pour le bouton de fermeture du panier */
.sb-menu-right .sb-close-btn {
  /* Positionnement */
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  z-index: 1000 !important;
  
  /* Dimensions et espacement */
  padding: 8px 10px !important;
  margin: 0 !important;
  
  /* Apparence */
  background-color: #f5f5f5 !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) !important;
  transition: all 0.2s ease-in-out !important;
  
  /* S'assurer qu'il reste visible */
  opacity: 1 !important;
  visibility: visible !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  
  /* Curseur */
  cursor: pointer !important;
}

/* Style de l'icône */
.sb-menu-right .sb-close-btn i.material-icons {
  font-size: 20px !important;
  color: #333 !important;
  transition: color 0.2s ease !important;
}

/* Effets au survol */
.sb-menu-right .sb-close-btn:hover {
  background-color: #e0e0e0 !important;
  transform: scale(1.1) !important;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2) !important;
}

.sb-menu-right .sb-close-btn:hover i.material-icons {
  color: #000 !important;
}

/* Effet au clic */
.sb-menu-right .sb-close-btn:active {
  transform: scale(0.95) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

/* S'assurer que le bouton reste visible même au survol du panier */
.sb-menu-right:hover .sb-close-btn,
#js-cart-sidebar:hover ~ .sb-close-btn,
.sb-menu-right .sb-close-btn:hover {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Ajuster la position du contenu du panier pour éviter le chevauchement */
.sb-menu-right #js-cart-sidebar {
  padding-top: 40px !important;
}


/*Réseaux Sociaux*/
        /* Style général pour la page */
.container-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 40px auto;
  padding: 12px 20px;
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  width: fit-content;
}

.logo-instagram,
.logo-facebook {
  width: 85px;
  height: auto;
  display: block;
  transition: transform 0.3s ease;
}

.logo-instagram:hover,
.logo-facebook:hover {
  transform: scale(1.1);
}

.logo-facebook {
  margin-left: 30px;
}

/*Blog*/
.blog-container {
    display: flex;
    width: 100%;
    background-color: white;
    transition: all 0.3s ease;
    font-family: 'Montserrat', sans-serif;
}

.blog-container:hover {
    background-color: #e6ffe6; /* Fond légèrement vert */
    transform: scale(1.02);
}

.blog-sub-container {
    flex: 1;
    padding: 20px;
    text-align: center;
    font-size: 1.5em; /* Taille de police plus grande */
}

.blog-pagetitle {
    font-family: 'Montserrat', sans-serif;
    font-size: 2em; /* Ajustez la taille selon vos besoins */
    color: transparent; /* Pour garantir le bon positionnement du parent */
}

.blog-pagetitle::before {
    content: "Notre Blog";
    position: absolute; /* Position absolue pour superposer le texte */
    color: black; /* Couleur du nouveau texte */
}

/* Masquer le hamburger sur desktop */
#cascade-hamburger {
  display: none !important;
}

/* navbars et wrapper - mode mobile */
@media (max-width: 767px) {
  .mobile_item_wrapper,
  .mobile-item-nodropdown,
  .amenu-link {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
  .mobile-toggler {
    display: flex !important;
    align-items: center;
    margin-left: 8px;
    height: 100%;
  }
  /* Afficher et positionner le hamburger uniquement en mobile */
  #cascade-hamburger {
    display: flex !important;
    position: fixed;
    top: 64px;    /* ajuste selon tes besoins */
    left: 16px;
    width: 44px;
    height: 44px;
    z-index: 99999;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.13);
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
}

/*Wishlist mobile*/
@media (max-width: 767px) {
  .wishlist-count-badge {
    position: absolute;
    top: -8px;
    right: -10px;
    background: none !important;
    border: none !important;
    color: #5CA60D;
    font-size: 13px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-weight: 300;
    line-height: 1;
    padding: 0;
    box-shadow: none;
    pointer-events: none;
    z-index: 2;
    letter-spacing: 0;
    display: block;
  }
}

/*hover menu mode mobile*/
/*hover menu mode mobile*/
/* CSS pour le hover sur les éléments de menu mobile avec styles inline */
@media (max-width: 991px) {
  /* Sélecteur très spécifique pour surpasser les styles inline */
  li.amenu-item.mm-3.plex,
  li.amenu-item.mm-4.plex,
  li.amenu-item.mm-5.plex,
  li.amenu-item.mm-9.plex,
  li.amenu-item.mm-10.plex,
  li.amenu-item.mm-11.plex,
  li.amenu-item.mm-12.plex,
  li.amenu-item.mm-15 {
    transition: color 0.3s ease !important;
  }
  
  /* Utiliser !important pour surpasser les styles inline */
  li.amenu-item.mm-3.plex:hover,
  li.amenu-item.mm-4.plex:hover,
  li.amenu-item.mm-5.plex:hover,
  li.amenu-item.mm-9.plex:hover,
  li.amenu-item.mm-10.plex:hover,
  li.amenu-item.mm-11.plex:hover,
  li.amenu-item.mm-12.plex:hover,
  li.amenu-item.mm-15:hover,
  li.amenu-item.mm-3.plex:active,
  li.amenu-item.mm-4.plex:active,
  li.amenu-item.mm-5.plex:active,
  li.amenu-item.mm-9.plex:active,
  li.amenu-item.mm-10.plex:active,
  li.amenu-item.mm-11.plex:active,
  li.amenu-item.mm-12.plex:active,
  li.amenu-item.mm-15:active,
  li.amenu-item.plex.active-item,
  li.amenu-item.mm-15.active-item {
    border-left: 4px solid #6ABB10 !important;
    padding-left: 4px !important;
  }
  
  /* Effet sur les liens à l'intérieur */
  li.amenu-item.plex:hover > div > a,
  li.amenu-item.plex:active > div > a,
  li.amenu-item.plex.active-item > div > a,
  li.amenu-item.mm-15:hover > div > a,
  li.amenu-item.mm-15:active > div > a,
  li.amenu-item.mm-15.active-item > div > a {
    color: #6ABB10 !important; /* Changer la couleur du texte en vert */
    font-weight: bold !important;
  }
  
  /* Effet sur les spans à l'intérieur des liens */
  li.amenu-item.plex:hover > div > a > span,
  li.amenu-item.plex:active > div > a > span,
  li.amenu-item.plex.active-item > div > a > span,
  li.amenu-item.mm-15:hover > div > a > span,
  li.amenu-item.mm-15:active > div > a > span,
  li.amenu-item.mm-15.active-item > div > a > span {
    color: #6ABB10 !important;
    font-weight: bold !important;
  }
  
  /* Assurer que les éléments interactifs restent cliquables */
  .mobile-toggle-plus,
  li.amenu-item > div > a {
    pointer-events: auto !important;
  }
}

/*taille bouton checkout*/
/* CSS pour réduire la taille du bloc de paiement */
.checkout.text-sm-center.card-block {
  padding: 10px !important; /* Réduire le padding (espacement intérieur) */
  margin: 10px 0 !important; /* Réduire les marges verticales */
  max-width: 90% !important; /* Limiter la largeur maximale */
  margin-left: auto !important; /* Centrer horizontalement */
  margin-right: auto !important; /* Centrer horizontalement */
}

/* Réduire la taille des boutons à l'intérieur */
.checkout.text-sm-center.card-block .btn {
  padding: 8px 15px !important; /* Réduire le padding des boutons */
  font-size: 0.9rem !important; /* Réduire la taille de police */
}

/* Réduire l'espacement entre les éléments */
.checkout.text-sm-center.card-block > * {
  margin-bottom: 8px !important; /* Réduire l'espacement vertical */
}

/* S'assurer que le bloc est bien adapté sur mobile */
@media (max-width: 767px) {
  .checkout.text-sm-center.card-block {
    padding: 8px !important;
    max-width: 100% !important;
  }
  
  .checkout.text-sm-center.card-block .btn {
    padding: 6px 12px !important;
    font-size: 0.85rem !important;
  }
}

/*Notice et Fiche RCP*/
.notice-rcp-container {
  max-width: 420px;
  margin: 32px auto;
  background: #f7fafc;
  border-radius: 18px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.10);
  padding: 32px 24px 28px 24px;
  text-align: center;
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 300;
}
.notice-rcp-title {
  font-size: 1.25rem;
  font-weight: 400;
  color: #5CA60D;
  margin-bottom: 18px;
  letter-spacing: 0.03em;
  font-family: 'Montserrat', Arial, sans-serif;
}
.notice-rcp-img img {
  display: block;
  margin: 0 auto 18px auto;
  max-width: 100%;
  height: auto;
  border-radius: 7px;
  box-shadow: 0 2px 8px rgba(92,166,13,0.07);
}
.notice-rcp-btn {
  display: inline-block;
  margin-top: 10px;
  background: #5CA60D;
  color: #fff !important;
  border: none;
  border-radius: 7px;
  padding: 10px 38px;
  font-size: 1.08rem;
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 400;
  text-decoration: none;
  transition: background 0.2s;
  box-shadow: 0 2px 8px rgba(92,166,13,0.07);
  cursor: pointer;
  letter-spacing: 0.02em;
}
.notice-rcp-btn:hover {
  background: #478309;
}

/*nouveau popup de recherche*/
/* CSS pour DevTools - avec masquage correct des éléments */

/* Barre de recherche réduite */
#ajaxsmartsearch-wrapper {
  width: 80%;
  max-width: 600px;
  margin: 0 auto;
}
#ajaxsmartsearch-form {
  width: 100%;
  max-width: 600px;
  margin: 0;
}

/* Popup réduit de 20% - DÉSACTIVÉ pour éviter les conflits avec le nouveau popup
 * Ces règles forcent un positionnement fixe qui interfère avec notre implémentation
 */
/*
#ajaxsmartsearch-popup {
  position: fixed;
  left: 0;
  right: 0;
  top: 150px;
  width: 76.8vw;
  max-width: 1120px;
  margin: 0 auto;
  z-index: 10000;
}
*/

/* Overlay avec z-index plus élevé et opacité réduite - DÉSACTIVÉ
 * Ce pseudo-élément peut masquer notre popup si son z-index n'est pas suffisant
 */
/*
body::after {
  content: "";
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.3);
  z-index: 9999;
}
*/

/* Afficher l'overlay quand le popup est visible - DÉSACTIVÉ
 * Cette règle active l'overlay qui peut interférer avec notre popup
 */
/*
body.search-popup-visible::after {
  display: block;
}
*/

/* Forcer un z-index élevé sur le popup - DÉSACTIVÉ
 * Cette valeur est trop faible pour notre popup qui utilise z-index: 999999
 */
/*
#ajaxsmartsearch-popup {
  z-index: 10000;
}
*/

/* Masquer spécifiquement la liste d'avantages quand le popup est visible */
body.search-popup-visible .an_advantages-list {
  visibility: hidden;
}

/* Maintenir 4 produits par ligne */
.ajaxsmartsearch-result-item {
  flex: 0 0 calc(25% - 16px);
  width: calc(25% - 16px);
}

/*suite*/
#apmenu-dropdown {
  padding-right: 0 !important;
}

.apmenu-dropdown-left {
  min-width: 320px !important;
  max-width: 420px !important;
  width: 380px !important;
}

.apmenu-dropdown-2cols {
  display: flex !important;
  gap: 32px !important; /* espace entre les deux panneaux */
}

.apmenu-dropdown-right {
  flex: 1 1 0% !important;
  width: auto !important;
  min-width: 0 !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding-top: 0 !important;
}

.apmenu-subcat-grid {
  align-items: start !important;
  background: #fff !important;
}

.apmenu-subcat-block {
  padding: 0 !important;
  margin: 0 !important;
  min-width: 130px !important;
  max-width: 180px !important;
  min-height: 100px !important;
  box-sizing: border-box !important;
}

/* 2. Vignette blanche par défaut, centrée dans la cellule */
.apmenu-photo-wrap {
  display: block !important;
  margin: 0 auto !important;
  background: #fff !important;      /* FOND BLANC PAR DÉFAUT */
  box-shadow: none !important;
  transition: background 0.2s, box-shadow 0.25s cubic-bezier(.4,1.4,.6,1);
}

/* 3. Fond transparent et ombre uniquement au hover */
.apmenu-subcat-block:hover .apmenu-photo-wrap {
  background: transparent !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.07), 0 6px 24px rgba(0,0,0,0.15) !important;
}
.apmenu-photo-wrap > div {
  margin-top: 8px; /* ou 6px, 10px... selon l'effet souhaité */
}
.apmenu-photo-wrap > div {
  width: 94%;
  height: 94%;
  margin: auto;
  border-radius: 10px;
  box-shadow: 0 0 0 2px rgba(231,76,60,0.10); /* optionnel */
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  position: relative;
  z-index: 1;
}
.apmenu-photo-wrap > div > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  position: relative;
  z-index: 2;
}

/*masquage produits accueil*/
.an_homeproducts-content.js-an_homeproducts-content.active[data-block-id="5"] .featured-products.an_homeproducts-products {
  display: none !important;
}
.an_homeproducts-content.js-an_homeproducts-content.active[data-block-id="7"] .featured-products.an_homeproducts-products {
  display: none !important;
}
.an_homeproducts-content.js-an_homeproducts-content.active[data-block-id="8"] .featured-products.an_homeproducts-products {
  display: none !important;
}

/*Minuscules items menu*/
.fixed-menu-container .anav-top .amenu-link {
  text-transform: none !important;
}

.fixed-menu-container .anav-top .amenu-link {
  font-weight: 400; /* ou 500 selon l'effet désiré */
}
/*MARQUES*/

/*SITE TENU PAR DES PHARMACIENS*/
a.an_advantages-item[href="https://pharmacieposte.fr/content/9-ethique-et-deontologie"] .an_advantages-item-title {
  color: #BB0A5F;
}

/*taille prix*/
.product-miniature-prices .price,
.product-miniature-prices .money {
    font-weight: 600;   /* ou 900 pour extra-bold */
}

/*taille image fiche article*/
/* Réduire la taille de l’image du slider produit */
.an_productpage-slider-image img.productslider-main-image {
  width: 400px !important;     /* Mets la largeur souhaitée */
  height: auto !important;     /* Conserve le ratio */
  max-width: 100% !important;  /* Ne dépasse jamais le conteneur */
  display: block;
  margin: 0 auto;              /* Centre l’image si besoin */
}

/*police quantité panier*/
.an_productattributes-qty {
  font-weight: 400;
  font-size: 18px; /* ou la taille exacte souhaitée */
}

/*promotions*/
/* Orange vif : #E90472 */
.amenu-item.mm-9.plex > .amenu-link {
  color: #E90472 !important;
  /* Pas de font-weight ici : l’épaisseur reste celle du parent */
  transition: transform 0.18s cubic-bezier(.4,1.4,.6,1), color 0.18s;
}

/* Grossissement au survol */
.amenu-item.mm-9.plex > .amenu-link:hover {
  color: #E90472 !important;
  transform: scale(1.15);
  /* Pas de font-weight ici non plus */
}

.category-sub-menu a[href*="promotions"] {
  color: #E90472 !important;
  transition: transform 0.18s cubic-bezier(.4,1.4,.6,1), color 0.18s;
}

/* Grossissement au survol */
.category-sub-menu a[href*="promotions"]:hover {
  color: #E90472 !important;
  transform: scale(1.15);
}

/*bouton ajouter au panier*/
.quantity_availability .add .add-to-cart,
.quantity_availability .add button.add-to-cart,
.quantity_availability button.add-to-cart {
  font-size: 18px !important;   /* Adapte la taille à ton besoin */
  font-weight: 600 !important;  /* Optionnel, pour épaissir le texte */
  line-height: 1.2 !important;  /* Optionnel, améliore la lisibilité */
}
.js-an_productattributes-add-to-cart,
.js-an_productattributes-add-to-cart span {
  font-size: 14px !important;   /* Mets la taille que tu veux */
  font-weight: 600 !important;  /* Optionnel, pour épaissir */
  line-height: 1.2 !important;  /* Optionnel */
}
/*prix fiche article*/
/* Prix plus gras */
.product-prices .current-price span[itemprop="price"] {
  font-weight: 600 !important;   /* Gras (bold) */
}

/* Masquer le label TTC/livraison */
.product-prices .tax-shipping-delivery-label {
  display: none !important;
}
/*événements*/
.amenu-item.mm-16 > .amenu-link {
  background: #E7EDE9;
  border-radius: 10px;
  padding: 0 10px;
  color: #222;
  display: inline-block;
  font-size: 1em;
  line-height: 1;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
  transition: background 0.2s, color 0.2s, transform 0.18s cubic-bezier(.4,1.4,.6,1);
  vertical-align: middle;
}

.amenu-item.mm-16 > .amenu-link:hover {
  transform: scale(1.15);
  background: #d0e3db;    /* Optionnel : fond un peu plus foncé au survol */
  color: #111 !important; /* Texte bien noir au hover */
}
/*réductions*/
.product-flags .product-flag.discount {
  display: inline-block !important;
  background: #E90472 !important;
  color: #fff !important;
  font-size: 2em !important;        /* Encore plus grand */
  font-weight: 900 !important;      /* Ultra épais */
  padding: 12px 32px !important;    /* Beaucoup d’espace autour du texte */
  border-radius: 24px !important;   /* Arrondi généreux */
  letter-spacing: 2px;
  box-shadow: 0 4px 16px rgba(233,4,114,0.16);
  border: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  height: auto !important;
  pointer-events: auto !important;
  text-transform: uppercase;
  margin: 8px 0 0 0;
  vertical-align: middle;
  transition: background 0.2s, color 0.2s;
}
.thumbnail-container .product-flag.discount {
  display: none !important;
}
.thumbnail-container .product-flag.discount-percentage {
  font-weight: 800 !important;   /* Police très épaisse */
  letter-spacing: 1px;           /* Optionnel : espace entre les caractères */
  font-size: 1.2em;              /* Optionnel : agrandir un peu */
  text-transform: uppercase;     /* Optionnel : tout en majuscules */
}

/*prix fiche article*/
.input-group.bootstrap-touchspin input#quantity_wanted {
  font-weight: 500 !important;   /* Police bien épaisse */
  font-size: 20px;              /* Optionnel : agrandir un peu */
  letter-spacing: 1px;           /* Optionnel : espace entre chiffres */
  color: #222;                   /* Optionnel : couleur foncée */
}

/*fix position éléments vignettes*/
/* 1. Fixe la hauteur du bloc image pour toutes les vignettes */
.thumbnail-container-image {
  min-height: 245px; /* ou la hauteur exacte de tes images */
  display: flex;
  align-items: flex-end; /* Optionnel : image collée en bas */
}

/* 2. Fixe la hauteur du bloc titre pour toutes les vignettes */
.product-miniature .product-title {
  min-height: 48px; /* Ajuste selon la hauteur de tes titres */
  display: flex;
  align-items: flex-end; /* Titre collé en bas du bloc titre */
}

/* 3. Aligne la partie sous le titre (prix, boutons, etc.) */
.product-miniature .product-description {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 100%;
}

/* 4. Fixe la hauteur totale de la vignette pour éviter les décalages */
.product-miniature {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* 5. Pour que toutes les vignettes aient la même hauteur dans la grille */
.products.row {
  display: flex;
  flex-wrap: wrap;
}

.products .product-miniature {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.product-miniature .product-title {
  min-height: 2.6em;         /* Ajuste selon la taille de police (2 lignes) */
  max-height: 2.6em;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;     /* Force 2 lignes max */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;       /* Permet le retour à la ligne */
  align-items: flex-end;
}
/*fix padding dropdown tous les produits*/
#apmenu-dropdown {
  width: 1300px !important;    /* Plus large, adapte selon ton besoin */
  height: 800px !important;    /* Plus haut, adapte selon ton besoin */
  left: 50% !important;
  transform: translateX(-50%) !important;
  padding: 32px !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
}

.apmenu-dropdown-right {
  height: 100%;
  overflow-y: auto !important;
  box-sizing: border-box;
}

.apmenu-subcat-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important; /* 4 colonnes égales */
  gap: 40px !important;
  width: 100% !important;
}

/*la Pharmacie-  #758974*/
.abouus-cms-page {
  max-width: 1200px;
  margin: 2rem auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 16px rgba(0,0,0,0.07);
  padding: 2rem 1rem;
}

.abouus-specific-container {
  width: 100%;
  margin: 0 auto 2rem auto;
  max-width: 1200px;
  padding: 0 1rem;
}

.abouus-row,
.abouus-row.abouus-vcenter {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  align-items: stretch;
}
.abouus-row.abouus-vcenter {
  align-items: flex-start;
}

.abouus-col {
  flex: 1 1 350px;
  min-width: 320px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.abouus-bloc-slide {
  max-width: 500px;
  flex: 1 1 400px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: stretch;
  justify-content: flex-start;
  min-width: 320px;
}

/* Carrousel fade CSS only */
.abouus-fade-carousel {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(0,0,0,0.07);
  background: #fff;
  min-height: 200px;
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.abouus-fade-carousel .fade-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  animation: fadeCarousel 18s infinite;
  transition: opacity 1s;
  border-radius: 12px;
  z-index: 1;
}
.abouus-fade-carousel .fade-slide:nth-child(1) { animation-delay: 0s; }
.abouus-fade-carousel .fade-slide:nth-child(2) { animation-delay: 6s; }
.abouus-fade-carousel .fade-slide:nth-child(3) { animation-delay: 12s; }
.abouus-fade-carousel .fade-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}
@keyframes fadeCarousel {
  0%   { opacity: 0; }
  5%   { opacity: 1; }
  30%  { opacity: 1; }
  35%  { opacity: 0; }
  100% { opacity: 0; }
}

/* Empêche tout effet d'opacité/animation sur la carte et le reste */
.abouus-guided-tour,
.abouus-map-container,
.abouus-guided-tour iframe,
.abouus-localiser-section,
.abouus-localiser-map-container,
.abouus-localiser-section iframe {
  position: static !important;
  opacity: 1 !important;
  animation: none !important;
  transition: none !important;
  z-index: 2;
}

/* VISITE GUIDÉE */
.abouus-guided-tour {
  margin-top: 2.5rem;
  text-align: center;
}
.abouus-map-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 1rem;
  width: 100%;
}
.abouus-map-container iframe {
  width: 100%;
  max-width: 600px;
  height: 400px;
  border: 0;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  background: #fff;
}
@media (max-width: 700px) {
  .abouus-map-container iframe {
    max-width: 100%;
    height: 250px;
  }
}

/* NOUS LOCALISER */
.abouus-localiser-section {
  margin: 2.5rem auto 0 auto;
  max-width: 1200px;
  padding: 0 1rem;
  background: #f7f7f7;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.abouus-localiser-section .abouus-section-title {
  margin-top: 0;
  margin-bottom: 1rem;
  font-size: 1.3rem;
  color: #758974;
  text-align: left;
}
.abouus-localiser-map-container {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 16px rgba(0,0,0,0.07);
  padding: 1.2rem 1rem 0.7rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 1.2rem;
  width: 100%;
  margin-bottom: 0.5rem;
}
.abouus-localiser-map-container iframe {
  width: 100%;
  max-width: 900px;
  height: 350px;
  border: 1px solid black;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  background: #fff;
}
.abouus-localiser-link {
  margin-top: 0.5rem;
  text-align: right;
  width: 100%;
}
.abouus-localiser-link a {
  color: #758974;
  text-decoration: underline;
  font-size: 0.95em;
  font-weight: 500;
  font-family: 'Montserrat', Arial, sans-serif;
  transition: color 0.2s;
}
.abouus-localiser-link a:hover {
  color: #758974;
}

@media (max-width: 900px) {
  .abouus-row,
  .abouus-row.abouus-vcenter {
    flex-direction: column;
    gap: 1.5rem;
  }
  .abouus-col,
  .abouus-bloc-slide {
    min-width: 0;
    max-width: 100%;
  }
  .abouus-localiser-map-container iframe {
    max-width: 100%;
    height: 220px;
  }
}

/* TITRES */
.abouus-title {
  color: #758974;
  font-size: 2.2rem;
  margin-bottom: 1rem;
  font-weight: 500;
  font-family: 'Montserrat', Arial, sans-serif;
  text-align: center;
}

.abouus-section-title {
  font-size: 1.4rem;
  margin-bottom: 0.7rem;
  color: #758974;
  font-weight: 400;
  font-family: 'Montserrat', Arial, sans-serif;
  text-align: center;
}

/* ADRESSE & INTRO */
.abouus-address {
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
  text-align: center;
}
.abouus-nonstop {
  color: #758974;
  font-weight: bold;
  letter-spacing: 1px;
}
.abouus-intro {
  margin-bottom: 1.2rem;
  font-size: 1.1rem;
  text-align: center;
}

/* BOUTONS */
.abouus-btn {
  background: #758974;
  color: #fff;
  border-radius: 4px;
  padding: 0.35rem 1rem;
  margin: 0.5rem 0.25rem 0.5rem 0;
  display: inline-block;
  text-decoration: none;
  transition: background 0.15s, transform 0.12s, box-shadow 0.12s;
  font-weight: 600;
  border: none;
  cursor: pointer;
  font-size: 0.98rem;
  min-width: 120px;
  text-align: center;
  box-shadow: 0 1px 4px rgba(0,0,0,0.07);
  font-family: 'Montserrat', Arial, sans-serif;
}
.abouus-btn:hover, .abouus-btn:focus {
  background: #758974;
  color: #fff;
  transform: scale(1.07);
  box-shadow: 0 4px 16px rgba(139,175,26,0.13);
  outline: none;
}
.abouus-btn:active {
  transform: scale(0.97);
  box-shadow: 0 1px 2px rgba(0,0,0,0.10);
}
.abouus-btn-group {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

/* LISTES */
.abouus-list {
  list-style: disc inside;
  margin: 0 auto 1.5rem auto;
  padding-left: 1rem;
  color: #555;
  text-align: left;
  max-width: 350px;
}

/* SERVICES */
.abouus-services {
  display: flex;
  flex-direction: column; /* Force un affichage vertical */
  gap: 1.5rem;
  margin-top: 1.5rem;
  justify-content: center;
}
.abouus-service {
  flex: 0 0 auto; /* Désactive la flexibilité de la largeur */
  width: 100%; /* Prend toute la largeur disponible */
  background: #f8f8f8;
  border-radius: 8px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.03);
  padding: 1.2rem;
  margin-bottom: 1.5rem; /* Ajoute un espacement entre les éléments */
}
.abouus-service-title {
  color: #758974;
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
  font-weight: 400;
  font-family: 'Montserrat', Arial, sans-serif;
  text-align: center;
}

/* LOGO */
.abouus-logo {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.2rem;
  max-height: 80px;
  max-width: 200px;
  width: auto;
  height: auto;
}

/* SECTION */
.abouus-section {
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Responsive pour boutons, titres, services */
@media (max-width: 600px) {
  .abouus-title {
    font-size: 1.4rem;
  }
  .abouus-btn {
    min-width: 100px;
    font-size: 0.92rem;
    padding: 0.32rem 0.7rem;
  }
  .abouus-btn-group {
    gap: 0.3rem;
  }
  .abouus-service {
    padding: 0.8rem;
  }
}
/*médicaments all products*/
li.apmenu-cat-li[data-id="11"] > a.apmenu-cat-link {
  color: #758974 !important;
  font-weight: 600 !important;
  font-size: 18px !important;
}
/*bannières sous le carrousel*/
.an_advantages-angle-left,
.an_advantages-angle-right {
  display: none !important;
}
.an_advantages-item,
.an_advantages-item-inner {
  border-radius: 24px !important; /* Ajuste la valeur selon l'effet souhaité */
  overflow: hidden;              /* Pour que le contenu suive l'arrondi */
}

/*coins arrondis carrousel*/
.an_homeslider-block,
.an_homeslider {
  border-radius: 24px !important; /* Ajuste la valeur selon l’effet souhaité */
  overflow: hidden;               /* Pour que les images suivent l’arrondi */
}

/*masquage éléments détails produit*/
section.product-features,
div.product-condition {
  display: none !important;
}

/*réduction fixe*/
/* Style complet pour le flag de réduction */
.product-flag.discount-percentage {
  position: absolute !important;
  z-index: 10;
  display: list-item !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.10); /* Ombre douce */
  /*border: 2px solid #E90472;      /* Liseré pour rappel couleur promo */
  pointer-events: auto;
  transition: box-shadow 0.18s, background 0.18s, color 0.18s;
}

/* Toujours visible même au hover */
.thumbnail-container-image:hover .product-flag.discount-percentage {
  display: list-item !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/*prix barré*/
.product-miniature-prices .regular-price {
  font-weight: 600 !important;
}

/* CSS pour ajuster uniquement l'élément CLICK & COLLECT en mode mobile */
@media (max-width: 767px) {
  /* Sélecteur spécifique pour l'élément CLICK & COLLECT */
  a.an_advantages-item[href*="click-collect"] .an_advantages-item-desc {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  
  /* Ajuster le titre CLICK & COLLECT */
  a.an_advantages-item[href*="click-collect"] .an_advantages-item-title.h4 {
    font-size: 13px !important;
    text-align: center !important;
    margin-bottom: 2px !important;
  }
  
  /* Ajuster le sous-titre "Retrait à la pharmacie" */
  a.an_advantages-item[href*="click-collect"] h6 {
    font-size: 11px !important;
    text-align: center !important;
    margin: 0 !important;
    line-height: 1.2 !important;
  }
  
  /* Conserver la structure avec l'image à gauche */
  a.an_advantages-item[href*="click-collect"] .an_advantages-item-inner {
    display: flex !important;
    align-items: center !important;
  }
  
  /* S'assurer que l'image reste à gauche et ne change pas */
  a.an_advantages-item[href*="click-collect"] .an_advantages-item-img {
    margin-right: 8px !important;
  }
}

/*masquage PROMO*/
/* Cache uniquement le drapeau "Promo !" */
.product-flag.on-sale {
    display: none !important;
}

/*popup de recherche pour mobile*/
@media (max-width: 767px) {
  .product-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }
  .product-grid .product-item {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
}

@media (max-width: 767px) {
  #ajaxsmartsearch-input,
  .search-input {
    font-size: 16px !important;
  }
}
@media (max-width: 767px) {
  #ajaxsmartsearch-overlay,
  .ajaxsmartsearch-overlay,
  [id*="overlay"],
  [class*="overlay"] {
    display: none !important;
  }
  #new-ajaxsmartsearch-popup {
    top: 200px !important;
  }
}