/* css/layout/_navigation.css (Son Hal: Sabit Hamburger ve Hizalama) */

/* ------------------------------------------- */
/* GENEL VE MASAÜSTÜ STİLLERİ */
/* ------------------------------------------- */

.main-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 70px;
    padding: 0 1rem;    /* give horizontal breathing room instead of huge left padding */
    position: relative;
    box-sizing: border-box;
}

/* Logo: use normal flow (no absolute positioning) so menu aligns correctly across pages */
.logo {
    z-index: 1001;
    display: flex;
    align-items: center;
    height: 70px;
    margin: 0;
    position: relative; /* was absolute - now in normal flow */
    left: auto;
    top: auto;
}

/* Responsive Logo */
.responsive-logo {
    height: 70px; /* adjust to fit nicely inside 70px header */
    width: auto;
    display: block;
}

/* Nav links: allow them to push to the right of the logo */
.nav-links {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    margin-left: auto; /* key: push links to the right of the logo */
}

.nav-links > li {
    position: relative;
    margin: 0 0.25rem;
}

.nav-links a {
    color: var(--white-color);
    display: block;
    padding: 0 1rem;
    line-height: 70px;
    font-weight: 300;
    text-transform: uppercase;
    transition: background-color 0.3s, color 0.3s;
}

.nav-links a:hover {
    color: var(--white-color);
    background-color: rgba(255, 255, 255, 0.1);
}

/* DROPDOWN MENÜ STİLİ */
.dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 10;
    min-width: 200px;
    
    padding: 0;
    z-index: 10;
    background-color: var(--primary-color);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    border-top: 3px solid #bf092f;
    border-radius: 0 0 10px 10px;
    overflow: hidden;
}

/* OVERRIDE: dropdown kutusu rengi ve link renkleri (kolayca düzenleyin) */
.dropdown-menu {
    /* dropdown kutu rengi (changeable): */
    background-color: var(--primary-color); /* dropdown box color — değiştir: e.g. #123456 veya var(--your-color) */
    /* ...other existing rules (box-shadow, border, vb.) are preserved above... */
}

/* Reduce dropdown box height and make it scrollable if content exceeds limit.
   Adjust --dropdown-max-height to tune the maximum visible height. */
:root {
	--dropdown-max-height: 400px; /* düşürmek/artsın diye burayı değiştirin */
}

.dropdown-menu {
	/* limit the visible height and allow internal scrolling */
	max-height: var(--dropdown-max-height);
	overflow-y: auto;
	padding: 0.25rem 0; /* hafif üst/alt boşluk: önceki 0 idi */
}

/* Make dropdown links more compact to reduce overall box height */
.dropdown-menu li a {
	padding: 0.45rem 1rem;   /* önceki 0.75rem -> daha sıkışık görünüm */
	line-height: 1.2;       /* daha sıkı satır yüksekliği */
	font-size: 0.95rem;     /* istenirse biraz küçült */
}

/* Linklerin rengi beyaz olsun ve hoverda değişmesin */
.dropdown-menu li a {
    color: var(--white-color); /* dropdown yazı rengi: beyaz olarak sabitlenir */
    /* padding ve line-height'ı burada tekrarlamak istemezseniz mevcut kural korunur */
}

.dropdown-menu li a:hover {
    background-color:rgb(242, 236, 228,0.2 ); /* hover arka plan: değiştirilebilir (örn: rgba(...) ) */
    color:var(--white-color) ; /* hoverda da yazı beyaz kalsın */
    /* comment: eğer hover arka planı istemiyorsanız bu satırı kaldırın veya transparent yapın */
}

.dropdown:hover > .dropdown-menu {
    display: block;
}

.dropdown-menu li {
    border-bottom: 1px solid var(--secondary-color);
}

.dropdown-menu li:last-child {
    border-bottom: none;
}

