/* ==========================================================================
   Egovt — Mobile navigation drawer
   --------------------------------------------------------------------------
   A single off-canvas drawer used by both header systems:

     1. The theme header  (.ovatheme_header_default / .navbar-toggler / #header_menu)
     2. The Elementor menu widget  (.ova_menu_clasic / .ova_openNav / .ova_nav)

   Parent items keep their link AND get a separate chevron button, so a parent
   that points at a real page can be visited *and* expanded.

   Everything is scoped to `.egovt-mnav--active`, a class that assets/js/mobile-menu.js
   adds only while the viewport is below that header's own breakpoint. Nothing
   in this file touches the desktop menu.

   Loaded after theme.css, but Elementor widget styles can be printed later,
   so structural properties are marked !important on purpose.
   ========================================================================== */

:root {
	--egovt-mnav-accent: #ff3514;
}


/* --------------------------------------------------------------------------
   1. Backdrop
   -------------------------------------------------------------------------- */

.egovt-mnav-backdrop {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 99990;
	background-color: rgba(11, 20, 44, 0.5);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.32s ease, visibility 0.32s ease;
}

.egovt-mnav-backdrop.is-visible {
	opacity: 1;
	visibility: visible;
}

/* The Elementor widget ships its own overlay + close link. We replace both. */
.egovt-mnav-root .ova_closeCanvas,
.egovt-mnav--active > .ova_closeNav {
	display: none !important;
}

/* Scroll lock while the drawer is open. */
html.egovt-mnav-locked,
html.egovt-mnav-locked body {
	overflow: hidden !important;
}


/* --------------------------------------------------------------------------
   2. Drawer panel
   -------------------------------------------------------------------------- */

