/* ZMA Transparent Header — v1.0.14 */

/* HEADER */
.header-zma {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 9999;
	background: transparent !important;
	color: #fff !important;
	transition: background-color .35s ease, color .35s ease, box-shadow .35s ease;
}

.header-zma > .wp-block-group {
	background: transparent !important;
}

/* MENU */
.header-zma a,
.header-zma .wp-block-navigation-item__content {
	color: #fff !important;
}

/* ICONES */
.header-zma svg {
	color: #fff !important;
	fill: currentColor;
}

/* LOGO */
.header-zma .wp-block-site-logo img {
	filter: brightness(0) invert(1);
	transition: filter .35s ease;
}

/* ==========================================================
   RECHERCHE : SUPPRESSION COMPLETE DE LA CAPSULE / FOND BLANC
   ========================================================== */

/* Conteneurs courants de recherche WordPress + Nook */
.header-zma .wp-block-search,
.header-zma .wp-block-search__inside-wrapper,
.header-zma form[role="search"],
.header-zma form[role="search"] > div,
.header-zma [class*="search-form"],
.header-zma [class*="search-field"],
.header-zma [class*="search-input"] {
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
}

/* Retire bordure et arrondi du wrapper */
.header-zma .wp-block-search__inside-wrapper,
.header-zma form[role="search"],
.header-zma form[role="search"] > div {
	border: 0 !important;
	border-radius: 0 !important;
	outline: 0 !important;
}

/* INPUT : transparent et sans contour au repos */
.header-zma input[type="search"],
.header-zma .wp-block-search__input {
	-webkit-appearance: none !important;
	appearance: none !important;
	background: transparent !important;
	background-color: transparent !important;
	color: #fff !important;
	border: 1px solid transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	outline: none !important;
	transition: border-color .2s ease, color .2s ease;
}

/* Retire certains styles navigateur */
.header-zma input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/* Libellé visible */
.header-zma input[type="search"]::placeholder,
.header-zma .wp-block-search__input::placeholder {
	color: rgba(255,255,255,.92) !important;
	opacity: 1 !important;
}

/* Contour fin seulement quand on clique */
.header-zma input[type="search"]:focus,
.header-zma .wp-block-search__input:focus {
	background: transparent !important;
	border-color: rgba(255,255,255,.75) !important;
	box-shadow: none !important;
}

/* Et le contour reste visible lorsqu'il y a du texte */
.header-zma input[type="search"]:not(:placeholder-shown),
.header-zma .wp-block-search__input:not(:placeholder-shown) {
	border-color: rgba(255,255,255,.75) !important;
}

/* ==========================================================
   APRES SCROLL
   ========================================================== */

.header-zma.is-scrolled {
	background: #fff !important;
	color: #000 !important;
	box-shadow: 0 2px 15px rgba(0,0,0,.05);
}

.header-zma.is-scrolled > .wp-block-group {
	background: #fff !important;
	color: #000 !important;
}

.header-zma.is-scrolled a,
.header-zma.is-scrolled .wp-block-navigation-item__content {
	color: #000 !important;
}

.header-zma.is-scrolled svg {
	color: #000 !important;
	fill: currentColor;
}

.header-zma.is-scrolled .wp-block-site-logo img {
	filter: brightness(0);
}

/* Recherche après scroll : toujours sans capsule */
.header-zma.is-scrolled .wp-block-search,
.header-zma.is-scrolled .wp-block-search__inside-wrapper,
.header-zma.is-scrolled form[role="search"],
.header-zma.is-scrolled form[role="search"] > div,
.header-zma.is-scrolled [class*="search-form"],
.header-zma.is-scrolled [class*="search-field"],
.header-zma.is-scrolled [class*="search-input"] {
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
}

.header-zma.is-scrolled input[type="search"],
.header-zma.is-scrolled .wp-block-search__input {
	background: transparent !important;
	color: #111 !important;
	border-color: transparent !important;
	border-radius: 0 !important;
}

.header-zma.is-scrolled input[type="search"]::placeholder,
.header-zma.is-scrolled .wp-block-search__input::placeholder {
	color: rgba(0,0,0,.62) !important;
}

.header-zma.is-scrolled input[type="search"]:focus,
.header-zma.is-scrolled .wp-block-search__input:focus,
.header-zma.is-scrolled input[type="search"]:not(:placeholder-shown),
.header-zma.is-scrolled .wp-block-search__input:not(:placeholder-shown) {
	border-color: rgba(0,0,0,.35) !important;
}