/* 1. Üç Çizgi (Hamburger) */
.hamburger {
    display: block; /* Hamburger menü her zaman görünür olmalı */
    width: 25px;
    height: 3px;
    background-color: var(--white-color);
    position: relative;
    border-radius: 1px;
    transition: background-color 0.3s;
}
/* 2. Üst ve Alt Çizgiler */
.hamburger::before,
.hamburger::after {
    content: '';
    position: absolute;
    width: 25px;
    height: 3px;
    background-color: var(--white-color);
    border-radius: 1px;
    transition: transform 0.3s, background-color 0.3s;
}

/* Üst ve Alt Çizgiyi Hizala (Kapalı Durumda) */
.hamburger::before {
    transform: translateY(-8px);
}

.hamburger::after {
    transform: translateY(8px);
}


.menu-toggle {
    display: none; /* Masaüstünde GİZLİ OLMALI */
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
    z-index: 1005;
    position: relative; 
}
/* ------------------------------------------- */
/* AÇIK DURUM (Sadece Görünüm/Renk Değişimi) */
/* ------------------------------------------- */

/* Menü açıkken simgenin rengini ayarlayabiliriz (isteğe bağlı) */
.menu-toggle.is-active .hamburger {
    background: var(--white-color);
}

.menu-toggle.is-active .hamburger::before,
.menu-toggle.is-active .hamburger::after {
    background: var(--white-color);
}

/* ------------------------------------------- */
/* RESPONSIVE AYARLARI (MOBİL ÇEKMECE GÖRÜNÜMÜ) */
/* ------------------------------------------- */

@media (max-width: 1024px) {
    
    /* Logo, Dil ve Hamburger'i kapsayan ana navigasyon çubuğu */
    .main-nav {
        display: flex;
        justify-content: space-between; /* Elemanları yay */
        align-items: center;
        width: 100%;
        padding: 0 1rem;
        box-sizing: border-box;
    }

    /* --- SIRA VE KONUMLANDIRMA YÖNETİMİ --- */
    
    .logo {
        order: 1; /* En solda */
        flex-shrink: 0;
    }
    
    .responsive-logo {
        content: url('../../images/sadecelogo.png'); /* Mobilde sadecelogo.png göster */
        height: 70px; /* Yeni mobil logo yüksekliği (Örnek) */
        width: auto;
    }

    .lang-switch-wrapper {
        order: 2; /* Logodan sonra hemen sağında */
        flex-shrink: 0;
        margin-left: 10px; /* Logo ile arasına boşluk */
        margin-right: auto; /* Hamburgerden önce sağa it */
    }

    .menu-toggle {
        display: block; /* Mobilde hamburger menüyü göster */
        order: 3; /* En sağda */
        flex-shrink: 0;
        z-index: 10010 !important;
        position: relative;
        margin-left: 0; /* Otomatik boşluğu kaldır */
    }

    /* --- DİĞER MOBİL AYARLAR (Yeniden Açılma/Gizlenme) --- */
    
    /* Mobil menü (Çekmece) kapalıyken gizle */
    .nav-links {
        display: none !important;
    }
    
    /* Menü açıkken mobil görünüm (Sağdan Açılır Çekmece) */
    .nav-links.is-open {
        display: flex !important;
        flex-direction: column;
        position: fixed;
        top: 70px; 
        right: 0;
        width: 280px; 
        min-height: calc(100vh - 70px);
        z-index: 10005;
        
        transform: translateX(0);
        transition: transform 0.3s ease-out;
        
        background-color: var(--primary-color) !important;
        box-shadow: -8px 0 24px rgba(0,0,0,0.45) !important;
        overflow-y: auto;
    }
    
    /* Menü kapalıyken (Ekran dışına kaydırılmış) */
    .nav-links:not(.is-open) {
        transform: translateX(100%);
    }

    /* Vücut kaymasını engelle */
    .menu-open-body {
            overflow: hidden;
        }
    
        .overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            z-index: 1000;
        }
    
        .overlay.is-active {
            display: block;
        }
    
    /* Dropdown mobil stili */
    .dropdown-menu {
        position: relative !important;
        width: 100% !important;
        left: 0 !important;
    }
}