header.wp-block-template-part {
	& .wp-block-navigation__container {
		row-gap: 0;
	}
}

@media screen and (min-width: 600px) {
	header.wp-block-template-part .wp-block-navigation.is-responsive .wp-block-navigation__submenu-container {
		min-width: 280px !important;
		box-shadow: var( --wp--preset--shadow--deep );
	}
}

html:not(.has-modal-open) header.wp-block-template-part .wp-block-navigation__container > .wp-block-navigation-item {
	display: grid;
	grid-template-areas: "link";

	&.has-child > .wp-block-navigation-item__content {
		margin-right: 1em;
	}

	& > .wp-block-navigation-item__content {
		grid-area: link;
		padding: var( --wp--preset--spacing--20 );
		border-top: 2px solid transparent;
		border-bottom: 2px solid transparent;
	}

	& > .wp-block-navigation-submenu__toggle {
		grid-area: link;
		align-self: center;
        justify-self: right;
		margin-right: 0.5em;
	}

	&:active,
	&:focus,
	&:hover {
		& > .wp-block-navigation-item__content {
			border-bottom: 2px solid var( --wp--preset--color--white );
		}
	}
}

html.has-modal-open header.wp-block-template-part .wp-block-navigation.is-responsive {
	justify-content: space-between;

	& .items-justified-right {
		--navigation-layout-justification-setting: flex-start;
		--navigation-layout-justify: flex-start;
	}

	& .wp-block-navigation__container {
		width: 100%;
	}

	& .wp-block-navigation-item,
	& .wp-block-navigation-item__content {
		width: 100%;
	}

	& .wp-block-navigation__responsive-container {
		padding-left: var( --wp--style--root--padding-left );
		padding-right: var( --wp--style--root--padding-right );
	}

	& .wp-block-navigation__responsive-container-content {
		align-items: flex-start;
	}

	& .wp-block-navigation__submenu-container {
		width: 100%;
		box-sizing: border-box;
		border-left: 2px solid var( --wp--preset--color--custom-highlight );
		padding-top: 0;
		margin-top: var( --wp--style--block-gap );
		row-gap: var( --wp--preset--spacing--20 )
	}
}