/**
 * Eleven Crown — Correctif responsive du mega-menu Flatsome
 * ------------------------------------------------------------
 * Le mega-menu généré par ce plugin contient énormément de liens
 * (championnats + clubs, zones + pays). Sur Flatsome, deux problèmes
 * combinés causent le bug "le menu se fige ou disparaît au scroll" :
 *
 * 1) Le header "collant" (sticky) de Flatsome anime son apparition avec
 *    un `transform` CSS. Or un `transform` sur un élément parent crée un
 *    nouveau "containing block" : tout élément en `position: fixed` à
 *    l'intérieur se comporte alors comme du `position: absolute` et se
 *    met à bouger / se figer bizarrement pendant le scroll au lieu de
 *    rester ancré à l'écran.
 * 2) Un sous-menu avec des centaines de liens dépasse la hauteur de
 *    l'écran : sans limite de hauteur ni défilement interne, il est
 *    simplement coupé/masqué par les conteneurs parents.
 *
 * Ce fichier corrige les deux causes. Les sélecteurs ciblent le balisage
 * standard de Flatsome ; si ton thème enfant a renommé des classes,
 * ajuste les sélecteurs ci-dessous en conséquence.
 */

/* 1) Neutralise le transform du header sticky pour ne pas casser le
      positionnement fixed/absolute des sous-menus pendant le scroll. */
#header.stuck,
#wrapper-navigation.stuck,
.header-wrapper.stuck {
	transform: none !important;
}

/* 2) Le sous-menu (et ses sous-niveaux) ne doit jamais dépasser la
      hauteur visible de l'écran : au-delà, il défile lui-même. */
.header-nav-main .nav-dropdown,
.header-nav-main .nav-dropdown .nav-dropdown,
#main-menu .nav-dropdown,
#main-menu .nav-dropdown .nav-dropdown {
	max-height: 75vh;
	overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain; /* le scroll dans le sous-menu ne fait pas défiler la page derrière */
}

/* 3) Empêche les conteneurs parents de rogner (clip) le mega-menu. */
#header,
#wrapper-navigation,
.header-nav-main,
.flatsome-navbar,
nav.nav-mega {
	overflow: visible;
}

/* 4) Le sous-menu doit toujours être ancré correctement et passer
      au-dessus du reste du contenu, même quand le header est sticky. */
.header-nav-main .nav-dropdown {
	position: absolute;
	z-index: 9999;
}

/* ------------------------------------------------------------ */
/* MOBILE / TABLETTE (menu off-canvas de Flatsome)                */
/* ------------------------------------------------------------ */
@media (max-width: 849px) {

	/* Le panneau off-canvas doit occuper toute la hauteur de l'écran
	   et défiler en interne, jamais se figer pendant qu'on scrolle
	   la page en dessous. */
	.off-canvas,
	#main-menu.mobile-sidebar,
	.mobile-nav-wrap {
		max-height: 100vh;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	/* Les sous-menus déroulés en accordéon sur mobile : limite de
	   hauteur + défilement interne pour les branches très longues
	   (ex : la liste des pays ou des clubs). */
	.header-nav-main .nav-dropdown,
	.header-nav-main .nav-dropdown .nav-dropdown {
		max-height: 60vh;
		width: 100% !important;
		position: relative !important;
		left: 0 !important;
	}
}

/* Empêche le scroll de la page de "fuiter" pendant qu'on défile dans
   un sous-menu ouvert (évite l'effet de saut/glitch au relâchement). */
.header-nav-main li.has-dropdown:hover > .nav-dropdown,
.header-nav-main li.has-dropdown.is-touch-open > .nav-dropdown {
	touch-action: pan-y;
}