/* ─────────────────────────────────────────────────────────────
   CVRS Navigation Styles
   Applied to the native WordPress Navigation block
   ───────────────────────────────────────────────────────────── */

/* ── Site Header ── */
.site-header {
	position: sticky;
	top: 0;
	z-index: 999;
	background: #fff;
	transition: box-shadow 0.3s ease;
	align-items: center;
}

.site-header.scrolled {
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

/* ── Desktop Navigation Links ── */
.wp-block-navigation .wp-block-navigation-item__content {
	color: #03003c;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 0.875rem;
	letter-spacing: 0.02em;
	transition: color 0.3s ease;
}

.top-menu .wp-block-navigation .wp-block-navigation-item {
    margin-top: 10px;
	padding-bottom: 10px;
}
.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item__content:focus {
	color: #00508d;
}

/* Current / active menu item */
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item--active > .wp-block-navigation-item__content {
	color: #00508d;
}

/* ── Desktop Submenu Dropdowns ── */
.wp-block-navigation .has-child .wp-block-navigation__submenu-container {
	background: #F1F6FB;
	border: none;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
	padding: 0px 5px 10px 5px;
	box-sizing: border-box;
	min-width: 320px;
	margin-top: 0;
	white-space: nowrap;
	overflow: visible;
}

/* Arrow pointer at top of dropdown */
.wp-block-navigation .has-child .wp-block-navigation__submenu-container::before {
	content: '';
	position: absolute;
	top: -5px;
	left: 30px;
	width: 12px;
	height: 12px;
	background: #F1F6FB;
	transform: rotate(45deg);
	border-radius: 3px 0 0 0;
	box-shadow: -3px -3px 8px rgba(0, 0, 0, 0.08);
	z-index: 1;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item {
	border-bottom: 1px solid #E5E7EB;
	padding: 0;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item:last-child {
	border-bottom: none;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-weight: 500;
	text-transform: none;
	font-size: 0.9375rem;
	padding: 14px 28px;
	color: #03003c;
	display: block;
	margin: 0;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus {
	color: #00508d;
	background: #f5f8fc;
}

/* Submenu indicator arrow on desktop */
.wp-block-navigation .has-child > .wp-block-navigation-item__content .wp-block-navigation__submenu-icon {
	transition: transform 0.3s ease;
}

.wp-block-navigation .has-child:hover > .wp-block-navigation-item__content .wp-block-navigation__submenu-icon,
.wp-block-navigation .has-child > .wp-block-navigation-item__content[aria-expanded="true"] .wp-block-navigation__submenu-icon {
	transform: rotate(180deg);
}

/* ── CTA Button in Header ── */
.header-cta .wp-block-button__link {
	background-color: #03003c !important;
	color: #fff !important;
	border-radius: 100px !important;
	font-weight: 700;
	font-size: 14px;
	padding: 12px 28px;
	text-decoration: none;
	transition: background-color 0.3s ease, transform 0.2s ease;
	white-space: nowrap;
}

.header-cta .wp-block-button__link:hover,
.header-cta .wp-block-button__link:focus {
	background-color: #00508d !important;
	transform: translateY(-1px);
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE NAVIGATION
   Breakpoint: 1070px — matches hamburger visibility below
   ═══════════════════════════════════════════════════════════════ */

/* ── Show hamburger, hide inline nav ── */
@media (max-width: 1070px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}

	.wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open {
		display: flex !important;
	}
}

/* ── Hamburger Button Styling ── */
@media (max-width: 1070px) {
	.wp-block-navigation__responsive-container-open {
		background: #03003c !important;
		border: none !important;
		border-radius: 8px !important;
		width: 44px !important;
		height: 44px !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		cursor: pointer;
		transition: background-color 0.3s ease;
		padding: 0 !important;
	}

	.wp-block-navigation__responsive-container-open:hover,
	.wp-block-navigation__responsive-container-open:focus {
		background: #00508d !important;
		outline: 2px solid #00508d;
		outline-offset: 2px;
	}

	.wp-block-navigation .wp-block-navigation__responsive-container-open svg {
		width: 22px !important;
		height: 22px !important;
		fill: #fff !important;
	}
}

/* ── Mobile Overlay Panel ── */
@media (max-width: 1070px) {

	/* Hide CTA button on mobile — keep nav clean */
	.site-header .header-cta,
	.top-header .header-cta {
		display: none;
	}

	/* Overlay panel styling */
	.wp-block-navigation__responsive-container.is-menu-open {
		background: #fff !important;
		padding: 0 !important;
	}

	/* ── Close Button ── */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		position: absolute !important;
		top: 8px !important;
		right: 16px !important;
		z-index: 100000;
		background: #f0f0f0 !important;
		border: none !important;
		border-radius: 50% !important;
		width: 40px !important;
		height: 40px !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		cursor: pointer;
		transition: background-color 0.3s ease;
		padding: 0 !important;
	}

	/* Push overlay content below the WP admin bar when logged in */
	.admin-bar .wp-block-navigation__responsive-container.is-menu-open {
		padding-top: 46px !important;
	}

	.admin-bar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		top: 54px !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close:hover,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close:focus {
		background: #e0e0e0 !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
		width: 18px !important;
		height: 18px !important;
		stroke: #03003c !important;
		stroke-width: 2 !important;
	}

	/* ── Content Container ── */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		flex-direction: column;
		gap: 0;
		align-items: stretch;
		padding: 8px 20px 24px;
		overflow-y: auto;
		max-height: 100vh;
	}

	/* ── Nav Items ── */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
		border-bottom: 1px solid #e5e7eb;
		width: 100%;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:last-child {
		border-bottom: none;
	}

	/* Parent items with submenus: row layout so toggle sits beside the link */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.has-child {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.has-child > .wp-block-navigation-item__content {
		flex: 1 1 0;
	}

	/* Submenu container spans full width below the row */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.has-child > .wp-block-navigation__submenu-container {
		flex-basis: 100%;
	}

	/* Nav link styling in overlay */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		padding: 14px 0;
		font-size: 1.0625rem;
		font-weight: 700;
		color: #03003c !important;
		text-transform: none;
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		letter-spacing: 0;
	}

	/* Active / current page — subtle accent indicator */
	.wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item--active > .wp-block-navigation-item__content {
		color: #00508d !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .current-menu-item,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item--active {
		border-left: 3px solid #2987cf;
		padding-left: 12px;
	}

	/* ── Mobile Submenu Toggle Button (+/- icons) ── */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle {
		background: #03003c !important;
		border: none !important;
		border-radius: 50% !important;
		width: 36px !important;
		height: 36px !important;
		min-width: 36px !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		cursor: pointer;
		transition: background-color 0.3s ease;
		position: relative;
		margin-left: auto;
		margin-right: 4px;
		flex-shrink: 0;
		padding: 0 !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle:hover,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle:focus {
		background: #00508d !important;
		outline: 2px solid #00508d;
		outline-offset: 2px;
	}

	/* Hide default SVG arrow */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle svg {
		display: none !important;
	}

	/* Plus icon (default state) */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle::before,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle::after {
		content: '';
		position: absolute;
		background: #fff;
		transition: transform 0.3s ease;
	}

	/* Horizontal line */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle::before {
		width: 14px;
		height: 2px;
	}

	/* Vertical line (creates the +) */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle::after {
		width: 2px;
		height: 14px;
	}

	/* Minus icon (expanded state) — rotate vertical line to horizontal */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle[aria-expanded="true"]::after {
		transform: rotate(90deg);
	}

	/* ── Force submenu toggle buttons visible in mobile overlay ──
	   WP core hides .wp-block-navigation__submenu-icon in the overlay
	   for "open-on-hover-click" mode. Override to show our +/- buttons. */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-icon {
		display: flex !important;
	}

	/* ── Force submenus collapsed by default in mobile overlay ── */
	.wp-block-navigation__responsive-container.is-menu-open .has-child > .wp-block-navigation__submenu-container {
		display: none !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .has-child > .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
		display: block !important;
	}

	/* ── Reset desktop dropdown styles in mobile overlay ── */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
		background: transparent !important;
		box-shadow: none !important;
		border-radius: 0 !important;
		padding: 0 0 8px 16px !important;
		margin: 0 !important;
		position: static !important;
		min-width: 0 !important;
		white-space: normal !important;
		overflow: visible !important;
	}

	/* Hide the desktop arrow pointer in overlay */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container::before {
		display: none !important;
	}

	/* Mobile submenu items */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
		border-bottom: none;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		font-weight: 500 !important;
		font-size: 1rem !important;
		color: #525A6B !important;
		padding: 10px 0 !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
		color: #00508d !important;
	}

	/* ── Logo inside mobile overlay ──
	   Injected automatically by navigation.js from the header logo.
	   Also supports manual placement via "mobile-overlay-logo" CSS class. */
	.mobile-overlay-logo,
	.mobile-nav-logo {
		display: none;
	}

	.wp-block-navigation__responsive-container.is-menu-open .mobile-overlay-logo,
	.wp-block-navigation__responsive-container.is-menu-open .mobile-nav-logo {
		display: flex;
		align-items: center;
		min-height: 36px;
		margin-bottom: 2px;
		padding-bottom: 10px;
		padding-right: 56px;
		border-bottom: 1px solid #e5e7eb;
	}

	.wp-block-navigation__responsive-container.is-menu-open .mobile-overlay-logo img,
	.wp-block-navigation__responsive-container.is-menu-open .mobile-nav-logo img {
		max-width: 150px;
		height: auto;
	}

	.wp-block-navigation__responsive-container.is-menu-open .mobile-nav-logo a {
		display: inline-flex;
		align-items: center;
		text-decoration: none;
	}

	/* ── CTA banner at bottom of mobile overlay ──
	   Add a Group block at the end of the navigation block in the editor.
	   Give it the CSS class "mobile-overlay-cta" in the block settings. */
	.mobile-overlay-cta {
		display: none;
	}

	.wp-block-navigation__responsive-container.is-menu-open .mobile-overlay-cta {
		display: block;
		background: linear-gradient(135deg, #03003c 0%, #00508d 100%);
		border-radius: 16px;
		padding: 32px 24px;
		margin-top: auto;
		text-align: center;
		color: #fff;
	}

	.wp-block-navigation__responsive-container.is-menu-open .mobile-overlay-cta p,
	.wp-block-navigation__responsive-container.is-menu-open .mobile-overlay-cta h3,
	.wp-block-navigation__responsive-container.is-menu-open .mobile-overlay-cta h4 {
		color: #fff !important;
		margin-bottom: 16px;
	}

	.wp-block-navigation__responsive-container.is-menu-open .mobile-overlay-cta .wp-block-button__link {
		background: #fff !important;
		color: #03003c !important;
		border-radius: 100px;
		font-weight: 700;
		font-size: 0.9375rem;
		padding: 14px 32px;
		text-decoration: none;
		display: inline-block;
		transition: background-color 0.3s ease, transform 0.2s ease;
	}

	.wp-block-navigation__responsive-container.is-menu-open .mobile-overlay-cta .wp-block-button__link:hover {
		background: #e2edf6 !important;
		transform: translateY(-1px);
	}

	/* ── Mobile CTA Button (inline, not in .mobile-overlay-cta group) ──
	   If a standalone button block exists in the nav, style it for mobile */
	.wp-block-navigation__responsive-container.is-menu-open > .wp-block-navigation__responsive-container-content > .wp-block-button .wp-block-button__link,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content > .wp-block-button .wp-block-button__link {
		background-color: #03003c !important;
		color: #fff !important;
		border-radius: 100px !important;
		font-weight: 700;
		font-size: 0.9375rem;
		padding: 14px 32px;
		text-decoration: none;
		display: inline-block;
		width: auto;
		margin-top: 16px;
		transition: background-color 0.3s ease, transform 0.2s ease;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content > .wp-block-button .wp-block-button__link:hover {
		background-color: #00508d !important;
		transform: translateY(-1px);
	}
}

/* ── Focus Visible for Keyboard Navigation ── */
.wp-block-navigation .wp-block-navigation-item__content:focus-visible {
	outline: 2px solid #00508d;
	outline-offset: 4px;
	border-radius: 2px;
}

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
	.site-header,
	.wp-block-navigation .wp-block-navigation-item__content,
	.wp-block-navigation .has-child .wp-block-navigation__submenu-container,
	.header-cta .wp-block-button__link,
	.wp-block-navigation-submenu__toggle,
	.wp-block-navigation__responsive-container-open {
		transition: none;
	}
}

