/* ============================================================
   Mega Menu Pro — Frontend Styles v1.0.3
   Bankmonitor-ihlette design
   ============================================================ */

:root {
	--mmp-accent:       #e84f0c;   /* Narancs kiemelő szín     */
	--mmp-bg:           #ffffff;
	--mmp-text:         #1a1a1a;
	--mmp-text-light:   #555555;
	--mmp-link-hover:   var(--mmp-accent);
	--mmp-divider:      #e8e8e8;
	--mmp-col3-bg:      #f8f8f8;
	--mmp-shadow:       0 6px 24px rgba(0,0,0,0.10);
	--mmp-border-top:   3px solid var(--mmp-accent);
	--mmp-width:        900px;
	--mmp-pad:          32px;
	--mmp-transition:   0.18s ease;
	--mmp-z:            9999;
}

/* ═══════════════════════════════════════════════════════════
   STANDALONE NAV — [mmp_nav] shortcode
   Elementorban egy HTML widgetbe: [mmp_nav location="primary"]
   ═══════════════════════════════════════════════════════════ */

.mmp-nav-wrapper {
	display:        flex !important;
	flex-direction: row !important;
	align-items:    center !important;
	position:       relative !important;
	width:          100% !important;
}

/* Hamburger — desktopon MINDIG rejtett */
.mmp-hamburger {
	display:         none !important;
	flex-direction:  column;
	justify-content: center;
	gap:             5px;
	background:      none;
	border:          none;
	padding:         10px;
	cursor:          pointer;
	z-index:         100;
}

.mmp-hamburger-line {
	display:    block;
	width:      26px;
	height:     2px;
	background: var(--mmp-text);
	border-radius: 2px;
	transition: transform 0.22s ease, opacity 0.22s ease;
}

/* X animáció nyitott állapotban */
.mmp-hamburger.mmp-open .mmp-hamburger-line:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.mmp-hamburger.mmp-open .mmp-hamburger-line:nth-child(2) { opacity: 0; }
.mmp-hamburger.mmp-open .mmp-hamburger-line:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

/* Desktop nav */
.mmp-standalone-nav {
	display:     flex !important;
	align-items: stretch !important;
	position:    relative !important;
}

.mmp-standalone-menu,
.mmp-standalone-menu ul {
	display:     flex !important;
	align-items: stretch !important;
	list-style:  none !important;
	margin:      0 !important;
	padding:     0 !important;
	gap:         0 !important;
}

.mmp-standalone-menu > .menu-item {
	display:     flex !important;
	align-items: stretch !important;
	position:    relative !important;
	list-style:  none !important;
}

/* Főmenü elemek linkjei */
.mmp-standalone-menu > .menu-item > a {
	display:         flex !important;
	align-items:     center !important;
	padding:         0 18px !important;
	height:          60px !important;
	color:           var(--mmp-text) !important;
	font-size:       15px !important;
	font-weight:     600 !important;
	text-decoration: none !important;
	border-bottom:   3px solid transparent !important;
	transition:      color var(--mmp-transition), border-color var(--mmp-transition) !important;
	white-space:     nowrap !important;
	background:      transparent !important;
}

.mmp-standalone-menu > .menu-item > a:hover,
.mmp-standalone-menu > .menu-item.current-menu-item > a,
.mmp-standalone-menu > .menu-item.current-page-ancestor > a,
.mmp-standalone-menu > .mmp-mega-item.is-open > a {
	color:        var(--mmp-accent) !important;
	border-color: var(--mmp-accent) !important;
}

/* ── Standalone mobilnézet ─────────────────────────────────────── */

@media ( max-width: 1024px ) {

	.mmp-hamburger {
		display:         flex !important;
		flex-direction:  column !important;
		justify-content: center !important;
		gap:             5px !important;
	}

	/* CSS !important legyőzi a normál inline style="display:flex" értéket */
	.mmp-standalone-nav {
		display:    none !important;
		position:   absolute !important;
		top:        100% !important;
		left:       0 !important;
		right:      0 !important;
		width:      100vw !important;
		background: #ffffff !important;
		box-shadow: 0 6px 24px rgba(0,0,0,0.10) !important;
		border-top: 3px solid var(--mmp-accent) !important;
		z-index:    9998 !important;
	}

	.mmp-standalone-nav.mmp-mobile-open {
		display: block !important;
	}

	.mmp-standalone-menu,
	.mmp-standalone-menu ul {
		flex-direction: column !important;
		align-items:    stretch !important;
		width:          100% !important;
	}

	.mmp-standalone-menu > .menu-item {
		display:       block !important;
		border-bottom: 1px solid var(--mmp-divider) !important;
	}

	.mmp-standalone-menu > .menu-item:last-child {
		border-bottom: none !important;
	}

	.mmp-standalone-menu > .menu-item > a {
		height:      auto !important;
		padding:     14px 20px !important;
		white-space: normal !important;
		width:       100% !important;
	}

	/* Standalone mobilon a mega dropdown statikus */
	.mmp-standalone-nav .mmp-dropdown {
		position:  static !important;
		transform: none !important;
		width:     100% !important;
		left:      auto !important;
		box-shadow: none !important;
		border-top: 1px solid var(--mmp-divider) !important;
	}
}

