/**
 * Site-wide: readable Elementor n-menu dropdown on mobile/tablet.
 * Does not change the desktop (min-width: 1025px) horizontal menu.
 *
 * The header widget (#edumagnet-top-menu, .e-n-menu-tablet) switches to
 * hamburger/dropdown at Elementor's tablet breakpoint (max-width: 1024px).
 * Dropdown item labels inherit the kit link color (#000) because
 * --n-menu-item-title-normal-color-dropdown is unset, and the open
 * panel background is transparent, so the page search shows through.
 */

@media (max-width: 1024px) {
	.elementor-widget-n-menu.e-n-menu-tablet,
	.elementor-widget-n-menu.e-n-menu-mobile,
	.elementor-widget-n-menu.e-n-menu-mobile_extra,
	#edumagnet-top-menu.elementor-widget-n-menu {
		--n-menu-item-title-normal-color-dropdown: #ffffff;
		--n-menu-item-title-hover-color-dropdown: #F7BE28;
		--n-menu-item-title-active-color-dropdown: #F7BE28;
		--n-menu-item-title-justify-content-mobile: center;
		overflow: visible;
	}

	/* Keep the open dropdown above the homepage search and other page content. */
	#miwi-header-container,
	.elementor-location-header,
	.elementor-55 {
		overflow: visible !important;
	}

	/*
	 * When the hamburger dropdown is open, lift the header stacking context
	 * above the membership popup (#emlp-membership-popup, z-index 999999)
	 * and the page search. Closed header stays at its normal stacking order.
	 */
	body:has(.elementor-widget-n-menu .e-n-menu-items-content.e-active) #miwi-header-container,
	body:has(.elementor-widget-n-menu .e-n-menu-items-content.e-active) .elementor-location-header,
	body:has(.elementor-widget-n-menu .e-n-menu-items-content.e-active) .elementor-55 {
		z-index: 1000001 !important;
		position: relative !important;
	}

	.elementor-widget-n-menu,
	.elementor-widget-n-menu > .elementor-widget-container,
	.elementor-widget-n-menu .e-n-menu {
		overflow: visible !important;
		position: relative;
	}

	.elementor-widget-n-menu .e-n-menu-items-content {
		background-color: #3b124b !important;
		background-image: none !important;
		z-index: 10001 !important;
		padding: 12px 14px 16px !important;
		box-sizing: border-box !important;
		border: 2px solid #eab830 !important;
		border-radius: 14px !important;
		box-shadow: 0 14px 32px rgba(0, 0, 0, 0.4) !important;
	}

	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title {
		justify-content: center !important;
		text-align: center !important;
		width: 100%;
		color: #ffffff !important;
	}

	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title > a.e-n-menu-item-title-container,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title a.e-n-menu-item-title-container,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title .e-n-menu-item-title-text {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 100%;
		color: #ffffff !important;
		text-align: center !important;
		font-size: 17px !important;
		font-weight: 600 !important;
		line-height: 1.2 !important;
		text-decoration: none !important;
	}

	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title:hover,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title:hover > a.e-n-menu-item-title-container,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title:hover a.e-n-menu-item-title-container,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title:hover .e-n-menu-item-title-text,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title:focus,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title:focus-within,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title:focus-within > a.e-n-menu-item-title-container,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title:focus-within .e-n-menu-item-title-text,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title.e-current,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title.e-current > a.e-n-menu-item-title-container,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title.e-current a.e-n-menu-item-title-container,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title.e-current .e-n-menu-item-title-text,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title > a.e-n-menu-item-title-container:hover,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title > a.e-n-menu-item-title-container:focus,
	.elementor-widget-n-menu .e-n-menu-items-content > .e-n-menu-item-title > a.e-n-menu-item-title-container:focus-visible {
		color: #F7BE28 !important;
	}
}