/* qm-header.css : header natif (bloc Elementor 627), charge apres post-627.css. Ne contient que ce que le JavaScript faisait (header collant + etat « scrolled », burger, overlay de recherche, bouton panier maison) et les regles de l'Additional CSS du Customizer dont le header depend. Selecteurs scopes sur .qm-hdr (classe posee sur
). */ /* ---- 1. Header collant sans JS ------------------------------------------------------------------------- Origine : conteneur 479f28d en position:absolute (post-627.css) par-dessus le hero, rendu fixe au defilement par sticky.min.js (classes elementor-sticky, elementor-sticky--active, elementor-sticky--effects : aucun CSS du site ne les cible, rien a remplacer), puis classe header-scrolled (fond noir pleine largeur) ajoutee a 300px par un snippet. Ici : le
colle au viewport avec une hauteur nulle ; le conteneur absolu (top:0 ; left:0) le suit et continue de recouvrir le contenu comme au repos. */ .qm-hdr.elementor-location-header{position:sticky;top:0;z-index:999;height:0;overflow:visible} /* Hauteur reelle du bandeau (mesuree) : le conteneur est absolu, il ne pousse rien. Les zones sans hero (pages, blog, archive mobile) se decalent d'autant. */ :root{--qm-hdr-h:92px} /* 30/08 : bandeau 20 px du haut + barre 72 px = 92 (136 datait d'avant le retrait de « Beliebte Suchanfragen ») */ @media (max-width:1024px){:root{--qm-hdr-h:92px}} @media (max-width:767px){:root{--qm-hdr-h:54px}} .qm-native main.site-main{padding-top:calc(var(--qm-hdr-h) + 32px)} /* Tunnel de commande : aucun bandeau de site (header-native.php sort tot), donc aucun decalage. */ .qm-native.woocommerce-checkout main.site-main{padding-top:0} /* 30/08 : meme ecart header -> titre que les pages (32 px) a TOUTES les largeurs, collections + recherche (conteneur c37b944 commun, paddings figes 150/100 px remplaces) et fiche produit (0985de8, 160 px) ; div. ajoute pour battre la CSS figee a ordre egal. */ .qm-native div.elementor-element.elementor-element-c37b944 > div.e-con-inner{padding-top:calc(var(--qm-hdr-h) + 32px)} /* Fiche produit mobile : la galerie commencait 4 px sous le bandeau (padding 50 px d'origine pour un bandeau de 54). */ .qm-native div.elementor-element.elementor-element-0985de8 > div.e-con-inner{padding-top:calc(var(--qm-hdr-h) + 32px)} .admin-bar .qm-hdr.elementor-location-header{top:32px} @media (max-width:782px){.admin-bar .qm-hdr.elementor-location-header{top:46px}} .qm-hdr .custom-sticky-header{background-color:transparent;isolation:isolate} /* Etat « scrolled » (>= 300px) : voile noir sous le contenu du conteneur. L'Additional CSS du Customizer impose background-color:transparent !important sur le conteneur, qu'une animation ne peut pas battre : d'ou le pseudo-element. Sans prise en charge des animations liees au defilement, l'etat repos (bandeau noir arrondi collant) reste. */ .qm-hdr .custom-sticky-header::before{content:"";position:absolute;inset:0;z-index:-1;background-color:#000;opacity:0;pointer-events:none} @supports (animation-timeline: scroll()) { .qm-hdr .custom-sticky-header::before{animation:qm-hdr-scrolled steps(1, end) both;animation-timeline:scroll(root);animation-range:0px 300px} @keyframes qm-hdr-scrolled{from{opacity:0}to{opacity:1}} } /* Additional CSS d'origine (Customizer), reporte pour que le header natif soit autonome : bandeau noir arrondi, droit sur mobile ; bouton panier sans bordure. */ .qm-hdr .header-background{border-radius:12px} @media (max-width:767px){.qm-hdr .header-background{border-radius:0}} .qm-hdr .cart-menu{border:none} /* ---- 2. Menu : un seul