/* Responsive düzenlemeler - Kalıcı (2026-08-23) */

/* ===========================================
   BREAKPOINT: 1024px (lg - desktop başlangıcı)
   =========================================== */

/* ----- Masaüstü (>= 1024px): Mobil menüyü GİZLE (hiçbir koşulda görünmesin) ----- */
@media (min-width: 1024px) {
    #mobile-menu,
    #mobile-menu-toggle,
    #mobile-menu.active,
    #mobile-menu:not(.hidden),
    #mobile-menu:not([hidden]) {
        display: none !important;
    }
    /* Desktop navbar: gizli menü linklerini göster */
    .desktop-nav,
    nav .desktop-links,
    [data-nav="desktop"] {
        display: flex !important;
    }
}

/* ----- Mobil & Tablet (<= 1023px): Mobil menü toggle mümkün ----- */
@media (max-width: 1023px) {
    .desktop-nav,
    nav .desktop-links,
    [data-nav="desktop"] {
        display: none !important;
    }
    #mobile-menu-toggle {
        display: inline-flex !important;
    }
    /* Mobil default: mobil menu gizli */
    #mobile-menu {
        display: none;
    }
    /* JS ile .hidden class kaldırıldıysa veya .active ise GÖSTER */
    #mobile-menu:not(.hidden),
    #mobile-menu.active,
    #mobile-menu:not([hidden]) {
        display: block !important;
    }
}

/* ----- Tablet ara breakpoint (768-1023px) ----- */
@media (min-width: 768px) and (max-width: 1023px) {
    #mobile-menu .menu-column {
        column-count: 2;
        column-gap: 1rem;
    }
}

/* ----- Küçük Mobil (<= 480px) ----- */
@media (max-width: 480px) {
    #mobile-menu .menu-section {
        padding: 0.75rem 0;
    }
}