/*
 * Noor Fashion - header ([nfx_fejlec]) and its menus ([nfx_menu], [nfx_mobilmenu])
 * Colours and sizes are CSS variables: override them on .nfx-header if needed.
 */

.nfx-header,
.nfx-menu,
.nfx-mobilmenu,
.nfx-mobilmenu-standalone {
	--nfx-ink: #222;
	--nfx-paper: #fff;
	--nfx-line: #e3e3e3;
	--nfx-accent: #ff6f6f;
	--nfx-top-size: 15px;
	--nfx-top-gap: 38px;
	--nfx-item-size: 14px;
	--nfx-item-pad-y: 16px;
	--nfx-item-pad-x: 18px;
	--nfx-sub-width: 250px;
	--nfx-sub-offset: 20px;
	--nfx-bar: 8px;
	--nfx-count: #6f6f72;
	--nfx-slogan-font: "Playfair Display", Georgia, "Times New Roman", serif;
	--nfx-pad-x: 24px;
	--nfx-top-font: "Karla", sans-serif;
}

/* ===================================================================
 * Header layout
 * ================================================================= */

.nfx-header {
	/* Both bars stay on screen while scrolling. Fixed (not sticky) so it works whatever
	   Bricks wrappers surround the shortcode. Below the WordPress admin bar when logged in. */
	position: fixed;
	top: var(--nfx-hdr-top, var(--wp-admin--admin-bar--height, 0px));
	left: 0;
	right: 0;
	background: var(--nfx-paper);
	color: var(--nfx-ink);
	z-index: 9990;
	/* A soft shadow under the sticky header in every variant and state. */
	--nfx-hdr-shadow: 0 3px 14px rgba(0, 0, 0, .12);
	box-shadow: var(--nfx-hdr-shadow);
}

/* Transparent variant: [nfx_fejlec stilus="atlatszo"] over a hero image.
   Semi-transparent top bar, almost transparent menu row, only a shadow to separate it.
   The dropdown panels keep their own white background. */
/* One shared tint for both rows (same grey as the top bar), painted once on the header,
   so the two rows match exactly instead of the top bar doubling it. */
.nfx-header--glass {
	--nfx-glass-top: rgba(34, 34, 34, .55);
	--nfx-glass-main: var(--nfx-glass-top);
	--nfx-glass-shadow: 0 6px 20px rgba(0, 0, 0, .18);
	background: var(--nfx-glass-main);
	box-shadow: var(--nfx-glass-shadow);
	transition: background-color .25s ease, box-shadow .25s ease;
}

.nfx-header--glass .nfx-hdr__top {
	background: transparent;
	box-shadow: none;
	transition: background-color .25s ease, box-shadow .25s ease;
}

/* Scrolled (or menu/search open): the usual solid colours. */
.nfx-header--glass.is-solid {
	background: var(--nfx-paper);
	box-shadow: var(--nfx-hdr-shadow);
}

.nfx-header--glass.is-solid .nfx-hdr__top {
	background: var(--nfx-ink);
	box-shadow: 0 0 0 100vmax var(--nfx-ink);
}

.nfx-hdr-spacer {
	display: block;
}

/* Transparent header with white text (setting: "Átlátszó fejléc szövegszíne"): only while
   transparent; the dropdown panels keep dark text on white, the solid state is unchanged. */
.nfx-header--glass-light:not(.is-solid) .nfx-hdr__main .nfx-l0 > .nfx-item > .nfx-menu__link,
.nfx-header--glass-light:not(.is-solid) .nfx-hdr__main .nfx-l0 > .nfx-item > .nfx-menu__toggle,
.nfx-header--glass-light:not(.is-solid) .nfx-hdr__main .nfx-hdr__slogan,
.nfx-header--glass-light:not(.is-solid) .nfx-hdr__mobile {
	color: #fff;
	text-shadow: 0 1px 3px rgba(0, 0, 0, .25);
}

.nfx-header--glass-light:not(.is-solid) .nfx-hdr__main .nfx-l0 > .nfx-item.nfx-kiemelt > .nfx-menu__link {
	color: var(--nfx-accent);
}

.nfx-header--glass .nfx-hdr__main .nfx-l0 > .nfx-item > .nfx-menu__link,
.nfx-header--glass .nfx-hdr__main .nfx-l0 > .nfx-item > .nfx-menu__toggle,
.nfx-header--glass .nfx-hdr__main .nfx-hdr__slogan,
.nfx-header--glass .nfx-hdr__mobile {
	transition: color .25s ease;
}

