/*
 * Molnár Autógáz – sötétkék fejléc („B” változat), élesítve 2026-10-28
 * Kizárólag CSS; a body.ma-hdr osztály a molnarautogaz-modern.php mu-pluginból jön.
 * Kikapcsolás: MA_MODERN_HEADER -> false (vagy összehasonlításhoz ?header=0),
 * ilyenkor a régi fejléc és a régi kék logó jelenik meg.
 */

/* ---------- Színek ---------- */

body.ma-hdr {
	--hb-top-bg: #0a1f2e;
	--hb-top-fg: #b9d5e4;
	--hb-top-icon: #22b8e6;
	--hb-top-sep: rgba(255, 255, 255, 0.12);
	--hb-bar-bg: linear-gradient(180deg, #12374f 0%, #0e2c41 100%);
	--hb-menu-fg: #ffffff;
	--hb-menu-hover-bg: rgba(255, 255, 255, 0.09);
	--hb-menu-hover-fg: #ffffff;
	--hb-menu-active-bg: #00a5d4;
	--hb-menu-active-fg: #ffffff;
	--hb-btn-bg: #ffffff;
	--hb-btn-fg: #0e2c41;
	--hb-btn-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
	--hb-icon-bg: rgba(255, 255, 255, 0.09);
	--hb-icon-fg: #ffffff;
	--hb-icon-hover-bg: #00a5d4;
	--hb-icon-hover-fg: #ffffff;
	--hb-drop-bg: #10324a;
	--hb-drop-fg: #e7f2f8;
	--hb-drop-hover-bg: rgba(255, 255, 255, 0.08);
	--hb-drop-sep: rgba(255, 255, 255, 0.08);
	--hb-accent: #00a5d4;
	--hb-shadow: 0 6px 24px rgba(0, 0, 0, 0.25);
	/* mobil */
	--hb-mbar-bg: #0a1f2e;
	--hb-micon-bg: rgba(255, 255, 255, 0.09);
	--hb-micon-fg: #ffffff;
	--hb-toggle-bg: rgba(255, 255, 255, 0.1);
	--hb-toggle-fg: #ffffff;
	--hb-mbtn-bg: #00a5d4;
	--hb-mbtn-fg: #ffffff;
	--hb-logo-bar-bg: #0e2c41;
}

/* ---------- Tapadó fejléc ---------- */

/* overflow:hidden helyett clip: ugyanúgy levágja a vízszintes kilógást, de nem gátolja a sticky-t */
body.ma-hdr .hfeed.site {
	overflow: visible !important;
	overflow-x: clip !important;
}

body.ma-hdr header#masthead {
	position: sticky;
	top: 0;
	z-index: 990; /* a jet-popup felugró ablakai 999-en vannak, azok a fejléc fölé kerüljenek */
}

body.ma-hdr .elementor-element-2fa459cd {
	box-shadow: var(--hb-shadow) !important;
}

/* ---------- Fő sáv (logó + menü) ---------- */

body.ma-hdr .elementor-element-2263428b {
	background: var(--hb-bar-bg) !important;
	position: relative;
	transition: padding 0.25s ease;
}

body.ma-hdr .elementor-element-2263428b::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 3px;
	background: var(--hb-accent);
}

body.ma-hdr .elementor-element-6a8a063a img {
	transition: max-height 0.25s ease;
}

/* Ügyfélkapu gomb (asztali és mobil) lakat ikonnal */
body.ma-hdr :is(.elementor-element-4f3e0ae, .elementor-element-ddab318) .elementor-button {
	background: var(--hb-btn-bg) !important;
	color: var(--hb-btn-fg) !important;
	border: 0 !important;
	border-radius: 999px !important;
	padding: 11px 20px 11px 17px !important;
	box-shadow: var(--hb-btn-shadow) !important;
	font-weight: 600 !important;
}

body.ma-hdr :is(.elementor-element-4f3e0ae, .elementor-element-ddab318) .elementor-button-text {
	color: var(--hb-btn-fg) !important;
}