.egovt-mnav--active {
	/* Light theme (default) */
	--mnav-bg: #ffffff;
	--mnav-text: #202b5d;
	--mnav-muted: #6b7794;
	--mnav-line: rgba(32, 43, 93, 0.1);
	--mnav-sub-bg: #f4f6fb;
	--mnav-rail: rgba(32, 43, 93, 0.12);
	--mnav-press: rgba(32, 43, 93, 0.05);
	--mnav-accent: var(--egovt-mnav-accent, #ff3514);

	/* The drawer's interaction colour: hover, press, and the current page all
	   use it, so one control governs the whole interactive language. Set per
	   widget by the menu widget's "Hover / Active Colour" control (which writes
	   --egovt-mnav-hover), falling back to the site accent.

	   It is routed through a variable on purpose: Elementor prints its selector
	   CSS outside media queries, so a control writing `:hover` directly would
	   apply on touch devices too and bring back the latched hover state. A
	   variable is only a value — the rules below decide when it is used. */
	--mnav-hover: var(--egovt-mnav-hover, var(--mnav-accent));

	position: fixed !important;
	top: 0;
	right: 0;
	bottom: 0;
	left: auto !important;
	/* The widget's own stylesheet puts .ova_nav at z-index 4 and loads after
	   this file, which would leave the drawer underneath its own backdrop. */
	z-index: 99991 !important;

	display: block !important;
	width: 400px !important;
	width: min(400px, 92vw) !important;
	max-width: none !important;
	height: 100% !important;
	height: 100dvh !important;

	margin: 0 !important;
	padding: 0 0 calc(32px + env(safe-area-inset-bottom, 0px)) !important;

	background-color: var(--mnav-bg);
	color: var(--mnav-text);
	box-shadow: -24px 0 60px -22px rgba(11, 20, 44, 0.4);

	overflow-x: hidden !important;
	overflow-y: auto !important;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;

	visibility: hidden;
	opacity: 1;
	transform: translate3d(100%, 0, 0);
	transition: transform 0.36s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.36s linear;
	will-change: transform;
}

.egovt-mnav--active.is-open {
	visibility: visible;
	transform: translate3d(0, 0, 0);
}

/* Before the drawer is set up the panel sits in normal flow (or, for the
   widget, pinned at width 0). Adding the drawer styles changes `transform`,
   and because a transition is declared the browser animates that first
   change — the panel visibly slides away from where it was on page load.
   The JS holds this class for one frame while the closed state is applied. */
.egovt-mnav--boot,
.egovt-mnav--boot * {
	transition: none !important;
	animation: none !important;
}

/* Drawer on the left — set by JS from the widget's own `canvas_left` option. */
.egovt-mnav--active.egovt-mnav--left {
	right: auto !important;
	left: 0 !important;
	box-shadow: 24px 0 60px -22px rgba(11, 20, 44, 0.4);
	transform: translate3d(-100%, 0, 0);
}

.egovt-mnav--active.egovt-mnav--left.is-open {
	transform: translate3d(0, 0, 0);
}

/* Dark drawer: the widget's gray canvas option, or an opt-in body class. */
.egovt-mnav--active.canvas_bg_gray,
body.egovt-mnav-dark .egovt-mnav--active {
	--mnav-bg: #14203d;
	--mnav-text: #ffffff;
	--mnav-muted: rgba(255, 255, 255, 0.62);
	--mnav-line: rgba(255, 255, 255, 0.12);
	--mnav-sub-bg: rgba(255, 255, 255, 0.05);
	--mnav-rail: rgba(255, 255, 255, 0.18);
	--mnav-press: rgba(255, 255, 255, 0.07);

	background-color: var(--mnav-bg) !important;
}

/* Keep clear of the WordPress admin bar. */
body.admin-bar .egovt-mnav--active {
	top: 32px;
	height: calc(100% - 32px) !important;
	height: calc(100dvh - 32px) !important;
}

@media (max-width: 782px) {
	body.admin-bar .egovt-mnav--active {
		top: 46px;
		height: calc(100% - 46px) !important;
		height: calc(100dvh - 46px) !important;
	}
}


/* --------------------------------------------------------------------------
   3. Drawer header (sticky)
   -------------------------------------------------------------------------- */

/* The head and the carets are injected into the live menu markup, so they must
   disappear entirely whenever the drawer is not the active presentation. */
.egovt-mnav__head,
.egovt-mnav__caret {
	display: none !important;
}

.egovt-mnav--active .egovt-mnav__head {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	/* Has to clear anything the menu markup carries its own z-index on, or
	   sub-menus scroll over the header instead of under it. Paired with the
	   `z-index: auto` reset on the rows below. */
	z-index: 30;
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 68px;
	padding: 12px 16px 12px 24px;
	background-color: var(--mnav-bg);
	border-bottom: 1px solid var(--mnav-line);
}

/* Title removed via the egovt_mobile_menu_title filter — keep the close
   button where it was rather than letting it slide to the left. */
.egovt-mnav--active .egovt-mnav__head--untitled {
	justify-content: flex-end;
}

.egovt-mnav--active .egovt-mnav__title {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mnav-muted);
}

