/*
Theme Name: Christèle Egea — La Magie de Vie
Theme URI: https://agea.projet-atlas.fr
Description: Thème enfant de Hello Elementor pour le site de Christèle Egea, thérapeute énergéticienne à Vaugneray. Design system « Wellness organique » (vert forêt, crème, or, terracotta) — polices Fraunces + Hanken Grotesk.
Author: Projet Atlas
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/

/* La charte graphique complète est chargée depuis assets/css/charte.css (voir functions.php).
   Ce fichier ne contient que d'éventuels micro-ajustements propres à l'intégration WordPress/Elementor. */

/* Compat Elementor : neutraliser le conteneur qui pourrait ajouter des marges parasites */
.elementor-section-wrap > .elementor,
.page-content > .elementor { margin: 0; }

/* La page WordPress standard (non-Elementor) reste centrée proprement */
.site-main .entry-content { margin-inline: auto; }

/* Hello Elementor style aussi une classe .site-header (flex, centrée, largeur limitée)
   qui entre en collision avec notre en-tête. On restaure un header pleine largeur. */
.site-header {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	/* En-tête collé en haut sur TOUTES les tailles (desktop, tablette, mobile). */
	position: -webkit-sticky !important;
	position: sticky !important;
	top: 0 !important;
	z-index: 100 !important;
}

/* Empêcher le défilement horizontal SANS créer de conteneur de défilement
   (overflow:hidden casserait le position:sticky sur Safari/iOS ; clip ne le casse pas). */
html { overflow-x: clip; }
body { overflow-x: clip; }

/* Hello Elementor contraint aussi .site-footer (max-width ~1140px, centré) : on rend
   le pied de page PLEINE LARGEUR (bandeau edge-to-edge, contenu centré via .container). */
.site-footer {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
}

/* Bouton hamburger : conserver le fond ivoire de la charte dans TOUS les états
   (Hello Elementor applique un fond rose #CC3366 au focus/actif). */
.site-header .nav-toggle,
.site-header .nav-toggle:hover,
.site-header .nav-toggle:focus,
.site-header .nav-toggle:focus-visible,
.site-header .nav-toggle:active,
body.menu-open .site-header .nav-toggle {
	background: var(--surface) !important;
	border-color: var(--line) !important;
	color: var(--forest) !important;
	box-shadow: none !important;
}
/* Les trois barres / la croix restent vert forêt. */
.site-header .nav-toggle span,
.site-header .nav-toggle span::before,
.site-header .nav-toggle span::after {
	background: var(--forest);
}
body.menu-open .site-header .nav-toggle span {
	background: transparent;
}

/* Menu principal en PLEINE LARGEUR en front (barre d'en-tête edge-to-edge) */
.site-header .nav {
	width: 100%;
	max-width: none;
	padding-inline: clamp(1.25rem, 4vw, 3.5rem);
}

/* Tiroir de navigation mobile/tablette : garantir pleine largeur (sinon un reset
   d'Elementor/Hello écrase left/right et le menu déborde à droite). */
@media (max-width: 1000px) {
	.site-header .nav-menu {
		left: 0 !important;
		right: 0 !important;
		width: auto !important;
		max-width: none !important;
	}

	/* Sous-menus TOUJOURS dépliés dans le tiroir mobile/tablette (aucun toggle). */
	.site-header .has-sub .submenu {
		max-height: none !important;
		overflow: visible !important;
	}
	/* Le chevron devient inutile puisque le sous-menu est déjà ouvert. */
	.site-header .has-sub > .nav-link > svg {
		display: none !important;
	}
	/* Le libellé « Accompagnements » n'est plus cliquable/togglable : simple intitulé. */
	.site-header .has-sub > .nav-link {
		pointer-events: none;
	}
	.site-header .has-sub .submenu a {
		pointer-events: auto;
	}
}