@media (prefers-reduced-motion: reduce) {
	.nfx-header--glass,
	.nfx-header--glass .nfx-hdr__top {
		transition: none;
	}
}

/* The header's own width drives its layout (works in the Bricks editor canvas too). */
.nfx-hdr__frame {
	container: nfxhdr / inline-size;
	max-width: var(--nfx-max-width, none);
	margin: 0 auto;
}

/* Desktop sizes: 15 px menu like the original site, slightly tighter on narrow headers. */
.nfx-header .nfx-menu {
	--nfx-top-size: 15px;
	--nfx-top-size: clamp(12px, 1.2cqw, 15px);
	--nfx-top-gap: 30px;
	--nfx-top-gap: clamp(12px, 2.2cqw, 38px);
}

/* No-JS fallback: below this width there is usually no room for the slogans.
   With JS the header measures its real content instead (nfx-fit-* classes below). */
@container nfxhdr (max-width: 1379px) {
	.nfx-header:not(.nfx-fit-js) .nfx-hdr__main .nfx-hdr__slogan {
		display: none;
	}
}

/* Step 1: the menus don't fit next to the slogans: logo only in the middle. */
.nfx-header.nfx-fit-1 .nfx-hdr__main .nfx-hdr__slogan {
	display: none;
}

/* Step 2: still too tight: compact menus. */
.nfx-header.nfx-fit-2 .nfx-hdr__main .nfx-menu {
	--nfx-top-size: 12px;
	--nfx-top-gap: 12px;
}

.nfx-header.nfx-fit-2 .nfx-hdr__main .nfx-l0 > .nfx-item {
	gap: 3px;
}

/* Step 3: the menus don't fit at all: use the mobile layout. */
.nfx-header.nfx-fit-mobile .nfx-hdr__desktop {
	display: none !important;
}

.nfx-header.nfx-fit-mobile .nfx-hdr__mobile {
	display: grid !important;
}

.nfx-header a {
	color: inherit;
	text-decoration: none;
}

.nfx-header button {
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	color: inherit;
	cursor: pointer;
	font: inherit;
	line-height: 1;
}

.nfx-header svg {
	display: block;
}

/* Top bar */
.nfx-hdr__top {
	background: var(--nfx-ink);
	color: var(--nfx-paper);
	/* Full-width background even when the content is limited to a maximum width. */
	box-shadow: 0 0 0 100vmax var(--nfx-ink);
	clip-path: inset(0 -100vmax);
}

.nfx-hdr__top-inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	min-height: 40px;
	padding: 0 var(--nfx-pad-x);
}

.nfx-hdr__top-text {
	grid-column: 2;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .04em;
	font-family: var(--nfx-top-font);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.7;
	padding: 6px 0;
}

.nfx-hdr__top-left,
.nfx-hdr__top-right {
	display: flex;
	align-items: center;
	gap: 22px;
}

.nfx-hdr__top-left {
	grid-column: 1;
	grid-row: 1;
}

.nfx-hdr__top-right {
	grid-column: 3;
	grid-row: 1;
	justify-content: flex-end;
	gap: 26px;
}

.nfx-header--hide-top.is-scrolled .nfx-hdr__top {
	display: none;
}

/* Bricks' own sticky header ("slide up / hide on scroll") transforms or hides #brx-header,
   which drags our fixed header (and its top bar) out of view. Our header is sticky by
   itself, so the Bricks wrapper is neutralised whenever it contains it. */
#brx-header:has(.nfx-header) {
	position: static !important;
	transform: none !important;
	opacity: 1 !important;
	visibility: visible !important;
	transition: none !important;
	height: auto !important;
}

/* Transparent variant: the page (hero) has to start right under the header. The Bricks
   header template wraps the shortcode in a section / container that may have its own
   padding, min-height or background (often only at the mobile breakpoints). As the header
   itself is fixed, that wrapper would remain as an empty white band above the hero, and the
   see-through header would look like a flat grey strip on it. Collapse those wrappers. */
#brx-header:has(.nfx-header--glass),
#brx-header :has(.nfx-header--glass) {
	padding: 0 !important;
	margin: 0 !important;
	min-height: 0 !important;
	height: auto !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