body.ma-hdr :is(.elementor-element-4f3e0ae, .elementor-element-ddab318) .elementor-button-text::before {
	content: "";
	display: inline-block;
	width: 13px;
	height: 13px;
	margin-right: 7px;
	vertical-align: -1px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1a5 5 0 0 0-5 5v3H6a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V11a2 2 0 0 0-2-2h-1V6a5 5 0 0 0-5-5zm-3 8V6a3 3 0 0 1 6 0v3H9z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1a5 5 0 0 0-5 5v3H6a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V11a2 2 0 0 0-2-2h-1V6a5 5 0 0 0-5-5zm-3 8V6a3 3 0 0 1 6 0v3H9z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- Asztali és tablet ---------- */

@media (min-width: 768px) {

	/* Felső sáv */
	body.ma-hdr .elementor-element-5cf6c564 {
		background: var(--hb-top-bg) !important;
		padding-top: 6px !important;
		padding-bottom: 6px !important;
		max-height: 60px;
		overflow: hidden;
		transition: max-height 0.25s ease, padding 0.25s ease, opacity 0.2s ease;
	}

	body.ma-hdr .elementor-element-5588589 .elementor-icon-list-text {
		color: var(--hb-top-fg) !important;
		font-size: 13px !important;
		font-weight: 500 !important;
	}

	body.ma-hdr .elementor-element-5588589 li:first-child .elementor-icon-list-text {
		font-weight: 700 !important;
	}

	body.ma-hdr :is(.elementor-element-5588589, .elementor-element-32b36ea1) .elementor-icon-list-icon svg {
		fill: var(--hb-top-icon) !important;
	}

	body.ma-hdr .elementor-element-5588589 li + li {
		border-left: 1px solid var(--hb-top-sep);
		padding-left: 16px !important;
	}

	/* Nyitvatartás a felső sáv jobb oldalán, a Facebook-ikon előtt.
	   Valódi szöveg a fejlécsablonban („manyitva” ikonlista widget), Elementorban szerkeszthető. */
	body.ma-hdr :is(.elementor-element-38fbb9ac, .elementor-element-38fbb9ac > .e-con-inner) {
		width: auto !important;
		max-width: none !important;
		flex: 1 1 auto !important;
		justify-content: flex-end !important;
		align-items: center !important;
	}

	body.ma-hdr :is(.elementor-element-32b36ea1, .elementor-element-manyitva) {
		width: auto !important;
	}

	body.ma-hdr .elementor-element-manyitva {
		margin-right: 6px !important;
		padding-right: 16px;
		border-right: 1px solid var(--hb-top-sep);
	}

	body.ma-hdr .elementor-element-manyitva .elementor-icon-list-text {
		color: var(--hb-top-fg) !important;
		font-size: 13px !important;
		font-weight: 500 !important;
		white-space: nowrap;
	}

	body.ma-hdr .elementor-element-manyitva .elementor-icon-list-icon svg {
		fill: var(--hb-top-icon) !important;
	}

	/* Menü: kapszula alakú kiemelés az aláhúzás helyett */
	body.ma-hdr .elementor-element-4aa744b9 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item {
		color: var(--hb-menu-fg) !important;
		font-weight: 600 !important;
		padding: 9px 15px !important;
		margin: 0 2px;
		border-radius: 999px;
		transition: background-color 0.2s ease, color 0.2s ease;
	}

	body.ma-hdr .elementor-element-4aa744b9 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item:is(:hover, :focus, .highlighted) {
		background-color: var(--hb-menu-hover-bg) !important;
		color: var(--hb-menu-hover-fg) !important;
	}

	body.ma-hdr .elementor-element-4aa744b9 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item.elementor-item-active {
		background-color: var(--hb-menu-active-bg) !important;
		color: var(--hb-menu-active-fg) !important;
	}

	body.ma-hdr .elementor-element-4aa744b9 .elementor-item::before,
	body.ma-hdr .elementor-element-4aa744b9 .elementor-item::after {
		display: none !important;
	}

	body.ma-hdr .elementor-element-4aa744b9 .sub-arrow svg {
		fill: currentColor !important;
	}

	/* Lenyíló almenü */
	body.ma-hdr .elementor-element-4aa744b9 .sub-menu {
		background: var(--hb-drop-bg) !important;
		border: 0 !important;
		border-radius: 12px !important;
		box-shadow: 0 14px 34px rgba(16, 24, 40, 0.18) !important;
		padding: 8px !important;
		min-width: 230px !important;
		margin-top: 8px !important;
	}

	body.ma-hdr .elementor-element-4aa744b9 .sub-menu a.elementor-sub-item {
		color: var(--hb-drop-fg) !important;
		background: transparent !important;
		border-radius: 8px;
		padding: 10px 14px !important;
		font-weight: 500 !important;
		border: 0 !important;
	}

	body.ma-hdr .elementor-element-4aa744b9 .sub-menu a.elementor-sub-item:hover {
		background: var(--hb-drop-hover-bg) !important;
		color: var(--hb-menu-hover-fg) !important;
	}

	/* Felhasználó és kosár: kerek ikongombok */
	body.ma-hdr .elementor-element-2fe4148 {
		width: auto !important;
		gap: 10px !important;
	}

	body.ma-hdr :is(.elementor-element-4e09ae0, .elementor-element-ca95ef0) {
		width: auto !important;
	}

	body.ma-hdr :is(.elementor-element-4e09ae0, .elementor-element-ca95ef0) .elementor-icon {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		width: 42px;
		height: 42px;
		border-radius: 50%;
		background: var(--hb-icon-bg);
		transition: background-color 0.2s ease, transform 0.15s ease;
	}

	body.ma-hdr :is(.elementor-element-4e09ae0, .elementor-element-ca95ef0) .elementor-icon svg {
		width: 18px !important;
		height: 18px !important;
		fill: var(--hb-icon-fg) !important;
	}

	body.ma-hdr :is(.elementor-element-4e09ae0, .elementor-element-ca95ef0) .elementor-icon:hover {
		background: var(--hb-icon-hover-bg);
		transform: translateY(-1px);
	}

	body.ma-hdr :is(.elementor-element-4e09ae0, .elementor-element-ca95ef0) .elementor-icon:hover svg {
		fill: var(--hb-icon-hover-fg) !important;
	}

	/* Görgetés után: felső sáv eltűnik, fő sáv karcsúbb */
	body.ma-hdr.ma-scrolled .elementor-element-5cf6c564 {
		max-height: 0;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		opacity: 0;
	}

	body.ma-hdr.ma-scrolled .elementor-element-6a8a063a img {
		max-height: 40px;
		width: auto;
	}
}

/* ---------- Mobil ---------- */

@media (max-width: 767px) {

	/* Ikonsor: hívás gomb balra, menü és ügyfélkapu jobbra */
	body.ma-hdr .elementor-element-5cf6c564 {
		background: var(--hb-mbar-bg) !important;
		padding: 8px 12px !important;
	}

	body.ma-hdr :is(.elementor-element-5cf6c564, .elementor-element-5cf6c564 > .e-con-inner) {
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		gap: 8px !important;
	}

	/* A rejtett telefonsor első eleme zöld hívás-gombként jelenik meg */
	body.ma-hdr .elementor-element-1c9bb46e {
		display: flex !important;
		width: auto !important;
		flex: 0 0 auto !important;
		padding: 0 !important;
	}

	body.ma-hdr .elementor-element-5588589 li:not(:first-child),
	body.ma-hdr .elementor-element-5588589 li:first-child .elementor-icon-list-text {
		display: none !important;
	}

	body.ma-hdr .elementor-element-5588589 li:first-child a {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		border-radius: 50%;
		background: #22b357;
		box-shadow: 0 4px 12px rgba(34, 179, 87, 0.4);
	}

	body.ma-hdr .elementor-element-5588589 li:first-child .elementor-icon-list-icon {
		padding: 0 !important;
		margin: 0 !important;
	}

	body.ma-hdr .elementor-element-5588589 li:first-child svg {
		fill: #ffffff !important;
		width: 17px !important;
		height: 17px !important;
	}

	body.ma-hdr :is(.elementor-element-38fbb9ac, .elementor-element-38fbb9ac > .e-con-inner) {
		flex: 1 1 auto !important;
		width: auto !important;
		flex-direction: row !important;
		justify-content: flex-start !important;
		align-items: center !important;
		gap: 8px !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	body.ma-hdr .elementor-element-3caa3ae { order: 1; }
	body.ma-hdr .elementor-element-6b415fb { order: 2; }
	body.ma-hdr .elementor-element-32b36ea1 { order: 3; }
	body.ma-hdr .elementor-element-53b618b { order: 4; margin-left: auto !important; }
	body.ma-hdr .elementor-element-ddab318 { order: 5; }

	body.ma-hdr :is(.elementor-element-3caa3ae, .elementor-element-6b415fb, .elementor-element-32b36ea1) {
		width: auto !important;
		margin: 0 !important;
	}

	/* Felhasználó, kosár, Facebook: egységes kerek ikonok */
	body.ma-hdr :is(.elementor-element-3caa3ae, .elementor-element-6b415fb) .elementor-icon,
	body.ma-hdr .elementor-element-32b36ea1 li a {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		width: 38px;
		height: 38px;
		border-radius: 50%;
		background: var(--hb-micon-bg);
	}

	body.ma-hdr :is(.elementor-element-3caa3ae, .elementor-element-6b415fb) .elementor-icon svg,
	body.ma-hdr .elementor-element-32b36ea1 svg {
		width: 17px !important;
		height: 17px !important;
		fill: var(--hb-micon-fg) !important;
	}

	body.ma-hdr .elementor-element-32b36ea1 .elementor-icon-list-icon {
		padding: 0 !important;
		margin: 0 !important;
	}

	/* Menü gomb */
	body.ma-hdr .elementor-element-53b618b .elementor-menu-toggle {
		width: 42px;
		height: 42px;
		border-radius: 10px !important;
		background: var(--hb-toggle-bg) !important;
	}

	body.ma-hdr .elementor-element-53b618b .elementor-menu-toggle svg {
		fill: var(--hb-toggle-fg) !important;
	}

	body.ma-hdr .elementor-element-ddab318 .elementor-button {
		background: var(--hb-mbtn-bg) !important;
		padding: 10px 14px 10px 12px !important;
		font-size: 13px !important;
		box-shadow: none !important;
	}

	body.ma-hdr .elementor-element-ddab318 .elementor-button-text {
		color: var(--hb-mbtn-fg) !important;
	}

	/* Logósor: kisebb, központi logó */
	body.ma-hdr .elementor-element-2263428b {
		background: var(--hb-logo-bar-bg) !important;
		padding: 8px 0 11px !important;
		max-height: 90px;
		overflow: hidden;
		transition: max-height 0.25s ease, padding 0.25s ease;
	}

	body.ma-hdr .elementor-element-6a8a063a img {
		max-width: 230px !important;
		height: auto;
	}

	/* Kinyitott mobilmenü: balra zárt, elválasztott, nagy érintési felület */
	body.ma-hdr .elementor-element-53b618b nav.elementor-nav-menu--dropdown {
		background: var(--hb-drop-bg) !important;
		box-shadow: 0 18px 40px rgba(16, 24, 40, 0.25) !important;
		border-radius: 0 0 14px 14px !important;
		margin-top: 8px !important;
	}

	body.ma-hdr .elementor-element-53b618b nav.elementor-nav-menu--dropdown a {
		justify-content: flex-start !important;
		text-align: left !important;
		color: var(--hb-drop-fg) !important;
		background: transparent !important;
		font-weight: 600 !important;
		font-size: 16px !important;
		padding: 15px 22px !important;
		border-bottom: 1px solid var(--hb-drop-sep) !important;
		border-left: 4px solid transparent !important;
	}

	body.ma-hdr .elementor-element-53b618b nav.elementor-nav-menu--dropdown .sub-arrow svg {
		fill: currentColor !important;
	}

	body.ma-hdr .elementor-element-53b618b nav.elementor-nav-menu--dropdown a.elementor-item-active {
		color: #00a5d4 !important;
		border-left-color: #00a5d4 !important;
		background: var(--hb-drop-hover-bg) !important;
	}

	/* Görgetés után: csak az ikonsor marad látható */
	body.ma-hdr.ma-scrolled .elementor-element-2263428b {
		max-height: 0;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.ma-hdr :is(.elementor-element-5cf6c564, .elementor-element-2263428b, .elementor-element-6a8a063a img) {
		transition: none !important;
	}
}

/* ---------- Kisebb laptopok (1025–1279 px) ---------- */

/* A menü egy sorban maradjon: a régi fejlécben itt a „Kapcsolat” új sorba csúszott,
   az „Ügyfélkapu” felirat kettétört. */
body.ma-hdr :is(.elementor-element-4f3e0ae, .elementor-element-ddab318) .elementor-button {
	white-space: nowrap;
}

@media (min-width: 1025px) and (max-width: 1279px) {
	body.ma-hdr .elementor-element-4aa744b9 .elementor-nav-menu--main > .elementor-nav-menu {
		flex-wrap: nowrap !important;
	}

	body.ma-hdr .elementor-element-4aa744b9 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item {
		padding: 8px 10px !important;
		margin: 0 !important;
		font-size: 14px !important;
	}

	body.ma-hdr .elementor-element-4f3e0ae .elementor-button {
		padding: 10px 15px 10px 13px !important;
	}

	body.ma-hdr .elementor-element-2fe4148 {
		gap: 6px !important;
	}

	body.ma-hdr :is(.elementor-element-4e09ae0, .elementor-element-ca95ef0) .elementor-icon {
		width: 38px;
		height: 38px;
	}
}

@media (min-width: 1025px) and (max-width: 1139px) {
	body.ma-hdr .elementor-element-6a8a063a {
		max-width: 165px !important;
	}

	body.ma-hdr .elementor-element-4aa744b9 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item {
		padding: 8px 7px !important;
	}

	body.ma-hdr .elementor-element-4f3e0ae .elementor-button {
		padding: 9px 12px 9px 11px !important;
		font-size: 14px !important;
	}
}
