/*
 Theme Name:   Astra Child - Stere.com
 Theme URI:    https://stere.com
 Description:  Theme enfant d'Astra pour le site annuaire stere.com
 Author:       stere.com
 Template:     astra
 Version:      1.0.0
 Text Domain:  astra-child
*/

/* Bouton "Rechercher un vendeur" - page d'accueil (page ID 7, Elementor) : pas de soulignement */
.e-55f9c04-8aea73f {
	text-decoration: none !important;
}

/* ==========================================================================
   Boutons Directorist - uniformisation globale, sur tout le site (formulaires,
   popups/modales, filtres, tableau de bord, fiches vendeur...). Tout element
   ".directorist-btn" (classe commune a la quasi-totalite des boutons du
   plugin, quelle que soit sa variante - primary/secondary/dark/submit/etc.)
   etait noir par defaut faute d'avoir jamais ete configure cote plugin :
   passe en bleu #375EFB / texte blanc, coins deja arrondis a 8px par defaut
   chez Directorist (rien a changer la). Complete par le reglage plugin
   button_primary_bg_color (voir wp eval, atbdp_option) pour les boutons
   utilisant explicitement la variante "primary". Les simples liens "annuler/
   effacer les filtres" (fond transparent, pas de classe .directorist-btn) ne
   sont pas des boutons colores et ne sont pas concernes. */
.directorist-btn {
	background-color: #375EFB !important;
	border-color: #375EFB !important;
	color: #FFFFFF !important;
}
.directorist-btn:hover,
.directorist-btn:focus {
	background-color: #2846d1 !important;
	border-color: #2846d1 !important;
	color: #FFFFFF !important;
}

/* ==========================================================================
   REGLE PERMANENTE, tout le site : toute icone Directorist (.directorist-
   icon-mask, le mecanisme d'icone utilise par tout le plugin - sections,
   cartes de resultat, fiches vendeur, formulaires, boutons, tableau de
   bord...) est en bleu #375EFB par defaut, quelle que soit la page ou le
   composant. A appliquer sans qu'on ait besoin de le redemander a chaque
   nouvelle page/composant ajoute a l'avenir.
   Deux exceptions :
   1. Icone DANS un bouton .directorist-btn (etoiles mises a part) : le
      bouton est deja bleu (regle ci-dessus) donc son icone reste blanche,
      sinon icone bleue sur fond bleu = invisible.
   2. Etoiles de notation (note moyenne affichee, formulaire "Laisser un
      avis", filtre par note) : ce sont des indicateurs de notation, pas des
      icones de section - restent dans leur couleur actuelle (orange/gris),
      jamais bleues. */
.directorist-icon-mask:after {
	background-color: #375EFB !important;
}
.directorist-btn .directorist-icon-mask:after {
	background-color: #FFFFFF !important;
}
.directorist-rating-meta i.directorist-icon-mask:after {
	background-color: var(--directorist-color-warning) !important;
}
.directorist-rating-meta i.directorist-icon-mask.star-empty:after {
	background-color: #d1d1d1 !important;
}
.directorist-search-field-review .directorist-icon-mask:after {
	background-color: var(--directorist-color-star) !important;
}

/* Autres controles-boutons Directorist qui ne portent pas la classe
   .directorist-btn (donc pas couverts par la regle ci-dessus) : bascule
   grille/liste des resultats (etat actif) et bouton "Filtrer" (bascule du
   panneau de filtres lateral, page "Toutes les annonces"). Meme bleu, pour
   rester uniforme avec tous les autres boutons du site. */
.directorist-viewas__item.active {
	border-color: #375EFB !important;
	background-color: #375EFB !important;
}
/* Bug latent corrige le 24/08/2026 (meme famille que le bug des badges de
   "Ajouter une annonce") : la regle ci-dessus met le bouton actif (bascule
   grille/liste) en fond bleu, mais son icone (.directorist-icon-mask:after)
   heritait de la regle permanente generale plus haut (background-color:
   #375EFB), sans exception dediee comme pour .directorist-btn - glyphe bleu
   sur fond bleu = invisible. Cette exception manquait depuis la creation
   meme de la regle .directorist-viewas__item.active (donc pas liee a une
   modification recente ponctuelle), simplement jamais remarquee avant ce
   signalement. */
.directorist-viewas__item.active .directorist-icon-mask:after {
	background-color: #FFFFFF !important;
}
.directorist-archive-sidebar-toggle,
.directorist-archive-sidebar-toggle--active {
	background-color: #375EFB !important;
	color: #FFFFFF !important;
}
/* Meme bug latent que .directorist-viewas__item.active ci-dessus, trouve en
   verifiant systematiquement tous les boutons lors de la correction du
   24/08/2026 : le bouton "Filtrer" (bascule du panneau lateral sur "Toutes
   les entreprises"/"Resultats de recherche") a la meme icone bleue sur fond
   bleu, meme cause (pas d'exception dediee pour cette icone). */
.directorist-archive-sidebar-toggle .directorist-icon-mask:after,
.directorist-archive-sidebar-toggle--active .directorist-icon-mask:after {
	background-color: #FFFFFF !important;
}

/* Bouton "Telephone" (et autres actions .directorist-btn-default) sur la
   fiche vendeur individuelle : Directorist le stylise en variante blanche/
   contour avec une specificite (3 classes) et des !important qui gagnent
   sur la regle generale .directorist-btn ci-dessus - on reprend exactement
   les memes selecteurs, avec la couleur du site, pour l'emporter. */
.directorist-listing-single__action-list .directorist-btn.directorist-btn-default,
.directorist-single-listing-header .directorist-listing-actions .directorist-btn.directorist-btn-default,
.directorist-details-info-wrap .directorist-single-info__value .directorist-btn.directorist-btn-default {
	background-color: #375EFB !important;
	border-color: #375EFB !important;
	color: #FFFFFF !important;
}
.directorist-listing-single__action-list .directorist-btn.directorist-btn-default:hover,
.directorist-single-listing-header .directorist-listing-actions .directorist-btn.directorist-btn-default:hover,
.directorist-details-info-wrap .directorist-single-info__value .directorist-btn.directorist-btn-default:hover {
	background-color: #2846d1 !important;
	border-color: #2846d1 !important;
	color: #FFFFFF !important;
}

/* ==========================================================================
   Page "Connexion" (page ID 38 / sign-in) uniquement - ne touche a aucune
   autre page du site (ni la page d'inscription vendeur, ni les autres).
   ========================================================================== */

/* Menu allege : uniquement le logo, reste du menu masque (desktop + mobile) */
body.page-id-38 #primary-site-navigation-desktop,
body.page-id-38 #ast-mobile-site-navigation,
body.page-id-38 .main-header-menu-toggle {
	display: none !important;
}

/* Bouton "Se Connecter" : meme style que les autres boutons du site
   (bleu #375EFB, texte blanc, coins 8px) */
body.page-id-38 .directorist-authentication__form__btn {
	background-color: #375EFB !important;
	border-color: #375EFB !important;
	color: #FFFFFF !important;
	border-radius: 8px !important;
}
body.page-id-38 .directorist-authentication__form__btn:hover,
body.page-id-38 .directorist-authentication__form__btn:focus {
	background-color: #2846d1 !important;
	border-color: #2846d1 !important;
	color: #FFFFFF !important;
}

/* Titre "Connexion" : centre, aligne avec le bloc du formulaire (meme largeur/centrage) */
body.page-id-38 .entry-header {
	max-width: 600px;
	margin: 0 auto;
	text-align: center;
}
body.page-id-38 .entry-title {
	text-align: center;
	color: #FFFFFF;
}

/* Fond photo (feu de bois) derriere le bloc de connexion, meme traitement que
   la section "Vous vendez du bois de chauffage ?" de la page d'accueil */
body.page-id-38 article.type-page {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/login-bg.jpg');
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	padding: 60px 20px;
	border-radius: 12px;
}
body.page-id-38 article.type-page::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.65);
	border-radius: 12px;
	pointer-events: none;
}
body.page-id-38 article.type-page > * {
	position: relative;
	z-index: 1;
}

@media (max-width: 767px) {
	body.page-id-38 .entry-header {
		max-width: 100%;
	}
}

/* Corrige le grand vide entre le bloc de connexion et le pied de page :
   Directorist masque le formulaire inactif (inscription quand on est sur
   Connexion, et inversement) avec "visibility:hidden", qui garde l'espace
   reserve dans la page (~600px de vide invisible). display:none le retire
   vraiment de la mise en page. */
body.page-id-38 .directorist-authentication:not(.active) {
	display: none !important;
}

/* Logo integre a la barre de menu compacte (pas de logo flottant separe) :
   la barre garde la meme hauteur/style fin que sur la page d'accueil, mais
   comme il n'y a pas d'autres liens sur cette page, le logo est centre
   horizontalement au lieu d'aligne a gauche. */
body.page-id-38 .ast-builder-grid-row {
	grid-template-columns: 1fr !important;
	width: 100%;
}
body.page-id-38 .site-header-primary-section-left {
	width: 100%;
	justify-content: center !important;
}
body.page-id-38 .ast-builder-layout-element.site-header-focus-item {
	justify-content: center;
	width: 100%;
}
body.page-id-38 .site-branding {
	justify-content: center !important;
	width: 100%;
}