/* Icons with counters */
.nfx-hdr__icon {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.nfx-hdr__icon svg {
	width: 19px;
	height: 19px;
}

.nfx-hdr__count {
	position: absolute;
	top: -7px;
	right: -9px;
	min-width: 15px;
	height: 15px;
	padding: 0 3px;
	box-sizing: border-box;
	border-radius: 8px;
	background: var(--nfx-count);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	line-height: 15px;
	text-align: center;
}

/* Desktop main row */
.nfx-hdr__main {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	min-height: 84px;
	padding: 0 var(--nfx-pad-x);
}

.nfx-hdr__main .nfx-menu .nfx-l0 > .nfx-item > .nfx-menu__link {
	white-space: nowrap;
}

.nfx-hdr__side--right {
	display: flex;
	justify-content: flex-end;
}

.nfx-hdr__brand {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 0 16px;
}

/* Desktop: the logo sits exactly in the middle whatever the length of the two slogans.
   Equal flexible columns on both sides of the logo keep it centred in the brand block,
   and the brand block is the centre column of the header row. */
.nfx-hdr__main .nfx-hdr__brand {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}

.nfx-hdr__main .nfx-hdr__logo {
	grid-column: 2;
}

.nfx-hdr__main .nfx-hdr__slogan:first-child {
	grid-column: 1;
	justify-self: end;
}

.nfx-hdr__main .nfx-hdr__slogan:last-child {
	grid-column: 3;
	justify-self: start;
}

/* Setting "Szlogen elhelyezése": the two slogan parts in one line under the logo.
   The logo spans both columns, so it stays exactly centred; the line is centred too. */
.nfx-header--slogan-below .nfx-hdr__main .nfx-hdr__brand {
	grid-template-columns: auto auto;
	grid-template-rows: auto auto;
	justify-content: center;
	column-gap: .3em;
	row-gap: 2px;
	padding-top: 8px;
	padding-bottom: 8px;
}

.nfx-header--slogan-below .nfx-hdr__main .nfx-hdr__logo {
	grid-column: 1 / -1;
	grid-row: 1;
	justify-self: center;
}

.nfx-header--slogan-below .nfx-hdr__main .nfx-hdr__slogan:first-child {
	grid-column: 1;
	grid-row: 2;
	justify-self: end;
}

.nfx-header--slogan-below .nfx-hdr__main .nfx-hdr__slogan:last-child {
	grid-column: 2;
	grid-row: 2;
	justify-self: start;
}

/* Only one slogan part filled in: centre it under the logo. */
.nfx-header--slogan-below .nfx-hdr__main .nfx-hdr__slogan:only-of-type {
	grid-column: 1 / -1;
	justify-self: center;
}

.nfx-header--slogan-below .nfx-hdr__main .nfx-hdr__slogan {
	font-size: 15px;
	line-height: 1.3;
}

.nfx-hdr__slogan {
	font-family: var(--nfx-slogan-font);
	font-style: italic;
	font-size: 16px;
	white-space: nowrap;
}

.nfx-hdr__main .nfx-hdr__logo {
	width: 58px;
	height: 58px;
}

.nfx-hdr__logo {
	display: block;
	width: 58px;
	height: 58px;
	object-fit: contain;
	border-radius: 50%;
}

.nfx-hdr__logo--text {
	width: auto;
	height: auto;
	border-radius: 0;
	font-size: 18px;
}

/* Mobile row */
.nfx-hdr__mobile {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	min-height: 62px;
	padding: 0 16px;
}

.nfx-hdr__mobile .nfx-mobilmenu__burger {
	justify-self: start;
}

.nfx-hdr__mobile-logo .nfx-hdr__brand {
	padding: 0;
}

.nfx-hdr__mobile-logo .nfx-hdr__logo {
	width: 48px;
	height: 48px;
}

.nfx-hdr__mobile-icons {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 20px;
}

.nfx-hdr__mobile-icons .nfx-hdr__icon svg {
	width: 22px;
	height: 22px;
}

/* Closed: wishlist, search, cart. Open: search, account, wishlist, cart (and no logo). */
.nfx-hdr__mobile-icons .nfx-hdr__i-wishlist { order: 1; }
.nfx-hdr__mobile-icons .nfx-hdr__i-search   { order: 2; }
.nfx-hdr__mobile-icons .nfx-hdr__i-account  { order: 3; display: none; }
.nfx-hdr__mobile-icons .nfx-hdr__i-cart     { order: 4; }

body.nfx-mobilmenu-open .nfx-hdr__mobile-icons .nfx-hdr__i-search   { order: 1; }
body.nfx-mobilmenu-open .nfx-hdr__mobile-icons .nfx-hdr__i-account  { order: 2; display: inline-flex; }
body.nfx-mobilmenu-open .nfx-hdr__mobile-icons .nfx-hdr__i-wishlist { order: 3; }
body.nfx-mobilmenu-open .nfx-hdr__mobile-logo { visibility: hidden; }

/* Search panel */
.nfx-hdr__search {
	border-top: 1px solid var(--nfx-line);
	padding: 16px var(--nfx-pad-x);
	background: var(--nfx-paper);
}

.nfx-hdr__search[hidden] {
	display: none;
}

.nfx-hdr__search form {
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 720px;
	margin: 0 auto;
	border-bottom: 1px solid var(--nfx-ink);
}

.nfx-hdr__search input[type="search"] {
	flex: 1 1 auto;
	border: 0;
	background: transparent;
	font: inherit;
	font-size: 15px;
	padding: 8px 0;
	color: var(--nfx-ink);
	outline: none;
	min-width: 0;
}

.nfx-hdr__search .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

@media (max-width: 767px) {
	.nfx-hdr__top-inner {
		min-height: 36px;
		padding: 0 12px;
	}

	.nfx-hdr__top-text {
		font-size: 14px;
		letter-spacing: .02em;
	}

	.nfx-hdr__mobile {
		min-height: 60px;
		padding: 0 12px;
	}

	.nfx-hdr__mobile-icons {
		gap: 16px;
	}
}

.nfx-menu ul,
.nfx-mobilmenu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nfx-menu a,
.nfx-mobilmenu a {
	text-decoration: none;
	color: inherit;
}

.nfx-menu button,
.nfx-mobilmenu button {
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	color: inherit;
	cursor: pointer;
	line-height: 1;
	font: inherit;
}

.nfx-menu svg,
.nfx-mobilmenu svg {
	display: block;
	transition: transform .15s ease;
}

/* ===================================================================
 * Desktop
 * ================================================================= */

.nfx-menu {
	color: var(--nfx-ink);
}

.nfx-menu .nfx-menu__list {
	display: flex;
	align-items: center;
	gap: var(--nfx-top-gap);
}

.nfx-menu .nfx-item {
	position: relative;
}

/* Top level */
.nfx-menu .nfx-l0 > .nfx-item {
	display: flex;
	align-items: center;
	gap: 6px;
}

.nfx-menu .nfx-l0 > .nfx-item > .nfx-menu__link {
	font-size: var(--nfx-top-size);
	text-transform: uppercase;
	letter-spacing: .03em;
	padding: 10px 0;
	display: inline-block;
}

.nfx-menu .nfx-l0 > .nfx-item > .nfx-menu__toggle {
	padding: 6px 2px;
}

.nfx-menu .nfx-l0 > .nfx-item.is-open > .nfx-menu__toggle svg {
	transform: rotate(180deg);
}

/* Current page: only an exact top-level match is marked, like the design shows none for ancestors. */
.nfx-menu .nfx-l0 > .nfx-item.is-current > .nfx-menu__link {
	text-decoration: underline;
	text-underline-offset: 5px;
}

/* Panels */
.nfx-menu .nfx-menu__sub {
	position: absolute;
	z-index: 1000;
	width: var(--nfx-sub-width);
	background: var(--nfx-paper);
	border: 0; /* No frame: a hovered row is coloured edge to edge. */
	box-shadow: 0 6px 20px rgba(0, 0, 0, .08);
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transition: opacity .12s ease, visibility 0s linear .12s;
}

/* First panel: under the top-level item; the padding keeps hover alive across the gap. */
.nfx-menu .nfx-l0 > .nfx-item > .nfx-menu__sub {
	top: 100%;
	left: 0;
	margin-top: var(--nfx-sub-offset);
}

.nfx-menu .nfx-l0 > .nfx-item.has-children::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	height: var(--nfx-sub-offset);
}

