/*
 * Mobil alt menü (Views/Shared/Partials/_MobilAltMenu.cshtml, js/mobil-alt-menu.js) — yalnız 992px altında.
 *
 * Ekranın altında sabit 5 bağlantı. Aşağı kaydırınca aşağı kayıp gizlenir (html.alt-menu-gizli), yukarı kaydırınca
 * gelir; yazı alanı odaktayken (klavye) gizli (html.klavye-acik). Teklif ekranlarında ([data-canli-ihale]) hiç yok.
 *
 * Diğer alt çubuklar (araç listesi Sırala/Filtrele, karşılaştırma çubuğu) menünün ÜSTÜNE oturur:
 *   bottom: var(--alt-menu-pay, 0px)  — menü görünürken yüksekliği + güvenli alan, gizliyken 0
 *   güvenli alan payı: var(--alt-menu-guvenli, env(safe-area-inset-bottom)) — menü görünürken 0 (payı menü taşır)
 * Alttan açılan sayfalar (filtre, sıralama, sohbet, araç talebi) ve pencereler daha üst katmandadır, menüyü örter.
 */

:root {
    --alt-menu-yukseklik: 58px;
}

.mobil-alt-menu,
.mobil-alt-menu-bosluk {
    display: none;
}

@media (max-width: 991.98px) {
    .mobil-alt-menu {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: var(--z-alt-cubuk);
        display: flex;
        padding-bottom: env(safe-area-inset-bottom);
        border-top: var(--kenar);
        background-color: var(--renk-yuzey);
        box-shadow: var(--golge-2);
        transition: transform var(--sure-orta) var(--egri), box-shadow var(--sure-orta);
    }

    .mobil-alt-menu-bosluk {
        display: block;
        height: calc(var(--alt-menu-yukseklik) + env(safe-area-inset-bottom));
    }

    .mobil-alt-menu-oge {
        display: flex;
        flex: 1 1 0;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        min-width: 0;
        height: var(--alt-menu-yukseklik);
        padding: 0;
        color: var(--renk-metin-ikincil);
        font-size: .6875rem;   /* 11px: sekme çubuğu etiketi; 360px telefonda "Tamamlanan"/"Kazanılan" kesilmesin */
        font-weight: var(--t-normal);
        line-height: 1.2;
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
        transition: color var(--sure-hizli);
    }

    .mobil-alt-menu-oge .bi {
        font-size: 22px;
        line-height: 1;
    }

    .mobil-alt-menu-oge span {
        max-width: 100%;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .mobil-alt-menu-oge:hover,
    .mobil-alt-menu-oge:active {
        color: var(--renk-metin);
    }

    /* Bulunulan sayfa: tek kırmızı vurgu + dolu simge. Kalınlık değişmez (dar ekranda etiket kesilmesin). */
    .mobil-alt-menu-oge[aria-current="page"] {
        color: var(--renk-marka);
    }

    .mobil-alt-menu-oge:focus-visible {
        outline: 2px solid var(--renk-marka);
        outline-offset: -4px;
        border-radius: var(--r-orta);
    }

    html.alt-menu-gizli .mobil-alt-menu,
    html.klavye-acik .mobil-alt-menu {
        transform: translateY(100%);
        box-shadow: none;
    }

    /* Teklif ekranları: ekranın altı teklif çubuğunundur; yanlış dokunuş teklif kaçırtmasın. */
    body:has([data-canli-ihale]) .mobil-alt-menu,
    body:has([data-canli-ihale]) .mobil-alt-menu-bosluk {
        display: none;
    }

    /* Menü görünürken diğer alt çubukların konumu (bkz. dosya başı). */
    html:has(.mobil-alt-menu):not(:has([data-canli-ihale])):not(.alt-menu-gizli):not(.klavye-acik) {
        --alt-menu-pay: calc(var(--alt-menu-yukseklik) + env(safe-area-inset-bottom));
        --alt-menu-guvenli: 0px;
    }
}

@media print {
    .mobil-alt-menu,
    .mobil-alt-menu-bosluk {
        display: none !important;
    }
}