/* Pied de page unique, bande bleu fonce identique a celle de la page d'accueil
   (fond #1E293B, liens clairs, copyright) - remplace entierement le footer
   natif minimal du theme (masque juste en dessous) pour n'avoir qu'un seul
   pied de page. La liste des pages concernees n'est plus geree ici mais
   cote PHP (stere_should_show_custom_footer() dans functions.php, qui pose
   la classe "stere-custom-footer" sur <body>) - un seul endroit a modifier
   pour ajouter/retirer une page, au lieu de dupliquer la liste en CSS. */
body.stere-custom-footer .stere-login-footer-links {
	background-color: #1E293B;
	padding: 30px 20px;
	text-align: center;
}
body.stere-custom-footer .stere-login-footer-links__nav {
	margin: 0 0 10px;
}
body.stere-custom-footer .stere-login-footer-links__nav a {
	color: #E2E8F0;
	text-decoration: none;
	margin: 0 12px;
	font-size: 14px;
}
body.stere-custom-footer .stere-login-footer-links__nav a:hover {
	text-decoration: underline;
}
body.stere-custom-footer .stere-login-footer-links__copy {
	margin: 0;
	color: #94A3B8;
	font-size: 13px;
}

/* Le footer natif du theme (bande blanche minimale "Copyright...") est
   entierement remplace par la bande bleue ci-dessus : on ne garde qu'un
   seul pied de page. */
body.stere-custom-footer .site-footer {
	display: none !important;
}

/* ==========================================================================
   Page "Trouver un vendeur" (page ID 29 / search-home) uniquement.
   ========================================================================== */

/* Fond photo + voile sombre sur toute la zone de contenu (titre + formulaire
   + resultats), meme technique que la page Connexion (fond applique sur
   l'article lui-meme, qui grandit avec le contenu : pas de zone blanche
   residuelle meme si beaucoup de resultats s'affichent). Le footer, en
   dehors de cet article, n'est pas concerne. */
body.page-id-29 article.type-page {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/search-bg.jpg');
	background-size: cover;
	/* "top" (et non "center") pour garder le sommet de la montagne entierement
	   visible : le conteneur est bien plus large que haut, donc "cover" doit
	   rogner dans la hauteur de l'image - un centrage vertical coupait le pic,
	   l'element le plus important visuellement. Le recadrage se fait donc
	   uniquement en bas (prairie), jamais en haut. */
	background-position: center top;
	background-repeat: no-repeat;
}
body.page-id-29 article.type-page::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.65);
	pointer-events: none;
}
body.page-id-29 article.type-page > * {
	position: relative;
	z-index: 1;
}

/* Titre "Trouver un vendeur" : centre, meme couleur/police que le texte du
   logo (var(--ast-global-color-2), regle par defaut d'Astra pour
   .ast-site-identity .site-title a - voir astra_get_option('header-color-site-title')).
   Ombre claire ajoutee pour rester lisible sur le fond sombre. */
body.page-id-29 .entry-header {
	text-align: center;
}
body.page-id-29 .entry-title {
	color: var(--ast-global-color-2);
	text-align: center;
	text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55), 0 1px 3px rgba(255, 255, 255, 0.85);
}

/* Sous-titre "Rechercher ici" (H2 au-dessus de la barre de recherche, hors de
   la carte blanche du formulaire) : illisible en texte fonce par defaut sur
   le fond montagne. Meme couleur/police que le texte du logo, comme pour le
   titre H1 "Trouver un vendeur" (var(--ast-global-color-2), regle par
   defaut d'Astra pour le site-title). NE PAS toucher au H1 lui-meme, deja
   valide. */
body.page-id-29 .directorist-search-top__title {
	color: var(--ast-global-color-2);
	text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55), 0 1px 3px rgba(255, 255, 255, 0.85);
}

/* Sous-titre "Trouvez ce qui correspond le mieux a votre recherche" : blanc,
   avec une ombre sombre legere pour rester lisible quel que soit l'endroit
   de l'image derriere (ciel clair ou montagne/prairie plus sombre). */
body.page-id-29 .directorist-search-top__subtitle {
	color: #FFFFFF;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
}

/* Noms de villes (liens de la bande "Browse by popular categories" en bas
   de la banniere) : blanc, soulignement existant conserve, ombre sombre
   legere pour rester lisibles sur n'importe quelle zone de l'image
   (montagne claire ou prairie plus texturee). */
body.page-id-29 .directorist-listing-category-top a {
	color: #FFFFFF;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}
body.page-id-29 .directorist-listing-category-top a:hover {
	color: #FFFFFF;
}

/* Bouton "Rechercher" du formulaire : meme style que les autres boutons du
   site (le champ de recherche lui-meme, .directorist-search-form__box,
   a deja un fond blanc opaque natif chez Directorist - rien a changer la). */
body.page-id-29 .directorist-btn-search {
	background-color: #375EFB !important;
	border-color: #375EFB !important;
	color: #FFFFFF !important;
	border-radius: 8px !important;
}
body.page-id-29 .directorist-btn-search:hover,
body.page-id-29 .directorist-btn-search:focus {
	background-color: #2846d1 !important;
	border-color: #2846d1 !important;
	color: #FFFFFF !important;
}

/* Icones de la barre de recherche (entonnoir "Plus de filtres", viseur de
   localisation, fleche du menu deroulant Categorie) en bleu #375EFB. Ce sont
   des masques CSS (.directorist-icon-mask:after) dont le remplissage vient
   de 3 mecanismes differents cote Directorist (verifie dans son CSS natif) -
   chacun traite avec la technique adaptee, en ne touchant que l'icone elle-
   meme (jamais le texte a cote, sur un element separe) :
   - le bouton "Plus de filtres" est cible par une regle Directorist plus
     specifique que prevu (.directorist-search-form-action__filter
     .directorist-filter-btn .directorist-icon-mask::after, via
     var(--directorist-color-btn-primary-bg)) -> ecrase directement en
     !important pour rester prioritaire.
   - l'icone de localisation a un gris #808080 code en dur -> on ecrase
     directement le background-color (avec !important pour rester prioritaire
     meme si Directorist reordonne son CSS a une future mise a jour).
   - la fleche de Categorie (select2) est en
     background-color:var(--directorist-color-body) !important cote
     Directorist -> on ne peut pas la battre avec un autre !important sur la
     meme regle, donc on redefinit seulement cette variable, localement. */
body.page-id-29 .directorist-modal-btn--advanced .directorist-icon-mask:after {
	background-color: #375EFB !important;
}
/* Regression corrigee : le bouton "Plus de filtres" a un fond blanc natif
   chez Directorist (deja ainsi avant toute intervention), mais la regle
   generale ".directorist-btn{color:#FFFFFF}" (uniformisation des boutons du
   site) rendait son texte blanc sur blanc, donc invisible. On restaure sa
   couleur de texte d'origine (noir) ici uniquement - seule l'icone reste
   bleue, comme demande. */
body.page-id-29 .directorist-modal-btn--advanced {
	color: #000000 !important;
}
/* Au survol, le fond du bouton passe au bleu fonce (regle generale des
   boutons du site) : icone et texte doivent alors passer au blanc pour
   rester lisibles, plutot que de garder le noir de l'etat normal. */
body.page-id-29 .directorist-modal-btn--advanced:hover,
body.page-id-29 .directorist-modal-btn--advanced:focus {
	color: #FFFFFF !important;
}
body.page-id-29 .directorist-modal-btn--advanced:hover .directorist-icon-mask:after,
body.page-id-29 .directorist-modal-btn--advanced:focus .directorist-icon-mask:after {
	background-color: #FFFFFF !important;
}
/* Alignement mobile du bouton "Plus de filtres" : Directorist annule le
   padding gauche uniquement sous 767px (padding-left:0, padding-right reste
   a 18px), ce qui colle l'icone+texte a gauche avec un vide visible a droite
   au lieu d'etre centres (contrairement au bouton "Rechercher", qui a un
   padding symetrique). On restaure un padding gauche identique au droit,
   uniquement sur ce breakpoint - le bouton reste centre en desktop, deja
   correct la-bas. */
@media only screen and (max-width: 767px) {
	body.page-id-29 .directorist-modal-btn--advanced {
		padding-left: 18px !important;
	}
}
body.page-id-29 .directorist-filter-location-icon .directorist-icon-mask:after {
	background-color: #375EFB !important;
}
body.page-id-29 .directorist-search-category .directorist-select2-addons-area {
	--directorist-color-body: #375EFB;
}

/* ==========================================================================
   Fleches de menus deroulants (select2 - categorie, localisation, etiquette...)
   et bouton "Selectionner des fichiers" : regles globales, tout le site (pas
   seulement "Trouver un vendeur"), meme mecanisme que ci-dessus mais non
   limite a une page puisque select2 et l'uploader de fichiers sont utilises
   a plusieurs endroits (recherche, formulaire d'inscription vendeur...). */
.directorist-select2-addons-area {
	--directorist-color-body: #375EFB;
}
.ezmu__btn {
	background-color: #375EFB !important;
	color: #FFFFFF !important;
	border-radius: 8px !important;
}
.ezmu__btn:hover {
	background-color: #2846d1 !important;
	color: #FFFFFF !important;
}

/* ==========================================================================
   Page "Ajouter une annonce" (page ID 31) uniquement - 3 bannieres photo,
   meme technique de fond+voile que "Trouver un vendeur" (page 29) : image en
   arriere-plan du bloc-titre uniquement (jamais des champs eux-memes, qui
   restent sur fond blanc classique de la page - aucune image ne passe
   derriere eux). Style de titre copie EXACTEMENT de celui de la page 29
   (meme couleur var(--ast-global-color-2), meme text-shadow), applique aux
   3 titres pour rester coherent, meme si ce sont des elements HTML differents
   (h1 de page pour la 1ere, h2 de section pour les 2 autres - impossible de
   partager litteralement la meme balise/classe puisque la structure du
   formulaire Directorist est differente de celle de la page de recherche).
   ========================================================================== */
body.page-id-31 .entry-title,
body.page-id-31 #add-listing-content-coordonnées > header.directorist-content-module__title h2,
body.page-id-31 #add-listing-content-localisation > header.directorist-content-module__title h2 {
	color: var(--ast-global-color-2) !important;
	text-align: center;
	text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55), 0 1px 3px rgba(255, 255, 255, 0.85);
	font-size: 32px;
	margin: 0;
}

