/*
 * navbar/carnet — porte depuis Entete.astro de la maquette de Chez Loeli. Engagement 5 : aucun
 * hexadecimal. Cadre sous .ivy-navbar--carnet (le CSS de tout le rayon est charge ensemble).
 *
 * Mobile d'abord : le bouton « Menu » deplie le panneau SOUS la barre (qui pousse la page), les liens
 * en rangees filetees. Des 1000 px : une seule ligne, le panneau est « en ligne ».
 */
/* Le gabarit d'en-tete d'Elementor est le seul parent assez haut pour que la barre colle : c'est lui qui devient `sticky`. */
.elementor-location-header:has( .ivy-navbar--carnet ) { position: sticky; inset-block-start: 0; z-index: 50; }
.ivy-navbar--carnet {
	position: relative;
	background-color: var( --ivy-surface );
	border-block-end: 1px solid transparent;
	transition: border-color 250ms ease;
}
.ivy-navbar--carnet.ivy-stuck,
.ivy-navbar--carnet:has( .ivy-navbar__inner.ivy-open ) { border-block-end-color: var( --ivy-line-soft ); }
.ivy-navbar--carnet .ivy-navbar__stage { transition: box-shadow 250ms ease; }
.ivy-navbar--carnet.ivy-stuck .ivy-navbar__stage,
.ivy-navbar--carnet:has( .ivy-navbar__inner.ivy-open ) .ivy-navbar__stage { box-shadow: 0 10px 30px -22px color-mix( in srgb, var( --ivy-line-accent ) 50%, transparent ); }
.ivy-navbar--carnet .ivy-navbar__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	box-sizing: border-box;
	min-height: 88px;
	width: min( 100% - 2 * clamp( 20px, 5vw, 56px ), 1200px );
	margin-inline: auto;
}
.ivy-navbar--carnet .ivy-navbar__logo { display: block; flex: none; padding-block: 6px; }
.ivy-navbar--carnet .ivy-navbar__logo img { display: block; width: auto; height: 76px; }

/* Le bouton « Menu » (mobile). */
.ivy-navbar--carnet .ivy-navbar__burger {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 48px;
	padding: 0 16px;
	border: 1.5px solid var( --ivy-burger-border-color, var( --ivy-muted ) );
	border-radius: var( --ivy-radius-action, 999px );
	background: transparent;
	color: var( --ivy-burger-color, var( --ivy-ink ) );
	font-family: inherit;
	font-size: var( --ivy-font-h5 ); font-weight: 600;
	cursor: pointer;
}
.ivy-navbar--carnet .ivy-navbar__burger-lines,
.ivy-navbar--carnet .ivy-navbar__burger-lines::before { display: block; width: 18px; height: 1.5px; border-radius: calc( var( --ivy-radius-surface, 18px ) * 2 / 18 ); background: currentColor; transition: transform 200ms ease; }
.ivy-navbar--carnet .ivy-navbar__burger-lines { position: relative; transform: translateY( -3px ); }
.ivy-navbar--carnet .ivy-navbar__burger-lines::before { content: ''; position: absolute; inset-block-start: 6px; }
.ivy-navbar--carnet .ivy-navbar__inner.ivy-open .ivy-navbar__burger-lines { transform: translateY( 0 ) rotate( 45deg ); }
.ivy-navbar--carnet .ivy-navbar__inner.ivy-open .ivy-navbar__burger-lines::before { inset-block-start: 0; transform: rotate( -90deg ); }

/* Le panneau mobile : cache tant que le runtime n'a pas la main (sans JavaScript, il reste deplie). */
.ivy-navbar--carnet .ivy-navbar__panel { display: flex; flex-direction: column; gap: 16px; flex-basis: 100%; width: 100%; padding-block: 8px 24px; }
.ivy-motion-ready .ivy-navbar--carnet .ivy-navbar__inner:not( .ivy-open ) .ivy-navbar__panel { display: none; }
.ivy-motion-ready .ivy-navbar--carnet .ivy-navbar__inner.ivy-open .ivy-navbar__panel { max-height: calc( 100dvh - 88px ); overflow-y: auto; }