/* ── Trigger elem ──────────────────────────────────────────── */

.mmp-mega-item {
	position: relative;
}

/* ── Dropdown panel ────────────────────────────────────────── */

.mmp-dropdown {
	position:    absolute;
	top:         100%;
	/* left és width értékét a frontend.js állítja be dinamikusan,
	   a navigációs sáv méretéhez igazítva. Fallback: 900px */
	left:        50%;
	transform:   translateX(-50%);
	width:       var(--mmp-width);
	background:  var(--mmp-bg);
	box-shadow:  var(--mmp-shadow);
	border-top:  var(--mmp-border-top);
	z-index:     var(--mmp-z);

	opacity:         0;
	visibility:      hidden;
	pointer-events:  none;
	transition:      opacity var(--mmp-transition), visibility var(--mmp-transition);
}

/* Csak a JS által adott is-open class nyitja meg — nincs CSS :hover trigger */
.mmp-mega-item.is-open > .mmp-dropdown {
	opacity:         1;
	visibility:      visible;
	pointer-events:  all;
}

/* ── Belső flex sor ────────────────────────────────────────── */

.mmp-inner {
	display:      flex;
	align-items:  stretch;
	padding:      0;
	gap:          0;
}

/* ── Oszlopok ──────────────────────────────────────────────── */

.mmp-col {
	flex:      1;
	min-width: 0;
	padding:   28px 28px;
}

.mmp-col + .mmp-col {
	border-left: 1px solid var(--mmp-divider);
}

.mmp-col-1 { flex: 1.1; }
.mmp-col-2 { flex: 1.2; }
.mmp-col-3 {
	flex:        1.6;
	background:  var(--mmp-col3-bg);
}

/* ── Almenü link lista ─────────────────────────────────────── */

.mmp-col ul {
	list-style:  none;
	margin:      0;
	padding:     0;
}

.mmp-link-item {
	border-bottom: none;
}

.mmp-link-item > a {
	display:          flex;
	align-items:      center;
	justify-content:  space-between;
	padding:          11px 0;
	color:            var(--mmp-text);
	text-decoration:  none;
	font-size:        14px;
	font-weight:      400;
	line-height:      1.4;
	transition:       color var(--mmp-transition), background-color var(--mmp-transition);
	border-radius:    5px;
}

.mmp-link-item > a:hover,
.mmp-link-item.current-menu-item > a,
.mmp-link-item.current-page-ancestor > a {
	color: var(--mmp-accent);
}

/* Nyíl ikon */
.mmp-arrow {
	font-size:    20px;
	font-weight:  700;
	line-height:  1;
	flex-shrink:  0;
	margin-left:  auto;
	padding-left: 10px;
	color:        var(--mmp-text-light);
	opacity:      0.5;
	transition:   opacity var(--mmp-transition), color var(--mmp-transition);
}

.mmp-link-item:hover .mmp-arrow,
.mmp-link-item.mmp-hovered .mmp-arrow {
	opacity: 1;
	color:   var(--mmp-accent);
}

/* ── Almenü (mélység 2) ────────────────────────────────────── */

.mmp-sub-links {
	padding: 2px 0 8px 0 !important;
	margin:  0 !important;
}

.mmp-sub-link-item {
	border-bottom: none !important;
}

.mmp-sub-link-item > a {
	display:          block !important;
	padding:          4px 0 !important;
	font-size:        13px !important;
	color:            var(--mmp-text-light) !important;
	text-decoration:  none !important;
	transition:       color var(--mmp-transition) !important;
}

.mmp-sub-link-item > a:hover {
	color: var(--mmp-accent) !important;
}

/* ── Per-item col2 (dinamikus szöveg oszloponként) ─────────── */

.mmp-item-content {
	display: none;
}

.mmp-item-content.mmp-active {
	display: block;
}

/* ── Per-item col3 (dinamikus — col1 hoverrel váltódik) ─────── */

.mmp-item-content-col3 {
	display: none;
}

.mmp-item-content-col3.mmp-active {
	display: block;
}

/* Aktív col1 elem kiemelése (JS hover) */
.mmp-col-1 .mmp-link-item.mmp-hovered > a {
	color:       var(--mmp-accent) !important;
	font-weight: 600;
}