/* Banniere 1 : haut de page, titre "Ajouter une annonce" (image 2 = geste de
   sciage - cadrage x62% y58% pour garder la buche/scie dans le champ, l'image
   etant en format portrait donc tres rognee en hauteur une fois en bandeau
   large). */
body.page-id-31 .entry-header {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/addlisting-bg-2.jpg');
	background-size: cover;
	background-position: 62% 58%;
	background-repeat: no-repeat;
	padding: 100px 20px;
	display: flex;
	align-items: center;
	justify-content: center;
}
body.page-id-31 .entry-header::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.65);
	pointer-events: none;
}
body.page-id-31 .entry-header > * {
	position: relative;
	z-index: 1;
}

/* Banniere 2 : section "Coordonnees" (image 3 = pick-up charge de buches -
   cadrage x50% y70%, le sujet - camion + buches - occupant surtout la moitie
   basse de cette photo portrait). Le fond s'applique uniquement au bloc-titre
   de la section, jamais aux champs (E-mail/Telephone/Site web) juste en
   dessous, qui restent sur la page blanche normale. */
body.page-id-31 #add-listing-content-coordonnées > header.directorist-content-module__title {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/addlisting-bg-3.jpg');
	background-size: cover;
	background-position: 50% 70%;
	background-repeat: no-repeat;
	padding: 80px 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
body.page-id-31 #add-listing-content-coordonnées > header.directorist-content-module__title::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.65);
	pointer-events: none;
}
body.page-id-31 #add-listing-content-coordonnées > header.directorist-content-module__title > * {
	position: relative;
	z-index: 1;
}
body.page-id-31 #add-listing-content-coordonnées > section.directorist-content-module__contents {
	background-color: #FFFFFF;
}

/* Banniere 3 : section "Localisation" (image 1 = entrepot/abri avec grumes -
   cadrage x50% y38%, le hangar et l'engin de manutention se trouvant dans la
   moitie superieure de cette photo portrait, les grumes empilees en bas).
   Meme regle : la carte Leaflet et les champs Localisation/Adresse restent
   sur fond blanc normal, sans image derriere. */
body.page-id-31 #add-listing-content-localisation > header.directorist-content-module__title {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/addlisting-bg-1.jpg');
	background-size: cover;
	background-position: 50% 43%;
	background-repeat: no-repeat;
	padding: 80px 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
body.page-id-31 #add-listing-content-localisation > header.directorist-content-module__title::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.65);
	pointer-events: none;
}
body.page-id-31 #add-listing-content-localisation > header.directorist-content-module__title > * {
	position: relative;
	z-index: 1;
}
body.page-id-31 #add-listing-content-localisation > section.directorist-content-module__contents {
	background-color: #FFFFFF;
}

/* Fond de page complet (remplace le lavis pale precedent, devenu inutile) :
   image appliquee sur l'article entier, qui grandit avec le contenu - meme
   technique que "Trouver un vendeur" pour ne jamais laisser de zone blanche
   reapparaitre plus bas sur une page longue. Pas de voile sombre ici (non
   demande), l'image etant un degrade bleu doux qui ne gene pas la lecture -
   de toute facon tout le texte reel se trouve sur les cartes blanches
   opaques par-dessus, jamais directement sur l'image. Les 3 bannieres photo
   (Ajouter une annonce / Coordonnees / Localisation) ne sont pas concernees,
   regles inchangees plus haut. */
body.page-id-31 article.type-page {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/Background-.-stere.com-.-page-annonce-1.png');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
}

/* Toutes les cartes de contenu du formulaire (Informations generales, Prix,
   Caracteristiques, Coordonnees, Localisation, Medias, Terminer) restent sur
   un blanc bien opaque, par-dessus le fond de page - aucune transparente.
   Pour Coordonnees/Localisation, ceci ne concerne que le corps de la carte :
   leur bloc-titre garde sa propre image (regle plus specifique, plus haut,
   qui continue a l'emporter). */
/* Contour bien visible sur chaque bloc du formulaire (Informations
   generales, Prix, Caracteristiques, Coordonnees, Localisation, Medias, et
   "Vous etes sur le point de publier") pour bien les distinguer les uns des
   autres et du fond bleu de la page - la bordure native de Directorist (1px
   solid #F5F5F5, quasi invisible sur fond blanc) est remplacee par une
   bordure noire nette, meme epaisseur (1px) et memes coins arrondis
   existants (12px, non touches) conserves.
   Corrige le 24/08/2026 (v2), deux points :
   1. Coins casses sur Coordonnees/Localisation : ces deux blocs ont un
      bloc-titre avec sa propre image de fond (regle plus specifique plus
      haut), au coin carre (border-radius:0) et sans etre decoupe par le
      conteneur parent (overflow:visible par defaut) - l'image debordait
      donc visuellement des coins arrondis du contour noir. Corrige avec
      overflow:hidden sur le conteneur, qui decoupe desormais tout enfant
      (y compris cette image d'en-tete) selon l'arrondi du parent.
   2. Bloc "Vous etes sur le point de publier" oublie : la bordure precedente
      ciblait .directorist-content-module, qui ne couvre que les 6 sections
      du formulaire, pas ce dernier bloc (structure differente : #add-
      listing-last-content). Selecteur elargi a .multistep-wizard__single,
      classe commune aux 6 sections ET a ce dernier bloc (verifie : exactement
      7 elements sur la page portent cette classe, tous avec deja le meme
      border-radius:12px natif) - un seul selecteur pour les 7 blocs, garantit
      qu'ils restent coherents entre eux a l'avenir. */
body.page-id-31 .directorist-content-module {
	background-color: #FFFFFF;
}
body.page-id-31 .multistep-wizard__single {
	border: 1px solid #000000 !important;
	overflow: hidden;
}

/* Contour noir sur chaque champ/sous-bloc A L'INTERIEUR des 6 sections
   (texte simple, editeur "Description", listes deroulantes categorie/
   etiquette, groupe de cases a cocher "Caracteristiques", champs Email/
   Telephone/Site web, Localisation/Adresse/Carte, zone d'upload d'images,
   Video) - meme traitement que les grandes sections (border 1px noir,
   radius 12px), scope a .directorist-content-module__contents pour ne
   cibler que l'interieur des sections, jamais les grandes sections
   elles-memes (deja bordees ci-dessus, pas de double-contour) ni le bloc
   "Vous etes sur le point de publier" (pas de .directorist-form-group la).
   .directorist-form-group n'avait ni padding ni fond propre (juste le
   libelle + le champ, colles l'un a l'autre) - un peu de padding et un fond
   blanc opaque ajoutes pour que le nouveau contour ne colle pas directement
   au texte, coherent avec l'espacement des grandes sections (padding 20px).
   overflow:hidden ajoute par precaution (meme bug que Coordonnees/
   Localisation, au cas ou un champ contiendrait une image) - verifie sans
   risque : les menus deroulants (select2) et le panneau de mise en forme de
   l'editeur "Description" (mce-floatpanel) sont tous les deux rattaches
   directement au <body> par leurs bibliotheques respectives, jamais imbriques
   dans le champ lui-meme, donc jamais rognes par ce overflow:hidden (verifie
   en ouvrant chacun des deux et en inspectant ou l'element resultant
   s'attache reellement dans le DOM). */
