/* Hoofdmenu: hoort bij js/nav-menu.js. */

/* Submenu's openen */
.elementor-nav-menu li.is-open > ul {
	display: block;
}

/* Toetsenbord-fallback, ook als JavaScript niet draait.
   Eigen regel, zodat oudere browsers die :focus-within niet kennen
   de rest van dit bestand niet negeren. */
.elementor-nav-menu--main .elementor-nav-menu li:focus-within > ul {
	display: block;
}

/* Desktop-submenu boven de pagina-inhoud */
.elementor-nav-menu--main .elementor-nav-menu ul {
	z-index: 9998;
	width: auto;
	min-width: 12em;
	white-space: nowrap;
}

/* Onzichtbare brug over de ruimte tussen menu-item en submenu,
   zodat het submenu niet sluit tijdens het bewegen van de muis. */
.elementor-nav-menu--main .elementor-nav-menu > li > ul::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100%;
	height: 32px;
}

/* Pijltje (naar beneden) bij items met een submenu.
   Eigen class: Elementor geeft .sub-arrow al padding en flex-opmaak. */
.elementor-nav-menu .nav-caret {
	display: inline-block;
	flex: none;
	box-sizing: content-box;
	width: 0.4em;
	height: 0.4em;
	padding: 0;
	margin: 0 0 0 0.45em;
	border: solid currentColor;
	border-width: 0 2px 2px 0;
	-webkit-transform: translateY(-20%) rotate(45deg);
	transform: translateY(-20%) rotate(45deg);
	pointer-events: none;
}

/* Elementor's eigen menuscript wordt soms alsnog van de live site geladen
   en voegt dan een tweede pijltje (.sub-arrow) toe. Alleen .nav-caret tonen. */
.elementor-nav-menu .sub-arrow {
	display: none !important;
}

/* Uitklapmenu (tablet/mobiel) */
.elementor-nav-menu--dropdown .elementor-nav-menu .nav-caret {
	margin-left: auto;
}

.elementor-nav-menu--dropdown .elementor-nav-menu a {
	display: flex;
	align-items: center;
}

.elementor-menu-toggle {
	-webkit-tap-highlight-color: transparent;
	-webkit-user-select: none;
	user-select: none;
}