/* ==========================================================================
   En-tete du filtre : titre "Web CATALOGUE" + bouton "Masquer / Afficher le filtre" (bloc Elementor du gabarit CE 7170101) - ps1
   Le bloc reprend le balisage de la prod (.category__itro > .h1 + #showHideSearch, style pilule de custom.css). L'etat est celui du
   compte (eg_color.save_config) : classe .fullwidth sur #content-wrapper-parent rendue COTE SERVEUR par layout-both-columns.tpl, donc
   libelle et masquage sont pilotes par le CSS ci-dessous des le premier rendu (aucun flash, meme sans JS).
   + chemin complet de la categorie filtree (widget CE "eg-cat-path", plugin Smarty themes/marketplace/plugins/function.eg_listing_context.php).
   Fichier dedie, charge par head.tpl avec ?v=<horodatage>. Bouton : DESKTOP seulement (>= 1024 px) ; sous 1024 px c'est le bouton mobile
   "Filtres (n)" + tiroir CE (lot 2) qui fait le travail ; la preference "masque" n'y a aucun effet.
   ========================================================================== */

/* Titre : espacement dans le bloc CE (la prod met 20 px sous le titre, le bouton vient ensuite) */
.eg-webcat-header.category__itro { margin-bottom: 0; }

/* Libelle du bouton : deux libelles dans le balisage, un seul visible selon l'etat rendu par le serveur */
#showHideSearch .eg-lbl { display: inline; }
#content-wrapper-parent.fullwidth #showHideSearch .eg-lbl--hide { display: none; }
#content-wrapper-parent:not(.fullwidth) #showHideSearch .eg-lbl--show { display: none; }

@media (min-width: 1024px) {
  /* Le bouton garde la pilule de la prod (custom.css : .category__itro #showHideSearch) ; on annule seulement son masquage a 1024 px pile */
  .category__itro #showHideSearch.eg-toggle-filters {
    display: inline-block;
    min-height: 40px;
    padding: 9px 20px;
  }
  .category__itro #showHideSearch.eg-toggle-filters:focus-visible {
    outline: 2px solid #0B6E85 !important;   /* meme anneau que le lot 2 ; !important : custom.css pose `a, button { outline: none !important }` */
    outline-offset: 2px;
  }
  /* aucune facette rendue (compte a personnalisation restreinte) : pas de bouton devant un bloc vide (le titre reste)
     (si :has() n'est pas supporte, la regle est ignoree et le bouton reste visible : jamais de blocage) */
  .container:not(:has(.sidebar_filter .ce-filters .elementor-field-group, #left-column #search_filters)) .eg-webcat-header #showHideSearch { display: none !important; }

  /* Etat "masque" (classe .fullwidth posee par layout-both-columns.tpl selon eg_color.save_config) : le bloc gauche disparait,
     la colonne des produits reprend la largeur. Les regles du lot 1 (grille 3 par ligne, pagination sous la grille) ne sont pas touchees. */
  #content-wrapper-parent.fullwidth .sidebar_filter.elementor-column { display: none !important; }
  #content-wrapper-parent.fullwidth .sidebar_filter ~ .elementor-column { width: 100% !important; max-width: 100%; }
  /* la rangee titre + tri est une section CE "boxed" (conteneur 1140 px centre) : sans la barre laterale elle se decalait de ~110 px par rapport a la grille ;
     on lui rend la largeur de la colonne pour que titre, tri et grille restent alignes */
  #content-wrapper-parent.fullwidth .sidebar_filter ~ .elementor-column .elementor-section-boxed > .elementor-container { max-width: 100%; }

  /* Reliquat du tiroir AS4 dans le gabarit CE : "FILTRES" (.open-filter) masquait la barre laterale ENTIERE, bouton compris, sans moyen de la
     rouvrir ni de conserver l'etat. Remplace par le bouton ci-dessus (un seul bouton, pas de doublon). */
  body .elementor .sidebar_filter .open-filter,
  body .elementor .sidebar_filter .close-filter { display: none !important; }
}

/* Chemin complet de la categorie filtree : texte simple, meme allure que le fil d'Ariane CE d'origine (Roboto 12 px, #676A6C) */
.eg-cat-path { margin: 0; font-family: "Roboto", sans-serif; font-size: 12px; line-height: 1.5; color: #676A6C; }
.eg-cat-path__list { display: block; margin: 0; padding: 0; list-style: none; }
.eg-cat-path__item { display: inline; margin: 0; padding: 0; }
.eg-cat-path__item:last-child { color: #111; font-weight: 500; }
.eg-cat-path__sep { color: #C5C5C5; white-space: pre-wrap; }

/* Retours recette 2 : segments ancetres du chemin cliquables (liste prefiltree sur la categorie) ; le dernier segment reste en texte.
   Teinte foncee de l'accent (#0B6E85, contraste > 5:1 sur blanc et sur le fond gris de la page) + soulignement fin (le lien se distingue du texte
   voisin sans reposer sur la seule couleur) ; survol : plus fonce, soulignement plein. */
.eg-cat-path__link { color: #0B6E85; text-decoration: underline !important; text-decoration-thickness: 1px; text-underline-offset: 2px; text-decoration-color: rgba(11, 110, 133, .55); }   /* !important : custom.css pose `a { text-decoration: none !important }` */
.eg-cat-path__link:hover { color: #084C5C; text-decoration-color: currentColor; }
.eg-cat-path__link:focus-visible { outline: 2px solid #0B6E85 !important; outline-offset: 2px; border-radius: 2px; }
/* ecrans tactiles : zone de toucher des liens du chemin (>= 24 px de haut) */
@media (pointer: coarse) { .eg-cat-path__link { display: inline-block; padding: 5px 1px; } }

/* Espace sous le header (2026-10-11, audits/ps1-perso-retours-client-2026-10-08/FRONT-A2.md) : sur les listings qui portent
   l'en-tete "Web CATALOGUE" (section CE 7e3b1a90 du gabarit ce_meta 7170101, deja 40 px de marge haute, 50 px en mobile), le
   padding-top general du #wrapper (custom.css : 60 px, 40 px <= 1024 px) s'ajoutait et creait une bande vide. Limite aux
   pages categorie qui contiennent cet en-tete ; navigateurs sans :has() = rendu d'avant. Le fil d'Ariane garde 16 px d'air. */
body.page-category #wrapper:has(.eg-webcat-header) { padding-top: 0; }
body.page-category #wrapper:has(.eg-webcat-header) .breadcrumb { padding-top: 16px; }