/**
 * Header üst menü stilleri — body.ui-nav-{style}
 * Sadece masaüstü yatay menü; mobil çekmece mevcut stilleri korur.
 */

@media (min-width: 969px) {
    /* Alternatif header düzenlerinde tema stilleri padding’i ezmesin */
    body:not(.ui-header-classic).ui-nav-classic .header-layout__nav .nav-menu > li > a {
        padding: 6px 0;
    }

    /* ——— Pill ——— */
    body.ui-nav-pill .header .nav-menu > li:not(.mobile-menu-logo):not(.mobile-menu-close):not(.mobile-menu-extras),
    body.ui-nav-pill .header-layout__nav .nav-menu > li:not(.mobile-menu-logo):not(.mobile-menu-close):not(.mobile-menu-extras) {
        display: flex;
        align-items: center;
    }

    body.ui-nav-pill .header .nav-menu {
        gap: 8px;
        padding: 10px 0 8px;
    }

    body.ui-nav-pill .header-layout__nav .nav-menu {
        gap: 8px;
        padding: 10px 0 8px;
    }

    body.ui-nav-pill .header .nav-menu > li > a,
    body.ui-nav-pill .header-layout__nav .nav-menu > li > a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        padding: 8px 16px;
        border-radius: 999px;
    }

    body.ui-nav-pill .header .nav-menu > li > a:hover,
    body.ui-nav-pill .header .nav-menu > li > a.active,
    body.ui-nav-pill .header-layout__nav .nav-menu > li > a:hover,
    body.ui-nav-pill .header-layout__nav .nav-menu > li > a.active {
        background: color-mix(in srgb, var(--primary-color) 11%, transparent);
    }

    body.ui-nav-pill .header .nav-menu > li > a.active::after,
    body.ui-nav-pill .header-layout__nav .nav-menu > li > a.active::after {
        display: none;
    }

    /* ——— Soft band (yalnızca ayrı menü şeridi olan düzenler) ——— */
    body.ui-nav-soft.ui-header-classic .header .navbar,
    body.ui-nav-soft.ui-header-dual .header .header-layout__nav,
    body.ui-nav-soft.ui-header-compact .header .header-layout__nav,
    body.ui-nav-soft.ui-header-utility .header .header-layout__nav {
        position: relative;
        overflow: visible;
        background: transparent;
        border-top-color: transparent;
    }

    /* Gri şerit: container genişliğinde değil, tam viewport */
    body.ui-nav-soft.ui-header-classic .header .navbar::before,
    body.ui-nav-soft.ui-header-dual .header .header-layout__nav::before,
    body.ui-nav-soft.ui-header-compact .header .header-layout__nav::before,
    body.ui-nav-soft.ui-header-utility .header .header-layout__nav::before {
        content: '';
        position: absolute;
        z-index: -1;
        left: 50%;
        top: 0;
        bottom: 0;
        width: 100vw;
        max-width: 100vw;
        transform: translateX(-50%);
        background: color-mix(in srgb, var(--bg-light) 72%, var(--bg-white));
        border-top: 1px solid var(--border-color);
        box-shadow: none;
        pointer-events: none;
    }

    body.ui-nav-soft .header .nav-menu,
    body.ui-nav-soft .header-layout__nav .nav-menu {
        gap: 4px;
        padding: 10px 0 8px;
    }

    body.ui-nav-soft .header .nav-menu > li > a,
    body.ui-nav-soft .header-layout__nav .nav-menu > li > a {
        display: inline-flex;
        align-items: center;
        box-sizing: border-box;
        padding: 9px 16px;
        border-radius: 8px;
    }

    body.ui-nav-soft .header .nav-menu > li > a:hover,
    body.ui-nav-soft .header .nav-menu > li > a.active,
    body.ui-nav-soft .header-layout__nav .nav-menu > li > a:hover,
    body.ui-nav-soft .header-layout__nav .nav-menu > li > a.active {
        background: var(--bg-white);
        box-shadow: 0 1px 3px rgba(38, 50, 56, 0.08);
    }

    body.ui-nav-soft .header .nav-menu > li > a.active::after,
    body.ui-nav-soft .header-layout__nav .nav-menu > li > a.active::after {
        display: none;
    }

    /* ——— Underline (animated) ——— */
    body.ui-nav-underline .header .nav-menu > li > a,
    body.ui-nav-underline .header-layout__nav .nav-menu > li > a {
        padding: 8px 4px;
    }

    body.ui-nav-underline .header .nav-menu > li > a::after,
    body.ui-nav-underline .header-layout__nav .nav-menu > li > a::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        right: auto;
        width: 0;
        height: 2px;
        background: var(--primary-color);
        transform: translateX(-50%);
        transition: width 0.22s ease;
    }

    body.ui-nav-underline .header .nav-menu > li > a:hover::after,
    body.ui-nav-underline .header .nav-menu > li > a.active::after,
    body.ui-nav-underline .header-layout__nav .nav-menu > li > a:hover::after,
    body.ui-nav-underline .header-layout__nav .nav-menu > li > a.active::after {
        width: 100%;
        bottom: 0;
        left: 50%;
        right: auto;
        height: 2px;
    }

    /* ——— Elegant (yalnızca ayrı menü şeridi olan düzenler) ——— */
    body.ui-nav-elegant.ui-header-classic .header .navbar,
    body.ui-nav-elegant.ui-header-dual .header .header-layout__nav,
    body.ui-nav-elegant.ui-header-compact .header .header-layout__nav,
    body.ui-nav-elegant.ui-header-utility .header .header-layout__nav {
        border-top: none;
        box-shadow: inset 0 1px 0 var(--border-color);
    }

    body.ui-nav-elegant .header .nav-menu,
    body.ui-nav-elegant .header-layout__nav .nav-menu {
        gap: 28px;
        padding: 8px 0 0;
    }

    body.ui-nav-elegant .header .nav-menu > li > a,
    body.ui-nav-elegant .header-layout__nav .nav-menu > li > a {
        font-size: 13px;
        font-weight: 600;
        letter-spacing: 0.03em;
        padding: 6px 0;
    }

    body.ui-nav-elegant .header .nav-menu > li > a.active::after,
    body.ui-nav-elegant .header-layout__nav .nav-menu > li > a.active::after {
        bottom: 0;
        height: 2px;
        background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    }

    /* ——— Divider ——— */
    body.ui-nav-divider .header .nav-menu,
    body.ui-nav-divider .header-layout__nav .nav-menu {
        gap: 0;
        padding: 10px 0 8px;
    }

    /*
     * Ayraç: li::before kullanılmaz — .dropdown li::before hover köprüsünde dolu.
     * Bitişik gerçek menü öğeleri arasında link (::before) üzerinde çizgi.
     */
    body.ui-nav-divider .header .nav-menu > li:not(.mobile-menu-logo):not(.mobile-menu-close):not(.mobile-menu-extras) + li:not(.mobile-menu-logo):not(.mobile-menu-close):not(.mobile-menu-extras) > a::before,
    body.ui-nav-divider .header-layout__nav .nav-menu > li:not(.mobile-menu-logo):not(.mobile-menu-close):not(.mobile-menu-extras) + li:not(.mobile-menu-logo):not(.mobile-menu-close):not(.mobile-menu-extras) > a::before {
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 1px;
        height: 20px;
        background: var(--border-color);
        opacity: 0.85;
        pointer-events: none;
        z-index: 2;
    }

    body.ui-nav-divider .header .nav-menu > li:not(.mobile-menu-logo):not(.mobile-menu-close):not(.mobile-menu-extras) > a,
    body.ui-nav-divider .header-layout__nav .nav-menu > li:not(.mobile-menu-logo):not(.mobile-menu-close):not(.mobile-menu-extras) > a {
        position: relative;
    }

    /* Mega menü tam genişlik için static kalmalı (klasik header dahil) */
    body.ui-nav-divider .header .nav-menu > li.mega-menu,
    body.ui-nav-divider .header-layout__nav .nav-menu > li.mega-menu {
        position: static;
    }

    body.ui-nav-divider .header .nav-menu > li > a,
    body.ui-nav-divider .header-layout__nav .nav-menu > li > a {
        display: inline-flex;
        align-items: center;
        box-sizing: border-box;
        padding: 8px 22px;
    }

    body.ui-nav-divider .header .nav-menu > li.mobile-menu-logo + li > a,
    body.ui-nav-divider .header-layout__nav .nav-menu > li.mobile-menu-logo + li > a,
    body.ui-nav-divider .header .nav-menu > li:first-child:not(.mobile-menu-logo) > a,
    body.ui-nav-divider .header-layout__nav .nav-menu > li:first-child:not(.mobile-menu-logo) > a {
        padding-left: 0;
    }

    body.ui-nav-divider .header .nav-menu > li > a.active::after,
    body.ui-nav-divider .header-layout__nav .nav-menu > li > a.active::after {
        display: none;
    }

    body.ui-nav-divider .header .nav-menu > li > a.active,
    body.ui-nav-divider .header-layout__nav .nav-menu > li > a.active {
        font-weight: 600;
    }

    /*
     * Klasik / satır içi / ortalanmış: tam genişlik menü şeridi yok.
     * (Çift bant, kompakt, üst araç şeridi kendi ::before şeridini korur.)
     */
    body.ui-header-classic .header .navbar,
    body.ui-header-inline .header-layout__nav.navbar,
    body.ui-header-center .header-layout__nav.navbar {
        border-top: none;
        background: transparent;
        box-shadow: none;
    }

    body.ui-header-inline .header-layout__nav.navbar::before,
    body.ui-header-center .header-layout__nav.navbar::before {
        display: none;
        content: none;
    }

    /* Mobil çekmeceye ait öğeler masaüstü yatay menüde asla görünmesin */
    .header .nav-menu > li.mobile-menu-logo,
    .header .nav-menu > li.mobile-menu-close,
    .header .nav-menu > li.mobile-menu-extras,
    .header-layout__nav .nav-menu > li.mobile-menu-logo,
    .header-layout__nav .nav-menu > li.mobile-menu-close,
    .header-layout__nav .nav-menu > li.mobile-menu-extras {
        display: none !important;
    }

    .header .nav-menu > li.mobile-menu-logo::before,
    .header .nav-menu > li.mobile-menu-close::before,
    .header .nav-menu > li.mobile-menu-extras::before,
    .header-layout__nav .nav-menu > li.mobile-menu-logo::before,
    .header-layout__nav .nav-menu > li.mobile-menu-close::before,
    .header-layout__nav .nav-menu > li.mobile-menu-extras::before {
        display: none !important;
        content: none !important;
    }

    /* Düzen dosyasındaki gap kurallarını ez — ayraçlar bitişik kalsın */
    body.ui-nav-divider .header .nav-menu,
    body.ui-nav-divider .header-layout__nav .nav-menu,
    body.ui-nav-divider.ui-header-inline .header-layout__nav .nav-menu,
    body.ui-nav-divider.ui-header-center .header-layout__nav .nav-menu,
    body.ui-nav-divider.ui-header-dual .header-layout__nav .nav-menu,
    body.ui-nav-divider.ui-header-compact .header-layout__nav .nav-menu,
    body.ui-nav-divider.ui-header-utility .header-layout__nav .nav-menu {
        gap: 0 !important;
        row-gap: 0 !important;
        column-gap: 0 !important;
    }
}
