/* ════════════════════════════════════════════════════════════════
   USTARAF — HEADER PRO OVERRIDE
   Dosya: themes/ustaraf/assets/css/header-pro-override.css
   Kullanım: style.css'in SONUNA @import veya <link> ile ekle.
   PHP / Bootstrap sınıflarına dokunmaz. Sadece görsel iyileştirme.
   ════════════════════════════════════════════════════════════════ */


/* ── 1. TOPBAR ─────────────────────────────────────────────────── */
/* ══════════════════════════════════════════════════════
   PRO TOPBAR  — Köklü yeniden yazım
   ══════════════════════════════════════════════════════ */

/* Üst gradient şerit */
body::before {
    content: '';
    display: block;
    height: 3px;
    background: linear-gradient(90deg,
        #0c3566 0%, #1a61ae 25%,
        #25D366 55%, #2979cc 80%,
        #0c3566 100%);
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1040;
}

/* Topbar dış kaplama */
.pro-topbar {
    position: fixed;
    top: 3px;            /* gradient şeridin hemen altı */
    left: 0; right: 0;
    z-index: 1039;
    height: 40px;
    background: linear-gradient(90deg, #0c2d5a 0%, #0f3f77 50%, #0c2d5a 100%);
    border-bottom: 1px solid rgba(255,255,255,.07);
}

/* İç: sol/sağ grupları justify-content ile iki uca yay */
.pro-topbar__inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 32px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;   /* ← sol gruba sol, sağ gruba sağ */
}

.pro-topbar__left,
.pro-topbar__right {
    display: flex;
    align-items: center;
    height: 100%;
    gap: 0;
}

/* Her bir item: ikonlu link/span */
.pro-topbar__item {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 100%;
    padding: 0 14px;
    font-size: 11.5px;
    color: rgba(255,255,255,.78);
    text-decoration: none;
    border-right: 1px solid rgba(255,255,255,.08);
    transition: color .15s, background .15s;
    white-space: nowrap;
}
.pro-topbar__left .pro-topbar__item:first-child {
    border-left: 1px solid rgba(255,255,255,.08);
}
.pro-topbar__item:hover {
    color: #fff;
    background: rgba(255,255,255,.08);
}
.pro-topbar__item i {
    font-size: 10px;
    opacity: .65;
}

/* Çalışma saati: biraz daha soluk */
.pro-topbar__hours {
    color: rgba(255,255,255,.48) !important;
    font-size: 11px !important;
    cursor: default;
}
.pro-topbar__hours:hover {
    background: none !important;
    color: rgba(255,255,255,.48) !important;
}

/* Sağ grup: Güven badge */
.pro-topbar__trust {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 100%;
    padding: 0 14px;
    font-size: 11px;
    color: rgba(255,255,255,.5);
    border-left: 1px solid rgba(255,255,255,.08);
    white-space: nowrap;
}
.pro-topbar__trust i {
    color: #25D366;
    font-size: 11px;
}

/* Adres */
.pro-topbar__address {
    color: rgba(255,255,255,.45) !important;
    font-size: 11px !important;
    border-left: 1px solid rgba(255,255,255,.08);
    border-right: none;
}
.pro-topbar__address:hover {
    color: rgba(255,255,255,.75) !important;
}

/* Mobilde adres metnini gizle, sadece ikon kalsın */
@media (max-width: 767px) {
    .pro-topbar__address {
        display: flex !important;
    }
    .pro-topbar__address span {
        display: none !important;
    }
}

/* ── Navbar pozisyonu güncelle */
.header--fixed {
    top: 43px !important;  /* 3px şerit + 40px topbar */
}
body.no-topbar .header--fixed {
    top: 3px !important;
}

/* ── Spacer güncelle */
.header-spacer {
    height: 111px !important;  /* 3 + 40 + 68 */
}
body.no-topbar .header-spacer {
    height: 71px !important;
}

/* Mobil: topbar'ı tek satıra sığdır */
@media (max-width: 767px) {
    .pro-topbar__inner {
        padding: 0 14px;
    }
    .pro-topbar__item {
        padding: 0 10px;
        font-size: 11px;
    }
}


/* Spacer'ı güncelle */
.header-spacer { height: 100px !important; } /* 38 topbar + 62 navbar */
body.no-topbar .header-spacer { height: 62px !important; }


/* ── 2. NAVBAR ──────────────────────────────────────────────────── */

.header.navbar {
    background: #fff !important;
    border-bottom: 1px solid #e4e8ee !important;
    padding: 0 !important;
    box-shadow: 0 1px 0 rgba(0,0,0,.04);
    transition: box-shadow .3s ease !important;
}
.header.navbar.scrolled {
    box-shadow: 0 4px 20px rgba(15,63,119,.10) !important;
}

/* Yüksekliği 62 → 68px: daha ferah */
.header.navbar .d-flex.align-items-center.justify-content-between {
    height: 68px !important;
}

/* Container padding dengeli */
.header.navbar .container-fluid {
    padding: 0 32px !important;
}

/* Header spacer güncelle */
.header-spacer { height: 106px; } /* 38 + 68 */
body.no-topbar .header-spacer { height: 68px; }


/* ── 3. LOGO ────────────────────────────────────────────────────── */

.logo {
    margin-right: 40px !important;
}
.logo img,
.logo .site-logo {
    max-height: 44px !important;
    max-width: 160px !important;
    width: auto !important;
    display: block;
}


/* ── 4. HAMBURGER ───────────────────────────────────────────────── */

.nav-toggle {
    width: 42px !important;
    height: 42px !important;
    background: #1a61ae !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 10px rgba(26,97,174,.28) !important;
    transition: background .2s, box-shadow .2s, transform .15s !important;
}
.nav-toggle:hover {
    background: #124e96 !important;
    box-shadow: 0 4px 18px rgba(26,97,174,.4) !important;
    transform: scale(1.04) !important;
}
.nav-toggle span {
    background: #fff !important;
    height: 2px !important;
    border-radius: 2px !important;
    transition: width .22s !important;
}
.nav-toggle span:nth-child(1) { width: 18px !important; }
.nav-toggle span:nth-child(2) { width: 13px !important; }
.nav-toggle span:nth-child(3) { width: 18px !important; }
.nav-toggle:hover span { width: 18px !important; }


/* ── 5. MASAÜSTÜ NAV LİNKLERİ ──────────────────────────────────── */

nav.nav.d-none.d-lg-flex,
#nav-desktop {
    height: 100% !important;
}