body.page-id-31 .directorist-content-module__contents .directorist-form-group {
	border: 1px solid #000000 !important;
	border-radius: 12px;
	background-color: #FFFFFF;
	padding: 16px;
	overflow: hidden;
}
/* Correction du 24/08/2026 : le overflow:hidden ci-dessus, pris par
   precaution, decoupait par effet de bord la liste de suggestions
   d'adresse (div.address_result, position:absolute; top:100% - stylee
   nativement par Directorist pour deborder du champ et s'afficher par-
   dessus la carte en dessous), rendant l'autocompletion invisible bien
   que fonctionnelle (Nominatim/OpenStreetMap confirme operationnel).
   Retire l'overflow:hidden uniquement sur ce champ precis (bordure/radius/
   padding conserves a l'identique) - tous les autres champs (menus
   deroulants select2, editeur "Description", etc.) n'ont pas ce besoin,
   deja verifie sans risque puisqu'ils s'ouvrent hors de la carte, rattaches
   au <body>, donc laisses inchanges. Les coins arrondis de Coordonnees et
   Localisation restent proteges par la regle .multistep-wizard__single
   plus haut, non touchee ici. */
body.page-id-31 .directorist-content-module__contents .directorist-form-address-field {
	overflow: visible !important;
}

/* Icones rondes des bloc-titres de section, dans le contenu principal
   (crayon, prix, caracteristiques, coordonnees, localisation, medias) :
   bleu #375EFB au lieu du noir par defaut du plugin (variable
   --directorist-color-primary, non modifiee globalement ailleurs sur le
   site car utilisee a plus de 200 endroits differents chez Directorist -
   corrigee ici precisement, uniquement pour ces icones). Le fond de la
   section "Medias" elle-meme n'est pas touche par cette regle (uniquement
   son icone). */
body.page-id-31 .directorist-content-module__title i {
	background-color: #375EFB !important;
}
/* Bug decouvert le 23/08/2026 : la regle ci-dessus met en bleu le cercle
   (l'element <i> lui-meme, 36x36), mais la regle globale toute en haut de ce
   fichier (.directorist-icon-mask:after { background-color: #375EFB }) met
   AUSSI en bleu le glyphe interieur (le pseudo-element ::after, 16x16, qui
   porte le veritable dessin via mask-image) - glyphe bleu sur cercle bleu =
   invisible, sur les 6 badges de cette page (verifie par comparaison des
   styles calcules des 6 icones, strictement identiques). Meme famille de
   correctif que l'exception deja existante pour .directorist-btn plus haut :
   le glyphe repasse en blanc, seul le cercle reste bleu. */
body.page-id-31 .directorist-content-module__title i:after {
	background-color: #FFFFFF !important;
}

/* Icones rondes de la colonne de navigation a gauche (liste des etapes,
   desktop uniquement - masquee sous 991px) : meme bleu, au lieu du gris
   clair par defaut du plugin. */
body.page-id-31 .multistep-wizard__nav__btn i:after {
	background-color: #375EFB !important;
}

/* Texte des etapes de la colonne de navigation (Directorist utilise un gris
   moyen #808080 par defaut pour les etapes non actives, peu lisible sur le
   fond de page) : passe en noir gras, actives et non actives, pour rester
   coherent avec le reste du formulaire (demande de Farid, 24/08/2026). Cible
   uniquement le texte du lien (color/font-weight) - ne touche ni au fond
   blanc de l'etape active, ni a l'icone (regle separee juste au-dessus, qui
   utilise background-color sur ::after, jamais color - aucun chevauchement
   possible). */
body.page-id-31 .multistep-wizard__nav__btn {
	color: #000000 !important;
	font-weight: 700 !important;
}

/* Libelles de champs du formulaire (Titre, Description, Categorie, Prix,
   E-mail, Localisation...) : noir bien visible au lieu du gris clair
   #404040 par defaut chez Directorist. Les champs de saisie eux-memes
   (texte tape, placeholders) ne sont pas concernes par ce selecteur, qui ne
   cible que les <label>. */
body.page-id-31 .directorist-form-group label {
	color: #000000 !important;
	font-weight: 700 !important;
}

/* Harmonisation demandee par Farid (24/08/2026) : les 6 titres de section du
   formulaire passent tous en noir gras 20px, un style unique et coherent.
   Avant cette regle, Coordonnees et Localisation heritaient d'un h2 a 32px
   non gras/non noir (incoherence preexistante du theme, jamais volontaire),
   pendant que les 4 autres etaient a 16px puis progressivement passes en
   noir gras 20px au fil de demandes successives - desormais un seul
   comportement pour les 6. */
body.page-id-31 .directorist-content-module__title h2 {
	color: #000000 !important;
	font-weight: 700 !important;
	font-size: 20px !important;
}

/* Harmonisation (suite) : Coordonnees et Localisation ont leur titre sur une
   bannière photo (voir plus haut dans ce fichier, regle avec l'ID
   #add-listing-content-coordonnees/#add-listing-content-localisation) avec
   un selecteur ID donc plus specifique que la regle ci-dessus - le noir n'y
   passait pas sans cette regle dediee. Seule la couleur est repassee en noir
   pur ici (var(--ast-global-color-2) etait deja une teinte tres proche,
   rgb(30,41,59) - changement quasi invisible) ; le halo blanc (text-shadow)
   qui assure la lisibilite du texte sur la photo/voile sombre n'est pas
   touche, ni la taille (deja geree par la regle generale ci-dessus grace au
   !important, qui l'emportait deja sur les 32px d'origine). */
body.page-id-31 #add-listing-content-coordonnées > header.directorist-content-module__title h2,
body.page-id-31 #add-listing-content-localisation > header.directorist-content-module__title h2 {
	color: #000000 !important;
}

/* ==========================================================================
   Page "Toutes les annonces" (page ID 32) uniquement.
   ========================================================================== */

/* Banniere de haut de page, mise a jour le 23/08/2026 : retour a un titre
   HTML reel (au lieu du texte incruste dans les pixels de l'image utilisee
   jusqu'ici), a la demande de Farid, pour pouvoir changer le texte du titre
   librement sans dependre d'une nouvelle image a chaque fois. Meme photo de
   montagne que "Trouver un vendeur" (page 29, search-bg.jpg - aucune version
   sans texte de l'ancienne image dediee n'existait), meme voile sombre, meme
   style de titre (var(--ast-global-color-2), meme text-shadow) - mais
   centrage vrai via flexbox (align-items/justify-content: center) plutot que
   des marges fixes, comme demande lors du reglage precedent.
   Hauteur (184px) : conservee identique au reglage precedent. A cette
   hauteur et a la largeur reelle du conteneur (1200px desktop / jusqu'a
   375px mobile), "cover" est contraint par la largeur, donc rogne
   uniquement en hauteur - "background-position: center top" ancre le haut
   du recadrage sur le haut de l'image (jamais de pixel retire en haut) :
   verifie par mesure Imagick que le sommet de la montagne (y=65px sur les
   1280px de hauteur de l'image source) reste tres largement dans la zone
   visible aux deux largeurs (fenetre visible de 294px a 1200px de large,
   942px a 375px de large) - aucun risque de rognage du sommet. */
body.page-id-32 .entry-header {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/search-bg.jpg');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
	min-height: 184px;
	display: flex;
	align-items: center;
	justify-content: center;
}
body.page-id-32 .entry-header::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.65);
	pointer-events: none;
}
body.page-id-32 .entry-title {
	position: relative;
	z-index: 1;
	color: var(--ast-global-color-2);
	text-align: center;
	text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55), 0 1px 3px rgba(255, 255, 255, 0.85);
	margin: 0;
}

/* Fond bleu pleine page sur le reste de la page (zone resultats) : meme
   image et meme technique que "Ajouter une annonce" (page 31) - appliquee
   sur l'article entier, qui grandit avec le contenu, donc jamais de zone
   blanche residuelle meme avec beaucoup de resultats/pagination. */
body.page-id-32 article.type-page {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/Background-.-stere.com-.-page-annonce-1.png');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
}

/* La barre de recherche (.directorist-search-form__box) et les fiches
   vendeur (.directorist-listing-card) ont deja un fond blanc opaque natif
   chez Directorist - rien a changer la. Seule la barre "X Annonces
   trouvees / Filtrer / Trier Par / vue grille-liste-carte" n'avait pas de
   fond propre et laissait voir la page blanche d'origine par transparence :
   passee en blanc opaque pour rester lisible sur le nouveau fond bleu. */
body.page-id-32 .directorist-header-bar {
	background-color: #FFFFFF;
	border-radius: 10px;
	padding: 15px;
}

/* "X Annonces trouvees" recentre au milieu de la barre (avec la petite icone
   buche du logo juste a gauche du texte), sans deplacer Filtrer / vue
   grille-liste-carte / Trier Par qui restent a droite. Le bloc de gauche
   passe en position absolue centree dans la barre (seul moyen de le sortir
   du flux flex sans deplacer le bloc de droite) ; le bloc de droite est
   ancre avec margin-left:auto plutot que de dependre du comportement du
   flex justify-content:space-between avec un seul element restant, ambigu
   selon les navigateurs. */
body.page-id-32 .directorist-listings-header {
	position: relative;
}
body.page-id-32 .directorist-listings-header__left {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
body.page-id-32 .directorist-listings-header__right {
	margin-left: auto;
}
body.page-id-32 .directorist-header-found-title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #000000 !important;
	font-weight: 700 !important;
}
body.page-id-32 .directorist-header-found-title::before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	background-image: url('/wp-content/uploads/2026/08/Favicon.stere_.com_.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	flex-shrink: 0;
}

