/* =========================================================================
   MENÜ YERLEŞİMİ: KEŞİF  —  [data-yerlesim="kesif"]
   =========================================================================

   Kullanıcı isteği (25 Eylül 2026): "ilk karşılama ekranında kategorideki
   ilgili ürün adına tıklayınca örneğin balıklar, sadece balıklar gözükmeli ve
   geri tuşuna basınca karşılama ekranına dönmeli."

   Diğer beş yerleşim menünün tamamını tek uzun sayfada gösteriyor. Keşif
   bunu ikiye ayırıyor:
     BÖLÜM LİSTESİ   (body[data-kesif="liste"])  — büyük bölüm kartları
     BÖLÜM İÇİ       (body[data-kesif="bolum"])  — yalnız seçilen kategori

   KURALLAR
   - Bu dosyadaki HER kural [data-yerlesim="kesif"] kapsamında. Kapsam dışına
     yazılan tek satır diğer beş yerleşimi bozar.
   - Gizleme YALNIZ buradan, CSS ile yapılıyor. JS `style.display`'a asla
     yazmıyor: menu-arama.js satır içi display kullanıyor ve visibleCardsIn()
     onu okuyor; iki yazar çakışsaydı arama sıfırlanınca gizlenen bölümler
     geri açılırdı.
   - Hiçbir işlev öğesi yok edilmiyor: sepet çubuğu, garson çağrısı, arama,
     süzgeçler, alt sayfalar her iki ekranda da erişilebilir kalıyor.
   - Arama açıldığında (body[data-kesif-arama="1"]) menü tek sayfa kipine
     düşüyor: misafir bütün menüde arama yapabilsin.
   ========================================================================= */

/* ---------------------------------------------------------------------------
   YÜZEY RENKLERİ METİN RENGİNDEN TÜRETİLİYOR (26 Eylül 2026, kullanıcı hatası)

   "Menü yerleşiminde Keşif kısmında Geri tuşu okunmuyordu ve Hazır paletlerden
    seçtiğimde menü yerleşimi bozuldu." + "Keşif Menü yerleşiminde Kategori
    fotoğrafları soluk çıkıyor."

   Sebep: bu dosya `var(--m-line, rgba(255,255,255,.14))` gibi yedeklerle
   yazılmıştı ama `--m-line` ve `--m-kart` HİÇBİR YERDE tanımlı değil (yalnız
   --m-zemin ve --m-accent Tasarım Stüdyosu'ndan geliyor). Yani her zaman beyaz
   yedek kullanılıyordu: koyu palette iş görüyor, AÇIK palette (varsayılan kağıt
   teması) kenarlar ve geri düğmesi bembeyaz zemine karışıp yok oluyordu.

   Çözüm: yüzeyler `currentColor`dan türetiliyor. Metin koyuysa çizgi koyu,
   metin açıksa çizgi açık olur — palet ne olursa olsun görünür kalır. */
[data-yerlesim="kesif"] {
    --k-cizgi: color-mix(in srgb, currentColor 22%, transparent);
    --k-yuzey: color-mix(in srgb, currentColor 7%, transparent);
    --k-yuzey-koyu: color-mix(in srgb, currentColor 13%, transparent);
}

/* ------------------------------------------------------------ bölüm listesi */

/* Bölüm listesi ekranında ürünler gizli, bölüm kartları görünür.
   `:not([data-kesif-arama])`: arama yazılırken bu kural DEVRE DIŞI kalıyor,
   yoksa arama sonuçları gizli bölümlerin içinde kalırdı (25 Eylül 2026
   kod incelemesi, bulgu 4). Özgüllükle yarışmak yerine kuralın kendisini
   koşullu yapmak tek sağlam yol. */
[data-yerlesim="kesif"][data-kesif="liste"]:not([data-kesif-arama]) .products-container > .cat {
    display: none;
}

/* Bölüm kartları: ürün listesinin yerine basılan gezinme ızgarası.
   Kartlar JS ile değil, sunucudan gelen .cat başlıklarından üretiliyor
   (aşağıdaki .k-bolumler kabı Menu/Index.cshtml'de basılıyor). */
[data-yerlesim="kesif"] .k-bolumler {
    display: none;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    padding: 4px 16px 24px;
}

[data-yerlesim="kesif"][data-kesif="liste"] .k-bolumler {
    display: grid;
}

[data-yerlesim="kesif"] .k-bolum-kart {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 132px;
    padding: 14px;
    border: 1px solid var(--k-cizgi);
    border-radius: 16px;
    background: var(--k-yuzey);
    color: inherit;
    text-align: left;
    cursor: pointer;
    overflow: hidden;
    font: inherit;
    -webkit-tap-highlight-color: transparent;
    transition: transform .16s ease, border-color .16s ease;
}

[data-yerlesim="kesif"] .k-bolum-kart:active { transform: scale(.975); }

@media (hover: hover) {
    [data-yerlesim="kesif"] .k-bolum-kart:hover {
        border-color: var(--m-accent, #E4572E);
    }
}

/* Kapak görseli varsa kartın zemini olur; yoksa vurgu rengiyle yumuşak bir
   degrade çizilir — boş gri kutu görünmesin. */
/* .55 → .92 (26 Eylül 2026): kategori fotoğrafları soluk çıkıyordu. Yazının
   okunmasını alttaki koyu degrade sağlıyor, fotoğrafı kısmaya gerek yok. */
[data-yerlesim="kesif"] .k-bolum-gorsel {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: .92;
}

/* Fotoğraflı kartta yazı BEYAZ: altında koyu degrade var, menünün kendi koyu
   mürekkebi o degradenin üstünde okunmuyordu. Fotoğrafsız kart menü rengini
   kullanmaya devam ediyor. */
[data-yerlesim="kesif"] .k-bolum-kart:not(.k-gorselsiz) .k-bolum-metin,
[data-yerlesim="kesif"] .k-bolum-kart:not(.k-gorselsiz) .k-bolum-ok {
    color: #fff;
}

[data-yerlesim="kesif"] .k-bolum-kart::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 30%, rgba(0, 0, 0, .62) 100%);
}