.egovt-mnav--active .egovt-mnav__close {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background-color: var(--mnav-press);
	color: var(--mnav-text);
	cursor: pointer;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

.egovt-mnav--active .egovt-mnav__close:focus-visible {
	background-color: var(--mnav-hover);
	color: #fff;
}

/* Colour only on hover — no background change. The button keeps its resting
   --mnav-press circle; only the glyph picks up the accent. */
@media (hover: hover) {
	.egovt-mnav--active .egovt-mnav__close:hover {
		color: var(--mnav-hover);
	}
}

.egovt-mnav--active .egovt-mnav__close:active {
	color: var(--mnav-hover);
	transform: scale(0.94);
}

.egovt-mnav--active .egovt-mnav__close svg {
	width: 20px;
	height: 20px;
	display: block;
}


/* --------------------------------------------------------------------------
   4. Lists and rows
   -------------------------------------------------------------------------- */

.egovt-mnav--active ul {
	list-style: none !important;
	margin: 0 !important;
}

.egovt-mnav--active > ul {
	display: block !important;
	flex-direction: column !important;
	width: auto !important;
	padding: 8px 16px 0 !important;
	border: 0 !important;
	background: transparent !important;
}

.egovt-mnav--active > ul > li {
	border-bottom: 1px solid var(--mnav-line);
}

.egovt-mnav--active > ul > li:last-child {
	border-bottom: 0;
}

/* The row: link takes the space it needs, the caret is its own target,
   the submenu drops onto its own line.

   z-index is forced back to auto: the widget's desktop rules raise sub-menus
   to 9999 so they clear page content, and any leftover stacking order here
   would let a scrolled sub-menu paint over the sticky header. */
.egovt-mnav--active > ul,
.egovt-mnav--active .egovt-mnav__sub {
	z-index: auto !important;
}

.egovt-mnav--active li {
	position: relative;
	z-index: auto !important;
	display: flex !important;
	flex-wrap: wrap;
	align-items: stretch;
	width: 100% !important;
	float: none !important;
	text-align: left !important;
	border-left: 0 !important;
	border-right: 0 !important;
}

.egovt-mnav--active li > a {
	flex: 1 1 auto;
	display: flex !important;
	align-items: center;
	width: auto !important;
	min-height: 54px;
	padding: 8px 8px 8px 8px !important;
	border: 0 !important;
	border-radius: 8px;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: -0.01em;
	/* The desktop rules paint sub-menu links white on a coloured hover
	   background. Inside the drawer there is no such background, so the
	   colours here have to win outright. */
	color: var(--mnav-text) !important;
	background: transparent !important;
	text-decoration: none;
	transition: color 0.2s ease, background-color 0.2s ease;
	white-space: normal !important;
}

/* Keyboard focus is always shown. Hover is not: a touch browser keeps the
   hover state latched on whatever was tapped last, so rows and carets stayed
   highlighted after use. `hover: hover` limits it to real pointing devices. */
.egovt-mnav--active li > a:focus-visible {
	color: var(--mnav-hover) !important;
	background-color: var(--mnav-press) !important;
}

/* Colour only — no row background. The tinted block was heavy against the
   sub-menu panel, and the colour shift alone reads clearly enough. */
@media (hover: hover) {
	.egovt-mnav--active li > a:hover {
		color: var(--mnav-hover) !important;
	}
}

/* The same colour on press. Touch devices never match `hover: hover`, so
   without this the Hover / Tap Colour control would have nothing to show on a
   phone — which is where this drawer actually lives. Unlike :hover, :active
   releases when the finger lifts, so it cannot latch on the last thing
   tapped, which is what made hover unusable on touch in the first place. */
.egovt-mnav--active li > a:active {
	color: var(--mnav-hover) !important;
}

/* Letter casing is deliberately left under the Elementor widget's control, so
   changing Text Transform there moves the desktop menu and this drawer
   together. That means this rule has to thread a specificity needle: three
   classes and two elements, (0,3,2).

   Above it, so the drawer is not stuck with the theme header's own
   `text-transform: capitalize` on `.ovatheme_header_default nav.navbar li a`
   (0,2,3). Below what Elementor emits for `{{WRAPPER}} .ova_nav ul.menu > li
   > a` (0,3,3) and for the sub-menu control (0,4,3), so an explicit setting
   still wins. This only supplies the default.

   !important would break that: it would pin the casing and take the setting
   away from the widget. Do not add it, and mind the selector's shape if this
   rule is ever edited.

   The ova-framework stylesheet used to hardcode `text-transform: uppercase`
   on its menu links, which this also had to outrank. Those two declarations
   were removed from the plugin source, so if a plugin update ever brings them
   back, this rule still covers the drawer — but the desktop menu would go
   uppercase again until they are removed a second time. */
.egovt-mnav-root .egovt-mnav--active.egovt-mnav li a {
	text-transform: none;
}

/* Current page.
 *
 * Keyed on `is-current`, which mobile-menu.js sets by matching each link's URL
 * against the page being viewed — NOT on WordPress's current-menu-* classes.
 * Those also mark every ancestor of every match, which highlighted parent
 * sections the visitor never came through, and is why this styling was pulled
 * once already. Do not add current-menu-item or current-menu-ancestor here.
 *
 * There is deliberately no marker in the left gutter: the panel clips it, and
 * it read as a stray sliver at the drawer's edge. Colour and weight carry it.
 *
 * The theme and widget stylesheets also colour `li.active > a` white for their
 * desktop hover treatment; that is neutralised by the plain link colour in
 * section 4, which carries !important for exactly this reason — so this colour
 * needs !important too.
 *
 * Shares --mnav-hover with the hover and press states by design: one control in
 * the widget sets the drawer's interaction colour, and the current page is part
 * of that same visual language. */
.egovt-mnav--active li.is-current > a {
	color: var(--mnav-hover) !important;
	/* !important because the sub-menu link rules below, and the widget's own
	   `.ova_nav .dropdown-menu > li > a`, both land at the same specificity
	   later in the cascade and would otherwise win. */
	font-weight: 600 !important;
}

/* The walker's inline caret glyph is replaced by the real button below. */
.egovt-mnav--active li > a > i.arrow_carrot-down,
.egovt-mnav--active li.dropdown > a::after {
	display: none !important;
	content: none !important;
}

/* Anything the original markup used as a toggle is retired by the JS, but
   hide it defensively in case a template prints its own. */
.egovt-mnav--active span.dropdown-toggle,
.egovt-mnav--active button.dropdown-toggle {
	display: none !important;
}


/* --------------------------------------------------------------------------
   5. Expand / collapse control
   -------------------------------------------------------------------------- */

.egovt-mnav--active .egovt-mnav__caret {
	position: relative;
	flex: 0 0 auto;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	align-self: center;
	width: 46px;
	height: 46px;
	margin: 0 0 0 4px;
	padding: 0;
	border: 0;
	border-radius: 10px;
	background-color: transparent;
	color: var(--mnav-muted);
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: background-color 0.2s ease, color 0.2s ease;
}

/* Hairline divider so the caret reads as a control separate from the link. */
.egovt-mnav--active .egovt-mnav__caret::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 1px;
	height: 20px;
	margin-top: -10px;
	background-color: var(--mnav-line);
}

