/**
 * core/navigation - Main
 */


/* Main nav */
.ibew-nav-main {
	--navigation-layout-justification-setting: stretch;
	--navigation-layout-direction: column;
	--navigation-layout-wrap: nowrap;
	--navigation-layout-justify: flex-start;
	--navigation-layout-align: center;
	--navigation--button--color: var(--wp--preset--color--base);
	--navigation--button--color-active: var(--wp--preset--color--accent-2);
	--navigation--icon--size: 14px;
	--navigation--icon--color: var(--wp--preset--color--base);
	--navigation--icon--color-active: var(--wp--preset--color--accent-2);
	--navigation--toggle--size: 40px;
}

/* Submenu toggle */
.ibew-nav-main .wp-block-navigation-submenu__toggle {
	transition: var(--wp--custom--transition--hover);
}

/* Submenu icon */
.ibew-nav-main .wp-block-navigation__submenu-icon,
.ibew-nav-main .wp-block-navigation__submenu-icon svg {
	block-size: var(--navigation--icon--size);
	inline-size: var(--navigation--icon--size);
	margin: 0;
	transition: rotate 0.33s ease-in-out, color 0.25s ease-in-out;
}

.ibew-nav-main .is-menu-open .wp-block-navigation__submenu-icon {
	display: block;
	position: absolute;
	inset-block-start: 20px;
	inset-inline-end: 0;
	color: var(--navigation--icon--color);
}

/* When preceded by a link */
.ibew-nav-main .open-on-hover-click .wp-block-navigation__submenu-icon.wp-block-navigation-submenu__toggle {
	inset-block-start: 0;
	block-size: var(--navigation--toggle--size);
	inline-size: var(--navigation--toggle--size);
}

.ibew-nav-main .wp-block-navigation-submenu__toggle[aria-expanded='true'],
.ibew-nav-main .wp-block-navigation-submenu__toggle[aria-expanded='true'] + .wp-block-navigation__submenu-icon,
.ibew-nav-main .open-on-hover-click .wp-block-navigation-submenu__toggle:is(:hover, :focus) {
	color: var(--navigation--icon--color-active);
}

.ibew-nav-main .wp-block-navigation-submenu__toggle[aria-expanded='true'] svg,
.ibew-nav-main .wp-block-navigation-submenu__toggle[aria-expanded='true'] + .wp-block-navigation__submenu-icon svg {
	rotate: 180deg;
}

/* Nav links and buttons */
.ibew-nav-main .wp-block-navigation-item__content {
	color: var(--navigation--button--color);
	text-decoration: none;
}

/* Submenu items */
.ibew-nav-main .wp-block-navigation-submenu .wp-block-navigation-item {
	text-transform: none;
}

/* Text link hover states */
.ibew-nav-main .wp-block-navigation-item__content:hover,
.ibew-nav-main .wp-block-navigation-submenu__toggle:hover + .wp-block-navigation__submenu-icon,
.ibew-nav-main .wp-block-navigation-item__content.open-on-click:hover + .wp-block-navigation__submenu-icon {
	color: var(--navigation--button--color-active);
}

/* Reduce width content when it contains a link */
.ibew-nav-main .is-menu-open .wp-block-navigation-item.open-on-hover-click .wp-block-navigation-item__content {
	inline-size: calc(100% - var(--navigation--toggle--size) - var(--wp--preset--spacing--10));
}

/* Mobile only */
.ibew-nav-main .wp-block-navigation__responsive-container.is-menu-open {
	overflow: visible;
}

/* Mobile only buttons */
.ibew-nav-main :is(.wp-block-navigation__responsive-container-close, .wp-block-navigation__responsive-container-open),
.ibew-part-head__nav .wp-block-buttons .wp-block-button__link {

	/* padding-block: clamp(1.375rem, -957.6875rem + 1500vw, 2.3125rem); */
	padding-block: clamp(1.375rem, -1132.0625rem + 1500vw, 2.3125rem);
	border-radius: var(--wp--preset--spacing--10) !important;
	line-height: 1;
}

/* Mobile open/close buttons */
.ibew-nav-main :is(.wp-block-navigation__responsive-container-close, .wp-block-navigation__responsive-container-open) {
	justify-content: center;
	inline-size: 66px;
	background-color: var(--menu-button--color-background, var(--wp--preset--color--accent-2));
	color: var(--menu-button--color-text, var(--wp--preset--color--accent-4));
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.075ch !important;
	text-align: center;
}