/* ==========================================================================
   Fiches vendeur individuelles (toutes les pages /directory/{slug}/ - pas de
   page-id ici, ce sont des articles du type at_biz_dir, donc scope via la
   classe .directorist-single-listing-header qui n'existe que sur ce gabarit).
   ========================================================================== */

/* Barre de boutons d'action (Retour / Modifier / Partager / Favoris /
   Signaler) : reste tout en haut, au-dessus de la banniere (deja son
   emplacement naturel dans le DOM), juste reduite pour etre moins
   imposante. */
.directorist-single-listing-top .directorist-single-listing-action {
	padding: 0 12px !important;
	font-size: 12px !important;
	min-height: 32px !important;
}

/* Banniere photo (meme image/voile que "Trouver un vendeur"), avec le nom
   de l'entreprise centre dedans. Le titre (h1.directorist-listing-details__listing-title)
   contient deja dynamiquement le nom de chaque fiche - la banniere est donc
   appliquee directement sur ce H1 (pas besoin d'un element separe ni de
   toucher a la config du plugin) : le "titre en clair" disparait de fait,
   remplace visuellement par le meme titre a l'interieur de la banniere.
   Le voile sombre est integre directement dans background-image (degrade
   uni superpose a l'image, une seule propriete) plutot qu'un pseudo-element
   ::before : le contenu du H1 est un noeud de texte brut, sans enfant sur
   lequel poser un z-index pour le faire passer au-dessus d'un ::before.
   Position "center top" (comme corrige precedemment sur "Trouver un
   vendeur") pour garder le sommet de la montagne entierement visible. */
.directorist-listing-details__listing-title {
	background-image: linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url('/wp-content/uploads/2026/08/search-bg.jpg');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
	margin: 0;
	padding: 80px 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ast-global-color-2);
	text-align: center;
	text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55), 0 1px 3px rgba(255, 255, 255, 0.85);
	font-size: 32px;
}

/* ==========================================================================
   Page "Accueil" (page ID 7) - banniere principale (video cheminee) sur
   mobile uniquement.
   ========================================================================== */

/* Le titre et le sous-titre du hero sont des widgets Elementor "Atomic"
   (e-heading / e-paragraph) dont les classes generees (ex. .e-63259c7-127b6ed)
   incluent un suffixe de hash recalcule a chaque sauvegarde Elementor - cible
   ici via l'attribut data-id du conteneur flexbox parent (stable, ne change
   pas d'une sauvegarde a l'autre) plutot que via ces classes volatiles.
   Sur desktop ces deux elements sont deja centres (par Elementor lui-meme) ;
   en dessous de 767px ils passaient en alignement par defaut (a gauche),
   colles au bord de l'ecran - corrige ici en CSS uniquement, sans toucher
   aux donnees Elementor de la page. */
@media only screen and (max-width: 767px) {
	body.page-id-7 [data-id="5ae5ae7"] h2,
	body.page-id-7 [data-id="5ae5ae7"] p {
		text-align: center !important;
		max-width: calc(100% - 40px) !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}

	/* Hauteur de la banniere (fixee a 520px quelle que soit la taille de
	   l'ecran) : sur un petit smartphone (ex. 320x568), 520px de banniere +
	   80px de header depassent la hauteur totale de l'ecran (568px), le
	   bouton "Rechercher" n'etant alors visible qu'apres un defilement.
	   Passee en unite relative au viewport (65vh) : s'adapte a la taille
	   reelle de l'ecran (environ 370px sur un petit smartphone, environ
	   530px sur un smartphone standard, proche de l'ancienne valeur fixe).
	   Consequence secondaire verifiee utile : la video (16:9, cover) est
	   toujours affichee sur sa hauteur entiere quelle que soit la hauteur du
	   conteneur (calcul verifie : le conteneur mobile est toujours plus
	   etroit que haut par rapport a la video, donc "cover" est contraint par
	   la hauteur, pas par la largeur) - une banniere plus courte resserre
	   donc le cadrage horizontal sur le centre de l'image (ou se trouve le
	   foyer, verifie par analyse de pixels du centre de masse de la flamme :
	   47,5% de la largeur, quasi au centre) sans jamais couper le sommet des
	   flammes ni le bas du foyer. */
	body.page-id-7 [data-id="5ae5ae7"] {
		height: 65vh !important;
		min-height: 65vh !important;
	}
}

/* ==========================================================================
   Pages d'archive Directorist "Categorie" (page ID 33), "Lieu" (page ID 34)
   et "Etiquette" (page ID 35) - pages fixes uniques que Directorist reutilise
   pour tous les termes de chaque taxonomie (ex. /categorie/anglet/,
   /localisation/{ville}/, /etiquette/{mot}/) : le titre H1 (.entry-title)
   affiche deja automatiquement le nom du terme courant (verifie en direct :
   "Anglet" sur /categorie/anglet/), aucune action necessaire pour le rendre
   dynamique. Meme systeme de banniere EXACT que "Toutes les entreprises"
   (page 32) : meme structure de regles (.entry-header en cover/flex avec
   voile ::before + .entry-title centre par flexbox reel, pas des marges
   fixes), seule l'image et sa position changent (nouvelle photo de rondins
   de bois en foret, position verifiee par recadrage Imagick reel - "center"
   met les rondins bien en valeur, "top" ne montre que le feuillage et
   "bottom" que le sol, testes avant de choisir). Meme hauteur (184px) que
   les autres pages du site. */
body.page-id-33 .entry-header,
body.page-id-34 .entry-header,
body.page-id-35 .entry-header {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/Forest-stere.com-1.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	min-height: 184px;
	display: flex;
	align-items: center;
	justify-content: center;
}
body.page-id-33 .entry-header::before,
body.page-id-34 .entry-header::before,
body.page-id-35 .entry-header::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.65);
	pointer-events: none;
}
body.page-id-33 .entry-title,
body.page-id-34 .entry-title,
body.page-id-35 .entry-title {
	position: relative;
	z-index: 1;
	color: var(--ast-global-color-2);
	text-align: center;
	text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55), 0 1px 3px rgba(255, 255, 255, 0.85);
	margin: 0;
}

/* Fond bleu pleine page sur le reste des pages "Zones de livraison" (page ID
   33, taxonomie Categorie - une ville par page /categorie/{ville}/), demande
   de Farid le 24/08/2026 : meme image et meme technique que "Toutes les
   entreprises" (page 32, voir plus haut) et "Resultats de recherche" (page
   30) - appliquee sur l'article entier, qui grandit avec le contenu. Ne
   concerne QUE la taxonomie Categorie (page 33), pas Lieu (34) ni Etiquette
   (35) qui ne font pas partie de cette demande et gardent leur fond blanc
   d'origine. La banniere ci-dessus (photo de rondins + titre de la ville)
   n'est pas touchee par cette regle, qui cible uniquement l'article, pas
   .entry-header. */
body.page-id-33 article.type-page {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/Background-.-stere.com-.-page-annonce-1.png');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
}

/* La barre de recherche (.directorist-search-form__box) et les fiches
   vendeur ont deja un fond blanc opaque natif chez Directorist, comme sur
   "Toutes les entreprises" - rien a changer la. Seule la barre "Nay / X
   Entreprises trouvees / Filtrer / Trier Par" n'a pas de fond propre et
   laissait voir la page blanche d'origine par transparence : passee en blanc
   opaque pour rester lisible sur le nouveau fond bleu, meme traitement que
   page-id-32. */
body.page-id-33 .directorist-header-bar {
	background-color: #FFFFFF;
	border-radius: 10px;
	padding: 15px;
}

/* Centrage du compteur "X Entreprises trouvees" au milieu de la barre (avec
   Filtrer / Trier Par / vue grille-liste-carte qui restent a droite) : meme
   technique que "Toutes les entreprises" (page 32) - oubliee au premier
   passage (seul le style texte+icone avait ete repris), corrigee ici sur
   signalement de Farid le 24/08/2026. */
body.page-id-33 .directorist-listings-header {
	position: relative;
}
body.page-id-33 .directorist-listings-header__left {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
body.page-id-33 .directorist-listings-header__right {
	margin-left: auto;
}

/* Compteur "X Entreprises trouvees" : meme style noir gras + logo buche que
   sur "Toutes les entreprises" (page 32) et "Resultats de recherche" (page
   30) - regle identique reprise telle quelle, demande de Farid le 24/08/2026
   de reutiliser le style existant plutot que d'en recreer un nouveau. */
body.page-id-33 .directorist-header-found-title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #000000 !important;
	font-weight: 700 !important;
}
body.page-id-33 .directorist-header-found-title::before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	background-image: url('/wp-content/uploads/2026/08/Favicon.stere_.com_.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	flex-shrink: 0;
}

/* ==========================================================================
   Page "Resultats de recherche" (page ID 30) uniquement.
   ========================================================================== */

