/**
 * Cohabitation avec le widget Menu d'Elementor Pro.
 *
 * Trois problemes a regler : le panneau est rogne par les conteneurs du
 * widget, il passe sous les elements suivants du header, et le tiroir mobile
 * a sa propre mise en page.
 */

/* ---------------------------------------------------------------------
 * Debordement : sans ca le panneau est coupe au bord du widget.
 * ------------------------------------------------------------------ */

.elementor-widget-nav-menu .elementor-widget-container,
.elementor-widget-nav-menu .elementor-nav-menu--main,
.elementor-widget-nav-menu .elementor-nav-menu--main > .elementor-nav-menu,
.elementor-widget-nav-menu .elementor-nav-menu > li.mm-has-panel {
	overflow: visible;
}

/* ---------------------------------------------------------------------
 * Empilement : le widget passe au-dessus tant qu'un panneau est ouvert.
 * La classe est posee par le JS, pas besoin de :has().
 * ------------------------------------------------------------------ */

.elementor-widget-nav-menu.mm-stack-top,
.elementor-element.mm-stack-top {
	position: relative;
	z-index: 1000;
}

/* ---------------------------------------------------------------------
 * Le widget aligne ses <a> en flex : on neutralise l'heritage sur le
 * panneau, qui a sa propre grille.
 * ------------------------------------------------------------------ */

.elementor-nav-menu .mm-panel {
	flex: none;
	font-family: inherit;
	white-space: normal;
	text-transform: none;
	letter-spacing: normal;
}

.elementor-nav-menu .mm-panel a {
	display: inline-flex;
	padding: 4px 0;
	background: none;
	text-transform: none;
	letter-spacing: normal;
	white-space: normal;
}

.elementor-nav-menu .mm-panel a:hover,
.elementor-nav-menu .mm-panel a:focus {
	background: none;
}

/* Les styles de survol du widget (pointeurs, soulignements) ne doivent pas
   s'appliquer aux liens internes du panneau. */
.elementor-nav-menu .mm-panel a::before,
.elementor-nav-menu .mm-panel a::after {
	display: none;
}

/* ---------------------------------------------------------------------
 * Tiroir mobile : le panneau devient un accordeon dans le flux.
 * ------------------------------------------------------------------ */

.elementor-nav-menu--dropdown .mm-panel {
	position: static;
	width: 100%;
	max-width: none;
	box-shadow: none;
	border-top: 0;
	transform: none;
}

.elementor-nav-menu--dropdown .mm-panel__inner {
	max-width: none;
	padding: 8px 20px 20px;
}

.elementor-nav-menu--dropdown .mm-panel__columns {
	grid-template-columns: minmax(0, 1fr);
	gap: 18px;
}

.elementor-nav-menu--dropdown .mm-col {
	grid-column: span 1 !important;
}

/* Le tiroir aligne ses items au centre selon les reglages du widget : le
   contenu du panneau, lui, reste lisible aligne a gauche. */
.elementor-nav-menu--dropdown .mm-panel,
.elementor-nav-menu--dropdown .mm-panel a {
	text-align: left;
	justify-content: flex-start;
}
