/**
 * Novatis — habillage du panneau déroulant reconstruit dans le header.
 *
 * Volontairement autonome (pas de classes Tailwind) : le CSS du site importé
 * est purgé des classes non utilisées à la capture, donc les utilitaires d'un
 * panneau qui n'existait pas peuvent en être absents.
 */

.nv-dd {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 60;
	min-width: 15rem;
	margin-top: .5rem;
	padding: .4rem 0;
	background: #fff;
	border: 1px solid rgba(17, 24, 39, .07);
	border-radius: 1rem;
	box-shadow: 0 18px 38px -14px rgba(15, 23, 42, .28), 0 4px 12px -6px rgba(15, 23, 42, .12);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-.35rem);
	pointer-events: none;
	transition: opacity .18s ease, transform .18s ease, visibility .18s;
}

/* Passerelle invisible sous le lien parent : le survol ne se coupe pas
   lorsque la souris traverse l'espace entre le lien et le panneau. */
.nv-dd::before {
	content: "";
	position: absolute;
	top: -.6rem;
	left: 0;
	right: 0;
	height: .6rem;
}

.nv-dd[data-state="open"] {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
}

.nv-dd-item {
	display: block;
	padding: .55rem 1.1rem;
	font-size: .875rem;
	line-height: 1.35;
	font-weight: 500;
	color: #374151;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .15s ease, color .15s ease;
}

.nv-dd-item:hover,
.nv-dd-item:focus-visible {
	background: var(--nv-dd-accent-soft, rgba(220, 38, 38, .09));
	color: var(--nv-dd-accent, #dc2626);
}

.nv-dd-item[aria-current="page"] {
	background: var(--nv-dd-accent-soft, rgba(220, 38, 38, .09));
	color: var(--nv-dd-accent, #dc2626);
}

.nv-dd-item:focus-visible {
	outline: 2px solid var(--nv-dd-accent, #dc2626);
	outline-offset: -2px;
}

/* Chevron du lien parent : pivote quand le panneau est ouvert. */
.nv-dd-chevron {
	transition: transform .2s ease;
}

[aria-expanded="true"] > .nv-dd-chevron,
[aria-expanded="true"] .nv-dd-chevron {
	transform: rotate(180deg);
}

/* Le panneau n'a de sens que sur la navigation bureau. */
@media (max-width: 1023px) {
	.nv-dd {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.nv-dd,
	.nv-dd-item,
	.nv-dd-chevron {
		transition: none;
	}
}