/* Correction du 24/08/2026 (v2) : reprise fidele, a l'identique, du systeme
   de "Toutes les entreprises" (page 32) - demande explicite de Farid de ne
   pas improviser une nouvelle approche mais de copier exactement ce qui
   fonctionne deja la-bas (voir le bloc "page-id-32" plus haut dans ce
   fichier, qui reste la reference et n'est pas modifie). Remplace la version
   precedente (photo telephone/carte confinee dans un pseudo-element) qui
   utilisait de toute facon une image supprimee entre-temps de la
   mediatheque. Seule difference : le texte du titre ("Resultats de
   recherche" au lieu de "Toutes les entreprises"), deja automatique via
   .entry-title (aucune regle specifique necessaire). */
body.page-id-30 .entry-header {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/search-bg.jpg');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
	min-height: 184px;
	display: flex;
	align-items: center;
	justify-content: center;
}
body.page-id-30 .entry-header::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.65);
	pointer-events: none;
}
body.page-id-30 .entry-title {
	position: relative;
	z-index: 1;
	color: var(--ast-global-color-2);
	text-align: center;
	text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55), 0 1px 3px rgba(255, 255, 255, 0.85);
	margin: 0;
}

/* Fond bleu pleine page sur le reste de la page (zone resultats), meme image
   et meme technique que "Toutes les entreprises" (page 32) - appliquee sur
   l'article entier, qui grandit avec le contenu, donc jamais de zone blanche
   residuelle meme avec beaucoup de resultats/pagination. */
body.page-id-30 article.type-page {
	position: relative;
	background-image: url('/wp-content/uploads/2026/08/Background-.-stere.com-.-page-annonce-1.png');
	background-size: cover;
	background-position: center top;
	background-repeat: no-repeat;
}

/* La barre de recherche (.directorist-search-form__box) et les fiches
   vendeur (.directorist-listing-card) ont deja un fond blanc opaque natif
   chez Directorist - rien a changer la, comme sur la page 32. Seule la barre
   "X Entreprises trouvees / Filtrer / Trier Par" n'avait pas de fond propre
   et laissait voir la page blanche d'origine par transparence - passee en
   blanc opaque pour rester lisible sur le nouveau fond bleu. */
body.page-id-30 .directorist-header-bar {
	background-color: #FFFFFF;
	border-radius: 10px;
	padding: 15px;
}

/* "X Entreprises trouvees" recentre au milieu de la barre (avec la petite
   icone buche du logo juste a gauche du texte, en noir et gras pour rester
   bien visible), sans deplacer Filtrer / Trier Par qui restent a droite -
   copie a l'identique du meme traitement sur la page 32. */
body.page-id-30 .directorist-listings-header {
	position: relative;
}
body.page-id-30 .directorist-listings-header__left {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
body.page-id-30 .directorist-listings-header__right {
	margin-left: auto;
}
body.page-id-30 .directorist-header-found-title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #000000 !important;
	font-weight: 700 !important;
}
body.page-id-30 .directorist-header-found-title::before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	background-image: url('/wp-content/uploads/2026/08/Favicon.stere_.com_.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	flex-shrink: 0;
}

@media (max-width: 1100px) {
	body.page-id-30 .directorist-listings-header__left,
	body.page-id-32 .directorist-listings-header__left,
	body.page-id-33 .directorist-listings-header__left {
		position: static;
		transform: none;
	}
}

/* ==========================================================================
   Page "Materiel & Outils" (page ID 159, /materiel-et-outils/) - page vitrine
   en attente de la selection produits (affiliation ManoMano/Awin). Banniere
   photo (homme a la tronconneuse, photo choisie et televersee par Farid,
   "outils stere.com 1") + voile sombre 65% + titre avec halo blanc : meme
   recette exacte que les autres bannieres photo du site (page-id-29
   "Trouver une entreprise", page-id-30/32 "Resultats de recherche"/"Toutes
   les entreprises"), seule l'image change. Remplace une premiere version qui
   utilisait par erreur le degrade bleu doux (Background-.-stere.com-.-page-
   annonce-1.png, prevu comme fond de PAGE ailleurs sur le site, pas comme
   photo de banniere) - rendu trop generique/verdatre une fois assombri.
   Pas de fond pleine page ni de carte blanche : le contenu est pour
   l'instant un simple texte d'attente, donc structure volontairement
   minimale. */
body.page-id-159 .entry-header {
	position: relative;
	background-image: url('/wp-content/uploads/2026/09/outils-stere.com-1-scaled.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	min-height: 184px;
	display: flex;
	align-items: center;
	justify-content: center;
}
body.page-id-159 .entry-header::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.65);
	pointer-events: none;
}
body.page-id-159 .entry-title {
	position: relative;
	z-index: 1;
	color: var(--ast-global-color-2);
	text-align: center;
	text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55), 0 1px 3px rgba(255, 255, 255, 0.85);
	margin: 0;
}
body.page-id-159 .materiel-outils-coming-soon {
	max-width: 720px;
	margin: 80px auto;
	padding: 0 20px;
	text-align: center;
}
body.page-id-159 .materiel-outils-coming-soon p {
	font-size: 20px;
	line-height: 1.6;
	color: #0f172a;
	font-weight: 700;
}

/* ==========================================================================
   Tableau de bord vendeur (page ID 37, /tableau-de-bord/) - version mobile
   uniquement (le rendu desktop n'a pas ete signale comme pose de probleme).
   Le rendu par defaut de Directorist y est austere sur petit ecran : onglets
   de filtre (Toutes les entreprises / Publiee / En attente / Expiree /
   Rejetee) empiles verticalement en simple lien noir souligne, aucune
   couleur pour indiquer l'onglet actif (ni ici ni dans le menu lateral
   "Mon entreprise / Mon profil / ..."). Corrige avec la couleur bleue du
   site (#375EFB, meme regle que partout ailleurs) sur les etats actifs, et
   un peu d'espacement/arrondi pour rapprocher visuellement le rendu des
   autres pages. Uniquement du CSS (aucune structure HTML ni script
   Directorist touche) : les filtres et la recherche continuent de
   fonctionner exactement comme avant. */
@media (max-width: 768px) {
	/* Menu lateral du tableau de bord ("Mon entreprise", "Mon profil"...) :
	   l'item actif etait en fond gris neutre, passe en bleu du site. */
	body.page-id-37 .directorist-user-dashboard__nav a.directorist-tab__nav__active {
		background-color: #375EFB !important;
		color: #FFFFFF !important;
		border-radius: 8px;
	}
	body.page-id-37 .directorist-user-dashboard__nav a.directorist-tab__nav__active .directorist-icon-mask:after {
		background-color: #FFFFFF !important;
	}

	/* Onglets de filtre des fiches (Toutes les entreprises / Publiee / ...) :
	   passent d'une liste verticale de liens soulignes a une rangee de tags
	   bleus sur fond clair quand actifs, plus lisible et plus proche des
	   codes du reste du site (boutons/badges arrondis). */
	body.page-id-37 .directorist-dashboard-listing-nav-js {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		padding: 0;
		margin: 0 0 16px;
		list-style: none;
	}
	body.page-id-37 .directorist-dashboard-listing-nav-js li {
		margin: 0;
	}
	body.page-id-37 .directorist-dashboard-listing-nav-js a {
		display: inline-block;
		padding: 6px 14px;
		border-radius: 8px;
		background-color: #F1F5F9;
		color: #1e293b;
		text-decoration: none !important;
		font-size: 14px;
		font-weight: 500;
	}
	body.page-id-37 .directorist-dashboard-listing-nav-js a.directorist-tab__nav__active {
		background-color: #375EFB;
		color: #FFFFFF;
		font-weight: 600;
	}
	/* Barre noire "::after" native de Directorist sous l'onglet actif : rendue
	   inutile (et visuellement en conflit) une fois le fond bleu applique
	   ci-dessus, donc masquee. */
	body.page-id-37 .directorist-dashboard-listing-nav-js a.directorist-tab__nav__active::after {
		display: none;
	}

	/* Barre de recherche des fiches : coins arrondis coherents avec le reste
	   du site, anneau bleu au focus (au lieu du gris neutre par defaut). */
	body.page-id-37 .directorist-dashboard-listing-searchform input {
		border-radius: 8px !important;
	}
	body.page-id-37 .directorist-dashboard-listing-searchform input:focus {
		outline: 2px solid #375EFB;
		outline-offset: 1px;
	}

	/* Cartes mieux delimitees : le bloc des onglets/recherche et le bloc du
	   tableau de fiches ressortent chacun comme une carte distincte (fond
	   blanc, bordure legere, coins arrondis, ombre douce), au lieu de se
	   fondre presque dans le fond de page. */
	body.page-id-37 .directorist-user-dashboard__contents-inner-top,
	body.page-id-37 .directorist-listing-table-wrapper,
	body.page-id-37 .directorist-listing-table {
		background-color: #FFFFFF;
		border: 1px solid #E2E8F0;
		border-radius: 12px;
		box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
	}
	body.page-id-37 .directorist-listing-table {
		padding: 4px;
	}

	/* Lignes de la table (nom, statut, actions) : un peu plus d'air pour ne
	   pas paraitre compressees sur petit ecran. */
	body.page-id-37 .directorist-listing-table td {
		padding: 12px 10px;
	}
	/* Le bloc "Partager mon entreprise" s'ajoute a cote de Modifier/Plus/
	   Supprimer : sur mobile la rangee d'actions passe en colonne pour que
	   rien ne se chevauche. */
	body.page-id-37 .directorist-actions {
		flex-wrap: wrap;
		row-gap: 8px;
	}
}