.ivy-navbar--carnet .ivy-navbar__menu > ul { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.ivy-navbar--carnet .ivy-navbar__menu a,
.ivy-navbar--carnet .ivy-navbar__submenu-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 48px;
	padding-inline: 4px;
	border-block-end: 1px solid color-mix( in srgb, var( --ivy-line-soft ) 64%, transparent );
	color: var( --ivy-menu-color, var( --ivy-ink ) );
	font-size: var( --ivy-font-body );
	font-weight: 500;
	text-decoration: none;
}
.ivy-navbar--carnet .ivy-navbar__submenu a { color: var( --ivy-submenu-color, var( --ivy-menu-color, var( --ivy-ink ) ) ); }
.ivy-navbar--carnet .ivy-navbar__menu a:hover,
.ivy-navbar--carnet .ivy-navbar__submenu-toggle:hover { color: var( --ivy-accent ); }
.ivy-navbar--carnet .ivy-navbar__menu .current-menu-item > a,
.ivy-navbar--carnet .ivy-navbar__menu .current-menu-ancestor .ivy-navbar__submenu-toggle { color: var( --ivy-accent ); font-weight: 600; }
.ivy-navbar--carnet .ivy-navbar__menu li { position: relative; }
.ivy-navbar--carnet .ivy-navbar__submenu-wrap { display: block; }
.ivy-navbar--carnet .ivy-navbar__submenu-toggle { width: 100%; border-inline: 0; border-block-start: 0; background: transparent; cursor: pointer; font-family: inherit; text-align: start; }
.ivy-navbar--carnet .ivy-navbar__submenu-toggle::after { content: ''; width: 12px; height: 12px; background: currentColor; -webkit-mask: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E" ) center / contain no-repeat; mask: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E" ) center / contain no-repeat; transition: transform 200ms ease; }
.ivy-navbar--carnet .ivy-navbar__submenu-wrap.ivy-open .ivy-navbar__submenu-toggle::after { transform: rotate( 180deg ); }
/* Le sous-menu : replie par defaut (visibility, pas display), deplie en ligne sur mobile. */
.ivy-navbar--carnet .ivy-navbar__submenu-wrap > [data-ivy-disclose-panel] { display: none; }
.ivy-navbar--carnet .ivy-navbar__submenu-wrap.ivy-open > [data-ivy-disclose-panel] { display: block; }
.ivy-navbar--carnet .ivy-navbar__submenu { display: grid; margin: 0; padding: 0 0 0 16px; list-style: none; }

.ivy-navbar--carnet .ivy-navbar__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	align-self: flex-start;
	min-height: 52px;
	padding: .85em 1.7em;
	border: 1.5px solid var( --ivy-cta-background-color, var( --ivy-accent ) );
	border-radius: var( --ivy-radius-action, 999px );
	background-color: var( --ivy-cta-background-color, var( --ivy-accent ) );
	color: var( --ivy-cta-color, var( --ivy-on-accent ) );
	font-size: var( --ivy-font-h6 ); font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color 200ms ease, border-color 200ms ease, transform 200ms ease;
}
.ivy-navbar--carnet .ivy-navbar__cta:hover { border-color: var( --ivy-line-accent ); background-color: var( --ivy-line-accent ); color: var( --ivy-on-accent ); }
.ivy-navbar--carnet .ivy-navbar__cta::after { content: ''; width: 18px; height: 18px; background: currentColor; -webkit-mask: var( --ivy-arrow-mask ) center / contain no-repeat; mask: var( --ivy-arrow-mask ) center / contain no-repeat; transition: transform 200ms ease; }
.ivy-navbar--carnet .ivy-navbar__cta:hover::after { transform: translateX( 3px ); }
.ivy-navbar--carnet :is( a, button ):focus-visible { outline: 3px solid var( --ivy-line-accent ); outline-offset: 3px; border-radius: calc( var( --ivy-radius-surface, 18px ) * 4 / 18 ); }

