html.has-modal-open {
	#wpadminbar {
		display: none;
	}
}

/* Reset breakpoint for navigation block */
@media screen and (min-width: 600px) and (max-width: 1000px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: block;
	}

	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

header {
	.site-search__icon {
		transform: scale(1.2);
	}
	.wp-block-navigation__responsive-container-open {
		transform: scale(1.3);
	}
}

.wp-block-navigation__responsive-container {
	--wp--style--root--padding-top: var(--wp--preset--spacing--10);
	--wp--style--root--padding-bottom: var(--wp--preset--spacing--10);
}

/* Desktop Navigation
--------------------------------------------- */
.wp-block-navigation__responsive-container:not(.is-menu-open.has-modal-open), 
.wp-block-navigation > .wp-block-navigation__container {


	--breakpoint-scale: 1.15vw;

	/** Gloabl sub-menus */
	.wp-block-navigation-submenu {
		border: none;

		.wp-block-navigation__submenu-icon {
			--dropdown--icon--size: 1em;
			height: var(--dropdown--icon--size) !important;
			width: var(--dropdown--icon--size) !important;
			position: relative;
			top: -2px;

			svg {
				color: var(--wp--preset--color--contrast);
				fill: currentColor;
			}
		}
	}

	/** Global menu item */
	.wp-block-navigation-item__content {
		padding-top: calc(var(--wp--custom--spacing--block-gap--default) / 2);
		padding-bottom: calc(var(--wp--custom--spacing--block-gap--default) / 2);
		padding-left: 0.5rem;
		padding-right: 0.5rem;
		transition: var(--wp--custom--transition--default);

		&[href="#"] {
			&:focus, &:hover {
				text-decoration: none;
				cursor: default;
			}
		}
	}

	.wp-block-navigation__responsive-container-content>.wp-block-navigation__container {
		gap: var(--wp--custom--spacing--block-gap--default) !important;
	}

	.wp-block-navigation__responsive-container-content>.wp-block-navigation__container>li.wp-block-navigation-item {
		&:hover, &:focus {
			> .wp-block-navigation-item__content {
				color: var(--wp--preset--color--accent);
			}
		}
	}

	/** Top level menu item */
	.wp-block-navigation__responsive-container-content>.wp-block-navigation__container>li.wp-block-navigation-item.has-child>.wp-block-navigation-item__content {
		padding-top: var(--wp--preset--spacing--31);
		padding-bottom: var(--wp--preset--spacing--31);

		+.wp-block-navigation__submenu-icon {
			margin-left: 0;
		}
	}

	/** First level sub-menu */
	.wp-block-navigation__responsive-container-content>.wp-block-navigation__container>li.wp-block-navigation-item.has-child>.wp-block-navigation-submenu {
		position: fixed;
		left: 50%;
		right: 0;
		top: calc(var(--navbar-size) - 2px);
		flex-direction: row;
		max-width: calc(var(--wp--style--global--content-size) - var(--wp--style--root--padding-right) - var(--wp--style--root--padding-left) - 1rem);
		width: 100%;
		transform: translateX(-50%);
		z-index: 99999;
		padding: var(--wp--style--root--padding-top) var(--wp--style--root--padding-right);
		gap: calc(var(--wp--custom--spacing--block-gap--default) * 2);
		display: flex;
		grid-template-columns: repeat(4, 1fr);
		justify-content: end;

		&::after {
			content: '';
			position: absolute;
			top: 0;
			left: -50vw;
			width: 150vw;
			height: 100%;
			background: var(--wp--preset--color--black);
			opacity: 0.9;
			z-index: -1;
		}

		&, .wp-block-navigation__submenu-container, .wp-block-navigation-submenu {
			background-color: transparent !important;
		}

		/** First level sub-menu item */
		.wp-block-navigation-item {
			display: block;
			min-width: unset !important;
			
			>.wp-block-navigation__submenu-icon {
				display: none;
			}
			
			>.wp-block-navigation-item__content {
				font-weight: 500;
				font-size: var(--wp--preset--font-size--10);
			}

			/** Global sub-sub menus */
			.wp-block-navigation-submenu {
				opacity: 1;
				overflow: visible;
				visibility: visible;
				position: unset;
				height: auto;
				width: auto;
				min-width: unset !important;

				/** Sub-menu links */
				.wp-block-navigation-item__content {
					font-size: var(--wp--preset--font-size--08);
					min-width: unset;
				}

				ul.wp-block-navigation-submenu {
					margin-left: calc(var(--wp--custom--spacing--block-gap--default));
				}
			}
		}
	}

}