/* ==========================================================================
   Page "Mentions legales" (page ID 78, /mentions-legales/) - meme banniere
   photo/degrade bleu que les autres pages du site (Background-.-stere.com-
   .-page-annonce-1.png + voile sombre 65% + titre centre avec halo blanc,
   recette identique a page-id-159 "Materiel & Outils"). Contenu texte
   (informations legales) centre, sections espacees, sous-titres (Editeur du
   site / Directeur de la publication / Hebergement) en bleu du site et en
   gras pour bien les distinguer. */
body.page-id-78 .entry-header,
body.page-id-3 .entry-header,
body.page-id-79 .entry-header {
	position: relative;
	/* Agrandi (etait 184px) pour laisser mieux voir chaque photo et ce
	   qu'elle represente, plutot qu'une bande trop fine et trop rognee. */
	min-height: 260px;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* Contact uniquement : banniere reduite (etait 420px) mais recadree pour
   que le HAUT ne bouge pas (pointe du toit de la boite aux lettres, deja
   bien visible, reste identique) - seul le bas est rogne. Le point de
   position ci-dessous (27%) est calcule pour ca, precisement a la largeur
   de reference utilisee ici (~1280px) ; negligeable ecart sur les autres
   largeurs desktop courantes. */
body.page-id-79 .entry-header {
	min-height: 320px;
}

/* Image + voile fonce de chaque banniere, fusionnes dans le meme calque
   (au lieu de l'image sur .entry-header et le voile sur ::before separement)
   pour pouvoir leur appliquer une opacite d'ensemble : ~88%, pour laisser
   deviner le fond "Montagne" de la page en dessous (visible par transparence
   a travers la banniere), tout en gardant l'image et le titre nettement
   reconnaissables/lisibles. Le titre (.entry-title, plus bas) est un
   element FRERE de ce ::before, jamais affecte par son opacite. */
body.page-id-78 .entry-header::before,
body.page-id-3 .entry-header::before,
body.page-id-79 .entry-header::before {
	content: "";
	position: absolute;
	inset: 0;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0.88;
	pointer-events: none;
}
body.page-id-79 .entry-header::before {
	background-image: linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url('/wp-content/uploads/2026/09/Email-stere.com-1.png');
	background-position: center 27%;
}
body.page-id-78 .entry-header::before {
	background-image: linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url('/wp-content/uploads/2026/09/mention-legal-stere.com-1.png');
	background-position: center 68%;
}
body.page-id-3 .entry-header::before {
	background-image: linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url('/wp-content/uploads/2026/09/Politique-de-confidentialite-stere.com-1.png');
	background-position: center;
}
body.page-id-78 .entry-title,
body.page-id-3 .entry-title,
body.page-id-79 .entry-title {
	position: relative;
	z-index: 1;
	color: var(--ast-global-color-2);
	text-align: center;
	text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55), 0 1px 3px rgba(255, 255, 255, 0.85);
	margin: 0;
}

/* Fond de page plein ecran, pour les 3 memes pages : photo Montagne
   (search-bg.jpg, deja utilisee comme banniere sur "Toutes les entreprises"/
   "Trouver une entreprise") + voile blanc clair ~88% pour garder le texte
   parfaitement lisible par-dessus. Applique sur l'article entier (grandit
   avec le contenu), independant de la banniere ci-dessus qui garde sa
   propre image/voile fonce sur sa seule zone. */
body.page-id-78 article.type-page,
body.page-id-3 article.type-page,
body.page-id-79 article.type-page,
body.page-id-159 article.type-page {
	position: relative;
}
/* Fond "fixe" (position: fixed, cale sur la fenetre plutot que sur la
   hauteur de l'article) : sur une page longue, dimensionner l'image par
   rapport a la hauteur du contenu (qui peut atteindre plusieurs milliers de
   px) la forcerait a un zoom enorme et ne laisserait plus voir qu'une fine
   bande verticale de l'image, coupant le sommet de la montagne. En la
   calant sur la fenetre (comme un fond "parallax"), l'image garde une
   taille raisonnable et le sommet reste visible, quelle que soit la
   longueur de la page. */
body.page-id-78 article.type-page::before,
body.page-id-3 article.type-page::before,
body.page-id-79 article.type-page::before,
body.page-id-159 article.type-page::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	background-image: linear-gradient(rgba(255, 255, 255, 0.45), rgba(255, 255, 255, 0.45)), url('/wp-content/uploads/2026/08/search-bg.jpg');
	background-size: cover;
	background-position: center 25%;
	background-repeat: no-repeat;
	pointer-events: none;
}
body.page-id-78 article.type-page > *,
body.page-id-3 article.type-page > *,
body.page-id-79 article.type-page > *,
body.page-id-159 article.type-page > * {
	position: relative;
	z-index: 1;
}

body.page-id-78 .entry-content {
	max-width: 700px;
	margin: 0 auto;
	padding: 48px 20px;
}
body.page-id-78 .entry-content p {
	text-align: center;
	line-height: 1.7;
	margin-bottom: 16px;
	color: #0f172a;
	font-weight: 700;
	font-size: 17px;
}
body.page-id-78 .entry-content h2 {
	text-align: center;
	color: #375EFB;
	font-weight: 700;
	font-size: 22px;
	margin-top: 48px;
	margin-bottom: 16px;
}
body.page-id-78 .entry-content h2:first-child {
	margin-top: 0;
}
body.page-id-78 .entry-content a {
	color: #375EFB;
}

/* Meme colonne centree que "Mentions legales" ci-dessus, mais seulement le
   centrage des paragraphes est demande pour ces deux pages (pas la couleur/
   graisse des sous-titres, propre au contenu remanie de "Mentions
   legales"). */
body.page-id-3 .entry-content,
body.page-id-79 .entry-content {
	max-width: 700px;
	margin: 0 auto;
	padding: 48px 20px;
}
body.page-id-3 .entry-content p,
body.page-id-79 .entry-content p {
	text-align: center;
	line-height: 1.7;
	margin-bottom: 16px;
	color: #0f172a;
	font-weight: 700;
	font-size: 17px;
}
body.page-id-3 .entry-content h2,
body.page-id-79 .entry-content h2 {
	font-weight: 700;
	color: #375EFB;
}

/* ==========================================================================
   Marqueurs de carte Directorist (Leaflet + OpenStreetMap) - regle GLOBALE
   (non scopee a une page), s'applique partout ou Directorist affiche une
   carte : fiche entreprise individuelle, formulaire "Inscrire mon
   entreprise" (etape Localisation), "Toutes les entreprises", resultats de
   recherche, zones de livraison.

   1) Marqueur individuel (.atbd_map_shape) : le rond noir + petite icone
   "epingle" bleue par defaut sont remplaces par le favicon du site (rondin
   de bois, fond deja transparent - verifie). L'icone interne d'origine est
   masquee plutot que supprimee (evite de toucher au HTML genere par le
   plugin). Recentrage precis sur le point exact : Directorist positionne
   ces marqueurs avec un point d'ancrage par defaut a (10px, 20px) du coin
   haut-gauche de son conteneur (iconSize [20,20] sans iconAnchor personnalise
   -> ancrage Leaflet par defaut = centre horizontal / bas). On bascule
   .atbd_map_shape en position absolue et on la recentre par sa propre taille
   (marge negative = -moitie de sa largeur/hauteur) exactement sur ce point,
   au lieu de laisser le rond deborder depuis le coin comme avant - c'est
   l'equivalent visuel d'un iconAnchor par le centre, fait en CSS pur pour ne
   pas avoir a modifier le JS du plugin (perdu a la prochaine mise a jour).
   Une petite ombre elliptique (::after, absente jusqu'ici) suggere que
   l'icone "repose" sur le point, sans ajouter de pointe triangulaire. */
.atbd_map_shape {
	position: absolute !important;
	left: 10px;
	top: 20px;
	margin-left: -20px;
	margin-top: -20px;
	/* !important partout : Directorist injecte un <style> inline (genere par
	   assets/other/style.php) qui redefinit .atbd_map_shape avec le RACCOURCI
	   "background" (pas "background-color"), et se charge apres notre CSS -
	   ce raccourci reinitialise aussi l'image/repeat/position/size a leur
	   valeur initiale s'ils ne sont pas marques !important ici. */
	background-color: transparent !important;
	background-image: url('/wp-content/uploads/2026/08/Favicon.stere_.com_.png') !important;
	background-size: 70% !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
}
.atbd_map_shape .directorist-icon-mask,
.atbd_map_shape > span {
	display: none !important;
}
.atbd_map_shape::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -3px;
	width: 16px;
	height: 5px;
	transform: translateX(-50%);
	background: rgba(0, 0, 0, 0.32);
	border-radius: 50%;
	filter: blur(1px);
	pointer-events: none;
}
/* Formulaire "Inscrire mon entreprise" (etape Localisation) : Directorist y
   affiche ce meme marqueur en plus grand (50px au lieu de 40px, regle du
   plugin conservee) - on ajuste seulement le recentrage en consequence. */
