/* ==========================================================
   PRINTER-FAIR HEADER
   Parent theme: GeneratePress
   Pantone 186 C screen approximation: #C8102E
   Pantone 445 C screen approximation: #505759
   ========================================================== */

:root {
    --pf-red-186c: #C8102E;
    --pf-red-186c-dark: #A20D26;
    --pf-gray-445c: #505759;

    --pf-header-bg: rgba(255, 255, 255, 0.97);
    --pf-header-border: rgba(80, 87, 89, 0.14);
    --pf-header-shadow: 0 12px 34px rgba(30, 34, 35, 0.09);

    --pf-header-transition: 360ms cubic-bezier(.22, .61, .36, 1);
}

/* ----------------------------------------------------------
   The JS groups the existing GeneratePress header/navigation
   inside this wrapper. No menu item is recreated or duplicated.
   ---------------------------------------------------------- */

.pf-header-shell {
    position: sticky;
    top: 0;
    z-index: 999;
    width: 100%;
    background: var(--pf-header-bg);
    border-bottom: 1px solid transparent;
    transform: translate3d(0, 0, 0);
    transition:
        transform var(--pf-header-transition),
        box-shadow var(--pf-header-transition),
        border-color var(--pf-header-transition),
        background-color var(--pf-header-transition);
    will-change: transform;
}

body.admin-bar .pf-header-shell {
    top: 32px;
}

.pf-header-shell.pf-header--hidden {
    transform: translate3d(0, -105%, 0);
}

.pf-header-shell.pf-header--visible,
.pf-header-shell.pf-header--scrolled {
    box-shadow: var(--pf-header-shadow);
    border-bottom-color: var(--pf-header-border);
}

/* Keep the real GeneratePress header/navigation visually clean. */
.pf-header-shell .site-header,
.pf-header-shell .main-navigation {
    background: transparent;
}

/* Logo: keep the logo selected in GeneratePress. */
.pf-header-shell .site-logo img,
.pf-header-shell .custom-logo {
    transition: transform 240ms ease, opacity 240ms ease;
}

.pf-header-shell .site-logo a:hover img,
.pf-header-shell .custom-logo-link:hover img {
    transform: translateY(-1px);
    opacity: .92;
}

/* ----------------------------------------------------------
   PRIMARY NAVIGATION
   Uses the menu already configured in WordPress/GeneratePress.
   Adding/removing items in Appearance > Menus updates normally.
   ---------------------------------------------------------- */

.pf-header-shell .main-navigation .main-nav > ul > li > a {
    position: relative;
    color: var(--pf-gray-445c);
    font-weight: 600;
    transition: color 220ms ease;
}

/* Animated underline without changing the saved menu. */
.pf-header-shell .main-navigation .main-nav > ul > li > a::after {
    content: "";
    position: absolute;
    left: 50%;
    right: 50%;
    bottom: 10px;
    height: 2px;
    border-radius: 999px;
    background: var(--pf-red-186c);
    opacity: 0;
    transition:
        left 220ms ease,
        right 220ms ease,
        opacity 220ms ease;
}

.pf-header-shell .main-navigation .main-nav > ul > li:hover > a,
.pf-header-shell .main-navigation .main-nav > ul > li:focus-within > a,
.pf-header-shell .main-navigation .main-nav > ul > li.current-menu-item > a,
.pf-header-shell .main-navigation .main-nav > ul > li.current-menu-ancestor > a {
    color: var(--pf-red-186c);
}

.pf-header-shell .main-navigation .main-nav > ul > li:hover > a::after,
.pf-header-shell .main-navigation .main-nav > ul > li:focus-within > a::after,
.pf-header-shell .main-navigation .main-nav > ul > li.current-menu-item > a::after,
.pf-header-shell .main-navigation .main-nav > ul > li.current-menu-ancestor > a::after {
    left: 22%;
    right: 22%;
    opacity: 1;
}

/* ----------------------------------------------------------
   DROPDOWN PREPARATION
   The animation is already present if submenus are added later.
   Desktop only, so GeneratePress mobile navigation stays native.
   ---------------------------------------------------------- */

