/**
 * FPL Theme Header Component Styles
 *
 * Handles Utility Bar, Main Header, Configurable Sticky Behavior modes (body.fpl-header-static,
 * body.fpl-header-sticky, body.fpl-header-compact-sticky), and Mobile Drawer overlay.
 *
 * @package FPL
 */

/* ==========================================================================
   0. Centralized CSS Custom Properties
   ========================================================================== */
:root {
	--fpl-utility-height: 36px;
	--fpl-header-height: 72px;
	--fpl-header-height-compact: 60px;
	--fpl-header-logo-max-width: 240px;
	--fpl-header-logo-max-height: 48px;
	--fpl-header-logo-max-height-compact: 38px;
	--fpl-logo-max-height: var(--fpl-header-logo-max-height);
	--fpl-logo-max-height-compact: var(--fpl-header-logo-max-height-compact);
	--fpl-header-wide-size: var(--wp--style--global--wide-size, 1440px);
	--fpl-header-container-padding: 24px;
}

/* ==========================================================================
   1. Shared Inner Centered Grid Containers & Zero Block Gap Resets
   ========================================================================== */
/* Full-Width Shell Breakout for Outer Header Elements */
.fpl-header-template-part,
.site-header-wrapper,
.wp-site-blocks > .fpl-header-template-part,
.wp-site-blocks > .site-header-wrapper,
.wp-site-blocks > .wp-block-template-part,
.is-layout-constrained > .fpl-header-template-part,
.is-layout-constrained > .site-header-wrapper,
.is-layout-constrained > .wp-block-template-part-header {
	width: 100%;
	max-width: 100%;
	margin-left: 0;
	margin-right: 0;
	box-sizing: border-box;
}

/* Inner Centered Grid Containers (Bounded to max 1440px) */
.fpl-container-wide,
.utility-bar-inner,
.main-header-inner {
	width: min(calc(100% - (var(--fpl-header-container-padding) * 2)), var(--fpl-header-wide-size));
	max-width: var(--fpl-header-wide-size);
	margin-inline: auto;
	margin-left: auto;
	margin-right: auto;
	height: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-sizing: border-box;
}

/* Explicit Reset for Gutenberg Block Gap Spacing */
.site-header-wrapper,
.site-header-wrapper > *,
.site-header-wrapper.is-layout-constrained > *,
.site-header-wrapper .utility-bar,
.site-header-wrapper .main-header,
.site-header-wrapper .main-header-inner,
.site-header-wrapper .desktop-navigation,
.site-header-wrapper .site-logo-group,
.site-header-wrapper .header-right-controls,
.fpl-header-template-part {
	margin-block-start: 0;
	margin-block-end: 0;
	margin-top: 0;
	margin-bottom: 0;
}

/* ==========================================================================
   2. Header Base Geometry & Behavior Modes Driven by body_class
   ========================================================================== */
.site-header-wrapper {
	width: 100%;
	max-width: 100%;
	background-color: var(--wp--preset--color--white);
	z-index: 1000;
	margin-bottom: 0;
	margin-block-end: 0;
	transition: box-shadow 0.22s ease;
}

/* Mode: static (No sticky behavior) */
body.fpl-header-static .wp-site-blocks > .wp-block-template-part:first-child,
body.fpl-header-static .site-header-wrapper {
	position: relative;
	top: auto;
	box-shadow: 0 2px 15px rgba(22, 85, 103, 0.04);
}

/* Mode: sticky (Full 2-level header sticky across the entire page) */
body.fpl-header-sticky .wp-site-blocks > .wp-block-template-part:first-child,
body.fpl-header-sticky .site-header-wrapper {
	position: sticky;
	top: 0;
	z-index: 1000;
	box-shadow: 0 2px 15px rgba(22, 85, 103, 0.06);
}

/* Mode: compact_sticky (Default with FPL Core: Utility hides, Main Header shrinks) */
body.fpl-header-compact-sticky .wp-site-blocks > .wp-block-template-part:first-child,
body.fpl-header-compact-sticky .site-header-wrapper {
	position: sticky;
	top: 0;
	z-index: 1000;
	box-shadow: 0 2px 15px rgba(22, 85, 103, 0.04);
}

