/* LES INFUTHÉS — ADVANCED TOP MENU V8.4 */ @media screen and (min-width:1200px){ #header #adtm_menu ul#menu>li.li-niveau1.sub{position:static!important} #header #adtm_menu ul#menu>li.li-niveau1.sub>div.adtm_sub{ top:58px!important;left:-9999px!important;right:auto!important; width:930px!important;max-width:calc(100vw - 110px)!important;min-height:0!important; display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto!important;gap:14px!important; padding:18px 20px 16px!important;color:#602f10!important;background:#fffaf0!important; border:2px solid rgba(96,47,16,.55)!important;border-radius:18px!important; box-shadow:0 14px 32px rgba(96,47,16,.11),0 3px 7px rgba(96,47,16,.05)!important; opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(7px)!important;z-index:1000!important } #header #adtm_menu ul#menu>li.li-niveau1.sub.infuthes-menu-open>div.adtm_sub, #header #adtm_menu ul#menu>li.li-niveau1.sub.infuthes-menu-open:hover>div.adtm_sub, #header #adtm_menu ul#menu>li.li-niveau1.sub.infuthes-menu-open>div.adtm_sub:hover{ left:0!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important } #header #adtm_menu ul#menu>li.li-niveau1.sub:not(.infuthes-menu-open):hover>div.adtm_sub{ left:-9999px!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important } #header #adtm_menu ul#menu>li.li-niveau1.sub>.adtm_sub>table.columnWrapTable{ grid-column:1!important;grid-row:1!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;table-layout:auto!important;background:transparent!important } #header #adtm_menu ul#menu>li.li-niveau1.sub .adtm_column_wrap_td, #header #adtm_menu ul#menu>li.li-niveau1.sub .adtm_column_wrap, #header #adtm_menu ul#menu>li.li-niveau1.sub .adtm_column{min-height:0!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important} #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title{position:relative!important;display:block!important;margin:0!important;padding:7px 2px 9px!important;background:transparent!important;border:0!important} #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title a, #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title span[data-href]{display:block!important;margin:0!important;padding:0!important;color:#602f10!important;background:transparent!important;border:0!important;font-family:"Catenary Stamp","Lato",sans-serif!important;font-size:19px!important;line-height:1.2!important;font-weight:400!important;text-transform:uppercase!important;text-decoration:none!important} #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title::after{content:"";display:block!important;width:42%!important;height:1px!important;margin-top:8px!important;background:rgba(100,185,40,.68)!important;border-radius:999px!important} #header #adtm_menu ul#menu>li.li-niveau1.sub .adtm_column:last-child .column_wrap_title::after, #header #adtm_menu ul#menu>li.li-niveau1.sub .adtm_column_wrap_td:last-child .adtm_column:last-child .column_wrap_title::after{display:none!important} #header #adtm_menu ul#menu>li.li-niveau1.sub>.adtm_sub>.infuthes-mega-parent-link{grid-column:1!important;grid-row:2!important;display:block!important;margin:2px 0 0!important;padding:9px 2px 0!important;border-top:1px solid rgba(96,47,16,.12)!important} #header #adtm_menu .infuthes-mega-parent-link>a.a-niveau1,#header #adtm_menu .infuthes-mega-parent-link>span.a-niveau1{float:none!important;display:inline-flex!important;min-height:0!important;line-height:1.3!important;margin:0!important;padding:2px 0!important;background:transparent!important;border:0!important} #header #adtm_menu .infuthes-mega-parent-link .advtm_menu_span{min-height:0!important;line-height:1.3!important;margin:0!important;padding:0!important;color:#602f10!important;background:transparent!important;font-size:0!important;font-weight:700!important;text-transform:none!important} #header #adtm_menu .infuthes-mega-parent-link .advtm_menu_span::after{content:"Voir toute la catégorie \2192"!important;position:static!important;display:inline!important;width:auto!important;height:auto!important;color:#602f10!important;background:none!important;font-family:"Lato",sans-serif!important;font-size:13.5px!important;line-height:1.3!important;transform:none!important} #header #adtm_menu ul#menu>li.advtm_menu_1 .infuthes-mega-parent-link .advtm_menu_span::after{content:"Voir toutes nos infusions \2192"!important} #header #adtm_menu .infuthes-mega-parent-link:hover .advtm_menu_span::after{color:#64b928!important} #header #adtm_menu ul#menu>li.li-niveau1.sub>div.adtm_sub::after, #header #adtm_menu ul#menu>li.li-niveau1.sub>div.adtm_sub::before{display:none!important} /* La carte éditoriale BIO reste spécifique à Infusions et thés. */ #header #adtm_menu ul#menu>li.advtm_menu_1>div.adtm_sub{grid-template-columns:minmax(0,1fr) 235px!important;gap:14px 18px!important} #header #adtm_menu ul#menu>li.advtm_menu_1>div.adtm_sub::after{ content:"BIO \2022 SANS ARÔMES AJOUTÉS\A L’UNIVERS LES INFUTHÉS\A Des recettes naturelles, élaborées avec soin pour retrouver le goût authentique des plantes."; grid-column:2!important;grid-row:1/span 2!important;display:block!important;min-height:205px!important;padding:17px 16px!important;color:#602f10!important;white-space:pre-line!important;background:#f3e4b9!important;border:1px solid rgba(96,47,16,.18)!important;border-radius:15px!important;font-family:"Lato",sans-serif!important;font-size:13px!important;line-height:1.5!important;box-sizing:border-box!important;pointer-events:none!important } #header #adtm_menu ul#menu>li.advtm_menu_1>div.adtm_sub::before{content:"";display:block!important;position:absolute;top:17px;right:20px;width:35px;height:3px;border-radius:999px;background:#64b928} } @media screen and (max-width:1199px){ #header #adtm_menu.adtm_menu_toggle_open ul#menu>li.li-niveau1.sub:first-of-type{margin-top:22px!important} #header #adtm_menu.adtm_menu_toggle_open ul#menu>li.li-niveau1.sub>div.adtm_sub{position:static!important;left:auto!important;right:auto!important;top:auto!important;width:100%!important;max-width:none!important;min-height:0!important;margin:6px 0 12px!important;padding:13px 16px 15px!important;color:#602f10!important;background:#fffaf0!important;border:2px solid rgba(96,47,16,.55)!important;border-radius:16px!important;box-shadow:0 9px 24px rgba(96,47,16,.09)!important;box-sizing:border-box!important} #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title{position:relative!important;display:block!important;margin:0!important;padding:9px 4px!important;background:transparent!important;border:0!important} #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title a,#header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title span[data-href]{display:block!important;margin:0!important;padding:0!important;color:#602f10!important;background:transparent!important;border:0!important;font-family:"Catenary Stamp","Lato",sans-serif!important;font-size:18.5px!important;line-height:1.2!important;font-weight:400!important;text-transform:uppercase!important;text-decoration:none!important} #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title::after{content:"";display:block!important;width:44%!important;height:1px!important;margin-top:9px!important;background:rgba(100,185,40,.68)!important;border-radius:999px!important} #header #adtm_menu ul#menu>li.li-niveau1.sub .adtm_column:last-child .column_wrap_title::after,#header #adtm_menu ul#menu>li.li-niveau1.sub .adtm_column_wrap_td:last-child .adtm_column:last-child .column_wrap_title::after{display:none!important} #header #adtm_menu ul#menu>li.li-niveau1.sub>.adtm_sub>.infuthes-mega-parent-link{display:block!important;margin:5px 0 0!important;padding:11px 4px 2px!important;border-top:1px solid rgba(96,47,16,.13)!important} #header #adtm_menu .infuthes-mega-parent-link>a.a-niveau1,#header #adtm_menu .infuthes-mega-parent-link>span.a-niveau1{float:none!important;display:inline-flex!important;min-height:0!important;line-height:1.3!important;margin:0!important;padding:3px 0!important;background:transparent!important;border:0!important} #header #adtm_menu .infuthes-mega-parent-link .advtm_menu_span{min-height:0!important;line-height:1.3!important;margin:0!important;padding:0!important;color:#602f10!important;background:transparent!important;font-size:0!important;font-weight:700!important;text-transform:none!important} #header #adtm_menu .infuthes-mega-parent-link .advtm_menu_span::after{content:"Voir toute la catégorie \2192"!important;position:static!important;display:inline!important;width:auto!important;height:auto!important;color:#602f10!important;background:none!important;font-family:"Lato",sans-serif!important;font-size:14px!important;line-height:1.3!important;transform:none!important} #header #adtm_menu ul#menu>li.advtm_menu_1 .infuthes-mega-parent-link .advtm_menu_span::after{content:"Voir toutes nos infusions \2192"!important} #header #adtm_menu ul#menu>li.li-niveau1.sub>div.adtm_sub::after, #header #adtm_menu ul#menu>li.li-niveau1.sub>div.adtm_sub::before{display:none!important} #header #adtm_menu ul#menu>li.advtm_menu_1>div.adtm_sub::after{content:"BIO \2022 SANS ARÔMES AJOUTÉS";display:block!important;margin-top:10px!important;padding:8px 10px!important;color:#602f10!important;background:#f3e4b9!important;border:1px solid rgba(96,47,16,.16)!important;border-radius:11px!important;font-family:"Lato",sans-serif!important;font-size:11.5px!important;line-height:1.35!important;font-weight:700!important;text-align:center!important;box-sizing:border-box!important} } /* ========================================================= V8.5 — Libellés spécifiques des liens parents IDs du module Advanced Top Menu : 4 = Coffrets, miels et accessoires 6 = Les Infuthés ========================================================= */ /* "Les Infuthés" : aucun lien "Voir toute la catégorie". */ #header #adtm_menu ul#menu > li.advtm_menu_6 .infuthes-mega-parent-link { display: none !important; } /* "Coffrets, miels et accessoires" : libellé dédié. */ #header #adtm_menu ul#menu > li.advtm_menu_4 .infuthes-mega-parent-link .advtm_menu_span::after { content: "Voir tous nos coffrets & accessoires \2192" !important; } /* ========================================================= V8.6 — VISUELS DES MEGA-MENUS (DESKTOP UNIQUEMENT) 1 = Infusions et thés 4 = Coffrets, miels et accessoires 6 = Les Infuthés ========================================================= */ /* Les visuels sont absents sur mobile/tablette. Les images ne sont référencées que dans la media query desktop ci-dessous. */ .infuthes-mega-visual { display: none !important; } @media screen and (min-width:1200px) { /* Les trois volets avec image disposent d'une vraie colonne visuelle. */ #header #adtm_menu ul#menu > li.advtm_menu_1 > div.adtm_sub, #header #adtm_menu ul#menu > li.advtm_menu_4 > div.adtm_sub, #header #adtm_menu ul#menu > li.advtm_menu_6 > div.adtm_sub { grid-template-columns: minmax(0, 1fr) 265px !important; gap: 14px 20px !important; } /* La carte texte BIO desktop d'Infusions et thés est remplacée par l'image. */ #header #adtm_menu ul#menu > li.advtm_menu_1 > div.adtm_sub::after, #header #adtm_menu ul#menu > li.advtm_menu_1 > div.adtm_sub::before { display: none !important; content: none !important; } #header #adtm_menu .infuthes-mega-visual { position: relative; grid-column: 2 !important; grid-row: 1 / span 2 !important; display: block !important; min-height: 220px !important; align-self: stretch; overflow: hidden; background-color: #f3e4b9 !important; background-repeat: no-repeat !important; background-position: center !important; border: 1px solid rgba(96,47,16,.18) !important; border-radius: 15px !important; box-sizing: border-box !important; } #header #adtm_menu .infuthes-mega-visual::before { content: ""; position: absolute; top: 0; right: 16px; width: 36px; height: 3px; border-radius: 999px; background: #64b928; } #header #adtm_menu .infuthes-mega-visual-1 { background-image: url("../img/menu/les-infuthes-produits-herboristerie.png") !important; background-size: 96% auto !important; } #header #adtm_menu .infuthes-mega-visual-4 { background-image: url("../img/menu/les-infuthes-coffret-cadeau.png") !important; background-size: 96% auto !important; } #header #adtm_menu .infuthes-mega-visual-6 { background-image: url("../img/menu/logo-les-infuthes-600x450.png") !important; background-size: 90% auto !important; } /* Les Infuthés : suppression garantie du lien parent. */ #header #adtm_menu ul#menu > li.advtm_menu_6 .infuthes-mega-parent-link { display: none !important; } /* Coffrets, miels et accessoires : libellé dédié. */ #header #adtm_menu ul#menu > li.advtm_menu_4 .infuthes-mega-parent-link .advtm_menu_span::after { content: "Voir tous nos coffrets & accessoires \2192" !important; } } @media screen and (max-width:1199px) { #header #adtm_menu .infuthes-mega-visual { display: none !important; } } /* ========================================================= LES INFUTHÉS — V8.7 ROBUSTE Ne dépend plus des IDs numériques d'Advanced Top Menu. ========================================================= */ @media screen and (min-width: 1200px) { /* Le texte réel du lien parent est désormais injecté par JS. On neutralise les anciens pseudo-libellés V8.4/V8.6. */ #header #adtm_menu .infuthes-mega-parent-link .advtm_menu_span { font-size: 13.5px !important; line-height: 1.3 !important; color: #602f10 !important; } #header #adtm_menu .infuthes-mega-parent-link .advtm_menu_span::after { content: none !important; display: none !important; } /* Les Infuthés : aucun lien parent. */ #header #adtm_menu ul#menu > li.infuthes-menu-marque .infuthes-mega-parent-link { display: none !important; } /* Les trois menus concernés gagnent une colonne visuelle à droite. */ #header #adtm_menu ul#menu > li.infuthes-menu-has-visual > div.adtm_sub { grid-template-columns: minmax(0, 1fr) 265px !important; gap: 14px 20px !important; } /* Supprime les cartes éditoriales générées par les anciennes versions afin de laisser toute la colonne droite à l'image. */ #header #adtm_menu ul#menu > li.infuthes-menu-has-visual > div.adtm_sub::before, #header #adtm_menu ul#menu > li.infuthes-menu-has-visual > div.adtm_sub::after { display: none !important; content: none !important; } #header #adtm_menu .infuthes-mega-visual { grid-column: 2 !important; grid-row: 1 / span 2 !important; align-self: center !important; display: flex !important; align-items: center !important; justify-content: center !important; min-height: 205px !important; padding: 10px !important; overflow: hidden !important; background: #f3e4b9 !important; border: 1px solid rgba(96, 47, 16, .18) !important; border-radius: 15px !important; box-sizing: border-box !important; } #header #adtm_menu .infuthes-mega-visual img { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; max-height: 215px !important; object-fit: contain !important; } #header #adtm_menu ul#menu > li.infuthes-menu-marque .infuthes-mega-visual img { max-width: 92% !important; } } @media screen and (max-width: 1199px) { /* Aucun téléchargement ni affichage d'image sur mobile : les images ne sont injectées par JS qu'à partir de 1200 px. */ #header #adtm_menu .infuthes-mega-visual { display: none !important; } /* Les anciens pseudo-libellés sont également neutralisés sur mobile. */ #header #adtm_menu .infuthes-mega-parent-link .advtm_menu_span { font-size: 14px !important; color: #602f10 !important; } #header #adtm_menu .infuthes-mega-parent-link .advtm_menu_span::after { content: none !important; display: none !important; } #header #adtm_menu ul#menu > li.infuthes-menu-marque .infuthes-mega-parent-link { display: none !important; } } /* ========================================================= V8.9 — Ajustements demandés - suppression du trait vert sur l'image - on rapproche texte et image sans réduire l'image - nouveau visuel pour INFUSIONS ET THÉS ========================================================= */ @media screen and (min-width:1200px){ /* Panneaux illustrés un peu moins larges pour réduire le vide. */ #header #adtm_menu ul#menu>li.infuthes-menu-has-visual>div.adtm_sub{ width:860px!important; max-width:calc(100vw - 110px)!important; grid-template-columns:minmax(0,1fr) 265px!important; gap:14px 12px!important; } /* On supprime le petit trait vert au-dessus des cartes images. */ #header #adtm_menu .infuthes-mega-visual::before{ display:none!important; content:none!important; } } /* ========================================================= V8.11 — HOVER UNIFORME SUR TOUS LES TITRES DE SOUS-CATÉGORIES Desktop uniquement. Ne modifie ni le mobile ni les onglets parents. ========================================================= */ @media screen and (min-width:1200px){ #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title a, #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title span[data-href]{ transition:color .18s ease, transform .18s ease!important; transform:translateX(0)!important; will-change:transform; } #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title:hover a, #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title:focus-within a, #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title:hover span[data-href], #header #adtm_menu ul#menu>li.li-niveau1.sub .column_wrap_title:focus-within span[data-href]{ color:#64b928!important; transform:translateX(4px)!important; } } /* ========================================================= V8.12 — TYPOGRAPHIE DU MENU PRINCIPAL + SEPARATEURS PIPE Desktop uniquement. ========================================================= */ @media screen and (min-width:1200px){ /* Même identité typographique que les titres du méga-menu, sans modifier la casse des libellés. */ #header #adtm_menu ul#menu > li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle) > a.a-niveau1 .advtm_menu_span{ font-family:"Catenary Stamp","Lato",sans-serif!important; font-size:18px!important; font-weight:400!important; text-transform:none!important; letter-spacing:.05px!important; } /* Chaque item de navigation sert de repère au séparateur. */ #header #adtm_menu ul#menu > li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle){ position:relative!important; } /* Pipe avant chaque entrée à partir de la deuxième. Ainsi : aucun pipe avant le premier, aucun pipe après le dernier, et aucun séparateur autour de la recherche. */ #header #adtm_menu ul#menu > li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle) + li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle)::before{ content:"|"!important; position:absolute!important; left:-2px!important; top:50%!important; transform:translateY(-50%)!important; color:rgba(96,47,16,.42)!important; background:none!important; font-family:"Lato",sans-serif!important; font-size:15px!important; font-weight:400!important; line-height:1!important; pointer-events:none!important; } } /* ========================================================= V8.13 — LISIBILITÉ DU MENU PRINCIPAL Desktop uniquement. Aucun changement structurel du header. ========================================================= */ @media screen and (min-width:1200px){ /* Catenary Stamp paraît visuellement plus petite que Lato : on l'augmente sans modifier la hauteur du header ni les méga-menus. */ #header #adtm_menu ul#menu > li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle) > a.a-niveau1 .advtm_menu_span{ position:relative!important; font-family:"Catenary Stamp","Lato",sans-serif!important; font-size:20px!important; font-weight:400!important; line-height:56px!important; letter-spacing:.18px!important; text-transform:none!important; color:#602f10!important; background:transparent!important; transition:color .18s ease!important; } /* Hover lisible et cohérent avec la marque. */ #header #adtm_menu ul#menu > li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle) > a.a-niveau1:hover .advtm_menu_span, #header #adtm_menu ul#menu > li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle):hover > a.a-niveau1 .advtm_menu_span{ color:#64b928!important; background:transparent!important; } /* Onglet actif : vert + soulignement net, sans changer la hauteur. */ #header #adtm_menu ul#menu > li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle) > a.a-niveau1.advtm_menu_actif .advtm_menu_span{ color:#64b928!important; background:transparent!important; } #header #adtm_menu ul#menu > li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle) > a.a-niveau1.advtm_menu_actif .advtm_menu_span::after{ content:""!important; position:absolute!important; left:10px!important; right:10px!important; bottom:7px!important; height:2px!important; border-radius:999px!important; background:#64b928!important; pointer-events:none!important; } /* Les pipes restent volontairement secondaires, même au hover/actif. */ #header #adtm_menu ul#menu > li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle) + li.li-niveau1:not(.advtm_search):not(.advtm_menu_toggle)::before{ color:rgba(96,47,16,.38)!important; font-size:15px!important; font-weight:400!important; } }