/* Bureau : une seule ligne. */
@media ( min-width: 1000px ) {
	.ivy-navbar--carnet .ivy-navbar__burger { display: none; }
	.ivy-navbar--carnet .ivy-navbar__inner { flex-wrap: nowrap; }
	.ivy-navbar--carnet .ivy-navbar__panel,
	.ivy-motion-ready .ivy-navbar--carnet .ivy-navbar__inner:not( .ivy-open ) .ivy-navbar__panel,
	.ivy-motion-ready .ivy-navbar--carnet .ivy-navbar__inner.ivy-open .ivy-navbar__panel {
		display: flex;
		flex: 1;
		flex-direction: row;
		align-items: center;
		justify-content: flex-end;
		width: auto;
		max-height: none;
		padding-block: 0;
		gap: clamp( 16px, 2.4vw, 36px );
		overflow: visible;
	}
	.ivy-navbar--carnet .ivy-navbar__menu > ul { display: flex; align-items: center; gap: clamp( 16px, 2.2vw, 34px ); }
	.ivy-navbar--carnet .ivy-navbar__menu a,
	.ivy-navbar--carnet .ivy-navbar__submenu-toggle { position: relative; min-height: 44px; padding-inline: 0; border: 0; font-size: var( --ivy-font-h5 ); width: auto; }
	.ivy-navbar--carnet .ivy-navbar__menu > ul > li > a::after,
	.ivy-navbar--carnet .ivy-navbar__submenu-toggle::before { content: ''; position: absolute; inset-inline: 0; inset-block-end: 6px; height: 1.5px; background: var( --ivy-support ); transform: scaleX( 0 ); transform-origin: left; transition: transform 250ms ease; }
	.ivy-navbar--carnet .ivy-navbar__menu > ul > li > a:hover::after,
	.ivy-navbar--carnet .ivy-navbar__menu > ul > li.current-menu-item > a::after,
	.ivy-navbar--carnet .ivy-navbar__submenu-toggle:hover::before,
	.ivy-navbar--carnet .ivy-navbar__menu .current-menu-ancestor .ivy-navbar__submenu-toggle::before,
	.ivy-navbar--carnet .ivy-navbar__submenu-wrap.ivy-open .ivy-navbar__submenu-toggle::before { transform: scaleX( 1 ); }
	.ivy-navbar--carnet .ivy-navbar__submenu-toggle::after { margin-inline-start: -2px; }
	.ivy-navbar--carnet .ivy-navbar__submenu-wrap { position: relative; }
	.ivy-navbar--carnet .ivy-navbar__submenu-wrap > [data-ivy-disclose-panel] { position: absolute; inset-block-start: calc( 100% + 4px ); inset-inline-start: -16px; z-index: 3; width: max-content; min-width: 260px; }
	.ivy-navbar--carnet .ivy-navbar__submenu { padding: 10px; border: 1px solid var( --ivy-line-soft ); border-radius: var( --ivy-radius-surface, 18px ); background-color: var( --ivy-submenu-background-color, var( --ivy-surface ) ); box-shadow: 0 18px 40px -24px color-mix( in srgb, var( --ivy-line-accent ) 45%, transparent ); }
	.ivy-navbar--carnet .ivy-navbar__submenu a { min-height: 48px; padding: 12px 14px; border-radius: calc( var( --ivy-radius-surface, 18px ) * 10 / 18 ); font-size: var( --ivy-font-body ); font-weight: 500; }
	.ivy-navbar--carnet .ivy-navbar__submenu a:hover { background-color: var( --ivy-print-paper, var( --ivy-surface-soft ) ); color: var( --ivy-ink ); }
	.ivy-navbar--carnet .ivy-navbar__cta { align-self: center; min-height: 48px; padding: .85em 1.4em; }
}
