/* ========================================================================= FFK — Recherche de clubs (habillage de WP Grid Builder) ========================================================================= La recherche fonctionne déjà : 5 097 clubs, facettes ville / spécialités / nom / ligues / tri. On ne reconstruit rien — on habille la sortie du plugin à la charte FFK. Sélecteurs 100 % préfixés .wpgb-* : cette feuille n'a aucun effet ailleurs. Fond de carte : Leaflet / OpenStreetMap (aucune requête vers Google). ========================================================================= */ /* ------------------------------------------------------------------------- Mise en page : deux colonnes, filtres+résultats / carte Constat du 2026-07-16 : la grille est DÉJÀ configurée comme la production — .wpgb-main à gauche, .wpgb-sidebar-right à droite, cette dernière ne contenant que la facette 9 (la carte). Il n'y a donc pas de mise en page à inventer : on cale les proportions, on rend la carte collante, et on gère proprement le cas « module Map Facet inactif ». ---------------------------------------------------------------------- */ /* Le header du thème n'est pas collant : la carte n'a donc à dégager que la barre d'administration, et seulement pour les comptes connectés. */ :root { --ffk-sticky-top: 24px; } body.admin-bar { --ffk-sticky-top: 56px; } /* NOTE DE SPÉCIFICITÉ — WP Grid Builder pose ses propres règles sur ces mêmes éléments (flex: 0 0 50% sur la sidebar, display: flex sur les zones). Un sélecteur simple perd. D'où .wpgb-wrapper en préfixe partout ci-dessous : on remonte la spécificité sans dégainer !important à chaque ligne. PIÈGE MAJEUR, corrigé le 2026-07-16 — ne pas remettre de max-width ici. L'option « pleine largeur » de la grille est activée : le JS de WP Grid Builder pose EN INLINE « left: -Npx; width: px » sur ce wrapper pour le faire déborder de son conteneur, et il recalcule à chaque mise à jour des facettes. La feuille précédente lui opposait « max-width: 1500px; margin: 0 auto » : le margin auto ne peut rien contre une largeur inline, le left négatif restait, et toute la recherche se retrouvait plaquée contre le bord gauche de l'écran. On laisse donc le plugin déborder — c'est son travail — et on centre le contenu par le rembourrage, ce qui ne touche ni à width ni à left. 1500px = la largeur de la carte du hero : les deux s'alignent au pixel. L'unité est vw et non % à dessein — un padding en % se calcule sur le conteneur (1741px), alors que le rembourrage part du bord du wrapper, que le JS a collé au bord de la fenêtre. Avec %, le contenu débordait de 20px de chaque côté. */ .wpgb-wrapper { padding-inline: max(clamp(16px, 4vw, 40px), calc((100vw - 1500px) / 2)); gap: clamp(20px, 2.5vw, 36px); align-items: flex-start; box-sizing: border-box; } .wpgb-wrapper .wpgb-main { flex: 1 1 auto; min-width: 0; } /* La carte suit le défilement : parcourir 5 099 résultats sans la perdre de vue est tout l'intérêt d'une recherche géographique. */ .wpgb-wrapper .wpgb-sidebar-right { flex: 0 0 clamp(340px, 40%, 640px); position: sticky; top: var(--ffk-sticky-top, 96px); height: calc(100vh - var(--ffk-sticky-top, 96px) - 24px); min-height: 420px; } /* Conteneur inséré par ffk-clubs-ux.js pour porter le rôle « tabpanel » que la balise