@media (min-width: 769px) {
    .pf-header-shell .main-navigation .main-nav ul ul {
        display: block !important;
        visibility: hidden;
        opacity: 0;
        pointer-events: none;

        transform: translate3d(0, -10px, 0);
        transform-origin: top center;

        background: #fff;
        border: 1px solid var(--pf-header-border);
        border-radius: 12px;
        box-shadow: 0 18px 42px rgba(30, 34, 35, .12);
        padding: 8px;

        transition:
            opacity 180ms ease,
            transform 220ms cubic-bezier(.22, .61, .36, 1),
            visibility 220ms ease;
    }

    .pf-header-shell .main-navigation .main-nav li:hover > ul,
    .pf-header-shell .main-navigation .main-nav li:focus-within > ul,
    .pf-header-shell .main-navigation .main-nav li.sfHover > ul {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
        transform: translate3d(0, 0, 0);
    }

    .pf-header-shell .main-navigation .main-nav ul ul li a {
        color: var(--pf-gray-445c);
        border-radius: 8px;
        transition:
            color 180ms ease,
            background-color 180ms ease,
            transform 180ms ease;
    }

    .pf-header-shell .main-navigation .main-nav ul ul li > a {
    position: relative;
}

.pf-header-shell .main-navigation .main-nav ul ul li > a::before {
    content: "";
    position: absolute;

    left: 0;
    top: 50%;

    width: 2px;
    height: 0;

    background: var(--pf-red-186c);
    border-radius: 2px;

    transform: translateY(-50%);

    transition: height 180ms ease;
}

.pf-header-shell .main-navigation .main-nav ul ul li:hover > a::before,
.pf-header-shell .main-navigation .main-nav ul ul li:focus-within > a::before,
.pf-header-shell .main-navigation .main-nav ul ul li.current-menu-item > a::before {
    height: 55%;
}
}

/* GeneratePress mobile menu remains functional; only colors are aligned. */
@media (max-width: 768px) {
    body.admin-bar .pf-header-shell {
        top: 46px;
    }

    .pf-header-shell .menu-toggle,
    .pf-header-shell .main-navigation .main-nav ul li a {
        color: var(--pf-gray-445c);
    }

    .pf-header-shell .main-navigation .main-nav ul li:hover > a,
    .pf-header-shell .main-navigation .main-nav ul li:focus-within > a,
    .pf-header-shell .main-navigation .main-nav ul li.current-menu-item > a {
        color: var(--pf-red-186c);
    }

    .pf-header-shell .main-navigation .main-nav > ul > li > a::after {
        display: none;
    }
}

/* Accessibility: respect reduced motion. */
@media (prefers-reduced-motion: reduce) {
    .pf-header-shell,
    .pf-header-shell *,
    .pf-header-shell *::before,
    .pf-header-shell *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }
}


/* =========================================
   PRINTER-FAIR - PREMIUM NAVIGATION FINISH
   ========================================= */

@media (min-width: 769px) {

    /* Főmenü */
    .pf-header-shell .main-navigation .main-nav > ul > li > a {
    padding-left: 16px;
    padding-right: 16px;
    letter-spacing: .01em;
}

    /* Aktív / hover jelzés */
    .pf-header-shell .main-navigation .main-nav > ul > li > a::after {
        height: 3px;
        bottom: 8px;
        border-radius: 999px;
    }

    /* Dropdown panel */
    .pf-header-shell .main-navigation .main-nav ul ul {
        min-width: 220px;

        padding: 10px;

        border: 1px solid rgba(80, 87, 89, .10);
        border-radius: 14px;

        box-shadow:
            0 10px 24px rgba(30, 34, 35, .06),
            0 24px 54px rgba(30, 34, 35, .10);

        transform: translate3d(0, -6px, 0);

        transition:
            opacity 200ms ease,
            transform 250ms cubic-bezier(.22, .61, .36, 1),
            visibility 250ms ease;
    }

    /* Dropdown item */
    .pf-header-shell .main-navigation .main-nav ul ul li a {
        position: relative;

        padding: 11px 14px 11px 18px;

        border-radius: 9px;

        font-size: 14px;
        line-height: 1.35;

        color: var(--pf-gray-445c);

        transition:
            color 180ms ease,
            background-color 180ms ease;
    }

    /* Bal oldali piros marker */
    .pf-header-shell .main-navigation .main-nav ul ul li > a::before {
        content: "";

        position: absolute;

        left: 7px;
        top: 50%;

        width: 3px;
        height: 0;

        background: var(--pf-red-186c);

        border-radius: 999px;

        transform: translateY(-50%);

        transition: height 180ms ease;
    }

    /* Hover */
    .pf-header-shell .main-navigation .main-nav ul ul li:hover > a,
    .pf-header-shell .main-navigation .main-nav ul ul li:focus-within > a {
        color: var(--pf-red-186c);

        background: rgba(80, 87, 89, .055);
    }

    .pf-header-shell .main-navigation .main-nav ul ul li:hover > a::before,
    .pf-header-shell .main-navigation .main-nav ul ul li:focus-within > a::before,
    .pf-header-shell .main-navigation .main-nav ul ul li.current-menu-item > a::before {
        height: 54%;
    }

    /* Aktív dropdown elem */
    .pf-header-shell .main-navigation .main-nav ul ul li.current-menu-item > a {
        color: var(--pf-red-186c);

        background: rgba(80, 87, 89, .075);
    }
}

/* =========================================
   DROPDOWN TOGGLE SPACING FIX
   ========================================= */

@media (min-width: 769px) {

    .pf-header-shell
    .main-navigation
    .main-nav
    > ul
    > li.menu-item-has-children
    > a
    .dropdown-menu-toggle {

        padding-left: 3px;
        padding-right: 0;

        margin: 0;

        width: auto;
    }
}