/* Deeper panels: fly out to the right, aligned with the hovered row. */
.nfx-menu .nfx-menu__sub .nfx-menu__sub {
	top: 0;
	left: 100%;
}

.nfx-menu .nfx-menu__sub.nfx-flip {
	left: auto;
	right: 100%;
}

.nfx-menu .nfx-item.is-open > .nfx-menu__sub,
.nfx-menu:not(.nfx-js) .nfx-item:hover > .nfx-menu__sub,
.nfx-menu .nfx-item:focus-within > .nfx-menu__sub {
	visibility: visible;
	opacity: 1;
	pointer-events: auto;
	transition: opacity .12s ease;
}

/* Defensive reset: theme/Bricks borders, outlines or radii must not frame the rows. */
.nfx-header .nfx-menu__sub,
.nfx-header .nfx-menu__sub li,
.nfx-header .nfx-menu__sub a,
.nfx-header .nfx-menu__sub button {
	border: 0 !important;
	border-radius: 0 !important;
	margin: 0;
	outline: 0;
	box-sizing: border-box;
}

.nfx-header .nfx-menu__sub a,
.nfx-header .nfx-menu__sub button {
	background: transparent !important;
	box-shadow: none !important;
}

/* Keyboard focus stays visible, inside the row instead of around it. */
.nfx-header .nfx-menu__sub a:focus-visible,
.nfx-header .nfx-menu__sub button:focus-visible {
	outline: 2px solid var(--nfx-accent);
	outline-offset: -4px;
}