/* Desktop Scroll Navigation
--------------------------------------------- */ 

.wp-block-navigation.no-wrap:has( > .wp-block-navigation__container ) { @media screen and (max-width: 952px) {
		overflow-x:auto;
		.wp-block-navigation-item {
			white-space: nowrap;
			flex-shrink: 0;
		}
		.wp-block-navigation__submenu-container {
			display: none;
		}
} }

/* Mobile Navigation
--------------------------------------------- */
@media screen and (max-width: 1000px) {
	.wp-block-site-logo {
		width: 185px;
	}
}

.wp-block-navigation__responsive-container.is-menu-open.has-modal-open {
	overflow: visible;

	.wp-block-navigation__responsive-container-close {
		padding: 0.75rem;
		top: 10px;
		border-radius: var(--wp--custom--elements--button--border--radius);
		border-width: var(--wp--custom--elements--button--border--width);
		border-color: var(--wp--custom--elements--button--border--color);
		border-style: var(--wp--custom--elements--button--border--style);
		svg {
			color: inherit;
			fill: currentColor;
		}
		&:not(:hover, :focus) {
			background-color: var(--wp--custom--elements--button--color--background);
			color: var(--wp--custom--elements--button--color--text);
		}
		&:hover, &:focus {
			background-color: var(--wp--custom--elements--button--hover--color--background);
			color: var(--wp--custom--elements--button--hover--color--text);
		}
	}
	
	.wp-block-navigation__responsive-dialog {
		margin-top: 0;
		max-width: var(--wp--style--global--content-size);
		margin: 0px auto;
	}

	.wp-block-navigation__responsive-container-content {
		overflow-y: auto;
		max-height: calc(100vh - 2.5rem);
	}

	.wp-block-separator {
		width: 100%;
	}

	/** Style all navigation items */
	.wp-block-navigation {
		--dropdown--icon--size: 0.5rem;
		--navigation-layout-justification-setting: flex-start;
		width: 100%;
		gap: 0 !important;
		--local--padding-right: 0.5rem;
		--local--padding-top: var(--wp--preset--spacing--10);

		.wp-block-navigation-item {
			align-items: stretch;
			width: 100%;
		}
	}

	.wp-block-navigation-submenu {
		padding: 0 !important;
	}

	.wp-block-navigation-item__content {
		padding: var(--local--padding-top) var(--local--padding-right);
		&:hover, &:focus {
			background-color: var(--wp--preset--color--accent);
		}
	}

	/** Top level menu item */
	.wp-block-navigation__responsive-container-content>.wp-block-navigation__container>li.wp-block-navigation-item>.wp-block-navigation-item__content {
		
		&+.wp-block-navigation__submenu-icon {
			display: block;
			height: var(--dropdown--icon--size);
			width: var(--dropdown--icon--size);
			position: absolute;
			top: calc(var(--local--padding-top) + (var(--dropdown--icon--size) / 2) + 5px);
			right: var(--local--padding-right);
			z-index: 1;

			svg {
				color: var(--wp--preset--color--contrast);
				fill: currentColor;
			}

		}
		/** Hide sub-menus when toggle is closed */
		&[aria-expanded="false"]+.wp-block-navigation-submenu, &[aria-expanded="false"]+.wp-block-navigation__submenu-icon+.wp-block-navigation-submenu {
			display: none;
		}
	}

	/** First level sub-menu */
	.wp-block-navigation__responsive-container-content>.wp-block-navigation__container>li.wp-block-navigation-item.has-child>.wp-block-navigation-submenu {
		background-color: var(--wp--preset--color--neutral-lighter) !important;

		ul.wp-block-navigation-submenu {
			padding-left: var(--wp--style--root--padding-left) !important;
		}
	}
}