/* Close button */
.ibew-nav-main .wp-block-navigation__responsive-container-close {
	--menu-button--color-background: var(--wp--preset--color--accent-4);
	--menu-button--color-text: var(--wp--preset--color--base);

	position: relative;
	inset-block-start: auto;
	inset-inline-end: auto;
	margin-inline: auto var(--wp--preset--spacing--10);
}

.ibew-nav-main .is-menu-open .wp-block-navigation__responsive-container-close {
	display: block;
}

/* Inner wrapper */
.ibew-nav-main .wp-block-navigation__responsive-dialog {
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
}

/* Mobile nav modal */
.ibew-nav-main .wp-block-navigation__responsive-container.has-modal-open.is-menu-open {
	background-color: transparent;
}


.ibew-nav-main .is-menu-open .wp-block-navigation__responsive-container-content {
	max-block-size: calc(100dvh - 72px - 16px - var(--wp-admin--admin-bar--height, 0px));
	translate: 0 var(--wp--preset--spacing--10);
	background-color: var(--wp--preset--color--accent-3);
	border-radius: var(--wp--preset--spacing--10);
	overflow: auto;
}

.ibew-nav-main .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	margin-block-start: 8px;
	padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--30);
}


/* Nav & submenu */
.ibew-nav-main .wp-block-navigation__container {
	inline-size: 100%;
}


.ibew-nav-main .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content :is(.wp-block-navigation__container,.wp-block-navigation__submenu-container) {
	gap: 0;
}


/* Top level nav */
.ibew-nav-main .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item + .wp-block-navigation-item {
	border-block-start: 1px solid var(--wp--preset--color--accent-4);
}


/* Submenu */
.ibew-nav-main .has-child .wp-block-navigation__submenu-container.wp-block-navigation-submenu {
	display: none;
	background: transparent;
}

.ibew-nav-main .has-child [aria-expanded='true'] ~ .wp-block-navigation__submenu-container.wp-block-navigation-submenu {
	display: flex;
}

.ibew-nav-main .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content :is(.wp-block-navigation__submenu-container, .has-child .wp-block-navigation__submenu-container) {
	padding: 0 0 var(--wp--preset--spacing--10) 0;
}

.ibew-nav-main .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content.wp-block-navigation-submenu__toggle {
	padding-block: var(--wp--preset--spacing--20);
}

.ibew-nav-main .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
	padding-block: 10px;
	line-height: 1.3;
}

.ibew-nav-main .wp-block-navigation__submenu-container.wp-block-navigation-submenu > .wp-block-navigation-item:first-child .wp-block-navigation-item__content {
	padding-block-start: 4px;
}

@media (width >= 1024px) {
	.ibew-nav-main .wp-block-navigation__responsive-dialog {
		padding-inline: var(--wp--style--root--padding-left);;
	}
}