[data-yerlesim="kesif"] .k-bolum-kart.k-gorselsiz::after {
    background: linear-gradient(145deg,
                color-mix(in srgb, var(--m-accent, #E4572E) 22%, transparent),
                rgba(0, 0, 0, .5));
}

[data-yerlesim="kesif"] .k-bolum-metin {
    position: relative;
    z-index: 1;
}

[data-yerlesim="kesif"] .k-bolum-ad {
    display: block;
    font-family: var(--m-font-display, inherit);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -.01em;
}

[data-yerlesim="kesif"] .k-bolum-sayi {
    display: block;
    font-size: 11.5px;
    opacity: .78;
    margin-top: 3px;
}

[data-yerlesim="kesif"] .k-bolum-ok {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 1;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: color-mix(in srgb, #fff 26%, transparent);
    display: grid;
    place-items: center;
}

[data-yerlesim="kesif"] .k-bolum-ok svg { width: 14px; height: 14px; }

/* Listede sekme şeridi ve süzgeçler anlamsız (henüz bölüm seçilmedi), ama
   ARAMA kalıyor: misafir bölümleri gezmeden ürün arayabilsin. */
[data-yerlesim="kesif"][data-kesif="liste"] .m-sekmeler,
[data-yerlesim="kesif"][data-kesif="liste"] #mFiltreler,
[data-yerlesim="kesif"][data-kesif="liste"] #catStatus,
[data-yerlesim="kesif"][data-kesif="liste"] .m-one {
    display: none;
}

/* ------------------------------------------------------------- bölüm içi */

/* Yalnız açık bölüm görünür. .k-acik sınıfını JS veriyor.
   Arama yazılırken bu kural da devre dışı: bölümün İÇİNDE arama yapan misafir
   bütün menüde sonuç görmeli. Eski sürümde bu kuralın özgüllüğü (0,5,0) arama
   kuralını (0,4,0) yeniyordu; sonuç, diğer bölümlerin sonuçları gizli kalıyor
   ve geri çubuğu da `!important` ile kalktığı için çıkışsız bir ekran
   oluşuyordu (kod incelemesi bulgu 4). */
[data-yerlesim="kesif"][data-kesif="bolum"]:not([data-kesif-arama]) .products-container > .cat:not(.k-acik) {
    display: none;
}

/* Bölüm içinde geri çubuğu */
[data-yerlesim="kesif"] .k-geri-serit {
    display: none;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    position: sticky;
    top: 0;
    z-index: 26;
    background: var(--m-zemin, var(--paper, #0f1420));
    border-bottom: 1px solid var(--k-cizgi);
}

[data-yerlesim="kesif"][data-kesif="bolum"] .k-geri-serit { display: flex; }

[data-yerlesim="kesif"] .k-geri {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px 7px 9px;
    border: 1px solid var(--k-cizgi);
    border-radius: 99px;
    background: var(--k-yuzey-koyu);
    color: inherit;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

[data-yerlesim="kesif"] .k-geri:active { transform: scale(.97); }
[data-yerlesim="kesif"] .k-geri svg { width: 15px; height: 15px; }

[data-yerlesim="kesif"] .k-geri-ad {
    font-family: var(--m-font-display, inherit);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -.01em;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Bölüm içindeyken o bölümün kendi başlığı tekrar ediyor (geri şeridinde
   adı yazıyor) — bölüm kapağı kalsın, ikinci başlık satırı kalkıyor. */
[data-yerlesim="kesif"][data-kesif="bolum"] .cat.k-acik > .cat-head.cat-hero {
    display: none;
}

/* --------------------------------------------------------------- arama kipi */

/* Arama yazılınca tek sayfa kipine dönülüyor: bütün bölümler görünür (yukarıdaki
   iki gizleme kuralı `:not([data-kesif-arama])` ile kendiliğinden susuyor),
   bölüm kartları kalkıyor.

   GERİ ÇUBUĞU GİZLENMİYOR (kod incelemesi bulgu 4): önceki sürüm onu
   `!important` ile kaldırıyordu ve bölüm içinde arama yapan misafirin bölüm
   listesine dönecek düğmesi kalmıyordu — yalnız tarayıcı geri tuşu. Çubuk
   dururken arama sonuçları da görünüyor, ikisi çakışmıyor. */
[data-yerlesim="kesif"][data-kesif-arama="1"] .k-bolumler {
    display: none !important;
}

[data-yerlesim="kesif"][data-kesif-arama="1"] .m-sekmeler,
[data-yerlesim="kesif"][data-kesif-arama="1"] #catStatus {
    display: block;
}

/* ------------------------------------------------------------------ telefon */

@media (min-width: 560px) {
    [data-yerlesim="kesif"] .k-bolumler { grid-template-columns: repeat(3, 1fr); }
    [data-yerlesim="kesif"] .k-bolum-kart { min-height: 150px; }
}

@media (prefers-reduced-motion: reduce) {
    [data-yerlesim="kesif"] .k-bolum-kart,
    [data-yerlesim="kesif"] .k-geri { transition: none; }
    [data-yerlesim="kesif"] .k-bolum-kart:active,
    [data-yerlesim="kesif"] .k-geri:active { transform: none; }
}