/* BARRE ADMIN */
body.admin-bar .header-zma {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar .header-zma {
		top: 46px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.header-zma,
	.header-zma .wp-block-site-logo img,
	.header-zma input[type="search"],
	.header-zma .wp-block-search__input {
		transition: none;
	}
}

/* ==========================================================
   v1.0.11 — SOUS-MENU BLANC AU SCROLL + MASQUER LE + SUR LE FRONT
   ========================================================== */
.header-zma.is-scrolled .wp-block-navigation__submenu-container,
.header-zma.is-scrolled .wp-block-navigation-item.has-child .wp-block-navigation__submenu-container {
	background: #fff !important;
	background-color: #fff !important;
	color: #000 !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}
.header-zma.is-scrolled .wp-block-navigation__submenu-container a,
.header-zma.is-scrolled .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	color: #000 !important;
}

/* Les contrôles d'ajout Gutenberg ne doivent jamais apparaître sur le front. */
body:not(.wp-admin) .header-zma .block-list-appender,
body:not(.wp-admin) .header-zma .wp-block-navigation__responsive-container-open + .block-list-appender,
body:not(.wp-admin) .header-zma [class*="block-list-appender"],
body:not(.wp-admin) .header-zma [class*="inserter"] {
	display: none !important;
}


/* ==========================================================
   v1.0.13 — MOBILE/TABLETTE : HEADER TOUJOURS COLLE EN HAUT
   ========================================================== */
@media (max-width: 1024px) {
	body:not(.admin-bar) .header-zma {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		margin-top: 0 !important;
		inset-block-start: 0 !important;
	}

	/* Le menu responsive commence lui aussi tout en haut de l'ecran. */
	.header-zma .wp-block-navigation__responsive-container.is-menu-open {
		position: fixed !important;
		inset: 0 !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 100vw !important;
		height: 100dvh !important;
		margin: 0 !important;
		box-sizing: border-box !important;
		z-index: 100000 !important;
	}
}

/* ==========================================================
   v1.0.13 — FIX MOBILE + SOUS-MENU + HOVER
   ========================================================== */

/* Mobile/tablette : le header doit toucher le bord supérieur du viewport,
   y compris quand WordPress ajoute la classe admin-bar au body. */
@media (max-width: 1024px) {
	body .header-zma,
	body.admin-bar .header-zma,
	body:not(.admin-bar) .header-zma {
		position: fixed !important;
		top: 0 !important;
		inset-block-start: 0 !important;
		left: 0 !important;
		right: 0 !important;
		margin-top: 0 !important;
		transform: none !important;
	}
}

/* Avant scroll : aucun fond blanc derrière un sous-menu dont le texte est blanc. */
.header-zma:not(.is-scrolled) .wp-block-navigation__submenu-container,
.header-zma:not(.is-scrolled) .wp-block-navigation-item.has-child .wp-block-navigation__submenu-container {
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
}
.header-zma:not(.is-scrolled) .wp-block-navigation__submenu-container a,
.header-zma:not(.is-scrolled) .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	color: #fff !important;
}

/* Après scroll seulement : fond blanc pur + texte noir. */
.header-zma.is-scrolled .wp-block-navigation__submenu-container,
.header-zma.is-scrolled .wp-block-navigation-item.has-child .wp-block-navigation__submenu-container {
	background: #fff !important;
	background-color: #fff !important;
	box-shadow: 0 4px 12px rgba(0,0,0,.05) !important;
}
.header-zma.is-scrolled .wp-block-navigation__submenu-container a,
.header-zma.is-scrolled .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	color: #000 !important;
}

/* Menu : effet de gras visuel doux sans changer la largeur du texte.
   On évite font-weight:600 au hover, car cela élargissait les liens et faisait bouger le logo. */
.header-zma .wp-block-navigation-item__content {
	display: inline-block;
	transition: text-shadow .55s cubic-bezier(.22,.61,.36,1),
	            transform .55s cubic-bezier(.22,.61,.36,1),
	            opacity .55s ease !important;
}
.header-zma .wp-block-navigation-item__content:hover,
.header-zma .wp-block-navigation-item__content:focus-visible {
	font-weight: inherit !important;
	text-shadow: .28px 0 currentColor, -.28px 0 currentColor;
	transform: translateY(-1px);
}


/* ==========================================================
   v1.0.14 — UNIQUEMENT : SOUS-MENU TRANSPARENT + MENU MOBILE LISIBLE
   ========================================================== */

/* Desktop : tant que le header est transparent, le sous-menu reste
   réellement transparent, sans grand carré ni ombre. */
@media (min-width: 1025px) {
	.header-zma:not(.is-scrolled) .wp-block-navigation__submenu-container,
	.header-zma:not(.is-scrolled) .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-container {
		background: transparent !important;
		background-color: transparent !important;
		box-shadow: none !important;
		border: 0 !important;
	}

	.header-zma:not(.is-scrolled) .wp-block-navigation__submenu-container a,
	.header-zma:not(.is-scrolled) .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		color: #fff !important;
	}
}

/* Mobile/tablette : le panneau ouvert est volontairement blanc et le
   texte/icônes noirs pour qu'il reste toujours lisible. Ces règles ne
   modifient pas le header fermé ni son comportement au scroll. */
@media (max-width: 1024px) {
	.header-zma .wp-block-navigation__responsive-container.is-menu-open,
	.header-zma .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
	.header-zma .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		background: #fff !important;
		background-color: #fff !important;
		color: #000 !important;
	}

	.header-zma .wp-block-navigation__responsive-container.is-menu-open a,
	.header-zma .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
	.header-zma .wp-block-navigation__responsive-container.is-menu-open button,
	.header-zma .wp-block-navigation__responsive-container.is-menu-open svg {
		color: #000 !important;
		fill: currentColor !important;
	}

	/* Dans le panneau mobile, pas de gros carré distinct pour le sous-menu. */
	.header-zma .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
		background: transparent !important;
		background-color: transparent !important;
		box-shadow: none !important;
		border: 0 !important;
	}
}

/* v1.0.15 — hover plus lent et sans déplacement du logo. */