/* Panel rows */
.nfx-menu .nfx-menu__sub > .nfx-item {
	margin: 0;
	border: 0;
	display: flex;
	align-items: center;
	background: var(--nfx-paper);
	color: var(--nfx-ink); /* Don't inherit the white text of a hovered parent row. */
	transition: background-color .12s ease, color .12s ease;
}

.nfx-menu .nfx-menu__sub .nfx-menu__link {
	flex: 1 1 auto;
	display: block;
	font-size: var(--nfx-item-size);
	letter-spacing: .02em;
	padding: var(--nfx-item-pad-y) var(--nfx-item-pad-x);
}

.nfx-menu .nfx-menu__sub .nfx-menu__toggle {
	align-self: stretch;
	padding: 0 var(--nfx-item-pad-x) 0 8px;
	display: flex;
	align-items: center;
}

.nfx-menu .nfx-menu__sub > .nfx-item:hover,
.nfx-menu .nfx-menu__sub > .nfx-item.is-open,
.nfx-menu .nfx-menu__sub > .nfx-item:focus-within {
	background: var(--nfx-ink);
	color: var(--nfx-paper);
}

.nfx-menu .nfx-menu__sub > .nfx-item.is-current > .nfx-menu__link {
	font-weight: 600;
}

/* Highlighted item (CSS class "nfx-kiemelt" in Appearance → Menus) */
.nfx-menu .nfx-item.nfx-kiemelt > .nfx-menu__link {
	color: var(--nfx-accent);
	font-weight: 700;
}

.nfx-menu .nfx-menu__sub > .nfx-item.nfx-kiemelt {
	box-shadow: inset var(--nfx-bar) 0 0 var(--nfx-accent);
}

.nfx-menu .nfx-menu__sub > .nfx-item.nfx-kiemelt:hover > .nfx-menu__link,
.nfx-menu .nfx-menu__sub > .nfx-item.nfx-kiemelt.is-open > .nfx-menu__link {
	color: var(--nfx-paper);
}

/* ===================================================================
 * Mobile
 * ================================================================= */

.nfx-mobilmenu {
	color: var(--nfx-ink);
}

.nfx-mobilmenu__burger {
	background: none;
	border: 0;
	padding: 0;
	color: inherit;
	cursor: pointer;
	position: relative;
	width: 30px;
	height: 30px;
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
}

.nfx-mobilmenu__burger span {
	display: block;
	width: 26px;
	height: 2px;
	background: currentColor;
	border-radius: 2px;
	transition: transform .2s ease, opacity .2s ease;
}

.nfx-mobilmenu__burger[aria-expanded="true"] span:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.nfx-mobilmenu__burger[aria-expanded="true"] span:nth-child(2) {
	opacity: 0;
}

.nfx-mobilmenu__burger[aria-expanded="true"] span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