/* Nav width */
@media (width >= 1210px) {

	/* Main nav */
	.ibew-nav-main {
		--navigation-layout-direction: row;
		--navigation--icon--size: 14px;
		--navigation--toggle--size: auto;

		flex: 1 0 auto;
		gap: 0;
	}

	.ibew-nav-main .open-on-hover-click .wp-block-navigation__submenu-icon.wp-block-navigation-submenu__toggle {
		margin-inline-start: 5px;
	}

	ul.ibew-nav-main > li {
		position: relative;
		block-size: calc(100% - var(--wp--preset--spacing--40));
		padding-inline: var(--wp--preset--spacing--30);
	}

	ul.ibew-nav-main > li > .wp-block-navigation-item__content {
		display: flex;
		align-items: center;
		block-size: 100%;
	}

	ul.ibew-nav-main > li + li {
		border-inline-start: 1px solid var(--wp--preset--color--accent-4);
	}

	/* Bottom border */
	ul.ibew-nav-main > li::before {
		--border--size: 4px;

		display: block;
		position: absolute;
		inset-block-start: calc(100% - var(--border--size));
		inset-inline-start: 50%;
		block-size: calc(var(--border--size) + var(--wp--preset--spacing--20));
		inline-size: 100%;
		scale: 0 1;
		translate: -50% 0;
		transform-origin: center;
		background-color: transparent;
		border-block-end: var(--border--size) solid var(--wp--preset--color--accent-2);
		content: '';
		transition: scale 0.33s ease-in-out;
	}

	ul.ibew-nav-main > li:hover::before,
	ul.ibew-nav-main > li:has([aria-expanded='true'])::before {
		scale: 1 1;
	}

	/* Top level nav */
	.ibew-nav-main .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item + .wp-block-navigation-item {
		border-block-start: 0;
	}

	/* Submenu container */
	.ibew-nav-main .has-child .wp-block-navigation__submenu-container.wp-block-navigation-submenu {
		display: flex;
		padding-block: 0;
	}

	.ibew-nav-main :is(.wp-block-navigation__responsive-container, .wp-block-navigation__responsive-close, .wp-block-navigation__responsive-dialog, .wp-block-navigation__responsive-container-content, ul.ibew-nav-main) {
		block-size: 100%;
	}

	.ibew-nav-main .wp-block-navigation__responsive-dialog {
		padding: 0;
	}

	ul.ibew-nav-main:not(.has-background) .wp-block-navigation__submenu-container {
		translate: 0 -24px;
		opacity: 0;
		visibility: hidden;
	}

	/* Cover to bridge open gap */
	.ibew-nav-main .has-child:hover .wp-block-navigation__submenu-container::before,
	.ibew-nav-main .has-child .wp-block-navigation-submenu__toggle[aria-expanded='true'] ~ .wp-block-navigation__submenu-container::before {
		display: block;
		position: absolute;
		inset-block-start: -20px;
		inset-inline-start: 0;
		block-size: 20px;
		inline-size: 100%;
		background-color: transparent;
		content: '';
	}

	.ibew-nav-main .has-child .wp-block-navigation-submenu__toggle[aria-expanded='true'] ~ .wp-block-navigation__submenu-container,
	.ibew-nav-main .has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container,
	.ibew-nav-main .has-child:not(.open-on-click, .open-on-hover-click):focus-within > .wp-block-navigation__submenu-container {
		inset-block-start: calc(100% + var(--wp--preset--spacing--10) + var(--wp--preset--spacing--20));
		inline-size: 100%;
		min-inline-size: 250px;
		padding-block: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20);
		translate: 0;
		background-color: var(--wp--preset--color--accent-3);
		border-radius: var(--wp--preset--spacing--10);
		opacity: 1;
		visibility: visible;
		transition: opacity 0.25s ease-out 0.25s, translate 0.25s ease-out 0.25s, visibility 0s ease;
	}


	.ibew-nav-main .wp-block-navigation__submenu-container .wp-block-navigation-item a:not(.wp-element-button),
	.ibew-nav-main .wp-block-navigation__submenu-container .wp-block-pages-list__item button.wp-block-navigation-item__content
	.ibew-nav-main .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button),
	.ibew-nav-main .wp-block-navigation__submenu-container .wp-block-navigation-submenu button.wp-block-navigation-item__content {
		padding: 10px var(--wp--preset--spacing--40);
		line-height: 1.3;
	}

	/* Submenu toggle icon */
	.ibew-nav-main .wp-block-navigation-item.open-on-click .wp-block-navigation-submenu__toggle {
		padding-inline-end: calc(var(--navigation--icon--size) + 5px);
	}

	.ibew-nav-main .open-on-click .wp-block-navigation-submenu__toggle+.wp-block-navigation__submenu-icon {
		margin-inline-start: calc(var(--navigation--icon--size) * -1);
	}
}

/** Override WordPress mobile navigation breakpoint */
@media (width >= 601px) and (width < 1210px) {
	.ibew-nav-main .wp-block-navigation__responsive-container {
		display: none;
	}

	.ibew-nav-main .wp-block-navigation__responsive-container-open:not(.always-shown),
	.ibew-nav-main .wp-block-navigation__responsive-container.has-modal-open {
		display: flex;
	}
}

/* Small mobile */
@media (width < 375px) {

	/* Close button */
	.ibew-nav-main :is(.wp-block-navigation__responsive-container-close) {
		margin-inline-end: calc(var(--wp--preset--spacing--10) * -1);
	}
}

/* Override default transition */
@keyframes overlay-menu__fade-in-animation {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}


