/**
 * Styles globaux du site (chargés sur toutes les pages).
 */

/* Icônes de la bibliothèque en SVG (« Inline Font Icons ») : carrées comme l'ancienne police.
   Sinon le réglage Elementor « hauteur 2em » (25 pages) les rend ovales dans les cadres ronds. */
.elementor-icon svg.e-font-icon-svg { height: 1em !important; }

/* =====================================================================
 * Classes utilitaires — à ajouter dans Elementor > Avancé > Classes CSS
 * ===================================================================== */

/* Élément non cliquable et non glissable (ex. carrousels décoratifs). */
.album-sans-clic {
	pointer-events: none;
	touch-action: none;
}

/* Widget FluentBooking : cache l'en-tête « auteur » (pages agenda des commerciaux). */
.album-sans-auteur .fcal_author_header {
	display: none;
}

/* Page sans barre d'administration WordPress (pages agenda / calendrier). */
html:has(.album-sans-barre-admin) {
	margin-top: 0 !important;
}
html:has(.album-sans-barre-admin) #wpadminbar {
	display: none !important;
}

/* =====================================================================
 * Menus EN / ES — effets de survol des boutons et titres
 * (.orangeline, .blueline, .blue2, .slide). Anciennement recopié dans chaque
 * bouton des menus « Menu Niveau 1 - EN » et « Menu_ES ». Limité aux pages
 * non françaises, comme avant (le menu FR n'avait pas ce CSS).
 * ===================================================================== */
html:not([lang^="fr"]) .orangeline .elementor-button-text {
  position: relative;
  display: inline-block;
  overflow: visible;
  z-index: 0;
}

html:not([lang^="fr"]) .orangeline .elementor-button-text::before {
  content: "";
  position: absolute;
  z-index: -1;

  top: 4%;
  bottom: -6px;
  left: -6px;
  right: -10px;

  background: #153E75;
  border-radius: 3px 8px 4px 7px;
  transform: scaleX(0) rotate(-0.8deg);
  transform-origin: left center;
  transition: transform 0.35s ease;
}

html:not([lang^="fr"]) .orangeline:hover .elementor-button-text::before {
  transform: scaleX(1) rotate(-0.8deg);
}

html:not([lang^="fr"]) .orangeline:hover .elementor-button-text {
  color: #F39718;
}

html:not([lang^="fr"]) .blueline .elementor-button-text {
  position: relative;
  display: inline-block;
  overflow: visible;
  z-index: 0;

}

html:not([lang^="fr"]) .blueline .elementor-button-text::before {
  content: "";
  position: absolute;
  z-index: -1;

  top: 4%;
  bottom: -6px;
  left: -6px;
  right: -10px;

  background: #153E75;
  border-radius: 3px 8px 4px 7px;
  transform: scaleX(0) rotate(-0.8deg);
  transform-origin: left center;
  transition: transform 0.35s ease;
}

html:not([lang^="fr"]) .blueline:hover .elementor-button-text::before {
  transform: scaleX(1) rotate(-0.8deg);
}

html:not([lang^="fr"]) .blueline:hover .elementor-button-text {
  color: #ffffff;
}

html:not([lang^="fr"]) .blue2 .elementor-button-text {
  position: relative;
  display: inline-block;
  overflow: visible;
  z-index: 0;

}

html:not([lang^="fr"]) .blue2 .elementor-button-text::before {
  content: "";
  position: absolute;
  z-index: -1;

  top: 4%;
  bottom: -6px;
  left: -6px;
  right: -10px;

  background: #f39718;
  border-radius: 3px 8px 4px 7px;
  transform: scaleX(0) rotate(-0.8deg);
  transform-origin: left center;
  transition: transform 0.35s ease;
}

html:not([lang^="fr"]) .blue2:hover .elementor-button-text::before {
  transform: scaleX(1) rotate(-0.8deg);
}

html:not([lang^="fr"]) .blue2:hover .elementor-button-text {
  color: #153e75;
}

html:not([lang^="fr"]) .slide {
  position: relative;
  display: inline-block;
  overflow: visible; /* pour laisser dépasser le décalage bas/droite */
}

html:not([lang^="fr"]) .slide a {
  position: relative;
  z-index: 1;
  color: inherit;
  text-decoration: none;
}

html:not([lang^="fr"]) .slide::before {
  content: "";
  position: absolute;
  z-index: 0;

  top: 4%;
  bottom: -6px;      /* décalage vers le bas */
  left: -6px;
  right: -10px;       /* décalage vers la droite */

  background: #f29217;
  border-radius: 3px 8px 4px 7px;   /* coins légèrement irréguliers */
  transform: scaleX(0) rotate(-0.8deg);
  transform-origin: left center;
  transition: transform 0.35s ease;
}

html:not([lang^="fr"]) .slide:hover::before {
  transform: scaleX(1) rotate(-0.8deg);
}

/* =====================================================================
 * Menus FR (Menu Niveau 1 - FR, Submenu_Sport, Submenu_General) — bouton #privee
 * Anciennement dans le CSS personnalisé du méga-menu de chacun.
 * ===================================================================== */
html[lang^="fr"] #privee {
	background-color: orange;
	color: white;
}

/* Cacher #privee sur les écrans plus larges que 1024 px */
@media screen and (min-width: 1025px) {
	html[lang^="fr"] #privee {
		display: none !important;
	}
}

/* =====================================================================
 * Effets au défilement (assets/js/effets-defilement.js) — ID CSS à donner dans Elementor.
 * Anciennement dans des widgets HTML de la page « Farnham Town FC ».
 * ===================================================================== */
#sticker,
#pins,
#reelyoutube,
#sticker_es {
	transition: transform 0.1s linear;
	will-change: transform;
}

/* #sticker_es : le cromo passe derrière la pochette (widget image suivant). */
#sticker_es {
	position: relative;
	z-index: 1;
}
#sticker_es + .elementor-widget-image {
	position: relative;
	z-index: 2;
}

/* Texte lu par Google et les lecteurs d'écran, invisible à l'écran.
 * Sert à compléter les H1 dont la fin est animée (ex. « … aux couleurs de votre [club / école…] »). */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	white-space: nowrap;
	word-wrap: normal !important;
}

/*
 * Pied de page : zones tactiles d'au moins 24 px de haut pour les liens des listes (PageSpeed, 29/09/2026).
 */
.elementor-location-footer .elementor-icon-list-item > a {
	min-height: 24px;
	padding-block: 4px;
	align-items: center;
}