.nfx-mobilmenu__panel {
	position: fixed;
	left: 0;
	right: 0;
	top: var(--nfx-mm-top, 0px);
	bottom: 0;
	z-index: 99990;
	background: var(--nfx-paper);
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

.nfx-mobilmenu__panel[hidden] {
	display: none;
}

body.nfx-mobilmenu-open {
	overflow: hidden;
}

/* Helper classes for Bricks elements around the menu */
body.nfx-mobilmenu-open .nfx-mm-hide-open,
body:not(.nfx-mobilmenu-open) .nfx-mm-show-open {
	display: none !important;
}

.nfx-mobilmenu .nfx-mm__sub[hidden] {
	display: none;
}

.nfx-mobilmenu .nfx-mm__row {
	display: flex;
	align-items: center;
	min-height: 52px;
	position: relative;
}

.nfx-mobilmenu .nfx-mm__link {
	flex: 1 1 auto;
	display: block;
	padding: 14px 0;
	font-size: 15px;
	letter-spacing: .02em;
}

.nfx-mobilmenu .nfx-mm__toggle {
	align-self: stretch;
	width: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.nfx-mobilmenu .nfx-mm__toggle svg {
	width: 12px;
	height: 12px;
}

.nfx-mobilmenu .is-open > .nfx-mm__row > .nfx-mm__toggle svg {
	transform: rotate(90deg);
}

/* Top level */
.nfx-mobilmenu .nfx-l0 > .nfx-item > .nfx-mm__row {
	padding-left: 18px;
}

.nfx-mobilmenu .nfx-l0 > .nfx-item > .nfx-mm__row .nfx-mm__link {
	text-transform: uppercase;
}

.nfx-mobilmenu .nfx-l0 > .nfx-item.has-children > .nfx-mm__row .nfx-mm__toggle svg {
	transform: rotate(-90deg);
}

.nfx-mobilmenu .nfx-l0 > .nfx-item.is-open > .nfx-mm__row {
	background: var(--nfx-ink);
	color: var(--nfx-paper);
}

.nfx-mobilmenu .nfx-l0 > .nfx-item.is-open > .nfx-mm__row .nfx-mm__toggle svg {
	transform: none;
}

/* Nested levels: indent per depth */
.nfx-mobilmenu .nfx-l1 > .nfx-item > .nfx-mm__row { padding-left: 66px; }
.nfx-mobilmenu .nfx-l2 > .nfx-item > .nfx-mm__row { padding-left: 86px; }
.nfx-mobilmenu .nfx-l3 > .nfx-item > .nfx-mm__row { padding-left: 106px; }

.nfx-mobilmenu .nfx-l1 > .nfx-item > .nfx-mm__row .nfx-mm__link,
.nfx-mobilmenu .nfx-l2 > .nfx-item > .nfx-mm__row .nfx-mm__link,
.nfx-mobilmenu .nfx-l3 > .nfx-item > .nfx-mm__row .nfx-mm__link {
	font-size: 14px;
	padding: 12px 0;
}

.nfx-mobilmenu .nfx-l1 > .nfx-item > .nfx-mm__row { min-height: 46px; }
.nfx-mobilmenu .nfx-l2 > .nfx-item > .nfx-mm__row,
.nfx-mobilmenu .nfx-l3 > .nfx-item > .nfx-mm__row { min-height: 42px; }

.nfx-mobilmenu .is-current > .nfx-mm__row .nfx-mm__link {
	font-weight: 600;
}

/* Highlighted item: accent text + bar left of the text */
.nfx-mobilmenu .nfx-item.nfx-kiemelt > .nfx-mm__row .nfx-mm__link {
	color: var(--nfx-accent);
	font-weight: 700;
	position: relative;
}

.nfx-mobilmenu .nfx-item.nfx-kiemelt > .nfx-mm__row .nfx-mm__link::before {
	content: "";
	position: absolute;
	left: -18px;
	top: 0;
	bottom: 0;
	width: var(--nfx-bar);
	background: var(--nfx-accent);
}

.nfx-mobilmenu .nfx-l0 > .nfx-item.nfx-kiemelt > .nfx-mm__row .nfx-mm__link::before {
	left: -18px;
}

/* Focus */
.nfx-header a:focus-visible,
.nfx-header button:focus-visible,
.nfx-menu a:focus-visible,
.nfx-menu button:focus-visible,
.nfx-mobilmenu a:focus-visible,
.nfx-mobilmenu button:focus-visible {
	outline: 2px solid var(--nfx-accent);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.nfx-header *,
	.nfx-menu *,
	.nfx-mobilmenu * {
		transition: none !important;
	}
}