/**
 * Mobil navigasyon geri yükleme — z-index / tıklama / logo
 * Tüm mobil stillerden sonra yüklenir.
 */
@media (max-width: 991px) {
    main {
        position: relative;
        z-index: 1 !important;
    }

    /* Kapalı çekmece navbar'ın üstüne binmesin, tıklamayı yutmasın */
    .side-nav:not(.is-open) {
        z-index: 0 !important;
        pointer-events: none !important;
        visibility: hidden !important;
        transform: translate3d(-105%, 0, 0) !important;
        opacity: 0 !important;
        isolation: auto !important;
    }

    .side-nav.is-open {
        z-index: 9200 !important;
        pointer-events: auto !important;
        visibility: visible !important;
        transform: translate3d(0, 0, 0) !important;
        opacity: 1 !important;
    }

    .mobile-nav-overlay {
        z-index: 9100 !important;
        pointer-events: none !important;
    }

    .mobile-nav-overlay.is-visible {
        z-index: 9150 !important;
        pointer-events: auto !important;
    }

    .top-nav {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        z-index: 9600 !important;
        pointer-events: auto !important;
    }

    body.nav-menu-open .top-nav,
    body:has(#menu-toggle:checked) .top-nav {
        z-index: 9650 !important;
    }

    .top-nav__brand {
        order: 0 !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        z-index: 9630 !important;
        pointer-events: auto !important;
        min-width: 0 !important;
        min-height: 44px;
        padding: 4px 2px !important;
        border: none !important;
        border-radius: 0 !important;
        overflow: visible !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    /* .top-nav__brand-img — oval: sidebar-brand.css */

    body.mobile-menu-open .top-nav__brand {
        opacity: 0.35 !important;
        pointer-events: none !important;
    }

    #menu-toggle {
        z-index: 9620 !important;
        pointer-events: auto !important;
    }

    .menu-button-container {
        z-index: 9625 !important;
        pointer-events: auto !important;
    }

    .theme-toggle {
        --toggle-size: 52px;
        --toggle-radius: 14px;
        z-index: 9622 !important;
        pointer-events: auto !important;
        top: calc(env(safe-area-inset-top, 0px) + 10px) !important;
        right: calc(max(10px, env(safe-area-inset-right, 0px)) + 60px) !important;
        min-width: 52px !important;
        min-height: 52px !important;
        border-radius: 14px !important;
    }

    body.nav-menu-open .nav-menu-close {
        z-index: 9640 !important;
        pointer-events: auto !important;
    }

    body.nav-menu-open #topNavMenu,
    body:has(#menu-toggle:checked) #topNavMenu,
    #menu-toggle:checked ~ #topNavMenu {
        z-index: 9580 !important;
        pointer-events: auto !important;
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Aydınlık cam sidebar — yalnızca açık çekmece; kapalı halde mobil kuralları */
    body.light-mode .side-nav:not(.is-open) {
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        box-shadow: none !important;
        border-right: none !important;
        isolation: auto !important;
    }

    body.light-mode .side-nav:not(.is-open)::before,
    body.light-mode .side-nav:not(.is-open)::after {
        display: none !important;
    }
}

@media (max-width: 576px) {
    .theme-toggle {
        right: calc(max(10px, env(safe-area-inset-right, 0px)) + 58px) !important;
    }
}

/* Karanlık mod mobil logo — son override (kare kutu / siyah zemin) */
@media (max-width: 991px) {
    body:not(.light-mode) .top-nav__brand,
    html:not([data-theme="light"]) .top-nav__brand {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        min-height: 0 !important;
        padding: 2px !important;
    }

    body:not(.light-mode) .top-nav__brand .brand-logo-oval--nav,
    html:not([data-theme="light"]) .top-nav__brand .brand-logo-oval--nav {
        --brand-oval-w: 72px;
        --brand-oval-h: calc(var(--brand-oval-w) * 463 / 656);
        display: block !important;
        width: var(--brand-oval-w) !important;
        height: var(--brand-oval-h) !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-width: none !important;
        max-height: none !important;
        aspect-ratio: 656 / 463 !important;
        border-radius: 50% !important;
        overflow: hidden !important;
        clip-path: ellipse(50% 50% at 50% 50%) !important;
        isolation: auto !important;
        contain: none !important;
        background: transparent !important;
        line-height: 0 !important;
    }

    body:not(.light-mode) .top-nav__brand .brand-logo-oval--nav .top-nav__brand-img,
    html:not([data-theme="light"]) .top-nav__brand .brand-logo-oval--nav .top-nav__brand-img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        max-height: none !important;
        object-fit: contain !important;
        mix-blend-mode: screen !important;
        filter: none !important;
        background: transparent !important;
        border-radius: 0 !important;
        -webkit-mask-image: radial-gradient(
            ellipse 50% 50% at 50% 50%,
            #000 88%,
            transparent 100%
        ) !important;
        mask-image: radial-gradient(
            ellipse 50% 50% at 50% 50%,
            #000 88%,
            transparent 100%
        ) !important;
    }
}

@media (max-width: 576px) {
    body:not(.light-mode) .top-nav__brand .brand-logo-oval--nav,
    html:not([data-theme="light"]) .top-nav__brand .brand-logo-oval--nav {
        --brand-oval-w: 66px;
    }
}