/* WordPress Admin Bar Compatibility Offsets */
body.admin-bar.fpl-header-sticky .wp-site-blocks > .wp-block-template-part:first-child,
body.admin-bar.fpl-header-sticky .site-header-wrapper,
body.admin-bar.fpl-header-compact-sticky .wp-site-blocks > .wp-block-template-part:first-child,
body.admin-bar.fpl-header-compact-sticky .site-header-wrapper {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar.fpl-header-sticky .wp-site-blocks > .wp-block-template-part:first-child,
	body.admin-bar.fpl-header-sticky .site-header-wrapper,
	body.admin-bar.fpl-header-compact-sticky .wp-site-blocks > .wp-block-template-part:first-child,
	body.admin-bar.fpl-header-compact-sticky .site-header-wrapper {
		top: 46px;
	}
}

/* ==========================================================================
   3. Utility Bar Component (Top Level Header: 36px, Approved Light Cielo)
   ========================================================================== */
.utility-bar {
	width: 100%;
	max-width: 100%;
	background-color: var(--wp--preset--color--cielo);
	color: var(--wp--preset--color--diviza);
	height: var(--fpl-utility-height);
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: 12px;
	font-weight: 500;
	position: relative;
	z-index: 1002;
	overflow: hidden;
	border-bottom: 1px solid var(--wp--preset--color--border-light);
	transition: max-height 0.28s cubic-bezier(0.4, 0, 0.2, 1), height 0.28s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.22s ease, padding 0.28s ease, visibility 0.28s ease;
}

/* Compact Sticky State: Hide Utility Bar upon Scroll */
body.fpl-header-compact-sticky.is-scrolled .utility-bar,
body.fpl-header-compact-sticky .site-header-wrapper.is-shrunk .utility-bar,
body.fpl-header-compact-sticky .is-shrunk .utility-bar,
.site-header-wrapper.is-shrunk .utility-bar {
	height: 0;
	max-height: 0;
	padding-top: 0;
	padding-bottom: 0;
	margin-top: 0;
	margin-bottom: 0;
	border-bottom-width: 0;
	opacity: 0;
	pointer-events: none;
	overflow: hidden;
	visibility: hidden;
}

.utility-bar a {
	color: var(--wp--preset--color--diviza);
	text-decoration: none;
	transition: opacity 0.2s ease, color 0.2s ease;
}

.utility-bar a:hover {
	color: var(--wp--preset--color--aviazone);
}

.utility-left,
.utility-right {
	display: flex;
	align-items: center;
	gap: 20px;
}

.utility-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.utility-item svg {
	width: 14px;
	height: 14px;
	fill: currentColor;
	opacity: 0.85;
}