.directorist-add-listing-form .atbd_map_shape {
	margin-left: -25px;
	margin-top: -25px;
}

/* 2) Bulles de regroupement (plusieurs fiches proches sur la carte
   "Toutes les entreprises"/recherche) : ce n'est pas Directorist qui les
   dessine mais la librairie Leaflet.markercluster elle-meme (feuille de
   style separee, chargee depuis unpkg.com), vert par defaut - jamais
   personnalisee par le plugin. Passee au bleu de la charte, chiffre en
   blanc bien lisible par-dessus. */
.marker-cluster-small,
.marker-cluster-medium,
.marker-cluster-large {
	background-color: rgba(55, 94, 251, 0.35) !important;
}
.marker-cluster-small div,
.marker-cluster-medium div,
.marker-cluster-large div {
	background-color: rgba(55, 94, 251, 0.9) !important;
}
.marker-cluster span {
	color: #FFFFFF !important;
	font-weight: 700;
}

/* ==========================================================================
   Correctif mobile : liens du pied de page bleu fonce (Mentions legales /
   Politique de confidentialite / Contact) empiles verticalement.
   ==========================================================================
   Diagnostic : .stere-login-footer-links__nav (functions.php,
   stere_login_page_footer_links()) affiche les 3 liens comme du texte
   inline dans un <p>, sans white-space:nowrap ni layout flex - juste des
   marges (margin:0 12px sur chaque <a>). Sur mobile, le navigateur retourne
   simplement a la ligne au niveau des espaces des que la largeur manque.
   "Politique de confidentialite" etant le plus long des 3 libelles, c'est
   systematiquement lui qui se retrouve coupe en deux lignes ("Politique de"
   / "confidentialite") pendant que "Mentions legales" et "Contact" tiennent
   chacun sur une seule ligne - d'ou le bloc visuellement desequilibre.
   Empiler les liens verticalement (plutot que reduire la police, fragile et
   dependant de la largeur exacte) elimine le probleme a toutes les largeurs
   mobiles, y compris en paysage. Meme breakpoint (767px) que le reste de ce
   fichier / que Astra. Ne touche pas au desktop : la regle inline d'origine
   (functions.php + regle desktop plus haut) reste inchangee au-dela de
   767px. */
@media (max-width: 767px) {
	body.stere-custom-footer .stere-login-footer-links__nav {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 10px;
	}
	body.stere-custom-footer .stere-login-footer-links__nav a {
		margin: 0;
	}
}

/* Meme correctif, meme cause, pour le bloc de liens equivalent de la page
   d'accueil : c'est un widget Elementor "Text Editor" independant (HTML
   ecrit en dur avec des styles inline, id 828c677 dans le contenu Elementor
   de la page 7), pas le composant PHP ci-dessus - la classe
   stere-home-footer-links-nav a ete ajoutee directement dans ce HTML pour
   pouvoir le cibler ici, les styles inline ne pouvant pas contenir de media
   query. */
@media (max-width: 767px) {
	.stere-home-footer-links-nav {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 10px;
	}
	.stere-home-footer-links-nav a {
		margin: 0 !important;
	}
}

/* Page d'accueil, section "Comment ca marche" (3 cartes Rechercher / Comparer
   / Contacter, colonnes 58356f6 / 426286e / 9fe58cd) : sur mobile les 3
   colonnes de 33% se retrouvent empilees les unes sous les autres sans le
   moindre espace entre elles. Le bouton "Commencez vos recherches" de la
   carte "Comparer" est bien positionne sous SA propre photo (l'ordre de la
   carte - photo, titre, texte, bouton - est correct et n'a pas ete touche),
   mais comme rien ne separe visuellement la fin d'une carte du debut de la
   suivante, le bouton semble "coller" directement a la photo de la carte
   d'apres ("Contacter"), ce qui donne l'impression trompeuse qu'il est mal
   place. Espacement ajoute uniquement sur mobile (desktop : colonnes deja
   cote a cote, pas de risque de confusion). */
@media (max-width: 767px) {
	.elementor-element-58356f6,
	.elementor-element-426286e {
		margin-bottom: 40px;
	}
}

/* Ligne de villes populaires (page "Trouver une entreprise", ID 29) - mobile
   uniquement, seuil aligne sur celui utilise nativement par Directorist
   pour basculer cette liste en defilement horizontal a une seule ligne
   (voir main.css du plugin : @media only screen and (max-width: 575px)).
   Probleme constate le 09/09/2026 : malgre le voile sombre general de la
   page (::before, 65% noir) et le texte blanc/ombre deja en place
   ci-dessus, le contraste restait insuffisant sur les zones plus claires
   de la photo (bas de l'image, prairie) - fond bleu marine dedie ici
   (meme couleur que le pied de page, #1E293B) pour un contraste garanti
   quelle que soit la zone de l'image en dessous. Ajoute aussi un indice
   visuel de defilement possible (rien ne le signalait auparavant, la
   liste etait juste coupee net sur la derniere ville visible) : degrade
   sur les bords, visible uniquement du cote ou il reste du contenu a
   faire defiler (technique CSS pure a 4 calques - 2 caches de la couleur
   de fond en background-attachment:local qui se deplacent avec le
   contenu, 2 lueurs bleues en background-attachment:scroll fixees aux
   bords du conteneur - aucun JavaScript necessaire, le degrade de gauche
   n'apparait que lorsque l'utilisateur a effectivement scrolle). Fleche
   discrete ajoutee en complement, fixe au bord droit du conteneur (donc
   toujours visible, y compris avant tout defilement). Desktop non
   concerne par cette media query, aucune regle existante modifiee. */
@media (max-width: 575px) {
	body.page-id-29 .directorist-listing-category-top {
		position: relative;
		border-radius: 10px;
		overflow: hidden;
	}
	body.page-id-29 .directorist-listing-category-top ul {
		padding: 12px 22px;
		background-color: #1E293B;
		background-repeat: no-repeat;
		background-position: 0 0, 100% 0, 0 0, 100% 0;
		background-size: 28px 100%, 28px 100%, 16px 100%, 16px 100%;
		background-attachment: local, local, scroll, scroll;
		background-image:
			linear-gradient(to right, #1E293B, rgba(30, 41, 59, 0)),
			linear-gradient(to left, #1E293B, rgba(30, 41, 59, 0)),
			linear-gradient(to right, rgba(55, 94, 251, 0.65), rgba(55, 94, 251, 0)),
			linear-gradient(to left, rgba(55, 94, 251, 0.65), rgba(55, 94, 251, 0));
	}
	body.page-id-29 .directorist-listing-category-top::after {
		content: "\203A";
		position: absolute;
		top: 50%;
		right: 8px;
		transform: translateY(-50%);
		color: rgba(255, 255, 255, 0.9);
		font-size: 20px;
		line-height: 1;
		pointer-events: none;
	}
}

/* Message d'alerte "Vous devez etre connecte(e) pour voir le contenu de
   cette page..." (Directorist, generique : rendu par ATBDP_Helper::guard()
   / show_login_message() partout ou une action necessite d'etre connecte -
   confirme dans le code sur 2 usages : formulaire "Inscrire mon
   entreprise" quand la soumission invitee est desactivee, et le tunnel de
   paiement Directorist - meme structure HTML dans les deux cas). Verifie
   en live le 13/09/2026 : la page "Tableau de bord" redirige directement
   vers /connexion/ sans jamais afficher ce bloc (variante dediee
   .directorist-user-dashboard-access-notice du plugin donc non
   atteignable en pratique sur ce site), et "Toutes les entreprises" /
   "Resultats de recherche" restent publiques, sans restriction. Contenu
   (icone + texte) recentre horizontalement - le plugin l'aligne a gauche
   par defaut via son display:flex sans justify-content - et couleurs
   alignees sur la charte du site (bleu #375EFB) au lieu de l'orange par
   defaut du plugin. Scope via .notice_wrapper (conteneur specifique a
   show_login_message()) pour ne PAS toucher le message "Single listing
   view is disabled" - meme classe .directorist-alert-warning mais wrapper
   .directorist-single-listing-notice different, jamais imbrique dans
   .notice_wrapper. L'icone est deja bleue via la regle .directorist-icon-
   mask:after permanente plus haut, non touchee ici. Le flex-wrap deja
   present chez le plugin fait que ce centrage s'applique aussi bien sur
   mobile que sur desktop, sans media query dediee necessaire. Lien "ici"
   non touche : deja dans une couleur/soulignement distincts du texte de
   l'alerte (regle globale des liens du theme), reste bien identifiable
   comme lien apres ce changement. */
.notice_wrapper .directorist-alert-warning {
	justify-content: center;
	text-align: center;
	background-color: #E9ECFF !important;
	color: #375EFB !important;
}