/**
 * Site header mega menu + mobile nav lock.
 */

/* Desktop mega-menu backdrop when a dropdown panel is open */
@media (min-width: 1025px) {
	.e-n-menu-content.e-active:has(.e-con.e-active)::after {
		content: "";
		position: absolute;
		width: 100%;
		height: 100vh;
		top: 25px;
		left: 0;
		background: color-mix(in srgb, var(--sw-color-navy) 35%, transparent);
		mix-blend-mode: multiply;
		z-index: -1;
	}
}

/* Lock body scroll while the mobile menu is expanded */
@media (max-width: 1024px) {
	body:has(.elementor-7038 .e-n-menu-toggle[aria-expanded="true"]) {
		overflow: hidden;
	}

	/* Keep Elementor's global button hover/focus colour off the burger toggle. */
	.elementor-7038 .e-n-menu-toggle:is(:hover, :focus, [aria-expanded="true"]) {
		background-color: transparent !important;
	}

	/* Match the menu labels to the header logo's horizontal inset. */
	.elementor-7038 .elementor-element-39dceea2
		.e-n-menu[data-layout="dropdown"]
		> .e-n-menu-wrapper
		> .e-n-menu-heading
		> .e-n-menu-item
		> .e-n-menu-title {
		padding-inline: 25px !important;
	}

	/* Keep the mobile navigation hierarchy clear and consistent. */
	.elementor-7038 .elementor-element-39dceea2
		.e-n-menu[data-layout="dropdown"]
		> .e-n-menu-wrapper
		> .e-n-menu-heading
		> .e-n-menu-item:not(:last-child)
		> .e-n-menu-title
		.e-n-menu-title-text {
		font-size: 17px;
		line-height: 24px;
	}

	.elementor-7038 .e-n-menu[data-layout="dropdown"]
		.e-n-menu-content
		.elementor-heading-title.elementor-size-default {
		font-size: 17px;
		line-height: 24px;
	}

	/*
	 * Elementor leaves this at max-height: auto for non-sticky mega menus.
	 * Give the open drawer the exact remaining viewport height so it reaches the
	 * bottom of the screen and becomes the scroll container for expanded panels.
	 */
	.elementor-7038 .e-n-menu[data-layout="dropdown"]
		> .e-n-menu-toggle[aria-expanded="true"]
		+ .e-n-menu-wrapper {
		background-color: var(--sw-color-white, #fff);
		height: var(--sourcewhale-mobile-menu-height, calc(100dvh - 80px));
		max-height: var(--sourcewhale-mobile-menu-height, calc(100dvh - 80px)) !important;
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior-y: contain;
		touch-action: pan-y;
		-webkit-overflow-scrolling: touch;
	}
}

/* Keep the desktop product rows compact inside the Platform mega menu. */
@media (min-width: 1025px) {
	.elementor-7038 .e-n-menu-content .e-grid:has(> .mega-nav-btn) {
		row-gap: 8px;
	}
}

/* Mega menu item hover affordance */
.mega-nav-btn {
	width: auto;
}

/* Keep the live menu's row rhythm while aligning every icon with its title. */
.elementor-7038 .mega-nav-btn > .e-con-inner {
	align-items: flex-start;
}

/*
 * Product descriptions use Elementor's Global / Body Normal typography.
 * Target both standard and optimised Elementor DOM output.
 */
.elementor-7038 .mega-nav-btn .elementor-widget-text-editor,
.mega-nav-btn .elementor-widget-text-editor > .elementor-widget-container {
	color: var(--sw-color-body);
	font-family: var(--e-global-typography-bodyn01-font-family, var(--sw-font-body));
	font-size: var(--e-global-typography-bodyn01-font-size, 17px);
	font-weight: var(--e-global-typography-bodyn01-font-weight, 400);
	letter-spacing: var(--e-global-typography-bodyn01-letter-spacing, -0.17px);
	line-height: var(--e-global-typography-bodyn01-line-height, 24px);
}

.elementor-7038 .mega-nav-btn .elementor-widget-text-editor {
	padding-block-end: 0.9rem;
}

/*
 * Elementor may store a description as either a text node or a paragraph.
 * Remove the paragraph box spacing so both variants occupy the same height.
 */
.elementor-7038 .mega-nav-btn .elementor-widget-text-editor > p,
.mega-nav-btn .elementor-widget-text-editor > .elementor-widget-container > p {
	margin: 0;
	padding: 0;
}

/* Elementor's generic link hover colour must not turn product titles blue. */
.mega-nav-btn:hover .elementor-heading-title,
.mega-nav-btn:focus-visible .elementor-heading-title {
	color: var(--sw-color-heading);
}

.mega-nav-btn__icon {
	cursor: pointer;
}

.mega-nav-btn__icon .elementor-icon {
	display: inline-block !important;
}

.mega-nav-btn .mega-nav-btn__arrow {
	opacity: 0;
	position: relative;
	left: -4px;
	transition: all 0.25s ease;
}

.mega-nav-btn:hover .mega-nav-btn__arrow {
	opacity: 1;
	left: 0;
}

.mega-nav-btn:hover .mega-nav-btn__text {
	text-decoration: underline;
}

/* Push Login + CTA to the right; style final item as button text */
@media (min-width: 1025px) {
	.elementor-7038 nav.e-n-menu > .e-n-menu-wrapper > ul > li:last-child {
		padding: 10px 20px !important;
	}

	.elementor-7038 nav.e-n-menu > .e-n-menu-wrapper > ul > li:last-child > .e-n-menu-title {
		padding: 0 !important;
	}

	.elementor-7038 nav.e-n-menu > .e-n-menu-wrapper > ul > li:nth-last-child(2) {
		margin-left: auto;
		margin-right: 0px !important;
	}
}

.elementor-7038 .e-n-menu-dropdown-icon {
	box-shadow: none !important;
}

.elementor-7038 nav.e-n-menu > .e-n-menu-wrapper > ul > li:last-child a > span {
	background-color: var(--sw-color-pink);
	box-shadow: none !important;
	border: none !important;
	border-radius: var(--sw-radius-control);
	font-family: var(--e-global-typography-484df4c-font-family, var(--sw-font-body));
	font-size: var(--e-global-typography-484df4c-font-size, 16px);
	font-weight: var(--e-global-typography-484df4c-font-weight, 600) !important;
	letter-spacing: var(--e-global-typography-484df4c-letter-spacing, 0.16px);
	line-height: var(--e-global-typography-484df4c-line-height, 24px);
	padding: 10px 20px;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.elementor-7038 nav.e-n-menu > .e-n-menu-wrapper > ul > li:last-child a:hover > span,
.elementor-7038 nav.e-n-menu > .e-n-menu-wrapper > ul > li:last-child a:focus-visible > span {
	background-color: var(--sw-color-pink-hover);
}

.elementor-7038 nav.e-n-menu > .e-n-menu-wrapper > ul > li:last-child a,
.elementor-7038 nav.e-n-menu > .e-n-menu-wrapper > ul > li:last-child a > span {
	color: var(--sw-color-white) !important;
}