.nav.d-none.d-lg-flex .nav__list,
#nav-desktop .nav__list {
    height: 100% !important;
    gap: 0 !important;
}

/* Nav link: daha geniş padding, net font */
.nav.d-none.d-lg-flex .nav__item > .nav__link,
.nav.d-none.d-lg-flex .nav__item > a.nav__link,
#nav-desktop .nav__item > .nav__link,
#nav-desktop .nav__item > a.nav__link {
    padding: 0 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #1e2535 !important;
    letter-spacing: .01em;
    border-bottom: 2px solid transparent !important;
    transition: color .18s, border-color .18s, background .18s !important;
    position: relative;
}

/* Hover & active: mavi alt çizgi + hafif arka plan */
.nav.d-none.d-lg-flex .nav__item:hover > .nav__link,
.nav.d-none.d-lg-flex .nav__item > .nav__link.active,
#nav-desktop .nav__item:hover > .nav__link,
#nav-desktop .nav__item > .nav__link.active {
    color: #1a61ae !important;
    border-bottom-color: #1a61ae !important;
    background: rgba(26,97,174,.03) !important;
}

/* Chevron: küçük ve zarif */
.nav.d-none.d-lg-flex .nav__item .fa-chevron-down,
#nav-desktop .nav__item .fa-chevron-down {
    font-size: .55rem !important;
    opacity: .35 !important;
    margin-left: 2px;
    transition: transform .22s, opacity .22s !important;
}
.nav.d-none.d-lg-flex .nav__item:hover .fa-chevron-down,
#nav-desktop .nav__item:hover .fa-chevron-down {
    transform: rotate(180deg) !important;
    opacity: .7 !important;
}


/* ── 6. DROPDOWN ────────────────────────────────────────────────── */

.nav.d-none.d-lg-flex .dropdown,
#nav-desktop .dropdown {
    left: 0 !important;             /* ortalamak yerine sola hizala */
    transform: translateY(-6px) !important; /* X ekseninde kaydırma yok */
    min-width: 220px !important;
    border-radius: 4px 4px 10px 10px !important;
    border-top: 2px solid #1a61ae !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.10) !important;
    padding: 4px 0 !important;
}
.nav.d-none.d-lg-flex .nav__item.has-dropdown:hover .dropdown,
.nav.d-none.d-lg-flex .nav__item.has-dropdown:focus-within .dropdown,
#nav-desktop .nav__item.has-dropdown:hover .dropdown,
#nav-desktop .nav__item.has-dropdown:focus-within .dropdown {
    transform: translateY(0) !important;
}

