/**
 * Header-only corrections for the 0.1.24 work branch.
 *
 * This late cascade layer keeps the native WordPress Navigation block and its
 * dialog/focus handling. It only fixes the visual controls, mobile submenu
 * geometry and the Documents card language.
 */

@media (max-width: 79.99rem) {
	/* A submenu label and its chevron share one explicit grid row. Long labels
	 * may wrap by whole words in column one; the fixed control can never become
	 * a separate flex line beneath them. */
	.et-primary-nav .wp-block-navigation__responsive-container.is-menu-open
		li.wp-block-navigation-submenu {
		align-items: center !important;
		display: grid !important;
		grid-template-columns: fit-content(calc(100% - 2.75rem)) 2.75rem minmax(0, 1fr);
		grid-template-rows: auto auto;
		justify-content: stretch !important;
		width: 100%;
	}

	.et-primary-nav .wp-block-navigation__responsive-container.is-menu-open
		li.wp-block-navigation-submenu
		> .wp-block-navigation-item__content {
		grid-column: 1;
		grid-row: 1;
		max-width: 100%;
		min-width: 0;
		padding-inline-end: 0.25rem !important;
		width: auto !important;
	}

	.et-primary-nav .wp-block-navigation__responsive-container.is-menu-open
		li.wp-block-navigation-submenu
		> button.wp-block-navigation__submenu-icon {
		align-self: stretch;
		grid-column: 2;
		grid-row: 1;
		inset: auto !important;
		justify-self: stretch;
		margin: 0 !important;
		min-height: 2.75rem;
		min-width: 2.75rem;
		position: relative !important;
		width: 2.75rem;
	}

	.et-primary-nav .wp-block-navigation__responsive-container.is-menu-open
		li.wp-block-navigation-submenu
		> ul.wp-block-navigation__submenu-container {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	/* Use one visible, high-contrast control language instead of depending on
	 * WordPress' theme-sensitive SVG strokes. The underlying SVG remains in the
	 * accessible button but is visually replaced by deterministic CSS marks. */
	.et-primary-nav :is(
		.wp-block-navigation__responsive-container-open,
		.wp-block-navigation__responsive-container-close
	) {
		align-items: center !important;
		background: var(--wp--preset--color--document-white) !important;
		border: 1px solid rgba(10, 35, 66, 0.2) !important;
		border-radius: 0.55rem !important;
		box-shadow: 0 0.2rem 0.65rem rgba(10, 35, 66, 0.07);
		color: var(--wp--preset--color--transit-navy) !important;
		display: inline-grid !important;
		height: var(--et-mobile-nav-control-height, 2.75rem) !important;
		justify-content: center !important;
		min-height: 2.75rem;
		min-width: 2.75rem;
		overflow: visible;
		padding: 0 !important;
		place-items: center;
		width: var(--et-mobile-nav-control-width, 2.75rem) !important;
	}

	.et-primary-nav :is(
		.wp-block-navigation__responsive-container-open,
		.wp-block-navigation__responsive-container-close
	) > svg {
		height: 1.4rem !important;
		opacity: 0 !important;
		position: absolute;
		width: 1.4rem !important;
	}

	.et-primary-nav .wp-block-navigation__responsive-container-open {
		position: relative;
	}

	.et-primary-nav .wp-block-navigation__responsive-container-open::before {
		background: currentColor;
		border-radius: 999px;
		box-shadow: 0 -0.42rem currentColor, 0 0.42rem currentColor;
		content: "";
		height: 2px;
		width: 1.35rem;
	}

	/* mega-menu.js records the opener's viewport rectangle immediately before
	 * the native dialog opens. Fixed positioning therefore puts the close mark
	 * exactly over the former burger at every width and scroll position. */
	.et-primary-nav .wp-block-navigation__responsive-container.is-menu-open
		.wp-block-navigation__responsive-container-close {
		inset: var(--et-mobile-nav-control-top, 0.875rem)
			var(--et-mobile-nav-control-right, clamp(1rem, 2.5vw, 3rem))
			auto auto !important;
		position: fixed !important;
		z-index: 1202;
	}

	.et-primary-nav .wp-block-navigation__responsive-container-close::before,
	.et-primary-nav .wp-block-navigation__responsive-container-close::after {
		background: currentColor;
		border-radius: 999px;
		content: "";
		height: 2px;
		left: 50%;
		position: absolute;
		top: 50%;
		width: 1.35rem;
	}

	.et-primary-nav .wp-block-navigation__responsive-container-close::before {
		transform: translate(-50%, -50%) rotate(45deg);
	}

	.et-primary-nav .wp-block-navigation__responsive-container-close::after {
		transform: translate(-50%, -50%) rotate(-45deg);
	}

	/* Documents uses the same card dimensions, border, soft colour field and
	 * focus behaviour as service links, but intentionally has no icon column or
	 * nested visual subgroup. */
	.et-primary-nav .wp-block-navigation__responsive-container.is-menu-open
		li.et-documents-menu
		> ul.wp-block-navigation__submenu-container {
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		gap: 0.4rem !important;
		padding: 0.25rem 0 0.65rem clamp(0.35rem, 2.5vw, 0.75rem) !important;
	}

	.et-primary-nav .wp-block-navigation__responsive-container.is-menu-open
		li.et-documents-menu
		> ul.wp-block-navigation__submenu-container
		> li {
		display: block !important;
		width: 100%;
	}

	.et-primary-nav .wp-block-navigation__responsive-container.is-menu-open
		li.et-documents-menu
		> ul.wp-block-navigation__submenu-container
		> li
		> a {
		align-items: center;
		background: linear-gradient(90deg, rgba(0, 156, 166, 0.08), rgba(255, 255, 255, 0.94)) !important;
		border: 1px solid rgba(10, 35, 66, 0.11) !important;
		border-radius: 0.65rem !important;
		color: var(--wp--preset--color--transit-navy) !important;
		display: flex !important;
		font-weight: 650;
		line-height: 1.28;
		margin: 0 !important;
		min-height: 2.75rem !important;
		padding: 0.45rem 0.6rem !important;
		text-transform: none !important;
		width: 100%;
	}
}

@media (min-width: 80rem) {
	.et-primary-nav li.et-documents-menu
		> ul.wp-block-navigation__submenu-container {
		background: var(--wp--preset--color--document-white) !important;
		border: 1px solid rgba(10, 35, 66, 0.14) !important;
		border-radius: 0.75rem !important;
		box-shadow: 0 1rem 2.5rem rgba(10, 35, 66, 0.16) !important;
		display: grid;
		gap: 0.22rem !important;
		min-width: 21rem !important;
		overflow: hidden !important;
		padding: 0.5rem !important;
		width: 21rem !important;
	}

	.et-primary-nav li.et-documents-menu
		> ul.wp-block-navigation__submenu-container
		> li
		> a {
		align-items: center;
		background: linear-gradient(90deg, rgba(0, 156, 166, 0.1), rgba(255, 255, 255, 0.9)) !important;
		border: 1px solid rgba(10, 35, 66, 0.11) !important;
		border-radius: 0.52rem !important;
		color: var(--wp--preset--color--transit-navy) !important;
		display: flex !important;
		font-size: 0.86rem !important;
		font-weight: 650;
		line-height: 1.15 !important;
		margin: 0 !important;
		min-height: 2.75rem !important;
		padding: 0.5rem 0.65rem !important;
		text-transform: none !important;
		transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
		width: 100%;
	}

	.et-primary-nav li.et-documents-menu
		> ul.wp-block-navigation__submenu-container
		> li
		> a:is(:hover, :focus-visible) {
		background: linear-gradient(90deg, rgba(0, 156, 166, 0.1), rgba(255, 255, 255, 0.9)) !important;
		border-color: rgba(0, 156, 166, 0.48) !important;
		box-shadow: 0 0.4rem 1rem rgba(10, 35, 66, 0.08) !important;
		color: var(--wp--preset--color--transit-navy) !important;
	}
}

@media (hover: hover) and (pointer: fine) and (max-width: 79.99rem) {
	.et-primary-nav .wp-block-navigation__responsive-container.is-menu-open
		li.et-documents-menu
		> ul.wp-block-navigation__submenu-container
		> li
		> a:is(:hover, :focus-visible) {
		border-color: rgba(0, 156, 166, 0.48) !important;
		box-shadow: 0 0.4rem 1rem rgba(10, 35, 66, 0.08) !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.et-primary-nav li.et-documents-menu
		> ul.wp-block-navigation__submenu-container
		> li
		> a {
		transition: none !important;
	}
}