/**
 * WAW Nav Accordion : sous-menus repliables dans l'overlay mobile.
 *
 * Active uniquement sur un `<nav>` portant `.wawp-nav-accordion` (posée par
 * le plugin quand les chevrons ont bien été reliés à l'état réel). Hors de
 * l'overlay (`.is-menu-open`), rien ne s'applique.
 *
 * Spécificité : le cœur affiche les sous-menus avec
 * `.wp-block-navigation .has-child .wp-block-navigation__submenu-container`
 * (0,3,0) et masque les chevrons de l'overlay en (0,4,0). Les règles
 * ci-dessous restent juste au-dessus. Un thème les surcharge en ajoutant une
 * classe (ex. `.site-header`).
 *
 * @package WawpNavAccordion
 * @since   0.1.0
 */

/* Parent : intitulé et chevron sur une ligne, sous-menu dessous. */
.wawp-nav-accordion .is-menu-open .wp-block-navigation__responsive-container-content .has-child:not(.open-always) {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--navigation-layout-justification-setting, flex-start);
}

/*
 * Intitulé collé à son chevron : le cœur fait grandir les intitulés des
 * sous-menus (`flex-grow: 1`), ce qui éloigne le chevron au niveau 2.
 */
.wawp-nav-accordion .is-menu-open .wp-block-navigation__responsive-container-content .has-child:not(.open-always) > .wp-block-navigation-item__content {
	flex-grow: 0;
}

/* Sous-menus repliés par défaut. */
.wawp-nav-accordion .is-menu-open .has-child:not(.open-always) > .wp-block-navigation__submenu-container {
	display: none;
	flex-basis: 100%;
}

/* Sous-menu dont le chevron est ouvert. */
.wawp-nav-accordion .is-menu-open .has-child:not(.open-always) > .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
	display: flex;
}

/* Chevron visible dans l'overlay (le cœur le masque). */
.wawp-nav-accordion .is-menu-open .wp-block-navigation__responsive-container-content .has-child:not(.open-always) > .wp-block-navigation__submenu-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/*
 * Mode survol : le chevron est le bouton. Cible tactile de 44 px
 * (WCAG 2.5.8 demande 24 px, 44 px est la recommandation RGAA / AAA).
 */
.wawp-nav-accordion .is-menu-open .wp-block-navigation__responsive-container-content .has-child:not(.open-always) > .wp-block-navigation__submenu-icon.wp-block-navigation-submenu__toggle {
	width: 2.75rem;
	height: 2.75rem;
	cursor: pointer;
}

.wawp-nav-accordion .is-menu-open .wp-block-navigation__responsive-container-content .has-child:not(.open-always) > .wp-block-navigation__submenu-icon svg {
	width: 0.75rem;
	height: 0.75rem;
	margin-top: 0;
	transform: none;
}

/* Rotation du chevron ouvert, dans les deux modes (survol et clic). */
.wawp-nav-accordion .is-menu-open .wp-block-navigation__responsive-container-content .has-child:not(.open-always) > .wp-block-navigation-submenu__toggle[aria-expanded="true"] > svg,
.wawp-nav-accordion .is-menu-open .wp-block-navigation__responsive-container-content .has-child:not(.open-always) > .wp-block-navigation-submenu__toggle[aria-expanded="true"] + .wp-block-navigation__submenu-icon > svg {
	transform: rotate(180deg);
}

/* Intitulé sans lien : il ouvre son sous-menu. */
.wawp-nav-accordion .is-menu-open .has-child > a.wp-block-navigation-item__content:not([href]) {
	cursor: pointer;
}

@media (prefers-reduced-motion: no-preference) {
	.wawp-nav-accordion .is-menu-open .wp-block-navigation__responsive-container-content .has-child > .wp-block-navigation__submenu-icon svg {
		transition: transform 0.15s ease;
	}
}
