/* --- GLOBAL DEĞİŞKENLER --- */
:root {
    --primary-purple: #a855f7; /* Asil Mor */
    --hover-purple: #8b5cf6;
    --nav-bg: rgba(15, 15, 15, 0.9);
    --border-color: #333;
}

#logo-header{
    width: 100%;
    margin:auto;
    padding: 0px 40px 0px 40px
}

#logo-header a{
    width: 100%;
    display: flex;
    justify-content: center;
}
#logo-header a img{
    width: 50%;
    height: auto;
    margin: auto;
}

/* --- ANA NAVİGASYON KONTEYNER --- */
.floating-nav {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--nav-bg);
    backdrop-filter: blur(12px);
    border: 1px solid var(--border-color);
    padding: 8px 15px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 1000;
    box-shadow: 0 10px 40px rgba(0,0,0,0.6);
    transition: all 0.3s ease;
    user-select: none; /* Çift tıklamada metin seçimini engeller */
}

/* --- MENÜ ELEMANLARI (LİNK VE BUTONLAR) --- */
.float-item {
    text-decoration: none;
    background: #222;
    border: 1px solid var(--border-color);
    color: #eee;
    padding: 0 18px;
    height: 45px; /* Kral, senin istediğin yükseklik */
    border-radius: 25px;
    cursor: pointer;
    transition: 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 14px; /* 18px çok büyük kalabilir, 14-15px idealdir ama senin tercihinse 18px yapabilirsin */
    font-weight: 700;
    white-space: nowrap;
}

/* Sabit İkonlar (Anasayfa ve Hamburger) */
.float-item[title="Anasayfa"], .menu-trigger {
    width: 45px !important;
    padding: 0 !important;
}

/* --- AKTİF VE HOVER DURUMU --- */
.float-item.active {
    background: var(--primary-purple) !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 0 15px rgba(168, 85, 247, 0.4);
}

.float-item:hover {
    background: var(--hover-purple);
    color: #fff;
    transform: translateY(-2px);
}

/* --- MASAÜSTÜ LİSTE GÖRÜNÜMÜ --- */
.desktop-only-flex {
    display: flex;
    gap: 10px;
}

/* --- HAMBURGER SİSTEMİ --- */
.mobile-or-large-menu { display: none; }
.mobile-or-large-menu.always-show { display: block !important; }

.menu-trigger {
    background: #1a1a1a;
    border: 1px solid var(--primary-purple) !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.4);
}
.menu-trigger span { color: white !important; font-size: 24px; }

/* --- DROPUP (AÇILIR MENÜ) TASARIMI --- */
.dropdown-container, .lang-dropdown { position: relative; }

.dropdown-popup, .lang-menu {
    position: absolute;
    bottom: 70px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(10, 10, 10, 0.98);
    backdrop-filter: blur(20px);
    border: 1px solid var(--border-color);
    border-radius: 18px;
    min-width: 180px;
    display: none; /* JS Kontrolü için başlangıçta gizli */
    flex-direction: column;
    padding: 10px;
    box-shadow: 0 -15px 40px rgba(0,0,0,0.7);
    z-index: 1001;
}

/* Tıklandığında veya (Masaüstünde) Hoverda Göster */
.dropdown-container.show-menu .dropdown-popup, 
.lang-dropdown.show-menu .lang-menu {
    display: flex !important;
    animation: slideUp 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Masaüstü Hover Desteği */
@media (min-width: 769px) {
    .dropdown-container:hover .dropdown-popup, 
    .lang-dropdown:hover .lang-menu { display: flex; }
}

/* Görünmez Köprü (Farenin kayması durumunda menünün kapanmaması için) */
.dropdown-popup::after, .lang-menu::after {
    content: ""; position: absolute; bottom: -25px; left: 0; width: 100%; height: 30px; background: transparent;
}

/* Pop-up İçindeki Linkler */
.popup-item, .lang-option {
    padding: 14px; color: #888; text-decoration: none; font-size: 13px; font-weight: 800; text-align: center; border-radius: 12px; transition: 0.2s;
}
.popup-item:hover, .lang-option:hover { background: rgba(168, 85, 247, 0.1); color: var(--primary-purple); }
.active-text { color: var(--primary-purple) !important; background: rgba(168, 85, 247, 0.05); }

/* --- DİL AYIRICI VE TETİKLEYİCİ --- */
.lang-divider { width: 1px; height: 20px; background: var(--border-color); margin: 0 5px; }
.lang-trigger {
    background: #222; border: 1px solid var(--border-color); color: #fff; padding: 0 15px; height: 45px; border-radius: 25px; cursor: pointer; font-size: 12px; font-weight: 800; display: flex; align-items: center; gap: 5px;
}

/* --- MOBİL ADAPTASYON (768px ve Altı) --- */
@media (max-width: 768px) {
    #logo-header a img{
        width: 100%;
        height: auto;
        margin: 10px 0px 10px 0px;
    }
    .desktop-only, .desktop-only-flex { display: none !important; }
    .mobile-only { 
        width: 100%;
        flex-wrap: wrap;
        display: flex;
        justify-content: center;
        flex-direction: column;
     }

    .floating-nav {
        height: 60px; /* Mobilde biraz daha geniş ve ferah */
        padding: 0 15px;
        gap: 15px;
        bottom: 20px;
        align-items: center !important;
    }

    /* Mobilde her şey aynı hizada (App Bar stili) */
    .menu-trigger, .lang-trigger, .float-item[title="Anasayfa"] {
        transform: none !important; 
        margin: 0 !important;
        width: 45px !important;
        height: 45px !important;
        border-radius: 50% !important;
        background: #222 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
    }

    .lang-trigger span.material-icons-outlined { display: none; } /* Mobilde ok gereksiz */

    .dropdown-popup, .lang-menu {
        bottom: 75px !important;
        min-width: 200px;
    }
}

/* --- ANİMASYON --- */
@keyframes slideUp {
    from { transform: translate(-50%, 20px); opacity: 0; }
    to { transform: translate(-50%, 0); opacity: 1; }
}