/* ── Promo oszlop ──────────────────────────────────────────── */

.mmp-promo-title {
	font-size:    18px;
	font-weight:  700;
	color:        var(--mmp-accent);
	margin:       0 0 14px 0;
	line-height:  1.3;
}

.mmp-promo-text {
	font-size:    14px;
	line-height:  1.7;
	color:        var(--mmp-text-light);
	margin:       0 0 18px 0;
}

.mmp-promo-text strong,
.mmp-promo-text b {
	color:       var(--mmp-text);
	font-weight: 600;
}

.mmp-promo-link {
	display:          inline-block;
	padding:          10px 22px;
	background:       var(--mmp-accent);
	color:            #fff !important;
	text-decoration:  none;
	border-radius:    3px;
	font-size:        14px;
	font-weight:      600;
	transition:       background var(--mmp-transition);
}

.mmp-promo-link:hover {
	background: #c94008;
}

/* ── Téma-kompatibilitás ───────────────────────────────────── */

header,
.site-header,
.site-header-section,
.main-navigation,
.nav-primary,
.nav-primary .main-nav,
.main-nav,
nav[role="navigation"],
ul.nav-menu,
ul.menu,
.elementor-nav-menu--main,
.elementor-nav-menu__container,
.elementor-widget-nav-menu {
	overflow: visible !important;
}

/* ── GeneratePress / téma CSS felülírása — CSAK DESKTOPON (mobilon ne ütközzön a hide-szabályokkal) */

@media ( min-width: 1025px ) {

	.mmp-dropdown .mmp-inner {
		display: flex !important;
	}

	.mmp-dropdown .mmp-col {
		display:    block !important;
		opacity:    1 !important;
		visibility: visible !important;
		position:   static !important;
	}

	.mmp-dropdown .mmp-col ul,
	.mmp-dropdown .mmp-col li,
	.mmp-dropdown .mmp-link-item,
	.mmp-dropdown .mmp-sub-link-item {
		display:    block !important;
		opacity:    1 !important;
		visibility: visible !important;
		position:   static !important;
		left:       auto !important;
		top:        auto !important;
		box-shadow: none !important;
		min-width:  0 !important;
		width:      auto !important;
	}

	.mmp-dropdown .mmp-link-item {
		padding:    0 !important;
		margin:     0 !important;
		background: transparent !important;
	}

	.mmp-dropdown .mmp-link-item > a {
		display:    block !important;
		opacity:    1 !important;
		visibility: visible !important;
		background: transparent;
		padding:    11px 0;
	}

}

/* Hover háttér a JS kezeli inline style-lal (lásd frontend.js mmpApplyHover) */

/* ── Mobilnézet ────────────────────────────────────────────── */

@media ( max-width: 1024px ) {

	.mmp-dropdown {
		position:    static;
		transform:   none;
		width:       100%;
		box-shadow:  none;
		border-top:  2px solid var(--mmp-divider);
		opacity:     1;
		visibility:  visible;
		pointer-events: all;
		display:     none;
	}

	.mmp-mega-item.is-open > .mmp-dropdown {
		display: block;
	}

	/* Flex iránya: column (desktop override block már NEM fut mobilon) */
	.mmp-dropdown .mmp-inner {
		display:        flex !important;
		flex-direction: column !important;
		width:          100% !important;
		gap:            0 !important;
	}

	/* Minden col alapbeállítás mobilon */
	.mmp-dropdown .mmp-col {
		flex:         none !important;
		width:        100% !important;
		border-left:  none !important;
		box-sizing:   border-box !important;
		padding:      16px 12px;
		border-bottom: 1px solid var(--mmp-divider);
	}

	.mmp-dropdown .mmp-col:last-child {
		border-bottom: none;
	}

	/* Col1 link elemek — láthatóak és egymás alatt (téma override ellen) */
	.mmp-dropdown .mmp-col-1 {
		display:    block !important;
		opacity:    1 !important;
		visibility: visible !important;
	}

	.mmp-dropdown .mmp-col-1 ul,
	.mmp-dropdown .mmp-col-1 li {
		display:    block !important;
		opacity:    1 !important;
		visibility: visible !important;
		position:   static !important;
		width:      auto !important;
	}

	.mmp-dropdown .mmp-col-1 .mmp-link-item {
		padding:    0 !important;
		margin:     0 !important;
		background: transparent !important;
	}

	.mmp-dropdown .mmp-col-1 .mmp-link-item > a {
		display:    block !important;
		opacity:    1 !important;
		visibility: visible !important;
		padding:    12px 0 !important;
	}

	/* Col2 és Col3 — REJTVE mobilon */
	.mmp-dropdown .mmp-col-2,
	.mmp-dropdown .mmp-col-3 {
		display: none !important;
	}
}