.nav.d-none.d-lg-flex .dropdown__item,
#nav-desktop .dropdown__item {
    padding: 10px 18px !important;
    font-size: 13.5px !important;
    font-weight: 400;
    color: #2a3344 !important;
    gap: 10px !important;
    border-bottom: 1px solid #f5f7fa !important;
    transition: background .12s, color .12s, padding-left .15s !important;
}
.nav.d-none.d-lg-flex .dropdown__item:last-child,
#nav-desktop .dropdown__item:last-child {
    border-bottom: none !important;
}
.nav.d-none.d-lg-flex .dropdown__item:hover,
#nav-desktop .dropdown__item:hover {
    color: #1a61ae !important;
    background: rgba(26,97,174,.05) !important;
    padding-left: 24px !important;
}

.nav.d-none.d-lg-flex .dropdown__item-icon,
#nav-desktop .dropdown__item-icon {
    color: #1a61ae !important;
    opacity: .65;
    font-size: 10px !important;
    width: 12px !important;
}


/* ── 7. MEGA MENU ───────────────────────────────────────────────── */

.mega-menu {
    left: 50% !important;
    transform: translateX(-50%) translateY(-8px) !important;
    min-width: 720px !important;
    max-width: 920px !important;
    border-radius: 4px 4px 12px 12px !important;
    border-top: 2px solid #1a61ae !important;
    box-shadow: 0 16px 48px rgba(15,63,119,.12) !important;
}
.nav.d-none.d-lg-flex .has-mega:hover .mega-menu,
.nav.d-none.d-lg-flex .has-mega:focus-within .mega-menu,
#nav-desktop .has-mega:hover .mega-menu,
#nav-desktop .has-mega:focus-within .mega-menu {
    transform: translateX(-50%) translateY(0) !important;
}

.mega-menu__inner { display: flex !important; }

.mega-menu__col {
    padding: 20px 22px !important;
}
.mega-menu__col--posts {
    background: #f6f8fb !important;
    border-left: 1px solid #edf0f5 !important;
    padding: 20px 18px !important;
}