/* Accessibility contrast mode toggle inside utility bar */
.accessibility-toggle-btn {
	background: transparent;
	border: none;
	color: var(--wp--preset--color--diviza);
	font-family: inherit;
	font-size: 12px;
	font-weight: 500;
	cursor: pointer;
	padding: 0;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.accessibility-toggle-btn:hover {
	color: var(--wp--preset--color--aviazone);
}

/* Polylang Language Switcher in Utility Bar */
.utility-lang-switcher {
	display: flex;
	align-items: center;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.utility-lang-switcher li {
	display: inline-block;
	margin: 0;
	padding: 0;
}

.utility-lang-switcher a {
	font-weight: 600;
	text-transform: uppercase;
	font-size: 11px;
	letter-spacing: 0.5px;
	padding: 2px 6px;
	border-radius: 4px;
	color: var(--wp--preset--color--diviza);
}

.utility-lang-switcher li.current-lang a {
	background-color: var(--wp--preset--color--aviazone);
	color: var(--wp--preset--color--white);
}

/* ==========================================================================
   4. Main Header Component (Normal: 72px, Compact: 60px)
   ========================================================================== */
.main-header {
	width: 100%;
	max-width: 100%;
	height: var(--fpl-header-height);
	background-color: var(--wp--preset--color--white);
	border-bottom: 1px solid var(--wp--preset--color--border-light);
	position: relative;
	z-index: 1001;
	transition: height 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.22s ease;
}

/* Compact Sticky Transition */
body.fpl-header-compact-sticky.is-scrolled .main-header,
body.fpl-header-compact-sticky .site-header-wrapper.is-shrunk .main-header,
.site-header-wrapper.is-shrunk .main-header {
	height: var(--fpl-header-height-compact);
	box-shadow: 0 4px 20px rgba(22, 85, 103, 0.08);
}

/* Logo Group & Responsive Scaling */
.site-logo-group {
	display: flex;
	align-items: center;
	gap: 14px;
	text-decoration: none;
	color: var(--wp--preset--color--diviza);
	flex-shrink: 0;
	min-width: 0;
	max-width: 100%;
}

.custom-logo-link {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	max-width: 100%;
	line-height: 0;
	min-width: 0;
}

.custom-logo,
.site-logo-img {
	display: block;
	width: auto;
	height: auto;
	max-width: var(--fpl-header-logo-max-width, 240px);
	max-height: var(--fpl-header-logo-max-height, 48px);
	object-fit: contain;
	transition: max-height 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

body.fpl-header-compact-sticky.is-scrolled .custom-logo,
body.fpl-header-compact-sticky.is-scrolled .site-logo-img,
.site-header-wrapper.is-shrunk .custom-logo,
.site-header-wrapper.is-shrunk .site-logo-img {
	max-height: var(--fpl-header-logo-max-height-compact, 38px);
}

.site-title-text {
	display: flex;
	flex-direction: column;
}

.site-title-main {
	font-family: var(--fpl-font-heading);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--wp--preset--color--diviza);
	letter-spacing: -0.2px;
}

.site-title-tagline {
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: 10px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--wp--preset--color--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-top: 2px;
}

/* Primary Desktop Navigation Slot */
.desktop-navigation {
	display: flex;
	align-items: center;
}

/* Right Header Controls (Search Icon & Call Center Quick Action) */
.header-right-controls {
	display: flex;
	align-items: center;
	gap: 16px;
}

.header-search-btn {
	background: transparent;
	border: none;
	color: var(--wp--preset--color--diviza);
	cursor: pointer;
	padding: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.header-search-btn:hover {
	background-color: var(--wp--preset--color--cielo);
	color: var(--wp--preset--color--aviazone);
}

.header-search-btn svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

/* Header Global Search Dropdown / Modal */
.header-search-trigger {
	position: relative;
}

.header-search-bar {
	position: absolute;
	right: 0;
	top: calc(100% + 8px);
	width: 340px;
	background: #ffffff;
	border: 1px solid rgba(15, 76, 129, 0.15);
	border-radius: 8px;
	box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.12), 0 8px 10px -6px rgba(0, 0, 0, 0.08);
	padding: 6px;
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.header-search-bar.is-open {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.header-search-form {
	display: flex;
	align-items: center;
	gap: 6px;
	width: 100%;
	margin: 0;
}

.header-search-input {
	flex: 1;
	border: 1px solid #e2e8f0;
	border-radius: 6px;
	padding: 8px 12px;
	font-family: inherit;
	font-size: 14px;
	line-height: 1.4;
	color: #1e293b;
	background: #f8fafc;
	outline: none;
	transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.header-search-input:focus {
	border-color: var(--wp--preset--color--diviza, #0f4c81);
	background: #ffffff;
	box-shadow: 0 0 0 2px rgba(15, 76, 129, 0.15);
}

.header-search-submit,
.header-search-close {
	background: transparent;
	border: none;
	padding: 8px;
	color: var(--wp--preset--color--diviza, #0f4c81);
	cursor: pointer;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.header-search-submit:hover,
.header-search-close:hover {
	background-color: var(--wp--preset--color--cielo, #f1f5f9);
	color: var(--wp--preset--color--aviazone, #002b49);
}

.header-search-submit:focus-visible,
.header-search-close:focus-visible {
	outline: 2px solid var(--wp--preset--color--diviza, #0f4c81);
	outline-offset: 2px;
}

@media (max-width: 480px) {
	.header-search-bar {
		position: fixed;
		left: 12px;
		right: 12px;
		top: 64px;
		width: calc(100vw - 24px);
		box-sizing: border-box;
	}
}

.header-cta-btn {
	background-color: var(--wp--preset--color--diviza);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.5px;
	padding: 8px 16px;
	border-radius: 6px;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color 0.2s ease;
}

.header-cta-btn:hover {
	background-color: var(--wp--preset--color--diviza-dark);
}

/* Mobile Hamburger Toggle Button */
.mobile-menu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	padding: 10px;
	background: transparent;
	border: none;
	border-radius: 6px;
	color: var(--wp--preset--color--diviza);
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.mobile-menu-toggle:hover,
.mobile-menu-toggle:focus-visible {
	background-color: var(--wp--preset--color--cielo);
	color: var(--wp--preset--color--aviazone);
	outline: none;
}

.mobile-menu-toggle .hamburger-box {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
}

.mobile-menu-toggle svg {
	display: block;
	width: 24px;
	height: 24px;
	fill: currentColor;
}

/* ==========================================================================
   5. Mobile Navigation Drawer Overlay
   ========================================================================== */
.mobile-drawer-overlay,
.mobile-menu-overlay {
	position: fixed;
	inset: 0;
	background-color: rgba(22, 85, 103, 0.5);
	backdrop-filter: blur(4px);
	z-index: 2000;
	opacity: 0;
	visibility: hidden;
	overflow: hidden;
	pointer-events: none;
	transition: opacity 0.25s ease, visibility 0.25s ease;
}

.mobile-drawer-backdrop {
	position: absolute;
	inset: 0;
	cursor: pointer;
}

body.menu-open .mobile-drawer-overlay,
body.mobile-menu-open .mobile-drawer-overlay,
body.menu-open .mobile-menu-overlay,
body.mobile-menu-open .mobile-menu-overlay,
.mobile-drawer-overlay.is-active,
.mobile-menu-overlay.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.mobile-drawer-content,
.mobile-menu-content {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(85vw, 360px);
	height: 100vh;
	height: 100dvh;
	background-color: var(--wp--preset--color--white);
	z-index: 2001;
	padding: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-shadow: -10px 0 30px rgba(22, 85, 103, 0.15);
	transform: translateX(100%);
	visibility: hidden;
	transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.28s ease;
}

body.menu-open .mobile-drawer-content,
body.mobile-menu-open .mobile-drawer-content,
body.menu-open .mobile-menu-content,
body.mobile-menu-open .mobile-menu-content,
.mobile-drawer-overlay.is-active .mobile-drawer-content,
.mobile-menu-overlay.is-active .mobile-menu-content {
	transform: translateX(0);
	visibility: visible;
}

body.menu-open,
body.mobile-menu-open {
	overflow: hidden !important;
	touch-action: none;
}

.mobile-drawer-header,
.mobile-menu-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 20px;
	border-bottom: 1px solid var(--wp--preset--color--border-light);
	flex-shrink: 0;
}

.mobile-drawer-title {
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: 16px;
	font-weight: 700;
	color: var(--wp--preset--color--diviza);
}

.mobile-drawer-close,
.mobile-menu-close {
	background: transparent;
	border: none;
	color: var(--wp--preset--color--diviza);
	cursor: pointer;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 6px;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.mobile-drawer-close:hover,
.mobile-drawer-close:focus-visible,
.mobile-menu-close:hover,
.mobile-menu-close:focus-visible {
	background-color: var(--wp--preset--color--cielo);
	color: var(--wp--preset--color--aviazone);
	outline: none;
}

.mobile-drawer-close svg,
.mobile-menu-close svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}

.mobile-drawer-body {
	flex: 1;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.mobile-drawer-nav {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.mobile-drawer-nav a {
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: 15px;
	font-weight: 600;
	color: var(--wp--preset--color--diviza);
	text-decoration: none;
	padding: 8px 0;
	border-bottom: 1px solid var(--wp--preset--color--cielo);
}

/* ==========================================================================
   6. Responsive Viewport Adaptations
   ========================================================================== */
@media (min-width: 1024px) {
	.desktop-navigation {
		display: flex !important;
	}

	.header-languages {
		display: flex !important;
	}

	.mobile-menu-toggle {
		display: none !important;
	}

	.mobile-drawer-overlay,
	.mobile-menu-overlay {
		display: none !important;
	}
}

@media (max-width: 1023px) {
	.desktop-navigation,
	.header-languages,
	.header-cta-btn {
		display: none !important;
	}

	.mobile-menu-toggle {
		display: inline-flex !important;
	}
.custom-logo,
	.site-logo-img {
		max-width: min(var(--fpl-header-logo-max-width, 240px), 200px);
	}
}

@media (max-width: 639px) {
	:root {
		--fpl-header-container-padding: 16px;
	}

	.site-title-tagline {
		display: none;
	}

	.custom-logo,
	.site-logo-img {
		max-width: min(var(--fpl-header-logo-max-width, 240px), 160px);
		max-height: min(var(--fpl-header-logo-max-height, 48px), 40px);
	}
}

@media (max-width: 375px) {
	.custom-logo,
	.site-logo-img {
		max-width: min(var(--fpl-header-logo-max-width, 240px), 140px);
		max-height: min(var(--fpl-header-logo-max-height, 48px), 36px);
	}
}


/* ==========================================================================
   HEADER-UTILITY-01 / rc5
   Managed multilingual utility menu + single language switcher
   ========================================================================== */

.utility-bar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 100%;
	gap: 24px;
}

.utility-bar-left,
.utility-bar-right {
	display: flex;
	align-items: center;
	min-width: 0;
}

.utility-bar-left {
	flex: 1 1 auto;
}

.utility-bar-right {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 16px;
}

.utility-navigation {
	display: block;
	min-width: 0;
}

.utility-menu-list {
	display: flex;
	align-items: center;
	gap: 22px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.utility-menu-list > li {
	display: block;
	margin: 0;
	padding: 0;
	white-space: nowrap;
}

.utility-menu-list a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.3;
	text-decoration: none;
}

.utility-menu-list .utility-external > a::after {
	content: "↗";
	font-size: 0.9em;
	line-height: 1;
	opacity: 0.75;
}

/* Accessibility & Language switcher alignment and high-contrast color scheme */
.utility-accessibility {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: 24px;
	min-height: 24px;
	box-sizing: border-box;
	padding: 0 6px;
	line-height: 1;
	color: var(--wp--preset--color--diviza, #165567);
	text-decoration: none;
	border-radius: 4px;
	transition: color 0.15s ease, background-color 0.15s ease;
}

.utility-accessibility:hover {
	color: var(--wp--preset--color--diviza-dark, #0e3b48);
	background-color: rgba(22, 85, 103, 0.08);
}

.utility-accessibility:focus-visible {
	outline: 2px solid var(--wp--preset--color--diviza, #165567) !important;
	outline-offset: 2px !important;
}

.utility-accessibility svg {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	display: block;
}

.utility-accessibility-text {
	font-size: 11px;
	font-weight: 500;
	line-height: 1;
}

.utility-languages {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
}

.utility-languages .language-switcher-list {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.utility-languages .language-item {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 0;
}

.utility-languages .language-item a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 24px;
	min-height: 24px;
	min-width: 24px;
	padding: 0 6px;
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--wp--preset--color--diviza, #165567);
	background-color: transparent;
	text-decoration: none;
	border-radius: 4px;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.utility-languages .language-item:not(.is-active) a:hover {
	background-color: rgba(22, 85, 103, 0.08);
	color: var(--wp--preset--color--diviza-dark, #0e3b48);
}

.utility-languages .language-item a:focus-visible {
	outline: 2px solid var(--wp--preset--color--diviza, #165567) !important;
	outline-offset: 2px !important;
}

.utility-languages .language-item.is-active a,
.utility-languages .language-item.current-lang a {
	background-color: var(--wp--preset--color--diviza, #165567);
	color: var(--wp--preset--color--white, #ffffff);
}

.utility-languages .language-item.is-active a:hover,
.utility-languages .language-item.current-lang a:hover {
	background-color: var(--wp--preset--color--diviza-dark, #0e3b48);
	color: var(--wp--preset--color--white, #ffffff);
}

.utility-languages .language-item.is-active a:focus-visible,
.utility-languages .language-item.current-lang a:focus-visible {
	outline: 2px solid var(--wp--preset--color--diviza-dark, #0e3b48) !important;
	outline-offset: 2px !important;
}

@media (max-width: 1023px) {

	.utility-bar {
		display: block;
	}

	.utility-bar-inner {
		padding-left: var(--fpl-header-container-padding);
		padding-right: var(--fpl-header-container-padding);
		gap: 16px;
	}

	.utility-menu-list {
		gap: 14px;
	}

	.utility-menu-list a {
		font-size: 11px;
	}

	.utility-accessibility-text {
		display: none;
	}

	.utility-accessibility {
		padding: 0 5px;
	}
}

@media (max-width: 639px) {

	.utility-menu-list > li:not(.utility-eotinish) {
		display: none;
	}

	.utility-bar-right {
		gap: 8px;
	}

	.utility-accessibility {
		display: none;
	}

	.utility-languages .language-switcher-list {
		gap: 3px;
	}

	.utility-languages .language-item a {
		font-size: 10px;
		padding: 0 4px;
		height: 24px;
		min-height: 24px;
		min-width: 24px;
	}
}

/* HEADER-UTILITY-01 / rc5 — centered container corrective fix */

/*
 * Outer utility bar is the full-width background band.
 * It must not behave as the WordPress flex layout container.
 */
.site-header-wrapper .utility-bar {
        display: block !important;
}

/*
 * Inner utility content follows the same centered-container model
 * as the main header.
 */
.site-header-wrapper .utility-bar-inner {
        margin-left: auto !important;
        margin-right: auto !important;
}