/**
 * Take Effect — mobile navigation overlay (block Navigation, overlay mode).
 * Left-aligns list items and adds subtle separators; desktop horizontal bar unchanged.
 */

.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	--navigation-layout-align: flex-start;
	/*
	 * Theme root padding can be 0 — keep menu content off the viewport edges.
	 * Bottom: leave room for fixed bottom UI (e.g. floating contact FAB ~3.5rem + margins).
	 */
	padding-left: max(1.25rem, env(safe-area-inset-left, 0px)) !important;
	padding-right: max(1.25rem, env(safe-area-inset-right, 0px)) !important;
	padding-bottom: max(
		6.75rem,
		calc(env(safe-area-inset-bottom, 0px) + 5.5rem)
	) !important;
}

/*
 * The inner list re-applies right justification: it often has both
 * .wp-block-navigation__container and .items-justified-right (same as <nav>),
 * which sets --navigation-layout-justification-setting back to flex-end and
 * keeps link rows hugging the right edge. Reset inside the overlay only.
 */
.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation.items-justified-right,
.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation.items-justified-center,
.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation.items-justified-space-between {
	--navigation-layout-justification-setting: flex-start !important;
	--navigation-layout-justify: flex-start !important;
	--navigation-layout-align: flex-start !important;
}

.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation__responsive-container-content {
	align-items: flex-start !important;
	width: 100%;
	max-width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation__responsive-container-content
	.wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation__responsive-container-content
	.wp-block-page-list {
	justify-content: flex-start !important;
	align-items: stretch !important;
	width: 100%;
	max-width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation__container
	> .wp-block-navigation-item {
	width: 100%;
	box-sizing: border-box;
	align-items: flex-start !important;
	justify-content: flex-start;
	padding-block: 0.5rem;
	border-bottom: 1px solid rgba(26, 26, 26, 0.1);
	border-bottom: 1px solid color-mix(
		in srgb,
		var(--wp--preset--color--custom-tet-26-deep-neutral, #1a1a1a) 20%,
		transparent
	);
}

.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation__container
	> .wp-block-navigation-item:last-child {
	border-bottom: none;
}

.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation__container
	> .wp-block-navigation-item
	> .wp-block-navigation-item__content {
	padding-top: 0.35rem;
	padding-bottom: 0.35rem;
	text-align: start;
}

.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation-item__label {
	text-align: start;
}

.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay)
	.wp-block-navigation__container
	> .wp-block-navigation-item
	.wp-block-navigation__submenu-container {
	width: 100%;
	flex-basis: 100%;
}