.mega-menu__heading {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 1.4px !important;
    color: #9ba5b4 !important;
    padding-bottom: 10px !important;
    margin-bottom: 12px !important;
    border-bottom: 1px solid #edf0f5 !important;
    text-transform: uppercase;
}
.mega-menu__heading i { color: #1a61ae !important; }

.mega-menu__cat-item {
    padding: 8px 10px !important;
    font-size: 13px !important;
    border-radius: 7px !important;
    color: #2a3344 !important;
    gap: 9px !important;
    transition: background .12s, color .12s !important;
}
.mega-menu__cat-item:hover {
    background: rgba(26,97,174,.07) !important;
    color: #1a61ae !important;
}
.mega-menu__cat-item em {
    font-size: 10px !important;
    background: rgba(26,97,174,.09) !important;
    color: #1a61ae !important;
    padding: 1px 6px !important;
    border-radius: 10px !important;
}

.mega-menu__all-link {
    margin-top: 14px !important;
    padding: 6px 15px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    border-radius: 20px !important;
    border: 1.5px solid #1a61ae !important;
    color: #1a61ae !important;
    transition: background .18s, color .18s !important;
}
.mega-menu__all-link:hover {
    background: #1a61ae !important;
    color: #fff !important;
}

.mega-menu__post {
    padding: 8px 10px !important;
    border-radius: 7px !important;
    gap: 11px !important;
    font-size: 12.5px !important;
    color: #2a3344 !important;
}
.mega-menu__post:hover {
    background: rgba(26,97,174,.06) !important;
    color: #1a61ae !important;
}
.mega-menu__post img {
    width: 48px !important;
    height: 38px !important;
    border-radius: 5px !important;
}


/* ── 8. SAĞ GRUP: ARAMA + BUTONLAR ────────────────────────────── */

.header__cta {
    gap: 10px !important;
}

/* Arama kutusu: daha ferah */
.search {
    height: 38px !important;
    border-radius: 9px !important;
    border: 1.5px solid #e0e6f0 !important;
    background: #f4f7fc !important;
    transition: border-color .2s, box-shadow .2s, background .2s !important;
}
.search:focus-within {
    border-color: #1a61ae !important;
    box-shadow: 0 0 0 3px rgba(26,97,174,.10) !important;
    background: #fff !important;
}
.search input {
    width: 190px !important;
    font-size: 13.5px !important;
    color: #1e2535 !important;
    padding: 0 14px !important;
}
.search input::placeholder { color: #b0bac8 !important; }
.search button {
    height: 38px !important;
    padding: 0 16px !important;
    font-size: 13px !important;
    background: #1a61ae !important;
    border-radius: 0 8px 8px 0 !important;
    letter-spacing: .01em;
    transition: background .15s !important;
}
.search button:hover { background: #124e96 !important; }
.search button i { font-size: 12px !important; }

/* WhatsApp butonu */
.btn--whatsapp {
    height: 38px !important;
    padding: 0 16px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-radius: 9px !important;
    background: #25D366 !important;
    letter-spacing: .01em;
    box-shadow: 0 2px 8px rgba(37,211,102,.2);
    transition: background .15s, box-shadow .15s !important;
}
.btn--whatsapp:hover {
    background: #1db954 !important;
    box-shadow: 0 4px 14px rgba(37,211,102,.32) !important;
}
.btn--whatsapp i { font-size: 15px !important; }

/* Blog butonu ("kayit") */
.kayit {
    height: 38px !important;
    padding: 0 !important;
    border-radius: 9px !important;
    background: #1a61ae !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(26,97,174,.2) !important;
    transition: background .15s, box-shadow .15s !important;
}
.kayit:hover {
    background: #124e96 !important;
    box-shadow: 0 4px 16px rgba(26,97,174,.32) !important;
}
.kayit a {
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: .01em;
    padding: 0 16px !important;
    height: 38px !important;
    gap: 7px !important;
}
.kayit a i { font-size: 12px !important; opacity: .85; }

/* Dil switcher: temaya uyumlu */
.lang-switcher__btn {
    background: none !important;
    border: 1.5px solid #e0e6f0 !important;
    border-radius: 8px !important;
    padding: 5px 11px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: #1e2535 !important;
    cursor: pointer;
    transition: border-color .18s, background .18s !important;
}
.lang-switcher__btn:hover {
    border-color: #1a61ae !important;
    background: rgba(26,97,174,.04) !important;
}
.lang-switcher__dropdown {
    border-radius: 10px !important;
    box-shadow: 0 8px 28px rgba(0,0,0,.11) !important;
    border: 1.5px solid #e8ecf4 !important;
    overflow: hidden !important;
    min-width: 130px !important;
}
.lang-switcher__dropdown a {
    padding: 9px 14px !important;
    font-size: 13px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: #2a3344 !important;
    font-weight: 500 !important;
    border-bottom: 1px solid #f0f3f8 !important;
    transition: background .12s !important;
}
.lang-switcher__dropdown a:last-child { border-bottom: none !important; }
.lang-switcher__dropdown a:hover { background: #f0f5ff !important; color: #1a61ae !important; }
.lang-switcher__dropdown a.active { background: rgba(26,97,174,.07) !important; color: #1a61ae !important; font-weight: 700 !important; }


/* ── 9. MOBİL DRAWER ────────────────────────────────────────────── */

@media (max-width: 991px) {

    /* Navbar mobil yüksekliği */
    .header.navbar .d-flex.align-items-center.justify-content-between {
        height: 62px !important;
    }
    .header.navbar .container-fluid { padding: 0 18px !important; }

    /* Drawer: tam ekran, yukarıdan kayar */
    .nav--drawer {
        border-radius: 0 !important;
    }

    /* Drawer başlığı */
    .nav__header {
        height: 62px !important;
        border-bottom: 2px solid #1a61ae !important;
        padding: 0 20px !important;
    }
    .nav__header-title {
        font-size: 15px !important;
        font-weight: 700 !important;
        color: #1a61ae !important;
        letter-spacing: .01em;
    }

    /* Kapatma butonu */
    .nav__close {
        width: 38px !important;
        height: 38px !important;
        border-radius: 50% !important;
        background: #f4f7fc !important;
        border: 1.5px solid #e0e6f0 !important;
        color: #555 !important;
        font-size: 16px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    .nav__close:hover {
        background: #fde8e8 !important;
        border-color: #fca5a5 !important;
        color: #c0392b !important;
    }

    /* Drawer liste öğeleri */
    .mob-nav__link {
        padding: 14px 22px !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        border-bottom: 1px solid #f2f4f8 !important;
        gap: 13px !important;
    }
    .mob-nav__link i:first-child {
        color: #1a61ae !important;
        width: 19px !important;
        font-size: 13px !important;
    }
    .mob-nav__link:hover,
    .mob-nav__link.active {
        background: rgba(26,97,174,.04) !important;
        color: #1a61ae !important;
    }

    /* Chevron */
    .mob-chevron {
        font-size: 10px !important;
        opacity: .4 !important;
        transition: transform .25s !important;
    }

    /* Drawer mega/sub paneller */
    .mob-mega {
        background: #f6f8fb !important;
        border-left: 3px solid rgba(26,97,174,.28) !important;
        border-top: 1px solid #edf0f5 !important;
    }
    .mob-mega__heading {
        padding: 11px 18px 8px !important;
        font-size: 10.5px !important;
        letter-spacing: 1.3px !important;
        color: #9ba5b4 !important;
        border-bottom: 1px solid #edf0f5 !important;
    }
    .mob-mega__cat {
        padding: 10px 14px !important;
        font-size: 12.5px !important;
        font-weight: 500 !important;
        border-bottom: 1px solid #edf0f5 !important;
        border-right: 1px solid #edf0f5 !important;
        gap: 8px !important;
        color: #2a3344 !important;
    }
    .mob-mega__cat:hover {
        background: rgba(26,97,174,.06) !important;
        color: #1a61ae !important;
    }
    .mob-mega__all {
        padding: 12px 18px !important;
        font-size: 12.5px !important;
        font-weight: 700 !important;
        color: #1a61ae !important;
        border-top: 1px solid #e4eaf4 !important;
        border-bottom: 1px solid #e4eaf4 !important;
    }
    .mob-mega__all:hover { background: rgba(26,97,174,.06) !important; }

    /* Sub menü */
    .mob-sub {
        background: #f6f8fb !important;
        border-left: 3px solid rgba(26,97,174,.22) !important;
    }
    .mob-sub__link {
        padding: 11px 18px !important;
        font-size: 13.5px !important;
        color: #3a4560 !important;
        border-bottom: 1px solid #edf0f5 !important;
        gap: 10px !important;
    }
    .mob-sub__link i { color: #1a61ae !important; }
    .mob-sub__link:hover { color: #1a61ae !important; background: rgba(26,97,174,.05) !important; }

    /* Footer */
/* Footer Logo */
    .nav__footer-logo {
        display: flex !important;
        justify-content: center !important;
        padding: 14px 22px 0 !important;
        background: #f6f8fb !important;
        border-top: 1px solid #edf0f5 !important;
    }
    .nav__footer-logo img {
        height: 90px !important;
        width: auto !important;
        object-fit: contain !important;
    }

    /* Footer */
    .nav__footer {
        border-top: none !important;  /* logo zaten border getiriyor */
		
        border-top: 1px solid #edf0f5 !important;
        background: #f6f8fb !important;
        padding: 16px 22px !important;
    }
    .nav__footer-info a,
    .nav__footer-info span {
        font-size: 13.5px !important;
        color: #3a4560 !important;
        gap: 10px !important;
    }
    .nav__footer-info a i,
    .nav__footer-info span i {
        color: #1a61ae !important;
        font-size: 13px !important;
    }
    .nav__footer-info a:hover { color: #1a61ae !important; }
    .nav__footer-info a[href*="whatsapp"] { color: #25D366 !important; }
    .nav__footer-info a[href*="whatsapp"] i { color: #25D366 !important; }

    /* Overlay */
    .nav-overlay {
        backdrop-filter: blur(4px) !important;
        background: rgba(10,30,60,.45) !important;
    }
}


/* ── 10. SCROLLED EFEKTI ─────────────────────────────────────────── */

.header--fixed.scrolled,
.header--sticky.scrolled {
    box-shadow: 0 4px 24px rgba(15,63,119,.10) !important;
}


/* ── 11. RENK ŞERİDİ (üst çizgi) ──────────────────────────────── */

/* Topbar'dan önce ince gradient şerit */
body::before {
    content: '';
    display: block;
    height: 3px;

	background: linear-gradient(90deg,
		#0c3566 0%, #1a61ae 25%,
		#25D366 55%, #2979cc 80%,
		#0c3566 100%);
		
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1032;
}



/* Header'ı da buna göre ayarla */
.header--fixed {
    top: 41px !important; /* 3px şerit + 38px topbar */
}
body.no-topbar .header--fixed {
    top: 3px !important;
}

/* Spacer son hali */
.header-spacer {
    height: 109px !important; /* 3 + 38 + 68 */
}
body.no-topbar .header-spacer {
    height: 71px !important; /* 3 + 68 */
}
