/**
 * Advanced Menu Module - CSS
 * Modern többszintű navigáció responsive dizájnnal
 * FONTOS: A media query-k dinamikusak, az inline CSS-ben generálódnak!
 */

/* ===== NAVBAR ALAPOK ===== */

.navbar {
    position: relative;
    /* background-color, border, padding, margin - BACKEND-RŐL vezérelve inline CSS-ben */
}

/* Hamburger gomb (mobil) */
.navbar-toggler {
    border: none;
    background-color: transparent;
    cursor: pointer;
    /* padding, margin - BACKEND-RŐL vezérelve inline CSS-ben */
}

.navbar-toggler:focus {
    outline: 2px solid #0d79bf;
    outline-offset: 2px;
}

.navbar-toggler .icon-menu {
    display: block;
    width: 24px;
    height: 2px;
    background-color: #333;
    position: relative;
    transition: background-color 0.3s;
}

.navbar-toggler .icon-menu::before,
.navbar-toggler .icon-menu::after {
    content: '';
    display: block;
    width: 24px;
    height: 2px;
    background-color: #333;
    position: absolute;
    transition: transform 0.3s;
}

.navbar-toggler .icon-menu::before {
    top: -7px;
}

.navbar-toggler .icon-menu::after {
    bottom: -7px;
}

/* Hamburger animáció amikor nyitva - aria-expanded VAGY data-expanded */
.navbar-toggler[aria-expanded="true"] .icon-menu,
.navbar-toggler[data-expanded="true"] .icon-menu {
    background-color: transparent !important;
}

.navbar-toggler[aria-expanded="true"] .icon-menu::before,
.navbar-toggler[data-expanded="true"] .icon-menu::before {
    transform: rotate(45deg) translate(5px, 5px);
}

.navbar-toggler[aria-expanded="true"] .icon-menu::after,
.navbar-toggler[data-expanded="true"] .icon-menu::after {
    transform: rotate(-45deg) translate(5px, -5px);
}

/* Hamburger RESET amikor zárt - EXPLICIT! */
.navbar-toggler[aria-expanded="false"] .icon-menu,
.navbar-toggler[data-expanded="false"] .icon-menu {
    background-color: #333 !important;
}

.navbar-toggler[aria-expanded="false"] .icon-menu::before,
.navbar-toggler[data-expanded="false"] .icon-menu::before {
    transform: rotate(0deg) translate(0, 0) !important;
}

.navbar-toggler[aria-expanded="false"] .icon-menu::after,
.navbar-toggler[data-expanded="false"] .icon-menu::after {
    transform: rotate(0deg) translate(0, 0) !important;
}

/* ===== ÁLTALÁNOS STÍLUSOK (mindkét nézet) ===== */

.mod-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav-item a,
.nav-item .mod-menu__heading {
    text-decoration: none;
    cursor: pointer;
}

.menu-main {
    display: block;
}

.menu-sub {
    display: block;
}

/* Submenu alapértelmezett */
.mod-menu__sub {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Parent elemek */
.nav-item.parent {
    position: relative;
}

/* Parent nyilak elrejtése - NINCS vizuális jelölés */
.nav-item.parent > a::after,
.nav-item.parent > .mod-menu__heading::after {
    display: none !important;
    content: none !important;
}

/* Akadálymentesség */
.nav-item a:focus,
.mod-menu__heading:focus,
.submenu-toggle:focus {
    outline: 2px solid #0d79bf;
    outline-offset: -2px;
}

/* A RESPONSIVE STÍLUSOK AZ INLINE CSS-BEN VANNAK GENERÁLVA A DINAMIKUS TÖRÉSPONT MIATT! */