.egovt-mnav--active .egovt-mnav__caret:focus-visible {
	background-color: var(--mnav-press);
	color: var(--mnav-hover);
}

/* Colour only — the chevron tints, the button does not fill. */
@media (hover: hover) {
	.egovt-mnav--active .egovt-mnav__caret:hover {
		color: var(--mnav-hover);
	}
}

.egovt-mnav--active .egovt-mnav__caret:active {
	color: var(--mnav-hover);
}

.egovt-mnav--active .egovt-mnav__caret svg {
	display: block;
	width: 20px;
	height: 20px;
	transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Expanded chevron uses the same interaction colour as hover, press and the
   current page — it is part of the same state language, not a separate one. */
.egovt-mnav--active .egovt-mnav__caret[aria-expanded="true"] {
	color: var(--mnav-hover);
}

.egovt-mnav--active .egovt-mnav__caret[aria-expanded="true"] svg {
	transform: rotate(180deg);
}


/* --------------------------------------------------------------------------
   6. Submenus
   -------------------------------------------------------------------------- */

.egovt-mnav--active .egovt-mnav__sub {
	flex: 0 0 100%;
	order: 9;
	position: static !important;
	display: block !important;
	width: 100% !important;
	min-width: 0 !important;
	height: 0;
	margin: 0 0 0 0 !important;
	padding: 0 !important;
	transform: none !important;
	opacity: 1 !important;
	visibility: visible !important;
	overflow: hidden;
	border: 0 !important;
	border-radius: 12px;
	background-color: transparent !important;
	box-shadow: none !important;

	/* Collapsed submenus must leave the tab order. Visibility flips back
	   instantly on open and only after the collapse finishes on close. */
	visibility: hidden !important;
	transition: height 0.32s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0.32s;
}

.egovt-mnav--active li.is-open > .egovt-mnav__sub {
	visibility: visible !important;
	transition: height 0.32s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0s;
}

/* The tint sits on the list, not on its items: the widget stylesheet forces
   `background: transparent !important` onto sub-menu <li>s with a selector
   this file cannot outrank, but leaves the <ul> reachable. The doubled class
   below is what lifts this rule past the widget's own <ul> rule. */
.egovt-mnav-root .egovt-mnav--active.egovt-mnav ul.egovt-mnav__sub {
	background-color: var(--mnav-sub-bg) !important;
}

/* Inner spacing has to be pseudo-elements rather than padding — padding would
   still be painted at height 0, and it is counted in scrollHeight so the open
   animation lands on exactly the right height. */
.egovt-mnav--active .egovt-mnav__sub::before,
.egovt-mnav--active .egovt-mnav__sub::after {
	content: "";
	display: block;
	height: 6px;
}

.egovt-mnav--active .egovt-mnav__sub > li {
	border: 0 !important;
	background-color: transparent !important;
}

/* Vertical guide rail down the nested level. */
.egovt-mnav--active .egovt-mnav__sub > li > a {
	position: relative !important;
	min-height: 46px;
	margin-left: 18px;
	padding-left: 16px !important;
	font-size: 15px;
	font-weight: 400;
	border-radius: 8px;
}

/* The desktop styles use ::before (theme) and ::after (widget) on sub-menu
   links for their own hover underline. Both are repurposed here: ::after
   becomes the indent rail, ::before is dropped. */
.egovt-mnav--active .egovt-mnav__sub > li > a::after {
	content: "" !important;
	position: absolute !important;
	top: 0 !important;
	right: auto !important;
	bottom: 0 !important;
	left: 0 !important;
	width: 2px !important;
	height: auto !important;
	border-radius: 2px;
	/* !important is required, not defensive: the Customizer prints
	   `.elementor-widget-ova_menu .ova_nav ul.menu .dropdown-menu li a:after`
	   with the site's primary colour at (0,4,3), which otherwise paints the
	   whole rail accent-red and makes every sub-item look like the current
	   page. */
	background-color: var(--mnav-rail) !important;
	opacity: 1 !important;
	transition: background-color 0.2s ease;
}

.egovt-mnav--active .egovt-mnav__sub > li > a::before {
	display: none !important;
}

/* Inside a sub-menu the indent rail carries the current-page colour, so the
   marker stays inside the panel instead of reaching into the gutter. */
.egovt-mnav--active .egovt-mnav__sub > li.is-current > a::after {
	background-color: var(--mnav-hover) !important;
}

.egovt-mnav--active .egovt-mnav__sub .egovt-mnav__caret {
	width: 42px;
	height: 42px;
	margin-right: 6px;
}

.egovt-mnav--active .egovt-mnav__sub .egovt-mnav__caret::before {
	display: none;
}

/* Third level and deeper. It reads quieter by rebinding the text colour
   rather than declaring one: a deeper selector here would outrank the
   current-page rule and swallow it. Inheritance keeps the two independent. */
.egovt-mnav--active .egovt-mnav__sub .egovt-mnav__sub > li {
	--mnav-text: var(--mnav-muted);
}

/* Nested lists inherit the same tint, so their own spacers would double up. */
.egovt-mnav--active .egovt-mnav__sub .egovt-mnav__sub::before,
.egovt-mnav--active .egovt-mnav__sub .egovt-mnav__sub::after {
	height: 2px;
}

.egovt-mnav--active .egovt-mnav__sub .egovt-mnav__sub > li > a {
	margin-left: 34px;
	font-size: 14.5px;
}


/* --------------------------------------------------------------------------
   7. Extras inside the drawer (widget shortcode area, search, buttons…)
   -------------------------------------------------------------------------- */

/* No top margin: this border is the divider under the last menu item, so it
   has to sit flush against it. The breathing room goes below the line, as
   padding, where the shortcode's own content starts. */
.egovt-mnav--active .shortcode {
	margin: 0 16px !important;
	padding-top: 20px;
	border-top: 1px solid var(--mnav-line);
}

/* An empty shortcode area would otherwise leave a rule floating under the
   menu with nothing beneath it. */
.egovt-mnav--active .shortcode.is-empty {
	display: none !important;
}


/* --------------------------------------------------------------------------
   8. Entrance stagger
   -------------------------------------------------------------------------- */

.egovt-mnav--active.is-open > ul > li {
	animation: egovt-mnav-in 0.42s cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.egovt-mnav--active.is-open > ul > li:nth-child(1)  { animation-delay: 0.04s; }
.egovt-mnav--active.is-open > ul > li:nth-child(2)  { animation-delay: 0.07s; }
.egovt-mnav--active.is-open > ul > li:nth-child(3)  { animation-delay: 0.10s; }
.egovt-mnav--active.is-open > ul > li:nth-child(4)  { animation-delay: 0.13s; }
.egovt-mnav--active.is-open > ul > li:nth-child(5)  { animation-delay: 0.16s; }
.egovt-mnav--active.is-open > ul > li:nth-child(6)  { animation-delay: 0.19s; }
.egovt-mnav--active.is-open > ul > li:nth-child(7)  { animation-delay: 0.22s; }
.egovt-mnav--active.is-open > ul > li:nth-child(8)  { animation-delay: 0.25s; }
.egovt-mnav--active.is-open > ul > li:nth-child(n+9) { animation-delay: 0.28s; }

@keyframes egovt-mnav-in {
	from {
		opacity: 0;
		transform: translate3d(14px, 0, 0);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.egovt-mnav--active.egovt-mnav--left.is-open > ul > li {
	animation-name: egovt-mnav-in-left;
}

@keyframes egovt-mnav-in-left {
	from {
		opacity: 0;
		transform: translate3d(-14px, 0, 0);
	}
	to {
		opacity: 1;
		transform: none;
	}
}


/* --------------------------------------------------------------------------
   9. Toggle button — theme header only
   The Elementor widget's button keeps its own Elementor-controlled styling.
   -------------------------------------------------------------------------- */

@media (max-width: 991.98px) {
	.ovatheme_header_default button.navbar-toggler {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 46px;
		height: 46px;
		padding: 0;
		border: 1px solid rgba(32, 43, 93, 0.12);
		border-radius: 12px;
		background-color: transparent !important;
		color: #202b5d !important;
		cursor: pointer;
		transition: background-color 0.2s ease, border-color 0.2s ease;
	}

	/* Open state only. A tapped button keeps :hover latched on touch. */
	.ovatheme_header_default button.navbar-toggler[aria-expanded="true"] {
		border-color: transparent;
		background-color: rgba(32, 43, 93, 0.06) !important;
	}

	.ovatheme_header_default .ovamenu_shrink.bg_dark button.navbar-toggler,
	.ovatheme_header_default.bg_dark button.navbar-toggler {
		border-color: rgba(255, 255, 255, 0.2);
		color: #fff !important;
	}

	.egovt-burger {
		position: relative;
		display: block;
		width: 20px;
		height: 14px;
	}

	.egovt-burger span {
		position: absolute;
		left: 0;
		display: block;
		width: 100%;
		height: 2px;
		border-radius: 2px;
		background-color: currentColor;
		transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease, top 0.3s cubic-bezier(0.22, 1, 0.36, 1);
	}

	.egovt-burger span:nth-child(1) { top: 0; }
	.egovt-burger span:nth-child(2) { top: 6px; }
	.egovt-burger span:nth-child(3) { top: 12px; }

	[aria-expanded="true"] > .egovt-burger span:nth-child(1) {
		top: 6px;
		transform: rotate(45deg);
	}

	[aria-expanded="true"] > .egovt-burger span:nth-child(2) {
		opacity: 0;
		transform: scaleX(0.3);
	}

	[aria-expanded="true"] > .egovt-burger span:nth-child(3) {
		top: 6px;
		transform: rotate(-45deg);
	}
}


/* --------------------------------------------------------------------------
   10. Focus visibility and reduced motion
   -------------------------------------------------------------------------- */

.egovt-mnav--active a:focus-visible,
.egovt-mnav__caret:focus-visible,
.egovt-mnav__close:focus-visible,
.egovt-mnav-root .navbar-toggler:focus-visible,
.egovt-mnav-root .ova_openNav:focus-visible {
	outline: 2px solid var(--egovt-mnav-hover, var(--egovt-mnav-accent, #ff3514));
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.egovt-mnav--active,
	.egovt-mnav-backdrop,
	.egovt-mnav--active .egovt-mnav__sub,
	.egovt-mnav__caret svg,
	.egovt-burger span {
		transition-duration: 0.01ms !important;
	}

	.egovt-mnav--active.is-open > ul > li {
		animation: none !important;
	}
}