/**
 * eh/mega-menu
 */

.wp-block-eh-mega-menu {
	--icon--scale: 2;

	border-block-end: 1px solid var(--wp--preset--color--accent-1);
}

.wp-block-eh-mega-menu .wp-block-navigation__submenu-container {
	background-color: transparent !important;
	border: 0 !important;
}

:is(.wp-block-eh-mega-menu__link, .wp-block-eh-mega-menu__button) {
	--eh--mega-menu--spacing--padding--block: var(--wp--preset--spacing--30);
	--eh--mega-menu--spacing--padding--inline: var(--wp--preset--spacing--30);

	font-weight: 700;
	white-space: nowrap;
}

.wp-block-navigation .wp-block-eh-mega-menu .wp-block-navigation__submenu-icon {
	line-height: 1;
}

/* Position toggle button on mobile links */
.wp-block-eh-mega-menu > .wp-block-eh-mega-menu__link + .wp-block-navigation-submenu__toggle::before {
	inset-inline-end: var(--wp--style--root--padding-right);
}

@media (width >= 1200px) {
	.wp-block-eh-mega-menu  {
		--icon--scale: 1;

		border-block-end: 0;
	}

	:is(.wp-block-eh-mega-menu__button, .wp-block-eh-mega-menu__link) {
		--eh--mega-menu--spacing--padding: 0;
	}

	:is(.wp-block-eh-mega-menu__button, .wp-block-eh-mega-menu:has(.wp-block-eh-mega-menu__link)) {
		gap: var(--wp--preset--spacing--10);
	}

	/* When link and click */
	.wp-block-eh-mega-menu > .wp-block-eh-mega-menu__link + .wp-block-navigation-submenu__toggle {
		position: relative;
		inset: auto;
	}

	.wp-block-eh-mega-menu > .wp-block-eh-mega-menu__link + .wp-block-navigation-submenu__toggle::before  {
		position: relative;
		inset: auto;
		translate: unset;
	}

	:root .wp-block-eh-mega-menu:is(.wp-block-navigation-item) {
		position: static;
	}

	.wp-block-eh-mega-menu .wp-block-navigation__submenu-container {
		position: absolute;
		inset-inline-start: 0 !important;
		block-size: 0;
		inline-size: 100vw !important;
		margin: 0 calc(50% - 50vw);
		background-color: var(--wp--preset--color--accent-3) !important;
		z-index: 2;
	}

	/* Scroll dropdown contents on short screens */
	.wp-block-eh-mega-menu.has-child .wp-block-navigation-submenu__toggle[aria-expanded='true'] ~ .wp-block-navigation__submenu-container > *,
	.wp-block-eh-mega-menu.has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container > *,
	.wp-block-eh-mega-menu.has-child:not(.open-on-click, .open-on-hover-click):focus-within > .wp-block-navigation__submenu-container  > * {
		max-block-size: calc(100vh - var(--wp--custom--head--dimensions--height));
		overflow-y: auto;
	}

	/* Utility nav dropdowns */
	.wcs-part-head__top .wp-block-eh-mega-menu.has-child .wp-block-navigation-submenu__toggle[aria-expanded='true'] ~ .wp-block-navigation__submenu-container > *,
	.wcs-part-head__top .wp-block-eh-mega-menu.has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container > *,
	.wcs-part-head__top .wp-block-eh-mega-menu.has-child:not(.open-on-click, .open-on-hover-click):focus-within > .wp-block-navigation__submenu-container  > * {
		max-block-size: calc(100vh - var(--wp--custom--head--dimensions--top-height));
	}

	.wp-block-eh-mega-menu .wp-block-navigation__submenu-container::before {
		display: block;
		position: absolute;
		inset-block-start: 0;
		inset-inline-start: 0;
		block-size: 100%;
		inline-size: 100vw;
		max-inline-size: none;
		margin-inline: calc(-50vw + 50%);
		background-color: inherit !important;
		content: '';
		z-index: -1;
	}

	/* Editor */
	.wp-block-eh-mega-menu.block-editor-block-list__block .wp-block-navigation__submenu-container {
		margin: 0;
		padding-inline: var(--wp--preset--spacing--60);
	}

	.wp-block-eh-mega-menu .wp-block-navigation__submenu-container > * {
		max-inline-size: var(--wp--custom--width--full) !important;
		margin-inline: auto;
		padding-block: var(--wp--preset--spacing--90) var(--wp--preset--spacing--120) !important;
		padding-inline: var(--wp--style--root--padding-left) var(--wp--style--root--padding-right);
	}


	.wp-block-eh-mega-menu .wp-block-navigation__submenu-container > .wp-block-group,
	.wp-block-eh-mega-menu .wp-block-navigation__submenu-container > .wp-block-group > .wp-block-columns {
		inline-size: 100%;
		max-inline-size: none;
	}

	.wp-block-eh-mega-menu .wp-block-navigation__submenu-container > .wp-block-group {
		padding-block: var(--wp--preset--spacing--60);
	}
}

.wp-block-eh-mega-menu .wp-block-columns {
	row-gap: var(--wp--preset--spacing--30);
}

/* Callout */
.wcs-mega-callout .wp-block-button.is-style-plain a.wp-block-button__link {
	--button--color--text: var(--wp--preset--color--base);
	--button--color--text-hover: var(--wp--preset--color--base);
}

@media (width < 1200px) {
	.wp-block-eh-mega-menu__title.wp-block-heading {
		display: none !important;
	}

	.wp-block-eh-mega-menu:has(> [aria-expanded='true']) :is(.wp-block-eh-mega-menu__link, .wp-block-eh-mega-menu__button) {
		background-color: var(--wp--preset--color--accent-1);
	}

	.wp-block-eh-mega-menu:has(> [aria-expanded='true']) :is(.wp-block-eh-mega-menu__link, .wp-block-eh-mega-menu__button, .wp-block-navigation__submenu-icon) {
		--head--color--text: var(--wp--preset--color--base);
		--head--transition: none;
	}

	.wp-block-eh-mega-menu .wp-block-navigation__submenu-container {
		inline-size: 100% !important;
		padding: 0 !important;
	}

	.wp-block-eh-mega-menu .wp-block-navigation__submenu-container > * {
		padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--30) var(--wp--preset--spacing--30) !important;
	}

	.wp-block-eh-mega-menu__panel .wp-block-columns {
		flex-direction: column;
	}

	.wp-block-eh-mega-menu__panel .wp-block-columns .wp-block-column {
		flex-basis: 100%;
		max-inline-size: 100%;
	}

	/* Callout */
	.wcs-mega-callout {
		padding-block-start: var(--wp--preset--spacing--20);
	}

	/* Kicker heading */
	.wcs-mega-callout .wp-block-heading.is-style-ornamental {
		margin-block-end: var(--wp--preset--spacing--20);
	}

	.wcs-mega-callout .wp-block-heading.has-medium-font-size {
		font-size: var(--wp--preset--font-size--small) !important;
		line-height: 1.3;
	}

	/* Image */
	.wcs-mega-callout:not(.block-editor-block-list__block) :is(.wp-block-image) {
		display: none;
	}
}
