/* ============================================================================
   Natra kabuk stilleri.

   Tasarım kararı: açık tema varsayılan, yoğun bilgi. Bir ERP kullanıcısı ekranda
   günde 8 saat geçiriyor ve aynı anda çok satır görmek istiyor — bol boşluklu
   "modern" düzen burada iş yavaşlatır.

   Kırılım noktası 860px (NatraWMS ile aynı): altında sol menü off-canvas drawer'a
   döner, dokunma hedefleri >= 44px olur.
   ============================================================================ */

:root {
    --ntr-yan-genislik: 264px;
    --ntr-yan-dar: 64px;
    --ntr-ust-yukseklik: 52px;

    --ntr-ana: #0f766e;
    --ntr-ana-koyu: #0b5d56;
    --ntr-ana-acik: #ccfbf1;

    --ntr-zemin: #f6f7f9;
    --ntr-yuzey: #ffffff;
    --ntr-kenar: #e2e5ea;
    --ntr-kenar-yumusak: #f1f3f5;
    --ntr-metin: #1f2933;
    --ntr-metin-soluk: #6b7684;

    /* Rapor/liste tabloları — GioESihirbaz tarzı: yumuşak başlık zemini + hover, kırmızı eksi. */
    --ntr-tablo-bas: #f8fafc;
    --ntr-tablo-hover: #f6f8fa;
    --ntr-kirmizi: #b91c1c;

    --ntr-tehlike: #dc2626;
    --ntr-uyari: #d97706;
    --ntr-basari: #16a34a;

    --ntr-yaricap: 8px;
    --ntr-golge: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .06);
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    color: var(--ntr-metin);
    background: var(--ntr-zemin);
}

/* ── Kabuk ─────────────────────────────────────────────────────────────── */

.ntr-kabuk {
    display: grid;
    grid-template-columns: var(--ntr-yan-genislik) 1fr;
    min-height: 100vh;
}

.ntr-kabuk.dar { grid-template-columns: var(--ntr-yan-dar) 1fr; }

.ntr-yan {
    background: var(--ntr-yuzey);
    border-right: 1px solid var(--ntr-kenar);
    display: flex;
    flex-direction: column;
    height: 100vh;
    position: sticky;
    top: 0;
    overflow: hidden;
}

.ntr-marka {
    display: flex;
    align-items: center;
    gap: 8px;
    box-sizing: border-box;
    /* iOS PWA (standalone): üst bar durum çubuğu/notch altına insin — güvenli alan boşluğu.
       Masaüstünde ve tarayıcıda env()=0, bu yüzden görünüm değişmez. */
    height: calc(var(--ntr-ust-yukseklik) + env(safe-area-inset-top, 0px));
    padding: env(safe-area-inset-top, 0px) 12px 0;
    border-bottom: 1px solid var(--ntr-kenar);
    font-weight: 600;
    color: var(--ntr-ana);
    flex: 0 0 auto;
}

.ntr-marka-ad { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.ntr-marka-ad:hover { opacity: .82; }
.ntr-marka-ad i { font-size: .95em; }
/* Logo: geniş "natra" wordmark; daraltılınca kompakt "n" markası (gizlemek yerine değiştir). */
.ntr-marka-genis { height: 24px; width: auto; display: block; }
.ntr-marka-dar { height: 24px; width: auto; display: none; }
.ntr-kabuk.dar .ntr-marka-ad { justify-content: center; }
.ntr-kabuk.dar .ntr-marka-genis { display: none; }
.ntr-kabuk.dar .ntr-marka-dar { display: block; }

.ntr-ana { display: flex; flex-direction: column; min-width: 0; }

.ntr-ust {
    display: flex;
    align-items: center;
    gap: 8px;
    box-sizing: border-box;
    /* iOS PWA güvenli alan: içerik durum çubuğu/notch altına insin (env()=0 masaüstünde). */
    height: calc(var(--ntr-ust-yukseklik) + env(safe-area-inset-top, 0px));
    padding: env(safe-area-inset-top, 0px) 12px 0;
    background: var(--ntr-yuzey);
    border-bottom: 1px solid var(--ntr-kenar);
    position: sticky;
    top: 0;
    z-index: 20;
}

.ntr-ust-sag { margin-left: auto; display: flex; align-items: center; gap: 8px; }

.ntr-icerik { padding: 16px; flex: 1; min-width: 0; }

/* ── Modül şeridi ──────────────────────────────────────────────────────── */

.ntr-serit {
    display: flex;
    flex-direction: column;
    padding: 6px;
    gap: 2px;
    border-bottom: 1px solid var(--ntr-kenar);
    max-height: 40vh;
    overflow-y: auto;
    flex: 0 0 auto;
}

.ntr-serit-sekme {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border: 0;
    border-radius: var(--ntr-yaricap);
    background: transparent;
    color: var(--ntr-metin);
    cursor: pointer;
    text-align: left;
    font-size: 13px;
    min-height: 36px;
}

.ntr-serit-sekme:hover { background: var(--ntr-zemin); }

.ntr-serit-sekme.aktif {
    background: var(--ntr-ana-acik);
    color: var(--ntr-ana-koyu);
    font-weight: 600;
}

.ntr-serit-sekme i { font-size: 16px; width: 20px; text-align: center; flex: 0 0 auto; }
.ntr-kabuk.dar .ntr-serit-ad { display: none; }

/* ── Menü ──────────────────────────────────────────────────────────────── */

.ntr-menu { flex: 1; overflow-y: auto; padding: 6px; }

.ntr-menu-grup { margin-bottom: 2px; }

.ntr-menu-baslik,
.ntr-kisayol-baslik {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 7px 10px;
    border: 0;
    border-radius: var(--ntr-yaricap);
    background: transparent;
    color: var(--ntr-metin-soluk);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
    cursor: pointer;
    min-height: 34px;
}

.ntr-menu-baslik:hover,
.ntr-kisayol-baslik:hover { background: var(--ntr-zemin); }

.ntr-menu-sayi {
    margin-left: auto;
    font-size: 11px;
    font-weight: 500;
    color: var(--ntr-metin-soluk);
    background: var(--ntr-zemin);
    border-radius: 10px;
    padding: 1px 7px;
}

.ntr-menu-ok { transition: transform .15s; font-size: 11px; }
.ntr-menu-grup.acik .ntr-menu-ok { transform: rotate(180deg); }

.ntr-menu-liste,
.ntr-kisayol-liste { list-style: none; margin: 0 0 6px; padding: 0; }

.ntr-menu-altgrup {
    padding: 8px 10px 3px 24px;
    font-size: 11px;
    font-weight: 600;
    color: var(--ntr-metin-soluk);
}

/* Açılır-kapanır alt menü başlığı (Raporlar domainleri: Stok/Cari/… Raporları). */
.ntr-menu-altbaslik {
    display: flex; align-items: center; gap: 8px; width: 100%;
    background: none; border: none; cursor: pointer;
    padding: 8px 10px 8px 22px; margin: 1px 0;
    font-size: 12.5px; font-weight: 600; color: var(--ntr-metin);
    text-align: left; border-radius: 8px;
}
.ntr-menu-altbaslik:hover { background: var(--ntr-zemin); }
.ntr-menu-altbaslik > span:first-child { flex: 1; }
.ntr-menu-altbaslik .ntr-menu-ok { transition: transform .18s ease; font-size: 11px; opacity: .6; }
.ntr-menu-altbaslik.acik .ntr-menu-ok { transform: rotate(180deg); }
.ntr-menu-altliste { padding-left: 10px; }

.ntr-menu-oge,
.ntr-kisayol-oge { display: flex; align-items: center; }

.ntr-menu-baglanti {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
    padding: 7px 10px 7px 22px;
    border-radius: var(--ntr-yaricap);
    color: var(--ntr-metin);
    text-decoration: none;
    font-size: 13px;
    min-height: 34px;
}

.ntr-menu-baglanti:hover { background: var(--ntr-zemin); }

.ntr-menu-baglanti.active,
.ntr-menu-oge.aktif .ntr-menu-baglanti {
    background: var(--ntr-ana-acik);
    color: var(--ntr-ana-koyu);
    font-weight: 600;
}

.ntr-menu-baglanti span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ntr-menu-onek {
    margin-left: auto;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px;
    color: var(--ntr-metin-soluk);
    background: var(--ntr-zemin);
    border-radius: 4px;
    padding: 1px 4px;
    flex: 0 0 auto;
}

/* Kısayol yıldızı — dokunmatikte hep görünür, masaüstünde üzerine gelince. */
.ntr-menu-yildiz {
    border: 0;
    background: transparent;
    color: var(--ntr-metin-soluk);
    cursor: pointer;
    padding: 6px;
    border-radius: 6px;
    opacity: 0;
    transition: opacity .12s;
}

.ntr-menu-oge:hover .ntr-menu-yildiz,
.ntr-menu-yildiz.dolu { opacity: 1; }
.ntr-menu-yildiz.dolu { color: #f59e0b; }
.ntr-menu-yildiz:hover { background: var(--ntr-zemin); }

.ntr-menu-yukleniyor,
.ntr-menu-bos,
.ntr-kisayol-bos {
    padding: 16px 12px;
    color: var(--ntr-metin-soluk);
    font-size: 12px;
    line-height: 1.5;
}

.ntr-menu-bos small { display: block; margin-top: 4px; opacity: .8; }

/* ── Kısayollar ────────────────────────────────────────────────────────── */

.ntr-kisayol {
    padding: 6px;
    border-bottom: 1px solid var(--ntr-kenar);
    flex: 0 0 auto;
    max-height: 34vh;
    overflow-y: auto;
}

.ntr-kisayol-baslik i:first-child { color: #f59e0b; }

.ntr-kisayol-sil {
    border: 0;
    background: transparent;
    color: var(--ntr-metin-soluk);
    cursor: pointer;
    padding: 6px;
    border-radius: 6px;
    opacity: 0;
}

.ntr-kisayol-oge:hover .ntr-kisayol-sil { opacity: 1; }
.ntr-kisayol-sil:hover { background: var(--ntr-zemin); color: var(--ntr-tehlike); }
.ntr-kisayol-oge.surukleniyor { opacity: .4; }

/* ── Kullanıcı bloğu ───────────────────────────────────────────────────── */

.ntr-kullanici {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-top: 1px solid var(--ntr-kenar);
    flex: 0 0 auto;
}

.ntr-kullanici-bilgi { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1; }
.ntr-kullanici-bilgi > i { font-size: 22px; color: var(--ntr-metin-soluk); }
.ntr-kullanici-ad { font-size: 13px; font-weight: 600; }
.ntr-kullanici-rol { font-size: 11px; color: var(--ntr-metin-soluk); }
.ntr-kullanici-firma { display: flex; align-items: center; gap: 4px; margin-top: 3px; font-size: 11px; font-weight: 700;
                       color: var(--ntr-ana); min-width: 0; }
.ntr-kullanici-firma > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ntr-kullanici-firma select { max-width: 150px; font-size: 11px; font-weight: 700; padding: 1px 4px; border-radius: 6px;
                              border: 1px solid var(--ntr-kenar); background: var(--ntr-yuzey); color: var(--ntr-ana); }
.ntr-kullanici-firma a { color: var(--ntr-metin-soluk); display: inline-flex; }
.ntr-kullanici-firma a:hover { color: var(--ntr-ana); }
.ntr-kabuk.dar .ntr-kullanici-bilgi > div { display: none; }

.ntr-cikis {
    color: var(--ntr-metin-soluk);
    padding: 8px;
    border-radius: 6px;
    text-decoration: none;
}

.ntr-cikis:hover { background: var(--ntr-zemin); color: var(--ntr-tehlike); }

/* ── Araç çubuğu ───────────────────────────────────────────────────────── */

.ntr-arac { display: flex; align-items: center; gap: 4px; }

.ntr-arac-dugme {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border: 1px solid var(--ntr-kenar);
    border-radius: var(--ntr-yaricap);
    background: var(--ntr-yuzey);
    color: var(--ntr-metin);
    cursor: pointer;
    font-size: 13px;
    min-height: 34px;
}

.ntr-arac-dugme:hover:not(:disabled) { background: var(--ntr-zemin); }

.ntr-arac-dugme:disabled {
    opacity: .38;
    cursor: default;
}

.ntr-arac-dugme.vurgu:not(:disabled) {
    background: var(--ntr-ana);
    border-color: var(--ntr-ana);
    color: #fff;
}

.ntr-arac-dugme.tehlike:not(:disabled):hover {
    border-color: var(--ntr-tehlike);
    color: var(--ntr-tehlike);
}

.ntr-arac-ayrac { width: 1px; height: 22px; background: var(--ntr-kenar); margin: 0 4px; }

.ntr-arac-kirli {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-left: 8px;
    font-size: 12px;
    color: var(--ntr-uyari);
}

.ntr-arac-kirli i { font-size: 7px; }

.ntr-hamburger,
.ntr-daralt,
.ntr-ara-dugme {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--ntr-metin-soluk);
    cursor: pointer;
    padding: 8px;
    border-radius: var(--ntr-yaricap);
    min-height: 36px;
    min-width: 36px;
    justify-content: center;
}

.ntr-ara-dugme { border-color: var(--ntr-kenar); padding: 6px 10px; }
.ntr-hamburger:hover, .ntr-daralt:hover, .ntr-ara-dugme:hover { background: var(--ntr-zemin); }
.ntr-kur-simge { padding: 6px 9px; justify-content: center; font-size: 16px; }

/* Hızlı Erişim — üst çubuktaki kalıcı giriş noktası. Arama kutusunun yanında
   duruyor çünkü ikisi de "nereye gideceğim" sorusunu cevaplıyor: arama biliyorsan,
   Hızlı Erişim bilmiyorsan. */
.ntr-hizli-dugme {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    min-height: 36px;
    border-radius: var(--ntr-yaricap);
    border: 1px solid transparent;
    background: var(--ntr-ana);
    color: #fff;
    font-weight: 600;
    font-size: 13px;
    text-decoration: none;
    white-space: nowrap;
}
.ntr-hizli-dugme:hover { filter: brightness(1.08); color: #fff; }
.ntr-hizli-dugme.active { box-shadow: 0 0 0 3px rgba(15, 118, 110, .2); }

kbd {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px;
    background: var(--ntr-zemin);
    border: 1px solid var(--ntr-kenar);
    border-radius: 4px;
    padding: 1px 5px;
    color: var(--ntr-metin-soluk);
}

/* ── Komut paleti ──────────────────────────────────────────────────────── */

.ntr-palet-perde {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, .35);
    z-index: 1000;
}

.ntr-palet {
    position: fixed;
    top: 12vh;
    left: 50%;
    transform: translateX(-50%);
    width: min(640px, calc(100vw - 32px));
    background: var(--ntr-yuzey);
    border-radius: 12px;
    box-shadow: 0 20px 48px rgba(16, 24, 40, .22);
    z-index: 1001;
    overflow: hidden;
}

.ntr-palet-arama {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--ntr-kenar);
}

.ntr-palet-girdi {
    flex: 1;
    border: 0;
    outline: 0;
    font-size: 15px;
    background: transparent;
    color: var(--ntr-metin);
}

/* FocusOnNavigate her sayfa açılışında ilk başlığa (h1/h2) PROGRAMATİK odak verir
   ve ona tabindex=-1 ekler — ekran okuyucu için doğru ama görsel olarak başlıkta
   mavi bir çerçeve bırakıyordu (kullanıcı bildirdi 2026-08-17). Yalnız bu tür
   programatik odağın çerçevesini kaldırıyoruz; klavye ile gezen kullanıcının
   :focus-visible çerçevesi ve interaktif elemanların odağı korunur. */
[tabindex="-1"]:focus:not(:focus-visible) {
    outline: none;
}

.ntr-palet-liste { list-style: none; margin: 0; padding: 6px; max-height: 52vh; overflow-y: auto; }

.ntr-palet-oge {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: var(--ntr-yaricap);
    cursor: pointer;
}

.ntr-palet-oge.secili { background: var(--ntr-ana-acik); }
.ntr-palet-baslik { font-weight: 500; }
.ntr-palet-yol { margin-left: auto; font-size: 11px; color: var(--ntr-metin-soluk); }

.ntr-palet-bos { padding: 28px 16px; text-align: center; color: var(--ntr-metin-soluk); }

.ntr-palet-alt {
    padding: 8px 16px;
    border-top: 1px solid var(--ntr-kenar);
    font-size: 11px;
    color: var(--ntr-metin-soluk);
}

/* ── Yer tutucu ekranlar ───────────────────────────────────────────────── */

.ntr-yapim, .ntr-yetkisiz {
    max-width: 560px;
    margin: 48px auto;
    padding: 32px;
    background: var(--ntr-yuzey);
    border: 1px solid var(--ntr-kenar);
    border-radius: 12px;
    box-shadow: var(--ntr-golge);
    text-align: center;
}

.ntr-yapim-ikon, .ntr-yetkisiz-ikon { font-size: 40px; color: var(--ntr-metin-soluk); }
.ntr-yetkisiz-ikon { color: var(--ntr-uyari); }
.ntr-yapim h2, .ntr-yetkisiz h2 { margin: 12px 0 6px; font-size: 19px; }
.ntr-yapim-durum, .ntr-yetkisiz-aciklama { color: var(--ntr-metin-soluk); line-height: 1.6; }

.ntr-yapim-bilgi {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px 14px;
    margin-top: 20px;
    text-align: left;
    font-size: 13px;
}

.ntr-yapim-bilgi dt { color: var(--ntr-metin-soluk); }
.ntr-yapim-bilgi dd { margin: 0; }

code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 12px;
    background: var(--ntr-zemin);
    padding: 1px 5px;
    border-radius: 4px;
}

.ntr-dugme {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 20px;
    padding: 9px 16px;
    border: 0;
    border-radius: var(--ntr-yaricap);
    background: var(--ntr-ana);
    color: #fff;
    cursor: pointer;
    font-size: 14px;
}

.ntr-dugme:hover { background: var(--ntr-ana-koyu); }

/* ── Duyarlılık ────────────────────────────────────────────────────────── */

.sadece-mobil { display: none; }

.ntr-perde { display: none; }

@media (max-width: 860px) {
    .ntr-kabuk { grid-template-columns: 1fr; }

    .ntr-yan {
        position: fixed;
        left: 0; top: 0; bottom: 0;
        width: 84vw;
        max-width: var(--ntr-yan-genislik);
        z-index: 900;
        transform: translateX(-100%);
        transition: transform .2s ease;
    }

    .ntr-kabuk.drawer-acik .ntr-yan { transform: translateX(0); }

    .ntr-kabuk.drawer-acik .ntr-perde {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(15, 23, 42, .35);
        z-index: 890;
    }

    .sadece-mobil { display: flex; }
    .sadece-masaustu { display: none !important; }

    /* Dokunma hedefleri >= 44px — depo/servis personeli bunu telefondan kullanıyor. */
    .ntr-menu-baglanti,
    .ntr-serit-sekme,
    .ntr-arac-dugme { min-height: 44px; }

    .ntr-menu-yildiz,
    .ntr-kisayol-sil { opacity: 1; padding: 10px; }

    .ntr-arac-ad { display: none; }
    .ntr-icerik { padding: 12px; }
    .ntr-palet { top: 4vh; }
}

/* Blazor hata çubuğu */
#blazor-error-ui {
    display: none;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    padding: 10px 16px;
    background: #fef3c7;
    border-top: 1px solid #fcd34d;
    box-shadow: 0 -1px 3px rgba(0, 0, 0, .1);
    z-index: 2000;
}

#blazor-error-ui .dismiss { cursor: pointer; float: right; }

/* ══ Tema: koyu yan menü ═══════════════════════════════════════════════════
   Renkler --ntr-yan-* değişkenlerinden gelir ve bunlar ÇALIŞMA ANINDA basılır
   (TemaServisi.Degiskenler). Sınıf yalnız "koyu mu" bilgisini taşır; renk
   değerini CSS'e gömmek her firmanın kendi menü temasını seçmesini engellerdi. */
.ntr-kabuk.yan-koyu .ntr-yan {
    background: var(--ntr-yan-zemin);
    border-right-color: rgba(255, 255, 255, .08);
}

.ntr-kabuk.yan-koyu .ntr-marka-ad,
.ntr-kabuk.yan-koyu .ntr-menu-grup,
.ntr-kabuk.yan-koyu .ntr-kisayol-baslik,
.ntr-kabuk.yan-koyu .ntr-kullanici-ad { color: var(--ntr-yan-metin); }

/* Modül sekmeleri ve menü bağlantıları BİRİNCİL gezinme — koyu zeminde parlak olmalı.
   Temanın --ntr-yan-metin'i bazı paletlerde soluk gri; birincil metni sabit açık tutuyoruz
   (yan-koyu zaten koyu zemin garantisi). */
.ntr-kabuk.yan-koyu .ntr-serit-sekme,
.ntr-kabuk.yan-koyu .ntr-menu-baglanti { color: rgba(255, 255, 255, .86); }
.ntr-kabuk.yan-koyu .ntr-serit-sekme i { opacity: .82; }

.ntr-kabuk.yan-koyu .ntr-kullanici-rol,
.ntr-kabuk.yan-koyu .ntr-menu-baglanti i { color: rgba(255, 255, 255, .86); opacity: .7; }

.ntr-kabuk.yan-koyu .ntr-menu-baglanti:hover,
.ntr-kabuk.yan-koyu .ntr-kisayol-baslik:hover,
.ntr-kabuk.yan-koyu .ntr-serit-sekme:hover { background: var(--ntr-yan-aktif); color: #fff; }
.ntr-kabuk.yan-koyu .ntr-serit-sekme:hover i { opacity: 1; }

/* Aktif modül: açık lavanta pill koyu menüde kontrastsız — koyu-vurgu satırına çevir. */
.ntr-kabuk.yan-koyu .ntr-serit-sekme.aktif {
    background: var(--ntr-yan-aktif); color: #fff; font-weight: 600;
    box-shadow: inset 3px 0 0 var(--ntr-ana);
}
.ntr-kabuk.yan-koyu .ntr-serit-sekme.aktif i { color: var(--ntr-ana); opacity: 1; }

/* Aktif satır: koyu menüde ana rengin açık tonu okunmaz (açık zemin + açık yazı),
   bu yüzden zemin menünün kendi aktif rengi, vurgu ise sol kenar çizgisi. */
.ntr-kabuk.yan-koyu .ntr-menu-baglanti.active,
.ntr-kabuk.yan-koyu .ntr-menu-oge.aktif .ntr-menu-baglanti {
    background: var(--ntr-yan-aktif);
    color: #fff;
    box-shadow: inset 3px 0 0 var(--ntr-ana);
}
.ntr-kabuk.yan-koyu .ntr-menu-baglanti.active i,
.ntr-kabuk.yan-koyu .ntr-menu-oge.aktif .ntr-menu-baglanti i { opacity: 1; }

/* Grup ve DOMAIN alt başlıkları koyu zeminde okunur olmalı — açık tema renkleri
   (--ntr-metin-soluk / --ntr-metin) dim kalıyordu ("Raporlar" altındaki domainler). */
.ntr-kabuk.yan-koyu .ntr-menu-baslik { color: var(--ntr-yan-metin); opacity: .68; }
.ntr-kabuk.yan-koyu .ntr-menu-baslik:hover,
.ntr-kabuk.yan-koyu .ntr-menu-grup.acik .ntr-menu-baslik { opacity: 1; background: var(--ntr-yan-aktif); }

.ntr-kabuk.yan-koyu .ntr-menu-altbaslik { color: var(--ntr-yan-metin); opacity: .9; }
.ntr-kabuk.yan-koyu .ntr-menu-altbaslik:hover,
.ntr-kabuk.yan-koyu .ntr-menu-altbaslik.acik { opacity: 1; background: var(--ntr-yan-aktif); }

/* Domain gruplarını hiyerarşik gösteren sol kılavuz çizgisi. */
.ntr-kabuk.yan-koyu .ntr-menu-altliste { border-left: 1px solid rgba(255, 255, 255, .12); margin-left: 15px; }

/* Sayı + önek (AFT/MUS…) rozetleri ve yıldız — koyu zemine uygun kontrast. */
.ntr-kabuk.yan-koyu .ntr-menu-sayi,
.ntr-kabuk.yan-koyu .ntr-menu-onek {
    background: rgba(255, 255, 255, .12); color: var(--ntr-yan-metin);
}
.ntr-kabuk.yan-koyu .ntr-menu-yildiz { color: var(--ntr-yan-metin); opacity: .55; }
.ntr-kabuk.yan-koyu .ntr-menu-oge:hover .ntr-menu-yildiz { opacity: 1; }
.ntr-kabuk.yan-koyu .ntr-menu-yildiz:hover { background: var(--ntr-yan-aktif); }
.ntr-kabuk.yan-koyu .ntr-menu-yildiz.dolu { color: #fbbf24; opacity: 1; }

.ntr-kabuk.yan-koyu .ntr-kullanici,
.ntr-kabuk.yan-koyu .ntr-marka { border-color: rgba(255, 255, 255, .08); }

/* ══ Belge Formu (BelgeYonetimi.razor) — zengin evrak tasarımı ═══════════════
   NatraWMS BelgeFormu deseninden taşındı: koyu üst bar + 4 kolon başlık ızgarası
   + kalem grid + üçlü alt özet (İskontolar / KDV Dağılımı / Genel Toplamlar) +
   yapışkan alt çubuk. Renk değişkenleri Natra paletine eşlendi (--ntr-*).
   Kalem grid'i dar ekranda KART'a döner (td::before = data-etiket). */
.bf { display: flex; flex-direction: column; gap: 12px; padding-bottom: 74px; }

.bf-ust {
    display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
    background: #0f172a; color: #fff; padding: 10px 16px; border-radius: 12px;
}
.bf-ust-sol { display: flex; align-items: center; gap: 12px; min-width: 0; }
/* Dar ekranda sağdaki düğmeler başlığın ÜSTÜNE binmez, alta sarar (sağa yaslı). */
.bf-ust-sag { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-left: auto; justify-content: flex-end; }
.bf-yol { font-size: .74rem; opacity: .7; }
.bf-yol span { margin: 0 4px; }
.bf-musteri { font-weight: 700; font-size: 1.02rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 46vw; }
.bf-yeni-rozet { background: #dcfce7; color: #15803d; font-size: .68rem; font-weight: 700; padding: 2px 9px; border-radius: 20px; }
.bf-geri, .bf-kapat {
    width: 34px; height: 34px; border-radius: 9px; cursor: pointer; flex: 0 0 34px;
    border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08);
    color: #fff; font-size: 1rem; display: grid; place-items: center;
}
.bf-geri:hover, .bf-kapat:hover { background: rgba(255,255,255,.2); }

/* KOYU BAŞLIK ÇUBUĞUNDAKİ İKİNCİL DÜĞMELER — tek desen (Eylemler, Yazdır, Excelden
   Aktarım…). Kaydet ayrı kalır (yeşil ana düğme).

   Neden burada: bu görünüm altı ayrı sınıfta, beş ayrı dosyada yazılıydı ve ikisi
   (BelgeYonetimi .ntr-blg-btn, StokSayimi .ntr-sty-eylem) koyu çubukta OPAK BEYAZ
   çiziliyordu — beyaz zeminde yazı görünmesin diye metin koyulaştırılmış, düğme de
   çubukta leke gibi duruyordu (kullanıcı isteği 2026-09-12).

   Seçici KAPA bağlı (.bf-ust / .ntr-yf-ust): ekranların kendi <style> bloğundaki
   tek-sınıf kuralları (0,1,0) bu iki-sınıflı kuralı (0,2,0) yenemez. Böylece mevcut
   sınıflar silinmeden — mobil "yalnız simge" kuralları onlara bağlı — görünüm değişiyor. */
.bf-ust .ntr-ust-btn, .ntr-yf-ust .ntr-ust-btn {
    display: inline-flex; align-items: center; gap: 7px; min-height: 38px; padding: 0 14px;
    border: 1px solid rgba(255,255,255,.35); border-radius: 9px;
    background: rgba(255,255,255,.14); color: #fff;
    font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none;
    width: auto; flex: 0 0 auto;
}
/* Sınıf İKİ KEZ yazılı (0,5,0): ekranların kendi hover kuralları (ör. BelgeYonetimi'nin
   .ntr-blg-btn:not(...):not(...):hover — 0,4,0) bileşen <style> bloğu head'den SONRA
   yüklendiği için eşit özgüllükte kazanıyordu ve düğme üzerine gelince BEYAZ oluyordu. */
.bf-ust .ntr-ust-btn.ntr-ust-btn:hover:not(:disabled),
.ntr-yf-ust .ntr-ust-btn.ntr-ust-btn:hover:not(:disabled) {
    background: rgba(255,255,255,.26);
}
.bf-ust .ntr-ust-btn:disabled, .ntr-yf-ust .ntr-ust-btn:disabled { opacity: .5; cursor: default; }

.bf-kilit {
    background: #fffbeb; border: 1px solid var(--ntr-uyari); color: #92400e;
    padding: 9px 14px; border-radius: 10px; font-size: .85rem; font-weight: 600;
}

.bf-kart { background: var(--ntr-yuzey); border: 1px solid var(--ntr-kenar); border-radius: 12px; padding: 14px 16px; }
.bf-kart-bas { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; gap: 10px; flex-wrap: wrap; }
.bf-kart-bas h3 { margin: 0; font-size: .95rem; display: flex; align-items: baseline; gap: 8px; }
.bf-kart-bas .sayac { color: var(--ntr-metin-soluk); font-weight: 600; font-size: .82rem; }

.bf-baslik { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 16px; }
.bf-alan { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.bf-alan.gen2 { grid-column: span 2; }
.bf-alan.gen4 { grid-column: 1 / -1; }
.bf-alan > label { font-size: .72rem; font-weight: 700; color: var(--ntr-metin-soluk); letter-spacing: .02em; text-transform: none; }
.bf-sabit {
    background: var(--ntr-zemin); border: 1px solid var(--ntr-kenar); border-radius: 8px;
    padding: 8px 10px; font-size: .88rem; min-height: 38px;
    display: flex; align-items: center; gap: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.bf-sabit.vurgu { color: var(--ntr-ana-koyu); font-weight: 700; font-family: Menlo, monospace; }
.bf-kod { color: var(--ntr-metin-soluk); font-size: .78rem; }
.bf-input {
    border: 1px solid var(--ntr-kenar); border-radius: 8px; padding: 8px 10px;
    font-size: .88rem; font-family: inherit; min-height: 38px; width: 100%;
    background: var(--ntr-yuzey); color: var(--ntr-metin);
}
.bf-input:focus { outline: none; border-color: var(--ntr-ana); box-shadow: 0 0 0 3px var(--ntr-ana-acik); }
.bf-input:disabled { background: var(--ntr-zemin); color: var(--ntr-metin-soluk); }
.bf-input.dar { max-width: 88px; }

/* ── Kalem grid ─────────────────────────────────────────────────────────────── */
.bf-kaydir { overflow-x: auto; }
.bf-grid { width: 100%; border-collapse: collapse; font-size: .85rem; min-width: 860px; }
.bf-grid th {
    text-align: left; font-size: .7rem; font-weight: 800; letter-spacing: .03em;
    color: var(--ntr-metin-soluk); padding: 8px 8px; border-bottom: 2px solid var(--ntr-kenar); white-space: nowrap;
}
.bf-grid th.sag { text-align: right; }
.bf-grid th.orta { text-align: center; }
.bf-grid th.dar, .bf-grid td.dar { width: 82px; }
.bf-grid .bf-stok-kol { min-width: 260px; }
.bf-grid td { padding: 7px 8px; border-bottom: 1px solid var(--ntr-kenar); vertical-align: middle; }
.bf-grid td.sag { text-align: right; }
.bf-grid td.orta { text-align: center; }
.bf-grid tbody tr:hover { background: #f8fafc; }
.bf-grid tbody tr.kilitli { background: #fafafa; }
.bf-sira { color: var(--ntr-metin-soluk); font-size: .78rem; }
.bf-birim { color: var(--ntr-metin-soluk); font-size: .8rem; }
.bf-net { color: var(--ntr-metin-soluk); font-variant-numeric: tabular-nums; }
.bf-kalan-bitti { color: var(--ntr-basari, #059669); font-weight: 600; }
.bf-toplam { font-weight: 700; font-variant-numeric: tabular-nums; }
.bf-satir-kod { font-size: .7rem; color: var(--ntr-metin-soluk); margin-top: 3px; font-family: Menlo, monospace; }
.bf-hucre {
    border: 1px solid var(--ntr-kenar); border-radius: 7px; padding: 5px 7px;
    font-size: .84rem; font-family: inherit; width: 100%; min-width: 74px;
    font-variant-numeric: tabular-nums; background: var(--ntr-yuzey); color: inherit;
}
.bf-hucre.sag { text-align: right; }
.bf-hucre:focus { outline: none; border-color: var(--ntr-ana); box-shadow: 0 0 0 2px var(--ntr-ana-acik); }
.bf-hucre:disabled { background: var(--ntr-zemin); color: var(--ntr-metin-soluk); }

/* Satır aksiyonları YAN YANA — hücre dar kalınca alt alta sarmasın. */
.bf-aksiyon { display: flex; gap: 6px; align-items: center; justify-content: center; flex-wrap: nowrap; }
.bf-grid td:has(.bf-aksiyon) { white-space: nowrap; }
.bf-sil {
    width: 34px; height: 34px; border-radius: 8px; cursor: pointer; font-size: 1.05rem;
    border: 1px solid #fecaca; background: var(--ntr-yuzey); color: var(--ntr-tehlike);
    display: inline-flex; align-items: center; justify-content: center; flex: none;
}
.bf-sil:hover { background: #fef2f2; }
.bf-ekle-satir {
    width: 34px; height: 34px; border-radius: 8px; cursor: pointer; font-size: 1.05rem;
    border: 1px solid var(--ntr-kenar); background: var(--ntr-yuzey); color: var(--ntr-ana); font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center; flex: none;
}
.bf-ekle-satir:hover { border-color: var(--ntr-ana); background: var(--ntr-ana-acik); }

/* Miktar, seçili depodaki bakiyeyi aşıyor → satır kırmızı. */
.bf-grid tbody tr.bf-eksi { background: #fef2f2; }
.bf-grid tbody tr.bf-kmp-bedava { background: #f0fdf4; font-weight: 700; }
.bf-grid tbody tr.bf-eksi:hover { background: #fee2e2; }

/* Satır sonundaki ＋/🗑/⋮ hücresi SAĞA YAPIŞIR (NatraWMS .bf-islem deseni) — grid yatay
   kaydırılınca aksiyonlar kaybolmasın. Yapışkan hücrenin KENDİ zemini olmalı; altından
   geçen içerik görünür ve bu zemin satır durumunu EZER — .bf-eksi (kırmızı) / hover / kilitli
   ayrıca yazılmazsa o satırda beyaz bir delik kalır. */
.bf-grid th.bf-islem, .bf-grid td.bf-aksiyon-hucre {
    position: sticky; right: 0; z-index: 2; background: var(--ntr-yuzey);
    box-shadow: -7px 0 7px -7px rgba(15, 23, 42, .25);
}
.bf-grid tbody tr:hover td.bf-aksiyon-hucre { background: #f8fafc; }
.bf-grid tbody tr.kilitli td.bf-aksiyon-hucre { background: #fafafa; }
.bf-grid tbody tr.bf-eksi td.bf-aksiyon-hucre { background: #fef2f2; }
.bf-grid tbody tr.bf-eksi:hover td.bf-aksiyon-hucre { background: #fee2e2; }

/* ── Alt özet panelleri ─────────────────────────────────────────────────────── */
.bf-ozet { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; align-items: start; }
/* Müstahsil/SMM/Gider Pusulası: 4 panel var — toplam (bf-genel) SAĞ kolona sabit, satır boyunca
   yaslı; giriş/kesinti/KDV panelleri sol iki kolonda akar (fatura düzeni, toplam aşağı kaymaz). */
.bf-must-ozet > .bf-genel { grid-column: 3; grid-row: 1 / span 2; }
/* KDV'siz belge (İthalat Faturası): ortadaki KDV DAĞILIMI kartı hiç çizilmiyor —
   Genel Toplamlar son sütuna yanaşsın, ortada asılı kalmasın. */
.bf-ozet.kdvsiz > .bf-genel { grid-column: 3; }
.bf-panel-bas {
    font-size: .72rem; font-weight: 800; letter-spacing: .05em; color: var(--ntr-ana);
    padding-bottom: 8px; margin-bottom: 10px; border-bottom: 1px solid var(--ntr-kenar);
}
.bf-gi { margin-bottom: 10px; }
.bf-gi > label { display: block; font-size: .78rem; color: var(--ntr-metin-soluk); margin-bottom: 4px; }
.bf-gi > label small { font-weight: 400; opacity: .75; }
.bf-gi-alan { display: flex; gap: 6px; }
.bf-gi-cift { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.bf-gi-not { font-size: .72rem; color: var(--ntr-metin-soluk); margin-top: -4px; }
.bf-kalemtipi-kol { min-width: 84px; width: 84px; }
.bf-kalemtipi-kol select.bf-hucre { min-width: 76px; }
@media (min-width: 861px) {
    .bf-grid td.bf-kalemtipi-kol .as-btn { min-width: 0 !important; width: 82px !important; padding-left: 6px; padding-right: 4px; }
    .bf-grid td.bf-kalemtipi-kol .as-kok, .bf-grid td.bf-kalemtipi-kol .as { min-width: 0 !important; width: 82px; }
}
/* Evrak kalem ızgarası (kullanıcı isteği 2026-10-02, İthalat Faturası): Kalem Tipi ve KDV % dar, Birim Fiyat geniş
   — 583,75 gibi fiyatlar 82 px'lik "dar" hücrede kesiliyordu. */
@media (min-width: 861px) {
    .bf-grid td.bf-m-bfiyat { width: 128px; min-width: 128px; }
    .bf-grid td.bf-m-bfiyat input.bf-hucre { min-width: 112px; }
    .bf-grid td.bf-m-kdvo { width: 58px; }
    .bf-grid td.bf-m-kdvo input.bf-hucre { min-width: 0; width: 52px; }
}
/* Stok Kodu (giriş + 🔍) ve Stok Açıklaması ayrı sütunlar */
.bf-stokkod-kol { min-width: 158px; }
.bf-stokad-kol { min-width: 190px; }
/* Satır Özel Kodları (OzelKod1..4) — parametregenel başlığı doluysa çizilir */
.bf-ozelkod-kol { min-width: 140px; }
.bf-stokkod-giris { display: flex; gap: 4px; align-items: stretch; }
.bf-stokkod-giris input { flex: 1; min-width: 0; }
.bf-stokkod-ara { flex: 0 0 auto; width: 34px; border: 1px solid var(--ntr-kenar); border-radius: 8px;
                  background: var(--ntr-zemin); cursor: pointer; color: var(--ntr-ana);
                  display: grid; place-items: center; font-size: 14px; }
.bf-stokkod-ara:hover { background: var(--ntr-ana); color: #fff; border-color: var(--ntr-ana); }
.bf-stokad { font-size: 13px; color: var(--ntr-metin); display: block;
             overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 240px; }
/* Barkod / hızlı ürün ekleme çubuğu (Kalemler başlığında) */
.bf-barkod { display: flex; flex-direction: column; gap: 4px; flex: 1 1 320px; min-width: 260px; max-width: 620px; }
.bf-barkod-etiket { font-size: .76rem; font-weight: 600; color: var(--ntr-metin-soluk); }
.bf-barkod-kutu { display: flex; align-items: center; gap: 6px; border: 1px solid var(--ntr-kenar);
                  border-radius: 10px; padding: 3px 5px 3px 10px; background: var(--ntr-yuzey); }
.bf-barkod-kutu:focus-within { border-color: var(--ntr-ana); box-shadow: 0 0 0 3px var(--ntr-ana-acik); }
.bf-barkod-ikon { color: var(--ntr-ana); font-size: 18px; }
.bf-barkod-kutu input { flex: 1; min-width: 0; border: none; outline: none; background: transparent;
                        font-size: 14px; color: inherit; min-height: 34px; }
.bf-barkod-btn { border: 1px solid var(--ntr-kenar); background: var(--ntr-zemin); border-radius: 8px;
                 padding: 6px 12px; cursor: pointer; font-size: .82rem; font-weight: 600; color: inherit;
                 display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.bf-barkod-btn:hover { border-color: var(--ntr-ana); }
.bf-barkod-btn.ana { background: var(--ntr-ana); color: #fff; border-color: var(--ntr-ana); }
.bf-barkod-btn.ana:hover { background: var(--ntr-ana-koyu); }
.bf-barkod-video { width: 100%; max-height: 240px; object-fit: cover; border-radius: 10px; background: #000; margin-top: 8px; }
.bf-barkod-durum { margin-top: 8px; padding: 8px 12px; border-radius: 8px; font-size: .84rem; font-weight: 600; }
.bf-barkod-durum.ok { background: #ecfdf5; color: #047857; }
.bf-barkod-durum.yok { background: #fef2f2; color: #b91c1c; }
/* Kalem ızgarası: salt-okunur Mevcut/Net Fiyat hücreleri */
.bf-mevcut-h { color: var(--ntr-metin-soluk); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bf-mevcut-h .eksi { color: var(--ntr-tehlike); font-weight: 700; }
.bf-mevcut-h .bos { opacity: .4; }
.bf-netfiyat { color: var(--ntr-ana-koyu); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }

.bf-mini { width: 100%; border-collapse: collapse; font-size: .82rem; }
.bf-mini th {
    text-align: left; font-size: .68rem; font-weight: 800; color: var(--ntr-metin-soluk);
    padding-bottom: 6px; letter-spacing: .03em;
}
.bf-mini th.sag, .bf-mini td.sag { text-align: right; }
.bf-mini td { padding: 5px 0; border-top: 1px solid var(--ntr-kenar); font-variant-numeric: tabular-nums; }
.bf-kdv { color: var(--ntr-ana); font-weight: 700; }
.bf-bos { color: var(--ntr-metin-soluk); font-size: .84rem; padding: 6px 0; }

.bf-genel { background: linear-gradient(180deg, var(--ntr-yuzey) 0%, var(--ntr-ana-acik) 320%); }
.bf-tsatir {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    padding: 6px 0; font-size: .82rem;
}
.bf-tsatir span { color: var(--ntr-metin-soluk); font-weight: 600; letter-spacing: .02em; }
.bf-tsatir strong { font-variant-numeric: tabular-nums; }
.bf-tsatir strong.eksi { color: var(--ntr-tehlike); }
.bf-tsatir.ara { border-top: 1px solid var(--ntr-kenar); padding-top: 9px; }
.bf-tsatir.ara strong { font-weight: 700; }
.bf-tsatir.sonuc { border-top: 2px solid var(--ntr-ana); margin-top: 6px; padding-top: 10px; }
.bf-tsatir.sonuc span { color: var(--ntr-ana-koyu); font-weight: 800; }
.bf-tsatir.sonuc strong { font-size: 1.25rem; color: var(--ntr-ana-koyu); }

/* ── Yapışkan alt aksiyon çubuğu ───────────────────────────────────────────── */
/* Footer NatraWMS gibi viewport'un ALTINDA HEP SABİT (fixed) — içerik kısayken de
   yukarı çıkmaz. Sol menü genişliğine göre konumlanır; dar/mobil modda ayarlanır. */
.bf-alt {
    position: fixed; left: var(--ntr-yan-genislik); right: 0; bottom: 0; z-index: 30;
    display: flex; justify-content: space-between; align-items: center; gap: 8px;
    background: var(--ntr-yuzey); border-top: 1px solid var(--ntr-kenar);
    padding: 10px 16px; box-shadow: 0 -3px 14px rgba(0,0,0,.10);
}
.ntr-kabuk.dar .bf-alt { left: var(--ntr-yan-dar); }
.bf-alt-sol { display: flex; gap: 8px; }
.bf-alt-sag { display: flex; gap: 8px; margin-left: auto; }
/* Sabit alt çubuk varsa içerik altta kalmasın (çubuk ≈ 60 px). Ekranın kendi kabı ayrıca pay bırakıyorsa bu yalnız fazladan boşluktur. */
.ntr-icerik:has(.bf-alt) { padding-bottom: 76px; }
/* Stok Listesi'nin alt sekme paneli de sabit; katlıyken ~44 px, açıkken kendi içinde kayar. */
.ntr-kabuk.dar .ntr-stok-alt { left: var(--ntr-yan-dar); }
.ntr-icerik:has(.ntr-stok-alt) { padding-bottom: 56px; }
/* Alt çubuğun ortak ikincil düğmeleri (başlıktan taşınan Sil ve İptal) — beyaz zeminde. */
.ntr-alt-sil, .ntr-alt-iptal {
    display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 13px; border-radius: 9px;
    font-size: 13px; font-weight: 600; cursor: pointer; background: var(--ntr-yuzey);
}
.ntr-alt-sil { border: 1px solid #fecaca; color: #b91c1c; }
.ntr-alt-sil:hover { background: #fef2f2; }
/* Hareketi/referansı olan kart silinemez: düğme pasif ve BUNU GÖSTERİR — tıklanabilir
   görünüp hata vermek kullanıcıya sebebini söylemiyordu (kullanıcı isteği 2026-09-22). */
.ntr-alt-sil:disabled { border-color: #e2e8f0; color: #94a3b8; background: #f8fafc;
                        cursor: not-allowed; opacity: .75; }
.ntr-alt-sil:disabled:hover { background: #f8fafc; }
.ntr-alt-iptal { border: 1px solid var(--ntr-kenar); color: var(--ntr-metin); }
.ntr-alt-iptal:hover { background: var(--ntr-zemin); }

@media (max-width: 1100px) {
    .bf-ozet { grid-template-columns: 1fr; }
    .bf-must-ozet > .bf-genel { grid-column: auto; grid-row: auto; }   /* dar ekranda tek kolona düş */
    .bf-ozet.kdvsiz > .bf-genel { grid-column: auto; }
    .bf-baslik { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bf-alan.gen2 { grid-column: span 1; }
}

/* Kalem ızgarası dar ekranda KART olur — 10 kolonlu tablo telefona sığmaz.
   Aynı işaretleme hem tablo hem kart; başlık gizlenir, her hücrenin etiketi
   data-etiket'ten basılır (tek işaretleme = iki görünüm ayrışmaz). */
@media (max-width: 860px) {
    .bf-baslik { grid-template-columns: 1fr; }
    .bf-alan.gen2, .bf-alan.gen4 { grid-column: span 1; }

    .bf-grid { min-width: 0; }
    .bf-grid thead { display: none; }
    .bf-grid, .bf-grid tbody { display: block; width: 100%; }
    /* Kart = satır; içindeki hücreler flex-wrap ile MANTIKLI SATIRLARA gruplanır
       (Miktar+Birim+Fiyat | İsk1-5 | NetFiyat+KDV%+NetTutar+KDV | Mevcut). */
    .bf-grid tr {
        display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 6px; width: 100%;
        border: 1px solid var(--ntr-kenar); border-radius: 10px; margin-bottom: 8px;
        padding: 8px 10px; position: relative;
    }
    .bf-grid tbody tr:hover, .bf-grid tr:hover { background: transparent; }
    /* Varsayılan hücre: TAM SATIR (kimlik: Stok Kodu/Açıklama/Özel Kod/Kalem Tipi/Seç ve
       bf-m sınıfı olmayan diğer bf-grid tüketicileri) — etiket solda, değer sağda. */
    .bf-grid td {
        display: flex; flex: 1 1 100%; align-items: center; justify-content: space-between; gap: 12px;
        border: none; padding: 5px 0; text-align: left;
    }
    .bf-grid td::before {
        content: attr(data-etiket); flex: 0 0 auto;
        font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
        color: var(--ntr-metin-soluk);
    }
    .bf-grid td > * { flex: 1 1 auto; min-width: 0; }
    .bf-grid td.sag { text-align: right; }
    .bf-hucre { min-height: 40px; }

    /* Gruplu sayısal hücreler: etiket ÜSTTE küçük, değer/input altta tam genişlik. */
    .bf-grid td.bf-m-miktar, .bf-grid td.bf-m-birim, .bf-grid td.bf-m-bfiyat,
    .bf-grid td.bf-m-isk, .bf-grid td.bf-m-tevk, .bf-grid td.bf-m-kdvo,
    .bf-grid td.bf-netfiyat, .bf-grid td.bf-net {
        flex-direction: column; align-items: stretch; justify-content: flex-end; gap: 2px;
    }
    .bf-grid td.bf-m-miktar::before, .bf-grid td.bf-m-birim::before, .bf-grid td.bf-m-bfiyat::before,
    .bf-grid td.bf-m-isk::before, .bf-grid td.bf-m-tevk::before, .bf-grid td.bf-m-kdvo::before,
    .bf-grid td.bf-netfiyat::before, .bf-grid td.bf-net::before { font-size: .56rem; text-align: left; }
    .bf-grid td.bf-netfiyat, .bf-grid td.bf-net { text-align: right; }
    .bf-grid td.bf-m-miktar > *, .bf-grid td.bf-m-birim > *, .bf-grid td.bf-m-bfiyat > *,
    .bf-grid td.bf-m-isk > *, .bf-grid td.bf-m-tevk > *, .bf-grid td.bf-m-kdvo > * { width: 100%; }

    /* Satır düzeni order ile (DOM sırası/masaüstü DEĞİŞMEZ; DOM'da Mevcut, Birim ile Fiyat
       arasında olduğundan order ile Row D'ye taşınır): */
    .bf-grid td.bf-m-miktar { order: 10; flex: 0 1 calc(33.333% - 4px); }
    .bf-grid td.bf-m-birim  { order: 11; flex: 0 1 calc(33.333% - 4px); }
    .bf-grid td.bf-m-bfiyat { order: 12; flex: 0 1 calc(33.333% - 4px); }
    .bf-grid td.bf-m-isk    { order: 20; flex: 0 1 calc(20% - 5px); }
    .bf-grid td.bf-m-tevk   { order: 30; flex: 0 1 calc(50% - 3px); }
    .bf-grid td.bf-netfiyat { order: 40; flex: 0 1 calc(25% - 5px); }
    .bf-grid td.bf-m-kdvo   { order: 41; flex: 0 1 calc(25% - 5px); }
    .bf-grid td.bf-net      { order: 42; flex: 0 1 calc(25% - 5px); }
    .bf-grid td.bf-m-kalan  { order: 13; flex: 0 1 calc(33.333% - 4px); }   /* sipariş: sevk edilmemiş */
    .bf-grid td.bf-mevcut-h { order: 50; }
    .bf-grid td.bf-durumu   { order: 55; }

    /* Sıra numarası kartın köşesinde; aksiyon karşı köşede. */
    .bf-grid td.bf-sira { position: absolute; top: 6px; right: 10px; width: auto; padding: 0; flex: 0 0 auto; justify-content: flex-end; }
    .bf-grid td.bf-sira::before { content: "#"; }
    .bf-grid td.bf-aksiyon-hucre { order: 60; justify-content: flex-end; padding-top: 8px; position: static; box-shadow: none; }
    .bf-grid td.bf-aksiyon-hucre::before { content: none; }

    /* Sabit footer mobilde solda 240px sidebar boşluğu bırakmasın → altta KOMPLE. */
    .bf-altsabit { left: 0 !important; }

    /* Üst bar sarsın: belge araç çubuğu + sağ grup (Hızlı Erişim/Ara) ekran dışına taşmasın. */
    .ntr-ust { flex-wrap: wrap; row-gap: 6px; }
    /* Üst komut çubuğu (Yeni/Kaydet/Sil/Bul/Liste/Yazdır) mobilde GİZLİ — belge formunun kendi
       başlık düğmeleri (Eylemler/Yazdır/Kaydet) ve listenin kendi "+ Yeni"si var; böylece
       Hızlı Erişim + Ara sağ grupta rahat sığar. ("Kaydedilmedi" rozeti de gizlenir; belge
       Kaydet düğmesi dirty iken aktif/teal olduğundan durum yine görünür.) */
    .ntr-arac { display: none; }
}

/* ============================================================================
   SQL Yöneticisi (sy-*) — GioESihirbaz'ın şık düzeni, Natra paletine uyarlandı.
   Salt-okunur: doğrulamayı SqlYoneticiServisi yapar, bu stil yalnız görünümdür.
   Koyu editör barı gibi bilinçli literal hex'ler (#0f172a, #5eead4) korunmuştur.
   ============================================================================ */

.sy-yukleniyor { text-align: center; padding: 60px 20px; color: var(--ntr-metin-soluk); }
.sy-yukleniyor i { font-size: 42px; display: block; margin-bottom: 10px; }

.sy-baslik { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.sy-baslik h1 { font-size: 20px; font-weight: 800; margin: 0; display: flex; align-items: center;
    gap: 9px; letter-spacing: -.3px; color: var(--ntr-metin); }
.sy-readonly { font-size: 12px; font-weight: 700; color: var(--ntr-ana);
    background: var(--ntr-ana-acik); padding: 4px 11px; border-radius: 20px;
    display: inline-flex; align-items: center; gap: 5px; }

.sy-wrap { display: flex; gap: 14px; align-items: flex-start; min-height: 60vh; }

/* ── Sol kenar çubuğu ─────────────────────────────────────────────────── */
.sy-side { width: 264px; flex-shrink: 0; background: var(--ntr-yuzey);
    border: 1px solid var(--ntr-kenar); border-radius: 14px; box-shadow: var(--ntr-golge);
    display: flex; flex-direction: column; overflow: hidden;
    position: sticky; top: 12px; max-height: calc(100vh - 120px); }
.sy-side-bas { padding: 12px 14px; font-weight: 800; color: #fff;
    background: linear-gradient(120deg, var(--ntr-ana), var(--ntr-ana-koyu));
    display: flex; align-items: center; gap: 8px; }
.sy-say { margin-left: auto; background: rgba(255,255,255,.25); border-radius: 20px;
    padding: 1px 9px; font-size: 12px; }
.sy-ara { display: flex; align-items: center; gap: 7px; margin: 10px;
    background: var(--ntr-zemin); border: 1px solid var(--ntr-kenar);
    border-radius: 9px; padding: 7px 11px; }
.sy-ara i { color: var(--ntr-metin-soluk); font-size: 14px; }
.sy-ara input { border: 0; background: transparent; outline: 0; font-size: 13px; width: 100%;
    color: inherit; }
.sy-tablolar { flex: 1; overflow-y: auto; padding: 0 8px 8px; display: flex;
    flex-direction: column; gap: 3px; }
.sy-tbl { display: flex; align-items: center; gap: 8px; text-align: left; border: 0;
    background: transparent; border-left: 3px solid transparent; border-radius: 8px;
    padding: 7px 10px; font-size: 12.5px; color: var(--ntr-metin); cursor: pointer;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace; transition: .13s; }
.sy-tbl span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sy-tbl i { color: var(--ntr-ana); font-size: 14px; flex-shrink: 0; }
.sy-tbl:hover { background: var(--ntr-zemin); border-left-color: var(--ntr-ana); }
.sy-tbl.akt { background: var(--ntr-ana-acik); border-left-color: var(--ntr-ana);
    color: var(--ntr-ana-koyu); font-weight: 700; }
.sy-side-alt-bas { display: flex; justify-content: space-between; align-items: baseline;
    padding: 9px 14px; border-top: 1px solid var(--ntr-kenar); font-size: 12.5px; }
.sy-side-alt-bas span { font-size: 11px; color: var(--ntr-metin-soluk); }
.sy-kolonlar { max-height: 240px; overflow-y: auto; padding: 0 8px 10px; display: flex;
    flex-direction: column; gap: 2px; font-size: 12px; }
.sy-kol { display: flex; align-items: center; gap: 7px; padding: 3px 8px; border-radius: 5px; }
.sy-kol code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.sy-kol small { margin-left: auto; color: var(--ntr-metin-soluk); }
.sy-kol.anahtar { background: #fffbeb; }
.sy-kol.anahtar i { color: var(--ntr-uyari); font-size: 11px; }

/* ── Sağ ana bölüm ────────────────────────────────────────────────────── */
.sy-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.sy-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.sy-btn { display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 9px;
    padding: 8px 14px; font-size: 13.5px; font-weight: 700; cursor: pointer; color: #fff;
    transition: .15s; box-shadow: 0 2px 8px -3px rgba(16,24,40,.35); }
.sy-btn i { font-size: 15px; }
.sy-btn kbd { font-size: 10.5px; opacity: .8; font-family: inherit;
    border: 1px solid rgba(255,255,255,.4); border-radius: 4px; padding: 0 4px; }
.sy-btn:hover:not(:disabled) { transform: translateY(-1px); }
.sy-btn:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
.sy-btn.calistir { background: linear-gradient(120deg, var(--ntr-basari), #15803d); }
.sy-btn.temizle { background: var(--ntr-metin-soluk); }
.sy-btn.kaydet { background: var(--ntr-ana); }
.sy-btn.excel { background: #15803d; }
.sy-btn.kayitli { background: #6d28d9; }
.sy-kaydet-satir { display: flex; align-items: center; gap: 8px; margin: 8px 0;
    padding: 8px 10px; background: var(--ntr-ana-acik); border-radius: 10px; }
.sy-kaydet-satir > i { color: var(--ntr-ana); }
.sy-kaydet-satir input[type=text], .sy-kaydet-satir input:not([type]) { flex: 1; max-width: 280px;
    border: 1px solid var(--ntr-kenar); border-radius: 8px; padding: 7px 10px; font: inherit;
    color: inherit; background: var(--ntr-yuzey); }
.sy-paylas { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600;
    color: var(--ntr-metin-soluk); white-space: nowrap; }
.sy-kayitli-panel { margin: 8px 0; padding: 8px; border: 1px solid var(--ntr-kenar);
    border-radius: 10px; background: var(--ntr-yuzey); box-shadow: var(--ntr-golge);
    max-height: 260px; overflow-y: auto; display: flex; flex-direction: column; gap: 3px; }
.sy-kayitli-it { display: flex; align-items: center; gap: 4px; }
.sy-kayitli-ad { flex: 1; text-align: left; display: inline-flex; align-items: center; gap: 8px;
    border: 0; background: transparent; padding: 7px 10px; border-radius: 8px; font: inherit;
    font-weight: 600; color: inherit; cursor: pointer; }
.sy-kayitli-ad:hover { background: var(--ntr-ana-acik); color: var(--ntr-ana); }
.sy-kayitli-sil { border: 0; background: transparent; color: var(--ntr-tehlike, #b91c1c);
    padding: 6px 9px; border-radius: 8px; cursor: pointer; }
.sy-kayitli-sil:hover { background: #fef2f2; }
.sy-etiket { color: #6d28d9; font-size: 11px; }
.sy-tavan { display: flex; flex-direction: column; gap: 2px; margin-left: auto; }
.sy-tavan span { font-size: 10px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .03em; color: var(--ntr-metin-soluk); }
.sy-tavan input { width: 110px; border: 1px solid var(--ntr-kenar); border-radius: 8px;
    padding: 6px 9px; font: inherit; color: inherit; background: var(--ntr-yuzey); }

.sy-sekme { display: flex; gap: 4px; border-bottom: 2px solid var(--ntr-kenar); }
.sy-sekme button { display: inline-flex; align-items: center; gap: 6px; border: 0;
    background: transparent; padding: 9px 16px; font-size: 13.5px; font-weight: 700;
    color: var(--ntr-metin-soluk); cursor: pointer; border-bottom: 3px solid transparent;
    margin-bottom: -2px; }
.sy-sekme button.akt { color: var(--ntr-ana); border-bottom-color: var(--ntr-ana); }
.sy-rozet { background: var(--ntr-ana); color: #fff; border-radius: 20px; padding: 0 8px;
    font-size: 11px; font-weight: 700; }

.sy-editor-kutu { border: 1px solid var(--ntr-kenar); border-radius: 12px; overflow: hidden;
    box-shadow: var(--ntr-golge); }
.sy-editor-bar { background: #0f172a; color: #5eead4; display: flex; align-items: center; gap: 7px;
    font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11.5px; font-weight: 700;
    padding: 6px 12px; letter-spacing: .4px; }
.sy-editor { margin: 0; border: 0; box-sizing: border-box; width: 100%; padding: 14px 16px;
    display: block; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 14px;
    line-height: 1.6; tab-size: 4; min-height: 220px; resize: vertical; outline: 0;
    color: var(--ntr-metin); background: var(--ntr-yuzey); }
.sy-editor:focus { box-shadow: inset 0 0 0 2px #5eead4; }

.sy-not { margin: 0; font-size: 12px; line-height: 1.6; color: var(--ntr-metin-soluk); }
.sy-not code { background: var(--ntr-zemin); padding: 1px 5px; border-radius: 4px;
    font-family: ui-monospace, monospace; }

.sy-veri { flex: 1; min-height: 200px; }
.sy-grid-kutu { border: 1px solid var(--ntr-kenar); border-radius: 12px; overflow: auto;
    max-height: 62vh; box-shadow: var(--ntr-golge); background: var(--ntr-yuzey); }
.sy-grid { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12.5px;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.sy-grid thead th { position: sticky; top: 0; z-index: 1; text-align: left; white-space: nowrap;
    padding: 8px 11px; font-weight: 700; color: #fff;
    background: linear-gradient(120deg, var(--ntr-ana), var(--ntr-ana-koyu)); }
.sy-grid td { padding: 6px 11px; white-space: nowrap; color: var(--ntr-metin);
    max-width: 340px; overflow: hidden; text-overflow: ellipsis;
    border-bottom: 1px solid var(--ntr-kenar); }
.sy-grid td.bos { color: #cbd5e1; font-style: italic; }
.sy-grid tbody tr:nth-child(even) td { background: var(--ntr-zemin); }
.sy-grid tbody tr:hover td { background: var(--ntr-ana-acik); }
.sy-rn { color: var(--ntr-metin-soluk); font-weight: 700; text-align: right;
    position: sticky; left: 0; background: var(--ntr-zemin) !important; }
.sy-grid thead .sy-rn { background: var(--ntr-ana-koyu) !important; color: #a7f3d0; }

.sy-durum { font-size: 12.5px; font-weight: 700; padding: 7px 13px; border-radius: 9px;
    display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.sy-durum span { display: inline-flex; align-items: center; gap: 6px; }
.sy-durum.ok { background: #dcfce7; color: #166534; }
.sy-durum.hata { background: #fee2e2; color: #b91c1c; }
.sy-kirp { color: var(--ntr-uyari); }

.sy-hata { background: #fee2e2; color: #b91c1c; padding: 14px 16px; border-radius: 12px;
    font-weight: 600; display: flex; align-items: center; gap: 8px; }
.sy-bos-kutu { color: var(--ntr-metin-soluk); font-size: 13px; padding: 12px;
    text-align: center; }
.sy-bos-kutu.buyuk { padding: 40px 16px; }

@media (max-width: 860px) {
    .sy-wrap { flex-direction: column; }
    .sy-side { width: auto; position: static; max-height: none; }
    .sy-tablolar { max-height: 220px; }
    .sy-tavan { margin-left: 0; }
}

/* ============================================================================
   Excel Aktarım (/sistem/excel-aktarim) — üç panelli sütun-eşlemeli toplu yükleme.
   NatraWMS/GioESihirbaz ekranının portu; renk-kodlu araç çubuğu + canlı-veri uyarısı.
   Natra paletine uyarlandı (--ntr-*), ikonlar Bootstrap Icons.
   ============================================================================ */
.ea-yukleniyor { text-align: center; padding: 60px 20px; color: var(--ntr-metin-soluk); }
.ea-sayfa { display: flex; flex-direction: column; gap: 10px; }

.ea-ust { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ea-ust h1 { font-size: 19px; margin: 0; display: flex; align-items: center; gap: 9px; color: var(--ntr-metin); }
.ea-db { margin-left: auto; display: inline-flex; align-items: center; gap: 6px;
    font-size: 12.5px; font-weight: 700; padding: 5px 12px; border-radius: 999px;
    background: var(--ntr-ana-acik); color: var(--ntr-ana-koyu); }

.ea-uyari { display: flex; align-items: center; gap: 9px; background: #fffbeb;
    border: 1px solid #fde68a; color: #92400e; border-radius: 11px; padding: 10px 14px; font-size: 12.5px; }
.ea-uyari > i { font-size: 18px; color: #b45309; flex: 0 0 auto; }

.ea-toolbar { display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
    background: var(--ntr-yuzey); border: 1px solid var(--ntr-kenar);
    border-radius: 12px; padding: 9px 12px; }
.ea-btn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--ntr-kenar);
    background: var(--ntr-yuzey); border-radius: 9px; padding: 7px 13px; font: inherit;
    font-size: 13px; font-weight: 600; color: var(--ntr-metin); cursor: pointer; transition: .13s; }
.ea-btn > i { font-size: 15px; }
.ea-btn:hover:not(:disabled) { background: var(--ntr-zemin); }
.ea-btn:disabled { opacity: .45; cursor: not-allowed; }
.ea-btn.yesil { color: #047857; border-color: #a7f3d0; background: #f0fdf4; }
.ea-btn.yesil:hover { background: #047857; color: #fff; border-color: #047857; }
.ea-btn.mavi { color: #fff; background: var(--ntr-ana); border-color: var(--ntr-ana); }
.ea-btn.mavi:hover:not(:disabled) { background: var(--ntr-ana-koyu); }
.ea-btn.kirmizi { color: var(--ntr-tehlike); border-color: #fecaca; background: #fef2f2; }
.ea-btn.kirmizi:hover { background: var(--ntr-tehlike); color: #fff; border-color: var(--ntr-tehlike); }
.ea-btn.tablo { color: #4338ca; border-color: #c7d2fe; background: #eef2ff; }
.ea-btn.tablo:hover { background: #4338ca; color: #fff; border-color: #4338ca; }
.ea-btn.yeni { color: #7c3aed; border-color: #ddd6fe; background: #f5f3ff; }
.ea-btn.yeni:hover:not(:disabled) { background: #7c3aed; color: #fff; border-color: #7c3aed; }
.ea-btn.sablon { color: #b45309; border-color: #fde68a; background: #fffbeb; }
.ea-btn.sablon:hover:not(:disabled) { background: #b45309; color: #fff; border-color: #b45309; }
.ea-rozet { background: currentColor; border-radius: 20px; padding: 0 7px; font-size: 11px;
    font-weight: 700; line-height: 17px; }
.ea-rozet::before { content: ""; }
.ea-btn.sablon .ea-rozet { color: #fff; background: #b45309; }
.ea-onay { display: flex; align-items: center; gap: 7px; margin: 10px 0 4px; font-size: 13px;
    font-weight: 600; color: var(--ntr-metin); }
.ea-sablon-liste { display: flex; flex-direction: column; gap: 3px; max-height: 320px; overflow-y: auto; }
.ea-sablon-it { display: flex; align-items: center; gap: 4px; }
.ea-sablon-ad { flex: 1; text-align: left; display: inline-flex; align-items: center; gap: 8px;
    border: 0; background: transparent; padding: 8px 10px; border-radius: 8px; font: inherit;
    font-weight: 600; color: inherit; cursor: pointer; }
.ea-sablon-ad:hover { background: var(--ntr-ana-acik); color: var(--ntr-ana); }
.ea-sablon-ad code { font-size: 11px; color: var(--ntr-metin-soluk); background: var(--ntr-zemin);
    padding: 1px 6px; border-radius: 6px; }
.ea-sablon-etiket { color: #b45309; font-size: 11px; }
.ea-sablon-sil { border: 0; background: transparent; color: var(--ntr-tehlike, #b91c1c);
    padding: 6px 9px; border-radius: 8px; cursor: pointer; }
.ea-sablon-sil:hover { background: #fef2f2; }
.ea-sep { width: 1px; height: 22px; background: var(--ntr-kenar); }
.ea-bosluk { flex: 1; }
.ea-lbl { font-size: 12.5px; color: var(--ntr-metin-soluk); font-weight: 600; }
.ea-lbl.ea-blok { display: block; margin-bottom: 5px; }
.ea-num { border: 1px solid var(--ntr-kenar); border-radius: 8px; padding: 6px 10px;
    font: inherit; font-size: 13px; color: var(--ntr-metin); background: var(--ntr-yuzey); }
input.ea-num[type=number] { width: 80px; }
.ea-num.ea-genis { width: 100%; margin-bottom: 8px; }

.ea-bilgi { font-size: 12.5px; color: var(--ntr-metin-soluk); }
.ea-bilgi b { color: var(--ntr-metin); }
.ea-hata-box { background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px;
    padding: 8px 11px; font-size: 12.5px; color: #b91c1c; max-height: 180px; overflow: auto; }
.ea-hata-box ul { margin: 6px 0 0; padding-left: 18px; }

.ea-grid { display: grid; grid-template-columns: 300px 1fr;
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas: "sol orta" "sag orta"; gap: 12px; height: 72vh; }
.ea-grid > .ea-pane:nth-child(1) { grid-area: sol; }
.ea-grid > .ea-pane:nth-child(2) { grid-area: orta; }
.ea-grid > .ea-pane:nth-child(3) { grid-area: sag; }
@media (max-width: 1100px) {
    .ea-grid { grid-template-columns: 1fr; grid-template-rows: auto;
        grid-template-areas: "sol" "sag" "orta"; height: auto; }
    .ea-grid > .ea-pane { max-height: 60vh; }
}
.ea-pane { background: var(--ntr-yuzey); border: 1px solid var(--ntr-kenar); border-radius: 12px;
    display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.ea-pane-bsl { font-size: 11.5px; text-transform: uppercase; color: var(--ntr-metin-soluk);
    font-weight: 700; padding: 10px 12px; border-bottom: 1px solid var(--ntr-kenar); flex: 0 0 auto; }
.ea-pane-not { color: var(--ntr-metin-soluk); font-weight: 400; text-transform: none; }
.ea-say { margin-left: 6px; background: var(--ntr-zemin); color: var(--ntr-metin-soluk);
    border-radius: 20px; padding: 1px 8px; font-size: 10.5px; font-weight: 700; }

.ea-liste { overflow: auto; padding: 6px; flex: 1; min-height: 0; }
.ea-bos { color: var(--ntr-metin-soluk); text-align: center; padding: 18px; font-size: 13px; }
.ea-bos-satir { color: var(--ntr-metin-soluk); font-size: 12px; }

.ea-alan-ara { display: flex; align-items: center; gap: 6px; margin: 7px 8px 0;
    background: var(--ntr-zemin); border: 1px solid var(--ntr-kenar); border-radius: 8px;
    padding: 5px 9px; flex: 0 0 auto; }
.ea-alan-ara > i { color: var(--ntr-metin-soluk); font-size: 14px; }
.ea-alan-ara input { border: 0; background: transparent; outline: 0; font: inherit;
    font-size: 12.5px; width: 100%; color: var(--ntr-metin); }
.ea-alan-ara button { border: 0; background: transparent; color: var(--ntr-metin-soluk);
    cursor: pointer; display: inline-flex; padding: 0; }
.ea-alan-ara button:hover { color: var(--ntr-tehlike); }

.ea-alan { width: 100%; display: flex; justify-content: space-between; align-items: center;
    gap: 8px; border: 1px solid var(--ntr-kenar); background: var(--ntr-yuzey);
    border-radius: 8px; padding: 6px 9px; font: inherit; font-size: 12.5px; cursor: pointer;
    margin-bottom: 3px; color: var(--ntr-metin); text-align: left; }
.ea-alan:hover { border-color: var(--ntr-ana); }
.ea-alan.sec { background: var(--ntr-ana-acik); border-color: var(--ntr-ana); }
.ea-alan .ea-tip { font-size: 10.5px; color: var(--ntr-metin-soluk); white-space: nowrap; }
/* zaten eşleştirilmiş alan: soldan çizgi (300+ kolonlu tabloda ne kaldı görünsün) */
.ea-alan.esl { border-left: 3px solid #2563eb; background: #f8faff; }

.ea-onizle { overflow: auto; padding: 0; flex: 1; min-height: 0; }
.ea-xls { border-collapse: collapse; font-size: 11.5px; white-space: nowrap; }
.ea-xls th, .ea-xls td { border: 1px solid var(--ntr-kenar); padding: 3px 7px; color: var(--ntr-metin); }
.ea-xls thead th { position: sticky; top: 0; background: var(--ntr-zemin);
    color: var(--ntr-metin-soluk); cursor: pointer; z-index: 1; }
.ea-xls thead th.sec { background: var(--ntr-ana); color: #fff; }
.ea-xls td.sec { background: var(--ntr-ana-acik); }
.ea-xls .ea-rn { background: var(--ntr-zemin); color: var(--ntr-metin-soluk);
    text-align: center; position: sticky; left: 0; }
.ea-xls .ea-baslik-satir td { background: #fffbeb; color: #92400e; }

.ea-esl-btns { display: flex; gap: 5px; padding: 7px 8px 0; flex-wrap: wrap; }
.ea-mini { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--ntr-kenar);
    background: var(--ntr-yuzey); border-radius: 8px; padding: 5px 10px; font: inherit;
    font-size: 12px; font-weight: 600; color: var(--ntr-metin); cursor: pointer; }
.ea-mini > i { font-size: 13px; }
.ea-mini:hover:not(:disabled) { background: var(--ntr-zemin); }
.ea-mini:disabled { opacity: .45; cursor: not-allowed; }
.ea-mini.ekle { color: #15803d; border-color: #bbf7d0; background: #f0fdf4; }
.ea-mini.ekle:hover:not(:disabled) { background: #15803d; color: #fff; border-color: #15803d; }
.ea-mini.kaldir { color: var(--ntr-tehlike); border-color: #fecaca; background: #fef2f2; }
.ea-mini.kaldir:hover:not(:disabled) { background: var(--ntr-tehlike); color: #fff; border-color: var(--ntr-tehlike); }
.ea-mini.oto { color: #7c3aed; border-color: #ddd6fe; background: #f5f3ff; }
.ea-mini.oto:hover:not(:disabled) { background: #7c3aed; color: #fff; border-color: #7c3aed; }
.ea-mini.sabit { color: #b45309; border-color: #fde68a; background: #fffbeb; }
.ea-mini.sabit:hover:not(:disabled) { background: #b45309; color: #fff; border-color: #b45309; }
.ea-mini.uuid { color: #1d4ed8; border-color: #bfdbfe; background: #eff6ff; }
.ea-mini.uuid:hover:not(:disabled) { background: #1d4ed8; color: #fff; border-color: #1d4ed8; }

.ea-esl { width: 100%; border-collapse: collapse; font-size: 12px; }
.ea-esl th { text-align: left; color: var(--ntr-metin-soluk); font-size: 10.5px;
    text-transform: uppercase; padding: 5px 7px; border-bottom: 1px solid var(--ntr-kenar); }
.ea-esl td { padding: 5px 7px; border-bottom: 1px solid var(--ntr-kenar); color: var(--ntr-metin); }
.ea-esl tr { cursor: pointer; }
.ea-esl tbody tr.sec td { background: var(--ntr-ana-acik); }

.ea-backdrop { position: fixed; inset: 0; background: rgba(0, 0, 0, .4); z-index: 1000; }
.ea-modal { position: fixed; top: 8%; left: 50%; transform: translateX(-50%);
    background: var(--ntr-yuzey); border-radius: 14px; width: 640px; max-width: 96vw;
    max-height: 84vh; display: flex; flex-direction: column; overflow: hidden; z-index: 1001;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .3); }
.ea-modal.sm { width: 460px; }
.ea-m-head { display: flex; align-items: center; padding: 13px 16px;
    border-bottom: 1px solid var(--ntr-kenar); font-weight: 700; color: var(--ntr-metin); }
.ea-x { margin-left: auto; border: 0; background: transparent; color: var(--ntr-metin-soluk);
    cursor: pointer; display: inline-flex; font-size: 16px; }
.ea-m-body { padding: 14px 16px; overflow: auto; }
.ea-m-foot { padding: 11px 16px; border-top: 1px solid var(--ntr-kenar);
    display: flex; gap: 9px; justify-content: flex-end; }
.ea-modal .ea-m-body .ea-m-foot { border-top: 0; padding: 11px 0 0; }
.ea-tablo-list { display: flex; flex-direction: column; gap: 3px; max-height: 55vh; overflow: auto; }
.ea-tablo-it { text-align: left; border: 1px solid var(--ntr-kenar); background: var(--ntr-yuzey);
    border-radius: 8px; padding: 8px 11px; font: inherit; font-size: 13px; cursor: pointer; color: var(--ntr-metin); }
.ea-tablo-it:hover { background: var(--ntr-ana-acik); border-color: var(--ntr-ana); }
.ea-not { margin: 8px 0 0; font-size: 12px; line-height: 1.55; color: var(--ntr-metin-soluk); }

.ea-hedef-ozet { display: flex; align-items: center; gap: 8px; background: #fffbeb;
    border: 1px solid #fde68a; color: #92400e; border-radius: 9px; padding: 8px 12px;
    font-size: 12.5px; margin-bottom: 12px; }
.ea-hedef-ozet > i { font-size: 16px; color: #b45309; }
.ea-baslat-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 16px; margin-bottom: 14px; }
@media (max-width: 560px) { .ea-baslat-grid { grid-template-columns: 1fr; } }
.ea-key-box { display: flex; flex-wrap: wrap; gap: 5px; min-height: 34px;
    border: 1px solid var(--ntr-kenar); border-radius: 8px; padding: 6px; }
.ea-key { display: inline-flex; align-items: center; gap: 4px; background: var(--ntr-ana-acik);
    color: var(--ntr-ana-koyu); border-radius: 20px; padding: 2px 6px 2px 10px; font-size: 12px; font-weight: 600; }
.ea-key button { border: 0; background: transparent; color: var(--ntr-tehlike); cursor: pointer;
    padding: 0; font-size: 15px; line-height: 1; }
.ea-key-ekle { display: flex; gap: 5px; margin-top: 8px; }
.ea-key-ekle select { flex: 1; }
.ea-radio { display: block; font-size: 13.5px; color: var(--ntr-metin); margin-bottom: 6px; cursor: pointer; }

.ea-sayac { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 8px; margin: 6px 0; }
.ea-sayac .sc { background: var(--ntr-zemin); border-radius: 9px; padding: 8px; text-align: center; }
.ea-sayac .sc span { font-size: 11px; color: var(--ntr-metin-soluk); display: block; }
.ea-sayac .sc b { font-size: 18px; color: var(--ntr-metin); font-variant-numeric: tabular-nums; }
.ea-sayac .ye b { color: #15803d; }
.ea-sayac .ma b { color: #7c3aed; }
.ea-sayac .kr b { color: var(--ntr-tehlike); }
.ea-prog { height: 8px; background: var(--ntr-kenar); border-radius: 6px; overflow: hidden; margin-top: 8px; }
.ea-prog-bar { height: 100%; background: var(--ntr-ana); transition: width .2s; }
.ea-ok { color: var(--ntr-basari); font-size: 13px; font-weight: 600; margin-top: 6px;
    display: flex; align-items: center; gap: 6px; }

/* ══ Liste kart görünümü — NatraWMS ".veri-kart" deseni ══
   ListeEkrani'nın kart görünümündeki tekil kartın görsel stili. Izgara/toggle
   (görünüp gizlenme, 860px mobil dönüşümü) ListeEkrani.razor'ın <style>'ındadır;
   burası yalnız kartın kendi görünümü. Kart, kolon meta'sından generic çizilir. */
.ntr-liste-kart {
    display: flex; flex-direction: column;
    background: var(--ntr-yuzey); border: 1px solid var(--ntr-kenar);
    border-radius: 10px; padding: 14px;
    box-shadow: var(--ntr-golge, 0 1px 4px rgba(0,0,0,.06));
    cursor: pointer;
    transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}
/* Muhasebe Durumu = 2 (muhasebeleşmedi/bekliyor) → kart hafif sarı. secili üstte kalsın diye ondan ÖNCE. */
.ntr-liste-kart.muh-bekliyor { background: #fffbeb; }
/* Sipariş/teklif ONAY DURUMU satır rengi (NatraWMS deseni, kullanıcı isteği):
   beklemede sarı, reddedildi pembemsi. Aynı sınıf hem tabloya hem karta gider
   (ListeEkrani.SatirSinif), iki görünüm ayrışamaz.
   Kod sözlüğü Delphi: 0 Beklemede · 1/4 Onaylı · 2 Reddedildi. NatraWMS 3 yazıyor;
   ikisi de kırmızı sayılıyor (bkz. BelgeYonetimi.OnaySatirSinifi). */
.ntr-liste-kart.onay-bekleme { background: #fffbeb; }
.ntr-liste-kart.onay-red { background: #fef2f2; }
.ntr-liste-kart:hover {
    box-shadow: 0 6px 18px rgba(16,24,40,.12);
    transform: translateY(-2px);
    border-color: var(--ntr-ana);
}
.ntr-liste-kart.secili {
    border-color: var(--ntr-ana);
    background: var(--ntr-ana-acik);
    box-shadow: inset 3px 0 0 var(--ntr-ana), 0 1px 4px rgba(0,0,0,.06);
}

/* Üst satır: solda vurgulu belge no (.kod), sağda rozet */
.ntr-liste-kart-ust { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.ntr-liste-kart-kod { min-width: 0; }
.ntr-liste-kart-kod .kod {
    font-family: "SF Mono", Menlo, Consolas, monospace;
    font-size: .9rem; font-weight: 700; color: var(--ntr-ana-koyu);
    word-break: break-word; line-height: 1.3;
}
/* Rozet satırı: birden çok durum rozeti sağ üstte sarar (Onay + Durum + Depo…). */
.ntr-liste-kart-rozetler { flex-shrink: 0; display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.ntr-liste-kart-rozet {
    flex-shrink: 0;
    display: inline-block; padding: 2px 9px; border-radius: 999px;
    background: var(--ntr-ana-acik); color: var(--ntr-ana-koyu);
    font-size: 11px; font-weight: 700; white-space: nowrap;
}
.ntr-liste-kart-rozet.evet { background: #dcfce7; color: #15803d; }
.ntr-liste-kart-rozet.hayir { background: #fee2e2; color: #b91c1c; }

/* Çok-renkli durum rozeti paleti (NatraWMS .mini karşılığı) — tablo + kart ortak. */
.ntr-liste-rozet.gri,     .ntr-liste-kart-rozet.gri     { background: #f1f5f9; color: #64748b; }
.ntr-liste-rozet.yesil,   .ntr-liste-kart-rozet.yesil   { background: #dcfce7; color: #15803d; }
.ntr-liste-rozet.sari,    .ntr-liste-kart-rozet.sari    { background: #fef3c7; color: #92400e; }
.ntr-liste-rozet.kirmizi, .ntr-liste-kart-rozet.kirmizi { background: #fee2e2; color: #b91c1c; }
.ntr-liste-rozet.mavi,    .ntr-liste-kart-rozet.mavi    { background: #e3f2fd; color: #1565c0; }

/* Ana ad: cari/başlık adı, kalın büyük */
.ntr-liste-kart-ad {
    font-size: 1rem; font-weight: 700; color: var(--ntr-metin);
    line-height: 1.35; margin-top: 8px;
}

/* Detay satırları: etiket → değer */
.ntr-liste-kart-satirlar { margin-top: 10px; display: flex; flex-direction: column; gap: 5px; }
.ntr-liste-kart-satir { display: flex; align-items: baseline; justify-content: space-between;
    gap: 12px; font-size: 13px; }
.ntr-liste-kart-satir > span { color: var(--ntr-metin-soluk); font-size: 12px; white-space: nowrap; }
.ntr-liste-kart-satir > b { font-weight: 600; color: var(--ntr-metin); text-align: right; }

/* Vurgulu toplam: Genel Toplam, altta büyük ve sağa yaslı */
.ntr-liste-kart-toplam {
    margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--ntr-kenar);
    display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
}
.ntr-liste-kart-toplam > span { color: var(--ntr-metin-soluk); font-size: 12px; font-weight: 600; }
.ntr-liste-kart-toplam > b {
    font-size: 1.05rem; font-weight: 700; color: var(--ntr-metin);
    font-variant-numeric: tabular-nums; text-align: right;
}

/* İsteğe bağlı eylem butonları (kart tıklaması detay açar; butonlar şart değil) */
.ntr-liste-kart-eylem { margin-top: 12px; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.ntr-liste-kart-eylem > button { min-width: 0; white-space: nowrap; }

/* Sipariş satır/kart aksiyon grubu (Düzenle · Faturalaştır · Kapat) — tablo hücresinde ve kartta ortak. */
.ntr-liste-eylem { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.ntr-liste-eylem > button { white-space: nowrap; }

/* ============================================================================
   Perakende Ödeme paneli (ntr-odm-*) — BelgeYonetimi altında katlanabilir bölüm.
   NatraWMS .odeme-* karşılığı; renkler --ntr-* token'larına eşlendi. Sticky değil. */
.ntr-odm-kutu { border: 1px solid var(--ntr-kenar); border-radius: 10px; overflow: hidden;
                background: var(--ntr-yuzey); }
.ntr-odm-baslik { width: 100%; display: flex; align-items: center; justify-content: space-between;
                  gap: 12px; padding: 12px 16px; border: none; cursor: pointer; font-size: 14px;
                  background: var(--ntr-ana-acik); color: var(--ntr-ana-koyu); }
.ntr-odm-baslik:hover { filter: brightness(.98); }
.ntr-odm-baslik-sag { display: flex; align-items: center; gap: 14px; }
.ntr-odm-tutar { font-weight: 800; font-size: 15px; font-variant-numeric: tabular-nums; }
.ntr-odm-ok { font-size: 12.5px; font-weight: 700; opacity: .85; }
.ntr-odm-panel { display: grid; grid-template-columns: 210px minmax(0, 1fr) 220px; gap: 16px;
                 padding: 16px; border-top: 1px solid var(--ntr-kenar); }
@media (max-width: 900px) { .ntr-odm-panel { grid-template-columns: 1fr; } }
.ntr-odm-sol { display: flex; flex-direction: column; gap: 6px; }
.ntr-odm-radyo { display: flex; align-items: center; gap: 8px; padding: 9px 11px; cursor: pointer;
                 border: 1px solid var(--ntr-kenar); border-radius: 9px; font-size: 13.5px;
                 background: var(--ntr-yuzey); }
.ntr-odm-radyo input { width: 16px; height: 16px; flex: none; }
.ntr-odm-radyo.secili { border-color: var(--ntr-ana); background: var(--ntr-ana-acik);
                        color: var(--ntr-ana-koyu); font-weight: 700; }
.ntr-odm-orta { display: flex; flex-wrap: wrap; gap: 10px 14px; align-content: flex-start; }
.ntr-odm-alan { display: flex; flex-direction: column; gap: 5px; flex: 1 1 200px; min-width: 0; }
.ntr-odm-alan.ntr-odm-dar { flex: 0 0 120px; }
.ntr-odm-alan > label { font-size: 12px; font-weight: 700; color: var(--ntr-metin-soluk);
                        text-transform: uppercase; letter-spacing: .03em; }
.ntr-odm-sag { display: flex; flex-direction: column; gap: 10px; }
.ntr-odm-toplam { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px;
                  border-radius: 10px; background: var(--ntr-ana); color: #fff; }
.ntr-odm-toplam > span { font-size: 12px; font-weight: 600; opacity: .9; }
.ntr-odm-toplam > strong { font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; }
.ntr-odm-not { font-size: 12px; color: var(--ntr-metin-soluk); line-height: 1.5; margin: 0; }

/* ============================================================================
   Kart Formu (kf-*) — KartFormu.razor. Görünüm belge formunun bf-* estetiğini
   yeniden kullanır: alan ızgarası .bf-baslik, alanlar .bf-alan/.gen4, girişler
   .bf-input, salt-okunur kutular .bf-sabit. Buradaki kf-* yalnızca sekme çubuğu
   (sy-sekme deseni) ve bf-*'te karşılığı olmayan onay/uzun-metin ince ayarları.
   ============================================================================ */
.kf { display: flex; flex-direction: column; gap: 14px; }

/* Sekme çubuğu — simgesiz kartlarda da düğme görünümü (Tema › Sekme Görünümü "Alt çizgi"de eski hâl). */
.kf-sekmeler { display: flex; gap: 4px; flex-wrap: wrap; }
.kf-sekmeler button {
    border: 1px solid var(--ntr-kenar); background: var(--ntr-yuzey, #fff); color: var(--ntr-metin); cursor: pointer;
    border-radius: 8px; padding: 7px 13px; font-size: 13px; font-weight: 600;
    display: inline-flex; align-items: center; gap: 6px;
}
.kf-sekmeler button:hover { border-color: var(--ntr-ana); color: var(--ntr-ana); }
.kf-sekmeler button.akt { background: var(--ntr-ana); border-color: var(--ntr-ana); color: #fff; }

/* Çok satırlı alan — bf-input tabanı üstüne yükseklik + serbest yükseklik */
.kf-cok { min-height: 76px; resize: vertical; line-height: 1.5; }

/* Onay satırı — bf-alan içindeki caption label'ının aksine normal ağırlık/renk,
   yatay kutu+etiket; en az bir input yüksekliğinde hizalı dursun. */
.kf-onay {
    display: flex; align-items: center; gap: 9px; min-height: 38px;
    cursor: pointer; font-size: .9rem; font-weight: 500; color: var(--ntr-metin);
}
.kf-onay input { width: 17px; height: 17px; accent-color: var(--ntr-ana); cursor: pointer; flex: 0 0 auto; }
.kf-onay input:disabled { cursor: default; }

/* ── Rapor filtre panelleri (Cari/Stok ORTAK) — "Diğer filtreler" açılır kart + anahtarlar ──
   ⚠ Taban kurallar (kap + label + input/select) RaporCercevesi.razor'un <style>'ındaydı; o blok
   yalnız BİLEŞEN ÇİZİLİNCE head'e giriyor. CariRaporFiltreleri bir modalın içinde RaporCercevesi
   olmadan kullanılınca (Mutabakat ▸ Yeni Mutabakat) filtreler temasız kalıyordu — kutu kenarı,
   yüksekliği ve odak halkası yoktu; 20 px'lik çıplak <select>'lere tıklamak da zorlaşıyordu.
   Bu yüzden taban buraya, tek yere alındı. */
.ntr-rpr-filtre { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
                  padding: 12px 14px; background: var(--ntr-yuzey, #fff);
                  border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: var(--ntr-yaricap, 8px); }
.ntr-rpr-filtre label { display: flex; flex-direction: column; gap: 4px; font-size: 11.5px;
                        font-weight: 600; color: var(--ntr-metin-soluk, #6b7684);
                        text-transform: none; letter-spacing: 0; }
.ntr-rpr-filtre label.genis { flex: 1 1 260px; }
/* Belge formu (bf-input) ile aynı: yumuşak kenar + teal odak halkası. */
.ntr-rpr-filtre input, .ntr-rpr-filtre select {
    padding: 8px 11px; min-height: 38px; border: 1px solid var(--ntr-kenar, #e2e5ea);
    border-radius: 8px; font-size: 13.5px; font-weight: 400; outline: none;
    text-transform: none; letter-spacing: 0; transition: border-color .12s, box-shadow .12s;
    background: var(--ntr-yuzey, #fff); color: var(--ntr-metin, #1f2933); }
.ntr-rpr-filtre input:focus, .ntr-rpr-filtre select:focus {
    border-color: var(--ntr-ana, #0f766e); box-shadow: 0 0 0 3px var(--ntr-ana-acik, #ccfbf1); }
/* Onay kutusu = seçenek düğmesi (SecenekDugmeleri) görünümünde çip (kullanıcı isteği 2026-10-09:
   "checkbox'ları iyileştir"). Kutu tarayıcının değil bizim: yuvarlak köşeli kare + ✓; işaretliyken çip teal. */
.ntr-rpr-filtre label.onay { flex-direction: row; align-items: center; gap: 8px; align-self: flex-end;
    min-height: 38px; padding: 0 13px 0 11px; border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 9px;
    background: var(--ntr-yuzey, #fff); color: var(--ntr-metin, #1f2933); font-size: 13px; font-weight: 500;
    white-space: nowrap; cursor: pointer; user-select: none; transition: border-color .12s, background .12s, color .12s; }
.ntr-rpr-filtre label.onay:hover { border-color: var(--ntr-ana, #0f766e); }
.ntr-rpr-filtre label.onay:has(input:checked) { border-color: var(--ntr-ana, #0f766e); background: var(--ntr-ana-acik, #ccfbf1);
    color: var(--ntr-ana-koyu, #0b5d56); font-weight: 600; }
.ntr-rpr-filtre label.onay:has(input:disabled) { opacity: .55; cursor: default; }
.ntr-rpr-filtre label.onay span { font-size: inherit; font-weight: inherit; color: inherit; text-transform: none; letter-spacing: 0; }
.ntr-rpr-filtre label.onay input[type=checkbox] { appearance: none; -webkit-appearance: none; flex: none; margin: 0;
    width: 17px; height: 17px; min-height: 0; padding: 0; border: 2px solid var(--ntr-metin-soluk, #94a3b8); border-radius: 5px;
    background: var(--ntr-yuzey, #fff) center / 11px 11px no-repeat; cursor: inherit; box-shadow: none;
    transition: background-color .12s, border-color .12s; }
.ntr-rpr-filtre label.onay input[type=checkbox]:checked { border-color: var(--ntr-ana, #0f766e); background-color: var(--ntr-ana, #0f766e);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round' d='M3 8.5l3.2 3L13 4.5'/%3E%3C/svg%3E"); }
.ntr-rpr-filtre label.onay input[type=checkbox]:focus-visible { box-shadow: 0 0 0 3px var(--ntr-ana-acik, #ccfbf1); }

/* ── Tarih/saat kutuları: <select> gibi bunların da bir teması olsun ──────────
   Tek elemanlı seçici (özgüllük 0,0,1): kendi sınıfı olan her ekran bunu kolayca ezer;
   sınıfsız kalan yerlerde (mutabakat süzgeçleri, detay penceresi) ham tarayıcı kutusu
   yerine formun geri kalanıyla aynı kenar/yükseklik çıkar. color-scheme, koyu temada
   tarayıcının kendi takvimini de koyu çizsin diye. */
input[type=date], input[type=datetime-local], input[type=time], input[type=month] {
    min-height: 38px; padding: 7px 10px; border: 1px solid var(--ntr-kenar, #e2e5ea);
    border-radius: 8px; background: var(--ntr-yuzey, #fff); color: var(--ntr-metin, #1f2933);
    font: inherit; font-size: 13.5px; outline: none;
    transition: border-color .12s, box-shadow .12s;
}
input[type=date]:focus, input[type=datetime-local]:focus, input[type=time]:focus, input[type=month]:focus {
    border-color: var(--ntr-ana, #0f766e); box-shadow: 0 0 0 3px var(--ntr-ana-acik, #ccfbf1);
}
input[type=date]:disabled, input[type=datetime-local]:disabled,
input[type=time]:disabled, input[type=month]:disabled { opacity: .7; }
input[type=date]::-webkit-calendar-picker-indicator,
input[type=datetime-local]::-webkit-calendar-picker-indicator,
input[type=time]::-webkit-calendar-picker-indicator,
input[type=month]::-webkit-calendar-picker-indicator { opacity: .5; cursor: pointer; }
input[type=date]::-webkit-calendar-picker-indicator:hover,
input[type=datetime-local]::-webkit-calendar-picker-indicator:hover,
input[type=time]::-webkit-calendar-picker-indicator:hover,
input[type=month]::-webkit-calendar-picker-indicator:hover { opacity: 1; }

.ntr-rpr-filtre .rpr-diger { order: 4; display: inline-flex; align-items: center; gap: 7px; align-self: flex-end;
             min-height: 40px; padding: 9px 14px; border: 1px solid var(--ntr-kenar, #e2e5ea);
             border-radius: 9px; background: var(--ntr-yuzey, #fff); font-size: 13px; font-weight: 600;
             color: var(--ntr-ana, #0f766e); cursor: pointer; }
.ntr-rpr-filtre .rpr-diger:hover { background: var(--ntr-ana-acik, #ccfbf1); }
.ntr-rpr-filtre .rpr-diger.acik { background: var(--ntr-ana-acik, #ccfbf1); border-color: var(--ntr-ana, #0f766e); }
.ntr-rpr-filtre .rpr-diger-rozet { background: var(--ntr-ana, #0f766e); color: #fff; border-radius: 10px;
                   font-size: 11px; font-weight: 700; padding: 1px 7px; }
.ntr-rpr-filtre .rpr-gelismis { order: 10; flex-basis: 100%; width: 100%; display: grid;
                grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
                gap: 12px; align-items: end; margin-top: 8px; padding: 14px;
                background: var(--ntr-zemin, #f6f7f9); border: 1px solid var(--ntr-kenar, #e2e5ea);
                border-radius: 10px; }
.ntr-rpr-filtre .rpr-gelismis > label { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ntr-rpr-filtre .rpr-gelismis > label.genis { grid-column: 1 / -1; }
.ntr-rpr-filtre .rpr-gelismis > label.onay { flex-direction: row; align-items: center; gap: 8px; align-self: end; }
.rpr-kod { display: flex; gap: 6px; }
.ntr-rpr-filtre .rpr-kod input { flex: 1; min-width: 60px; }
.rpr-kod-btn { min-height: 38px; padding: 0 11px; border: 1px solid var(--ntr-kenar, #e2e5ea);
               border-radius: 8px; background: var(--ntr-yuzey, #fff); cursor: pointer;
               color: var(--ntr-ana, #0f766e); flex: 0 0 auto; }
.rpr-kod-btn:hover, .rpr-kod-btn.acik { border-color: var(--ntr-ana, #0f766e); background: var(--ntr-ana-acik, #ccfbf1); }
/* Büyüteçle seçilen kaydın adı — kod kutusunun yanında, ✕ ile temizlenir.
   Kullanıcı hangi kartı süzdüğünü koddan değil adından anlar. */
.rpr-secili { display: inline-flex; align-items: center; gap: 7px; align-self: end; min-height: 38px;
              max-width: 260px; padding: 0 6px 0 11px; border-radius: 999px; font-size: 12.5px;
              font-weight: 600; background: var(--ntr-ana-acik, #ccfbf1); color: var(--ntr-ana, #0f766e); }
/* Kırpma METİNDE: chip'in kendisine uygulanırsa uzun ad ✕ düğmesini dışarı itiyor. */
.rpr-secili .ad { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rpr-secili button { border: none; background: rgba(15,118,110,.14); color: inherit; cursor: pointer;
                     width: 20px; height: 20px; border-radius: 50%; line-height: 1; flex: 0 0 auto; }
.rpr-secili button:hover { background: rgba(15,118,110,.28); }
.ntr-rpr-filtre .rpr-anahtarlar { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; }
.rpr-switch { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600;
              color: var(--ntr-metin, #1f2933); cursor: pointer; text-transform: none; letter-spacing: 0; }
.rpr-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.rpr-switch .rpr-yol { width: 38px; height: 22px; border-radius: 999px; background: var(--ntr-kenar, #cbd5e1);
                       position: relative; transition: background .15s; flex: 0 0 auto; }
.rpr-switch .rpr-yol::after { content: ""; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px;
                              border-radius: 50%; background: #fff; transition: transform .15s;
                              box-shadow: 0 1px 2px rgba(0,0,0,.25); }
.rpr-switch input:checked + .rpr-yol { background: var(--ntr-ana, #0f766e); }
.rpr-switch input:checked + .rpr-yol::after { transform: translateX(16px); }
/* İşlem Tipi çoklu-seçim ızgarası (Cari+Stok raporları ortak) */
.ntr-rpr-filtre .rpr-islem { flex: 1 1 100%; order: 11; }
.rpr-islem-kutu { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 2px 12px;
                  max-height: 160px; overflow-y: auto; padding: 8px 10px; border: 1px solid var(--ntr-kenar, #e2e5ea);
                  border-radius: 8px; background: var(--ntr-yuzey, #fff); }
.rpr-islem-oge { display: flex; align-items: center; gap: 6px; flex-direction: row; font-size: 12.5px;
                 font-weight: 500; text-transform: none; color: var(--ntr-metin, #1f2933); cursor: pointer; }
.rpr-islem-oge input { min-height: 0; width: auto; }

/* ── Excel Aktarım Şablonu (/sistem/excel-aktarim-sablonu) — iki panelli tür→alan eşleme editörü ── */
.exs-sar { display: grid; grid-template-columns: 240px 1fr; gap: 14px; align-items: start; }
.exs-sol { display: flex; flex-direction: column; gap: 3px; max-height: 72vh; overflow-y: auto;
           padding: 8px; border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 10px;
           background: var(--ntr-yuzey, #fff); }
.exs-tur { display: flex; align-items: center; gap: 8px; text-align: left; width: 100%;
           padding: 7px 10px; border: 1px solid transparent; border-radius: 7px; background: transparent;
           font-size: 13px; font-weight: 500; color: var(--ntr-metin, #1f2933); cursor: pointer; }
.exs-tur:hover { background: var(--ntr-zemin, #f4f6f9); }
.exs-tur-sec { background: var(--ntr-ana-acik); border-color: var(--ntr-ana);
               color: var(--ntr-ana-koyu); font-weight: 600; }
.exs-nokta { width: 9px; height: 9px; border-radius: 50%; background: var(--ntr-ana); flex: 0 0 auto; }
.exs-sag { border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 10px; background: var(--ntr-yuzey, #fff);
           padding: 0; overflow: hidden; min-height: 200px; }
.exs-baslik { background: var(--ntr-ana-acik); color: var(--ntr-ana-koyu);
              font-weight: 700; font-size: 13.5px; padding: 9px 14px; border-bottom: 1px solid var(--ntr-kenar, #e2e5ea); }
.exs-grid { width: 100%; border-collapse: collapse; }
.exs-grid th { text-align: left; font-size: 11.5px; text-transform: uppercase; letter-spacing: .03em;
               color: var(--ntr-metin-soluk, #6b7280); font-weight: 600; padding: 8px 14px;
               border-bottom: 1px solid var(--ntr-kenar, #e2e5ea); }
.exs-grid td { padding: 5px 14px; border-bottom: 1px solid var(--ntr-zemin, #f0f2f5); font-size: 13px; }
.exs-grid tr:last-child td { border-bottom: none; }
.exs-no { width: 130px; text-align: right; }
.exs-inp { width: 74px; text-align: right; padding: 4px 8px; border: 1px solid var(--ntr-kenar, #d3d8df);
           border-radius: 6px; font-size: 13px; }
.exs-inp:disabled { background: var(--ntr-zemin, #f4f6f9); color: var(--ntr-metin-soluk, #9aa2ab); }
.exs-bos, .exs-not { color: var(--ntr-metin-soluk, #6b7280); font-size: 12.5px; }
.exs-bos { padding: 30px 14px; }
.exs-not { padding: 10px 14px 14px; border-top: 1px solid var(--ntr-zemin, #f0f2f5); }
.exs-perde { position: fixed; inset: 0; background: rgba(15,23,32,.28); display: flex; align-items: center;
             justify-content: center; z-index: 1050; }
.exs-onay { background: var(--ntr-yuzey, #fff); border-radius: 12px; padding: 20px 22px; max-width: 420px;
            box-shadow: 0 12px 40px rgba(0,0,0,.2); }
.exs-onay-dugme { display: flex; gap: 8px; justify-content: flex-end; margin-top: 14px; }
@media (max-width: 720px) { .exs-sar { grid-template-columns: 1fr; } .exs-sol { max-height: 40vh; } }

/* Eylemler açılır menüsü (NOSCloud Araç Kabul deseni) — 2026-09-17'de BasitEvrakYonetimi'nden taşındı;
   koyu başlıklı başka ekranlar (MRP) da kullanıyor. */
.be-eylem { position: relative; display: inline-block; }
/* Açıkken menü uygulama çubuklarının üstüne çıkar; perde tam ekranı kaplar ama
   menünün ALTINDA kalır, böylece maddeye yapılan tıklama perdeye takılmaz. */
.be-eylem.acik { z-index: 950; }
.be-eylem-perde { position: fixed; inset: 0; z-index: 20; }
.be-eylem-liste { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30;
    min-width: 220px; background: var(--ntr-yuzey, #fff); border: 1px solid var(--ntr-kenar, #e2e5ea);
    border-radius: 10px; box-shadow: 0 12px 32px rgba(16,24,40,.18); padding: 6px; display: flex;
    flex-direction: column; gap: 2px; }
/* Madde düğmeleri dış RenderFragment'ten (ekran scope'u) geliyor; bu stil bloğu GLOBAL olduğu için
   :deep GEÇERSİZ olur ve kurallar düşer -> düz gri düğme. Düz seçici (button) ile kurallar ulaşır. */
.be-eylem-liste button { display: flex; align-items: center; gap: 9px; width: 100%;
    text-align: left; border: none; background: none; padding: 9px 11px; border-radius: 8px;
    cursor: pointer; font-weight: 600; font-size: 13.5px; color: var(--ntr-metin, #1f2933); }
.be-eylem-liste button:hover { background: var(--ntr-ana-acik, #ccfbf1); color: var(--ntr-ana-koyu, #0b5d56); }
.be-eylem-liste button:disabled { opacity: .45; cursor: default; }
.be-eylem-liste button i { color: var(--ntr-ana, #0f766e); width: 16px; }

/* ── Modern ipucu (natra-ipucu.js) ─────────────────────────────────────────────
   Tarayıcının kendi `title` balonu yerine temaya uyan balon. Ekran kodu değişmez:
   JS, hover anında `title`'ı alıp geri koyuyor. */
.ntr-ipucu {
    position: fixed; z-index: 2000; pointer-events: none;
    max-width: 380px; padding: 8px 11px; border-radius: 10px;
    background: #1f2937; color: #f8fafc;
    font-size: 12.5px; line-height: 1.45; font-weight: 500; text-align: left;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .28), 0 0 0 1px rgba(255, 255, 255, .06);
    opacity: 0; transform: translateY(-3px);
    transition: opacity .13s ease, transform .13s ease;
}
.ntr-ipucu.acik { opacity: 1; transform: translateY(0); }
.ntr-ipucu.az-hareket { transition: none; transform: none; }
/* Ucundaki küçük ok — balon alttayken yukarı, üstteyken aşağı bakar. */
.ntr-ipucu::after {
    content: ""; position: absolute; left: var(--ok, 50%); margin-left: -6px;
    border: 6px solid transparent; top: -12px; border-bottom-color: #1f2937;
}
.ntr-ipucu.ustte::after { top: auto; bottom: -12px; border-bottom-color: transparent; border-top-color: #1f2937; }

@media (prefers-color-scheme: dark) {
    input[type=date], input[type=datetime-local], input[type=time], input[type=month] { color-scheme: dark; }
    .ntr-ipucu { background: #e2e8f0; color: #0f172a; box-shadow: 0 10px 28px rgba(0, 0, 0, .5); }
    .ntr-ipucu::after { border-bottom-color: #e2e8f0; }
    .ntr-ipucu.ustte::after { border-bottom-color: transparent; border-top-color: #e2e8f0; }
}

/* ═══ Açılır listeler: yerel <select> → AramaSecim görünümü (2026-09-19, kullanıcı isteği "bütün listelere, formlar dahil") ═══
   Kapalı hâl: tarayıcı oku yerine AramaSecim'in ince oku; kutunun kenar/yükseklik/genişliği kendi sınıfından (bf-input…) gelir.
   Açık hâl: natra-secim.js tarayıcının listesini durdurup aşağıdaki .ns-panel'i (AramaSecim'in .as-* sınıflarıyla) çizer.
   Kapsam dışı: çoklu seçim, size>1, tablo hücresi (td), .natra-yerel / [data-yerel]. */
select:not([multiple]):not([size]):not(.natra-yerel):not([data-yerel]):not(td select) {
    -webkit-appearance: none; -moz-appearance: none; appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%236b7684' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M3.5 6l4.5 4.5L12.5 6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 10px center; background-size: 12px 12px;
    padding-right: 30px; cursor: pointer; text-overflow: ellipsis;
}
select:not([multiple]):not([size]):not(.natra-yerel):not([data-yerel]):not(td select):disabled { cursor: default; opacity: .7; }
select:not([multiple]):not([size]):not(.natra-yerel):not([data-yerel]):not(td select):focus {
    border-color: var(--ntr-ana, #0f766e); box-shadow: 0 0 0 3px var(--ntr-ana-acik, #ccfbf1); outline: none;
}
.ns-perde { position: fixed; inset: 0; z-index: 5099; }
/* ⚠ Seçici İKİ SINIFLI (.as-panel.ns-panel) olmak ZORUNDA: panel AramaSecim'in `.as-*`
   sınıflarını da taşıyor ve o bileşenin `.razor` <style>'ı GLOBAL — aynı sayfada bir
   AramaSecim çizildiğinde `.as-panel { position: absolute }` head'e natra.css'ten SONRA
   giriyor ve tek sınıflık `.ns-panel`i eziyordu. Panel o zaman body'ye göre konumlanıp
   kaydırma kadar yukarıda açılıyor (Stok Kartı'nda ölçüldü 2026-09-23: JS top 549 px
   yazmışken panel 149 px'e düşüyordu). `top/left` JS'ten VIEWPORT koordinatı gelir. */
/* ⚠ z-index de İKİ SINIFLI kuralda olmak ZORUNDA: AramaSecim'in `.as-panel { z-index: 31 }`
   kuralı tek sınıflı ve head'e natra.css'ten SONRA giriyor → tek sınıflık `.ns-panel { z-index: 5100 }`
   eziliyordu. Sade sayfalarda fark edilmiyordu (panelin üstünde bir şey yok); bir MODALIN içinden
   açılan <select>'te panel 31'de kalıp 1100'lük pencerenin ARKASINA düşüyordu — kullanıcıya
   "tıklıyorum açılmıyor" diye görünüyordu (perde 5099'da olduğu için tıklama da yutuluyordu). */
.as-panel.ns-panel { position: fixed; top: auto; left: auto; z-index: 5100; min-width: 0; }
.ns-panel { position: fixed; z-index: 5100; background: var(--ntr-yuzey, #fff); border: 1px solid var(--ntr-kenar, #e2e5ea);
            border-radius: 10px; box-shadow: 0 12px 30px rgba(16,24,40,.16); overflow: hidden; outline: none; }
.ns-panel .as-ara { display: flex; align-items: center; gap: 7px; padding: 8px 10px; border-bottom: 1px solid var(--ntr-kenar, #eef0f4); }
.ns-panel .as-ara i { color: var(--ntr-metin-soluk, #94a3b8); font-size: 13px; }
.ns-panel .as-ara input { flex: 1; border: none; outline: none; font-size: 13.5px; background: transparent; color: inherit; min-width: 0; }
.ns-panel .as-liste { max-height: min(300px, 60vh); overflow-y: auto; padding: 4px; }
.ns-panel .as-oge { display: block; width: 100%; text-align: left; border: none; background: none; cursor: pointer;
                    padding: 8px 10px; border-radius: 7px; font-size: 13.5px; color: var(--ntr-metin, #1f2933);
                    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ns-panel .as-oge:hover, .ns-panel .as-oge.ns-imlec { background: var(--ntr-zemin, #f6f7f9); }
.ns-panel .as-oge.sec { background: var(--ntr-ana-acik, #ccfbf1); color: var(--ntr-ana-koyu, #0b5d56); font-weight: 600; }
.ns-panel .as-oge.sec.ns-imlec { box-shadow: inset 0 0 0 1px var(--ntr-ana, #0f766e); }
.ns-panel .as-oge:disabled { opacity: .45; cursor: default; }
.ns-panel .as-oge.ns-bos { color: var(--ntr-metin-soluk, #94a3b8); }
.ns-panel .ns-grup { padding: 8px 10px 4px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
                     color: var(--ntr-metin-soluk, #6b7684); }
.ns-panel .as-yok { padding: 12px; text-align: center; color: var(--ntr-metin-soluk, #94a3b8); font-size: 12.5px; }

/* ── Cihaz Kabul / Cihaz Teslim (.ck-*) — iki ekran ortak (2026-09-19) ─────────────────────── */
.ck { display: flex; flex-direction: column; gap: 10px; padding-bottom: 74px; }
.ck-bos { text-align: center; padding: 50px 20px; color: var(--ntr-metin-soluk, #6b7684); }
.ck-ana { border: none; border-radius: var(--ntr-yaricap, 8px); padding: 8px 15px; cursor: pointer; font-weight: 700; color: #fff;
          background: var(--ntr-ana, #0f766e); display: inline-flex; gap: 6px; align-items: center; }
.ck-ana:disabled { opacity: .45; cursor: not-allowed; }
.ck-uyari { display: flex; gap: 8px; align-items: flex-start; padding: 9px 12px; border-radius: var(--ntr-yaricap, 8px); font-size: 13px; }
.ck-uyari.hata { background: #fef2f2; color: #b91c1c; } .ck-uyari.iyi { background: #ecfdf5; color: #047857; }
.ck-uyari.bilgi { background: #eff6ff; color: #1d4ed8; }
.ck-rozet { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; background: #f1f5f9; color: #475569; }
.ck-rozet.sari { background: #fef3c7; color: #92400e; } .ck-rozet.yesil { background: #dcfce7; color: #15803d; }
.ck-rozet.mavi { background: #dbeafe; color: #1d4ed8; } .ck-rozet.kirmizi { background: #fee2e2; color: #b91c1c; }
.ck-sek { display: flex; gap: 4px; flex-wrap: wrap; }
.ck-sek button { border: 1px solid var(--ntr-kenar, #e2e5ea); background: var(--ntr-yuzey, #fff); color: var(--ntr-metin, #1f2933);
    border-radius: 8px; padding: 7px 13px; cursor: pointer; font-size: 13px; display: inline-flex; gap: 6px; align-items: center; }
.ck-sek button.etkin { background: var(--ntr-ana, #0f766e); border-color: var(--ntr-ana, #0f766e); color: #fff; }
.ck-govde { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 10px; align-items: start; }
.ck-iki { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }
.ck-sag { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ck-kutu { padding: 12px 14px; background: var(--ntr-yuzey, #fff); border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 12px; min-width: 0; }
.ck-alanlar { display: flex; flex-direction: column; gap: 10px; }
.ck-sira { display: grid; gap: 10px 12px; align-items: end; min-width: 0; }
.ck-sira.s2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ck-sira.s3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ck-sira.s4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ck-sira.stok { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.ck-sira.bir { grid-template-columns: 1fr; }
.ck label, .ck .ck-alan { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ck label > span, .ck .ck-alan > span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ntr-metin-soluk, #6b7684);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck input:not([type=checkbox]), .ck textarea { border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: var(--ntr-yaricap, 8px); padding: 8px 10px;
    font: inherit; color: inherit; background: var(--ntr-yuzey, #fff); width: 100%; box-sizing: border-box; min-width: 0; }
.ck input[readonly], .ck input:disabled, .ck textarea:disabled { background: var(--ntr-zemin, #f8fafc); color: var(--ntr-metin-soluk, #6b7684); }
.ck textarea { min-height: 90px; resize: vertical; }
.ck-kod, .ck-yan { display: flex; gap: 4px; align-items: center; min-width: 0; }
.ck-kod > input, .ck-kod > .as-kok, .ck-kod > div:not(.ck-miktar) { flex: 1 1 auto; min-width: 0; }
.ck-kod .as-btn { width: 100% !important; min-width: 0 !important; box-sizing: border-box; }
.ck-yan input.dar { flex: 0 0 64px; }
.ck-kod > button, .ck-kod > a { border: 1px solid var(--ntr-kenar, #e2e5ea); background: var(--ntr-yuzey, #fff); border-radius: 8px; min-width: 36px; height: 36px;
    display: inline-flex; align-items: center; justify-content: center; cursor: pointer; color: var(--ntr-ana, #0f766e); text-decoration: none; flex: none; font-weight: 800; }
.ck-kod > button:disabled { opacity: .45; cursor: not-allowed; }
.ck-kod > button.r { color: #b91c1c; }
.ck-miktar { flex: none; font-size: 12px; font-weight: 700; color: #b91c1c; white-space: nowrap; padding: 0 4px; }
.ck-onay { flex-direction: row !important; align-items: center; gap: 8px !important; font-size: 13.5px; font-weight: 600; }
.ck-onay input { width: 18px; height: 18px; accent-color: var(--ntr-ana, #0f766e); }

/* Müşteri kartı (koyu mavi), iletişim (turuncu), durum (mor-mavi) — masaüstü blokları */
.ck-musteri { background: linear-gradient(135deg, #1e3a8a, #1d4ed8); color: #fff; border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.ck-musteri .bas { font-weight: 800; font-size: 13px; display: flex; gap: 6px; align-items: center; }
.ck-musteri label > span { color: rgba(255,255,255,.78); }
.ck-musteri input, .ck-musteri textarea { background: rgba(255,255,255,.96) !important; color: #0f172a !important; border-color: transparent !important; }
.ck-musteri textarea { min-height: 54px; }
.ck-musteri .ck-kod > button { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.35); color: #fff; }
.ck-iletisim { border: 2px solid #fb923c; background: #fff7ed; border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; gap: 7px; }
.ck-iletisim .bas { font-weight: 800; font-size: 13px; color: #c2410c; display: flex; gap: 6px; align-items: center; }
.ck-iletisim .tel-sira { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ck-iletisim .kutular { display: flex; gap: 4px; align-items: center; min-width: 0; }
.ck-iletisim .kutular input { flex: 1 1 auto; min-width: 0; }
.ck-iletisim .kutular .kod { flex: 0 0 92px; min-width: 0; }
.ck-iletisim .kutular .kod > * { width: 100%; min-width: 0; }
.ck-iletisim .kutular .kod .as-btn { width: 100% !important; min-width: 0 !important; box-sizing: border-box; }
.ck-iletisim a { border: 1px solid #fed7aa; border-radius: 8px; min-width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; color: #c2410c; flex: none; }
.ck-durum { border-radius: 12px; padding: 10px 12px; color: #fff; display: flex; flex-direction: column; gap: 6px;
    background: linear-gradient(135deg, #4f46e5, #6366f1); }
.ck-durum.garantili { background: linear-gradient(135deg, #047857, #10b981); }
.ck-durum .bas { font-weight: 900; letter-spacing: .06em; text-align: center; font-size: 14px; }
.ck-durum .satir { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 6px; align-items: center; font-size: 12.5px; }
.ck-durum .satir b { font-weight: 600; opacity: .85; }
.ck-durum .satir span, .ck-durum .satir button { background: rgba(255,255,255,.18); border-radius: 6px; padding: 4px 8px; min-height: 26px; color: #fff; border: none; text-align: left; font: inherit; }
.ck-durum .satir button { cursor: pointer; text-decoration: underline; }
.ck-durum .uclu { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ck-durum .uclu > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ck-durum .uclu b { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; opacity: .85; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-durum .uclu span, .ck-durum .uclu button { background: rgba(255,255,255,.18); border-radius: 6px; padding: 5px 8px; min-height: 28px; color: #fff; border: none;
    text-align: left; font: inherit; font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ck-durum .uclu button { cursor: pointer; text-decoration: underline; }
@media (max-width: 480px) { .ck-durum .uclu { grid-template-columns: 1fr; } }

.ck-bolum { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #fff; background: #f59e0b;
    padding: 7px 10px; border-radius: 8px; display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.ck-bolum label { flex-direction: row !important; align-items: center; gap: 6px !important; color: #fff; cursor: pointer; }
.ck-bolum input { width: 17px; height: 17px; accent-color: #0f766e; }
.ck-bolum .sag { margin-left: auto; }
.ck-bolum button { border: 1px solid rgba(255,255,255,.5); background: rgba(255,255,255,.18); color: #fff; border-radius: 6px; padding: 3px 9px; cursor: pointer; font-weight: 700; font-size: 11.5px; }
.ck-baslik-kutu { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px 14px; }
.ck-baslik-kutu label { flex-direction: row !important; align-items: center; gap: 8px !important; font-size: 13.5px; padding: 6px 8px;
    border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 8px; cursor: pointer; }
.ck-baslik-kutu label.isaretli { background: #ecfdf5; border-color: #6ee7b7; }
.ck-baslik-kutu input { width: 17px; height: 17px; accent-color: var(--ntr-ana, #0f766e); }
.ck-ekbilgi-pop { position: relative; }
.ck-ekbilgi-panel { position: absolute; right: 0; top: 34px; z-index: 30; width: min(560px, 90vw); background: var(--ntr-yuzey, #fff);
    border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 12px; box-shadow: 0 16px 40px rgba(0,0,0,.18); padding: 10px; }
.ck-gorseller { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ck-resim-bas { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--ntr-metin-soluk, #6b7684); margin-bottom: 6px; }
.ck-bitis { font-weight: 800; padding: 8px 10px; border-radius: 8px; }
.ck-bitis.yesil { background: #dcfce7; color: #15803d; } .ck-bitis.kirmizi { background: #fee2e2; color: #b91c1c; }
.ck-soluk { color: var(--ntr-metin-soluk, #6b7684); font-size: 13px; padding: 8px 0; }
.ck-not { font-size: 11.5px; color: var(--ntr-metin-soluk, #6b7684); }
.ck-tablo-sar { overflow: auto; max-height: 360px; border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 10px; }
.ck-tablo { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ck-tablo th { position: sticky; top: 0; background: var(--ntr-zemin, #f6f7f9); text-align: left; padding: 7px 8px; font-size: 11px; text-transform: uppercase; }
.ck-tablo td { padding: 6px 8px; border-top: 1px solid #eef0f3; }
.ck-tablo .sag { text-align: right; font-variant-numeric: tabular-nums; }
.ck-tablo tr.tik { cursor: pointer; } .ck-tablo tr.tik:hover td { background: #f8fafc; }
.ck-tablo tr.bu td { background: var(--ntr-ana-acik, #f0fdfa); font-weight: 600; }
.ck-toplamlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ck-toplamlar div { border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 10px; padding: 8px 10px; }
.ck-toplamlar small { display: block; font-size: 10.5px; font-weight: 700; text-transform: uppercase; color: var(--ntr-metin-soluk, #6b7684); }
.ck-toplamlar b { font-variant-numeric: tabular-nums; }
.ck-toplam-sira { display: flex; justify-content: flex-end; margin-top: 10px; }
.ck-toplam { width: min(340px, 100%); margin: 0; }
.ck-bilgi-rozetler { display: flex; flex-wrap: wrap; gap: 6px; }
.ck-bilgi-rozetler span { padding: 4px 10px; border-radius: 999px; font-size: 12px; background: #f1f5f9; color: #64748b; }
.ck-bilgi-rozetler span.var { background: #dcfce7; color: #15803d; font-weight: 700; }
.ck-oneri { margin: 6px 0 0; padding-left: 18px; font-size: 13px; }
.ck-perde { position: fixed; inset: 0; z-index: 1100; background: rgba(15,23,42,.45); }
.ck-pencere { position: fixed; inset: 0; margin: auto; z-index: 1101; width: min(1000px, calc(100vw - 32px)); height: fit-content; max-height: calc(100vh - 60px);
    background: var(--ntr-yuzey, #fff); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 24px 64px rgba(0,0,0,.3); }
.ck-pencere.dar { width: min(520px, calc(100vw - 32px)); }
.ck-pencere .bas { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 12px 16px; background: var(--ntr-ana, #0f766e); color: #fff; font-weight: 700; }
.ck-pencere .bas button { width: 32px; height: 32px; border-radius: 8px; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.14); color: #fff; cursor: pointer; }
.ck-pencere .govde { padding: 12px 16px; overflow: auto; }
.ck-pencere .alt { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 16px; border-top: 1px solid var(--ntr-kenar, #e2e5ea); }
tr.ck-hazir td { background: #ecfdf5; }
@media (max-width: 1100px) { .ck-govde, .ck-iki { grid-template-columns: 1fr; } .ck-gorseller { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) { .ck-sira.s3, .ck-sira.s4 { grid-template-columns: 1fr 1fr; } .ck-sira.stok { grid-template-columns: 1fr; }
    .ck-gorseller { grid-template-columns: 1fr; } .ck-toplamlar { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .ck-sira.s2, .ck-sira.s3, .ck-sira.s4 { grid-template-columns: 1fr; } .ck-iletisim .tel-sira { grid-template-columns: 1fr; } }

/* ── BelgeYonetimi ekrana özgü genişlemeler (2026-09-20: Servis İş Emri) ── */
.bf-baslik-ek { margin: 10px 0; }
.bf-ek-sekme { padding: 4px 0 10px; }
.bf-grid td.bf-ekkolon { min-width: 120px; }
.bf-ek-kod { display: flex; align-items: center; gap: 2px; }
.bf-ek-kod.bf-ek-pasif .bf-hucre { background: var(--ntr-zemin, #f1f5f9); cursor: not-allowed; }
.bf-ek-kod input { flex: 1; min-width: 0; }
.bf-ek-salt { display: block; padding: 0 6px; font-family: ui-monospace, monospace; font-size: 12px; color: #334155; white-space: nowrap; }
.bf-hedef-btn { margin-left: 8px; border: 1px solid #c7d2fe; background: #eef2ff; color: #4338ca; border-radius: 6px;
    font-size: 10.5px; font-weight: 700; padding: 1px 7px; cursor: pointer; vertical-align: middle; }
.bf-hedef-btn:hover { background: #e0e7ff; }
.bf-hedef-perde { position: fixed; inset: 0; background: rgba(15,23,42,.35); z-index: 1200; }
.bf-hedef-pencere { position: fixed; left: 50%; top: 22%; transform: translateX(-50%); width: min(380px, calc(100vw - 32px));
    background: #fff; border-radius: 12px; box-shadow: 0 20px 50px rgba(15,23,42,.3); z-index: 1201; overflow: hidden; }
.bf-hedef-pencere .bas { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px;
    background: #1e293b; color: #fff; font-weight: 600; }
.bf-hedef-pencere .bas button { background: none; border: 0; color: #cbd5e1; cursor: pointer; }
.bf-hedef-pencere .govde { padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.bf-hedef-pencere .govde label { font-size: 12px; color: #475569; font-weight: 600; }
.bf-hedef-giris { font-size: 20px; text-align: right; font-weight: 700; padding: 8px 10px; }
.bf-hedef-not { font-size: 11.5px; color: #64748b; }
.bf-hedef-pencere .alt { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 16px; border-top: 1px solid #e2e8f0; background: #f8fafc; }

/* ── Servis İş Emri başlık paneli (IsEmriServis, 2026-09-20) ── */
.ise-panel { display: flex; flex-direction: column; gap: 10px; }
.ise-fatura { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 10px;
    background: #fef3c7; border: 1px solid #fcd34d; color: #78350f; font-size: 13px; }
.ise-izgara { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 12px; align-items: start; }
.ise-alanlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; align-items: end;
    background: var(--ntr-yuzey, #fff); border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 12px; padding: 12px 14px; }
.ise-alan { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ise-alan.gen2 { grid-column: span 2; } .ise-alan.gen3 { grid-column: span 3; }
.ise-alan > label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--ntr-metin-soluk, #64748b); }
.ise-onay { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px dashed var(--ntr-kenar, #e2e5ea);
    border-radius: 9px; cursor: pointer; font-size: 13px; font-weight: 600; min-height: 38px; }
.ise-onay input { width: 16px; height: 16px; }
.ise-onay.kilit { opacity: .6; cursor: not-allowed; }
.ise-onay.gen2 { grid-column: span 2; }
.ise-onay small { font-weight: 400; color: var(--ntr-metin-soluk, #64748b); }
.ise-kod { display: flex; align-items: center; gap: 4px; min-width: 0; }
.ise-kod input { flex: 1; min-width: 0; }
.ise-ad { font-size: 12px; color: var(--ntr-metin-soluk, #64748b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-left: 4px; }
.ise-btn { border: 1px solid var(--ntr-kenar, #e2e5ea); background: var(--ntr-yuzey, #fff); border-radius: 8px;
    min-width: 36px; height: 36px; cursor: pointer; font-weight: 700; }
.ise-btn:hover:not(:disabled) { background: #f1f5f9; }
.ise-btn:disabled { opacity: .5; cursor: not-allowed; }
.ise-kaynak { border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 9px; color: #fff;
    background: linear-gradient(135deg, #0f766e 0%, #0d9488 55%, #14b8a6 100%);
    box-shadow: 0 10px 24px -12px rgba(15,118,110,.55); position: relative; overflow: hidden; }
.ise-kaynak::after { content: ""; position: absolute; right: -40px; top: -40px; width: 140px; height: 140px; border-radius: 50%;
    background: rgba(255,255,255,.08); pointer-events: none; }
.ise-kaynak.sec { background: linear-gradient(135deg, #3730a3 0%, #4f46e5 55%, #6366f1 100%); box-shadow: 0 10px 24px -12px rgba(79,70,229,.55); }
.ise-kaynak-bas { font-weight: 800; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; display: flex; gap: 8px; align-items: center; }
.ise-kaynak-bas i { width: 26px; height: 26px; border-radius: 8px; background: rgba(255,255,255,.18); display: inline-flex;
    align-items: center; justify-content: center; font-size: 14px; }
.ise-kaynak label { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ise-kaynak label > span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: rgba(255,255,255,.75); }
.ise-kaynak input { width: 100%; min-width: 0; height: 36px; padding: 0 10px; border-radius: 9px; border: 1px solid transparent;
    background: rgba(255,255,255,.97); color: #0f172a; font: inherit; font-size: 13px; text-overflow: ellipsis;
    box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.ise-kaynak input:focus { outline: none; box-shadow: 0 0 0 3px rgba(255,255,255,.35); }
.ise-kaynak input.ise-no { font-family: ui-monospace, Menlo, monospace; font-weight: 700; cursor: pointer; }
.ise-kaynak input.ad { font-weight: 700; }
.ise-kaynak .ise-kod button { border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.16); color: #fff; border-radius: 8px;
    min-width: 36px; height: 36px; cursor: pointer; flex: none; }
.ise-kaynak .ise-kod button:hover:not(:disabled) { background: rgba(255,255,255,.28); }
.ise-kaynak .ise-kod button:disabled { opacity: .45; cursor: not-allowed; }
.ise-kaynak-sira { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 8px 10px; }
.ise-kaynak-sira .gen2 { grid-column: span 2; }
.ise-sekme { padding: 12px 14px; }
.ise-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; align-items: end; }
.ise-bos { padding: 18px; text-align: center; color: var(--ntr-metin-soluk, #64748b); }
@media (max-width: 900px) {
    .ise-izgara { grid-template-columns: 1fr; }
    .ise-alanlar, .ise-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ise-alan.gen3 { grid-column: span 2; }
}

/* ── Bekleme göstergeleri (2026-09-24, kullanıcı isteği: "çalışıyor güzel bir animasyon
   olsun, anlaşılmıyor") ─────────────────────────────────────────────────────────────
   Uygulamada bekleme hep DURAĞAN bir kum saati ikonuyla anlatılıyordu (40'tan çok yerde
   `bi-hourglass-split`); duran bir ikon "takıldı" gibi görünüyor. Tek kural hepsini
   canlandırır — ekranların tek tek değişmesi gerekmez. */
@keyframes ntr-kumsaati { 0%,55% { transform: rotate(0deg); } 70%,100% { transform: rotate(180deg); } }
.bi-hourglass-split, .bi-hourglass, .bi-hourglass-top, .bi-hourglass-bottom {
    display: inline-block; animation: ntr-kumsaati 1.6s ease-in-out infinite; transform-origin: 50% 50%; }
@keyframes ntr-donen { to { transform: rotate(360deg); } }
.bi-arrow-repeat.doner, .bi-arrow-clockwise.doner { display: inline-block; animation: ntr-donen 1s linear infinite; }

/* Ortak bekleme bloğu — <Yukleniyor /> bileşeni çiziyor. */
.ntr-bkl { display: flex; flex-direction: column; gap: 9px; padding: 20px 4px; color: var(--ntr-metin-soluk, #64748b); font-size: 13px; }
.ntr-bkl.orta { align-items: center; text-align: center; }
.ntr-bkl-sat { display: flex; align-items: center; gap: 10px; }
.ntr-bkl-halka { width: 18px; height: 18px; flex: none; border-radius: 50%;
    border: 2.5px solid var(--ntr-kenar, #e2e5ea); border-top-color: var(--ntr-ana, #0f766e);
    animation: ntr-donen .8s linear infinite; }
.ntr-bkl-metin { font-weight: 600; color: var(--ntr-metin, #1f2933); }
.ntr-bkl-alt { font-size: 12px; color: var(--ntr-metin-soluk, #64748b); }
/* Belirsiz süre: çubuk sağa doğru akar (yüzde bilinmiyor demektir). */
.ntr-bkl-cubuk { height: 7px; border-radius: 99px; background: var(--ntr-kenar, #e8ebef); overflow: hidden; width: 100%; max-width: 420px; }
.ntr-bkl-cubuk > div { height: 100%; border-radius: 99px; background: var(--ntr-ana, #0f766e); transition: width .25s ease; }
.ntr-bkl-cubuk.belirsiz > div { width: 38%; animation: ntr-akan 1.1s ease-in-out infinite; }
@keyframes ntr-akan { 0% { margin-left: -40%; } 100% { margin-left: 100%; } }
@media (prefers-reduced-motion: reduce) {
    .bi-hourglass-split, .bi-hourglass, .bi-hourglass-top, .bi-hourglass-bottom,
    .bi-arrow-repeat.doner, .bi-arrow-clockwise.doner,
    .ntr-bkl-halka, .ntr-bkl-cubuk.belirsiz > div { animation: none; }
    .ntr-bkl-cubuk.belirsiz > div { width: 100%; opacity: .5; }
}

/* Sekme kayıt rozeti (SekmeRozeti) — kayıt olan sekme başlığında küçük sayı kapsülü */
.sek-rozet { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 6px;
             margin-left: 6px; border-radius: 999px; font-size: 10.5px; font-weight: 800; line-height: 1; vertical-align: 1px;
             background: color-mix(in srgb, var(--ntr-ana, #0f766e) 14%, transparent); color: var(--ntr-ana, #0f766e); }
.aktif > .sek-rozet { background: var(--ntr-ana, #0f766e); color: #fff; }

/* ── Bilgi penceresi (Cari Bilgileri · Avukat Bilgileri) — CariDetayModal / AvukatDetayModal ── */
/* z-index sayfa modallerinin (1100) ÜSTÜNDE: cari kartı çoğu zaman BİR pencerenin
   içinden açılıyor (mutabakat detayı, evrak formu…) ve 60'ta perdenin arkasında kalıyordu. */
.ntr-cdm-perde { position: fixed; inset: 0; z-index: 1300; background: rgba(15,23,42,.45);
    display: flex; align-items: flex-start; justify-content: center; padding: 40px 16px; overflow-y: auto; }
.ntr-cdm-kutu { width: 100%; max-width: 760px; background: var(--ntr-yuzey, #fff); border-radius: 16px;
    box-shadow: 0 24px 60px rgba(0,0,0,.28); display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; }
.ntr-cdm-bas { display: flex; align-items: flex-start; gap: 10px; }
.ntr-cdm-bas-ad { flex: 1; min-width: 0; }
.ntr-cdm-kod { font-size: 12.5px; font-weight: 700; color: var(--ntr-ana, #0f766e); }
.ntr-cdm-bas-ad h3 { margin: 1px 0 0; font-size: 17px; font-weight: 800; }
.ntr-cdm-tip { flex: none; font-size: 11px; font-weight: 700; padding: 3px 9px; border-radius: 999px;
    background: var(--ntr-ana-acik, #ccfbf1); color: var(--ntr-ana-koyu, #0b5d56); }
.ntr-cdm-kapat { flex: none; border: none; background: none; cursor: pointer; font-size: 16px; padding: 4px; color: inherit; }

.ntr-cdm-iletisim { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px 18px;
    background: var(--ntr-zemin, #f8fafc); border-radius: 12px; padding: 11px 14px; }
.ntr-cdm-iletisim > div, .ntr-cdm-iletisim > a { display: flex; align-items: center; gap: 8px; font-size: 12.5px; min-width: 0; }
.ntr-cdm-iletisim > * > i { color: var(--ntr-metin-soluk, #94a3b8); flex: none; }
.ntr-cdm-iletisim > * > span { color: var(--ntr-metin-soluk, #6b7684); flex: none; min-width: 74px; }
.ntr-cdm-iletisim > * > b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.ntr-cdm-kpi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.ntr-cdm-kpi > div { border-radius: 12px; padding: 11px 13px; border: 1px solid var(--ntr-kenar, #e2e5ea); }
.ntr-cdm-kpi small { display: block; font-size: 10.5px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .04em; color: var(--ntr-metin-soluk, #6b7684); }
.ntr-cdm-kpi b { display: block; font-size: 16px; margin-top: 3px; font-variant-numeric: tabular-nums; }
.ntr-cdm-kpi .borc { background: #fef2f2; } .ntr-cdm-kpi .alacak { background: #ecfdf5; }
.ntr-cdm-kpi .net { background: #eff6ff; } .ntr-cdm-kpi .net .eksi { color: #b91c1c; }

.ntr-cdm-hbas { font-size: 12.5px; font-weight: 700; color: var(--ntr-metin, #1f2933);
    display: flex; align-items: center; gap: 6px; }
.ntr-cdm-htablo-sar { max-height: 320px; overflow: auto; border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 10px; }
.ntr-cdm-htablo { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ntr-cdm-htablo th { position: sticky; top: 0; background: var(--ntr-zemin, #f1f5f9); text-align: left;
    padding: 7px 10px; font-size: 11px; font-weight: 700; color: var(--ntr-metin-soluk, #64748b); white-space: nowrap; }
.ntr-cdm-htablo td { padding: 6px 10px; border-top: 1px solid var(--ntr-kenar, #eef1f5); white-space: nowrap; }
.ntr-cdm-htablo .sag { text-align: right; font-variant-numeric: tabular-nums; }
.ntr-cdm-htablo code { background: #f1f5f9; padding: 0 5px; border-radius: 4px; }
.ntr-cdm-bos { text-align: center; color: var(--ntr-metin-soluk, #94a3b8); padding: 16px !important; }
.ntr-cdm-alt { display: flex; justify-content: flex-end; }
.ntr-cdm-kapat-btn { border: none; background: var(--ntr-ana, #334155); color: #fff; font-weight: 700;
    font-size: 12.5px; padding: 9px 22px; border-radius: 9px; cursor: pointer; }
.ntr-cdm-kapat-btn:hover { filter: brightness(1.08); }

.ntr-cdm-iletisim a { color: inherit; text-decoration: none; } .ntr-cdm-iletisim a:hover b { color: var(--ntr-ana, #0f766e); text-decoration: underline; }
.ntr-cdm-rozet { font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #f1f5f9; color: #475569; }
.ntr-cdm-rozet.yesil { background: #dcfce7; color: #15803d; } .ntr-cdm-rozet.kirmizi { background: #fee2e2; color: #b91c1c; }
.ntr-cdm-htablo tbody tr.tik { cursor: pointer; } .ntr-cdm-htablo tbody tr.tik:hover td { background: var(--ntr-zemin, #f8fafc); }
.ntr-cdm-not { font-size: 12.5px; background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px; padding: 8px 12px; white-space: pre-wrap; }
.ntr-cdm-kutu.genis { max-width: 920px; }

/* Ek Bilgi › bağlı görüşme notunu salt okunur açan düğme (BelgeYonetimi) */
.bf-gorusme-ac { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 9px; cursor: pointer;
    border: 1px solid color-mix(in srgb, var(--ntr-ana, #0f766e) 35%, transparent); background: color-mix(in srgb, var(--ntr-ana, #0f766e) 8%, #fff);
    color: var(--ntr-ana, #0f766e); font-weight: 700; font-size: 13px; }
.bf-gorusme-ac:hover { background: color-mix(in srgb, var(--ntr-ana, #0f766e) 14%, #fff); }


/* ── .ck-acik — Hesap/Müşteri kartının AÇIK tema tonu (kullanıcı isteği 2026-10-04; Görüşme Notları + İthalat Millileştirme).
   Ortak .ck-musteri koyu degradesinin yerine tema renginin açık karışımı, beyaz kutular, tema renkli düğmeler; başlık yazısı yok.
   Sol kalın şerit bilinçli kaldırıldı (geri istenirse: border-left: 4px solid var(--ntr-ana)). */
    .ck-acik .ck-musteri { height: 100%; box-sizing: border-box; color: var(--ntr-metin, #0f172a);
        background: linear-gradient(135deg, color-mix(in srgb, var(--ntr-ana, #0f766e) 32%, var(--ntr-yuzey, #fff)),
                                            color-mix(in srgb, var(--ntr-ana, #0f766e) 18%, var(--ntr-yuzey, #fff)));
        border: 1px solid color-mix(in srgb, var(--ntr-ana, #0f766e) 45%, transparent);
        }
    .ck-acik .ck-musteri .bas { color: var(--ntr-ana, #0f766e); font-size: 12px; text-transform: uppercase; letter-spacing: .05em;
        padding-bottom: 6px; border-bottom: 1px solid color-mix(in srgb, var(--ntr-ana, #0f766e) 18%, transparent); }
    .ck-acik label { display: flex; flex-direction: column; gap: 4px; }
    .ck-acik label > span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
        color: var(--ntr-soluk, #64748b) !important; }
    .ck-acik input, .ck-acik textarea { border-radius: 8px; padding: 8px 10px; font: inherit; width: 100%; box-sizing: border-box;
        background: var(--ntr-yuzey, #fff) !important; color: var(--ntr-metin, #0f172a) !important;
        border: 1px solid var(--ntr-kenar, #d8dee6) !important; }
    .ck-acik input:disabled, .ck-acik input[readonly], .ck-acik textarea:disabled {
        background: var(--ntr-zemin, #f1f5f9) !important; opacity: 1; }
    .ck-acik textarea { resize: vertical; min-height: 54px; }
    .ck-acik .ck-kod > button, .ck-acik .ck-kod > a { min-width: 36px; height: 36px; font-weight: 700; border-radius: 8px;
        background: var(--ntr-yuzey, #fff) !important; color: var(--ntr-ana, #0f766e) !important;
        border: 1px solid color-mix(in srgb, var(--ntr-ana, #0f766e) 30%, transparent) !important;
        display: inline-grid; place-items: center; text-decoration: none; cursor: pointer; }
    .ck-acik .ck-kod > button:hover:not(:disabled), .ck-acik .ck-kod > a:hover {
        background: color-mix(in srgb, var(--ntr-ana, #0f766e) 10%, var(--ntr-yuzey, #fff)) !important; }
    .ck-acik .ck-kod > button:disabled { opacity: .5; cursor: default; }

/* BelgeYonetimi HesapKartSagda — Genel sekmesi solda alanlar, sağda açık tema Hesap kartı (İthalat Faturası). */
.bf-genel-hesapsag { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(300px, 1fr); gap: 12px; align-items: stretch; }
.bf-genel-hesapsag > .bf-baslik { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
.bf-hesapkart .ck-musteri { border-radius: 12px; }
/* Cari bilgisi (adres) kartın kalan yüksekliğini doldurur (kullanıcı isteği 2026-10-04). */
.bf-hesapkart .ck-musteri textarea { flex: 1 1 auto; min-height: 110px; }
.bf-hesapkart .ck-kod { display: flex; gap: 6px; }
.bf-hesapkart .ck-kod input { flex: 1; min-width: 0; }
.bf-genel-hesapsag > .bf-hk-aciklama { grid-column: 1 / -1; margin: 0; }
.bf-hesapkart .bf-hk-vergi { font-size: 12px; color: var(--ntr-soluk, #64748b); font-weight: 600; }
@media (max-width: 980px) { .bf-genel-hesapsag { grid-template-columns: 1fr; } }

/* Seri + E-Seri + Belge No + Belge Türü tek satır (BelgeYonetimi.SeriSatiri, kullanıcı isteği 2026-10-04). */
.bf-seri-satir { grid-column: 1 / -1; display: flex; gap: 10px 12px; align-items: end; flex-wrap: wrap; min-width: 0; }
.bf-seri-satir > .bf-alan { flex: 1 1 160px; min-width: 0; }
.bf-seri-satir > .bf-alan:has(.bf-dar) { flex: 0 0 auto; }

/* Kart sekmeleri — simgeli düğme (Servis Çağrısı gibi; Tema › Sekme Görünümü "Alt çizgi"de eski hâl, TemaServisi). */
.bk-sekmeler { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 12px; }
.bk-sekmeler button { border: 1px solid var(--ntr-kenar, #e2e5ea); background: var(--ntr-yuzey, #fff); color: var(--ntr-metin, #1f2933);
                      border-radius: 8px; padding: 7px 12px; font-size: 13px; font-weight: 600; cursor: pointer;
                      display: inline-flex; align-items: center; gap: 6px; }
.bk-sekmeler button:hover { border-color: var(--ntr-ana, #0f766e); color: var(--ntr-ana, #0f766e); }
.bk-sekmeler button.aktif { background: var(--ntr-ana, #0f766e); border-color: var(--ntr-ana, #0f766e); color: #fff; }
.bk-sekmeler button.aktif > .sek-rozet { background: rgba(255,255,255,.28); color: #fff; }
.bk-sekmeler button > .sek-rozet { margin-left: 0; }

/* Dosya seçme düğmesi temaya uygun (kullanıcı isteği 2026-10-05: tarayıcının gri "Dosya Seç" düğmesi). Bütün input[type=file]. */
input[type="file"]::file-selector-button {
    margin-right: 10px; padding: 5px 12px; border: 1px solid var(--ntr-ana, #0f766e); border-radius: 7px;
    background: var(--ntr-ana-acik, #ccfbf1); color: var(--ntr-ana, #0f766e); font: inherit; font-size: 12.5px; font-weight: 600;
    cursor: pointer; transition: background .15s, color .15s;
}
input[type="file"]:not(:disabled)::file-selector-button:hover { background: var(--ntr-ana, #0f766e); color: #fff; }
input[type="file"]:disabled::file-selector-button { opacity: .55; cursor: not-allowed; }

/* ── Süzgeç daralt / genişlet (Üretim Siparişleri Kontrol sekmeleri; raporlardaki "Diğer filtreler") ──
   Ek süzgeçler label.ek; kapalıyken gizlenir, açıkken ana süzgeçlerin ARKASINA dizilir (order). */
:is(.od-suz, .uh-suz, .ie-suz, .ud-suz, .sy-suz, .sv-suz, .pk-suz) > label.ek { order: 1; }
:is(.od-suz, .uh-suz, .ie-suz, .ud-suz, .sy-suz, .sv-suz, .pk-suz).suz-dar > label.ek { display: none; }
.ud-suz > .ud-eylem { order: 2; }
:is(.od-eylem, .uh-eylem, .ie-eylem, .ud-eylem, .sy-eylem, .sv-eylem, .pk-eylem) button.suz-diger { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 32px; padding: 0 10px;
    border-radius: 8px; border: 1px dashed var(--ntr-ana, #0f766e); background: var(--ntr-yuzey, #fff); color: var(--ntr-ana, #0f766e);
    font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
:is(.od-eylem, .uh-eylem, .ie-eylem, .ud-eylem, .sy-eylem, .sv-eylem, .pk-eylem) button.suz-diger:is(:hover, .acik) { background: var(--ntr-ana-acik, #ccfbf1); border-style: solid; }
:is(.od-eylem, .uh-eylem, .ie-eylem, .ud-eylem, .sy-eylem, .sv-eylem, .pk-eylem) button.suz-diger em { font-style: normal; background: var(--ntr-ana, #0f766e); color: #fff; border-radius: 10px; padding: 0 6px; font-size: 11px; }

/* Kartların en çok bakılan sekmeleri (Genel · Hareketler) biraz daha kalın yazılır — kullanıcı isteği 2026-10-07:
   Müşteri/Satıcı/Diğer Hesaplar, Personel ve Stok kartı. Sınıf iki kez yazılır: bileşenlerin kendi
   <style> blokları GLOBAL ve natra.css'ten sonra yükleniyor, tek sınıflık kural ezilirdi. */
.ntr-kalin.ntr-kalin :is(input:not([type=checkbox]):not([type=radio]), select, textarea, td, .as-btn) { font-weight: 600; }
.ntr-kalin.ntr-kalin :is(label, th) { font-weight: 600; }

/* SQL Yöneticisi — yazma modu (yalnız admin, 2026-10-08) */
.sy-yazma-rozet.sy-yazma-rozet { background: #fee2e2; color: #b91c1c; border-color: #fca5a5; }
.sy-yazma-anahtar { display: inline-flex; align-items: center; gap: 8px; margin-left: 12px; font-size: 13px; font-weight: 600; cursor: pointer; user-select: none; }
.sy-yazma-anahtar input { position: absolute; opacity: 0; width: 0; height: 0; }
.sy-yazma-ray { width: 38px; height: 21px; border-radius: 99px; background: #cbd5e1; position: relative; transition: background .15s; }
.sy-yazma-ray span { position: absolute; top: 2px; left: 2px; width: 17px; height: 17px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: left .15s; }
.sy-yazma-anahtar.acik { color: #b91c1c; }
.sy-yazma-anahtar.acik .sy-yazma-ray { background: #dc2626; }
.sy-yazma-anahtar.acik .sy-yazma-ray span { left: 19px; }
.sy-editor-bar.yazma.yazma { background: #7f1d1d; color: #fff; }
.sy-yazildi { margin: 14px; padding: 14px 16px; border-radius: 10px; background: #f0fdf4; color: #166534; font-size: 14px; }
.sy-onay-ort { position: fixed; inset: 0; z-index: 1400; background: rgba(15,23,42,.5); display: flex; align-items: center; justify-content: center; padding: 16px; }
.sy-onay-pop { background: var(--ntr-yuzey, #fff); border-radius: 14px; width: min(620px, 100%); box-shadow: 0 20px 50px rgba(0,0,0,.3); overflow: hidden; }
.sy-onay-bas { padding: 12px 16px; background: #fee2e2; color: #991b1b; font-weight: 700; }
.sy-onay-bas i { margin-right: 6px; }
.sy-onay-govde { padding: 14px 16px; font-size: 13.5px; }
.sy-onay-govde p { margin: 0 0 10px; }
.sy-onay-uyari { padding: 9px 12px; border-radius: 9px; background: #fef3c7; color: #92400e; margin-bottom: 10px; }
.sy-onay-sql { max-height: 220px; overflow: auto; background: #0f172a; color: #e2e8f0; padding: 10px 12px; border-radius: 9px; font-size: 12.5px; white-space: pre-wrap; word-break: break-word; margin: 0; }
.sy-onay-teyit { display: flex; gap: 8px; align-items: center; margin-top: 10px; font-weight: 600; color: #991b1b; }
.sy-onay-alt { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--ntr-kenar, #e2e5ea); }
.sy-btn.sy-onay-evet { background: #dc2626; color: #fff; border-color: #dc2626; }
.sy-btn.sy-onay-evet:disabled { opacity: .5; cursor: default; }

/* Detay pencerelerinde (stok/cari/kasa/banka) hareket satırı: çift tık evrak önizlemesi açar. */
tr.ntr-hcift { cursor: pointer; }
tr.ntr-hcift:hover td { background: var(--ntr-ana-acik, #ecfdf5); }

/* ── Hareket tablolarında FARK: toplam satırında Bakiye kolonunun altında (FarkDeger, 2026-10-08) ── */
.ntr-fark-deger { display: inline-block; padding: 4px 11px; border-radius: 8px; font-weight: 800; white-space: nowrap;
                  background: #fef2f2; color: #b91c1c; box-shadow: inset 0 0 0 1.5px #fca5a5; }
.ntr-fark-deger.eksi { background: #f0fdf4; color: #15803d; box-shadow: inset 0 0 0 1.5px #86efac; }
.ntr-fark-deger.sifir { background: #f1f5f9; color: var(--ntr-metin-soluk, #6b7684); box-shadow: inset 0 0 0 1.5px #cbd5e1; }

/* Hareket tablolarının toplam şeridi (kullanıcı isteği 2026-10-09 — Müşteri TL Hareket'teki görünüm, ortak). */
tr.ntr-toplam-serit > td { background: linear-gradient(180deg, #f8fafc, #eef2f6); border-top: 2px solid var(--ntr-ana, #0f766e);
                           padding-top: 9px; padding-bottom: 9px; box-shadow: 0 -6px 12px -10px rgba(15,23,42,.35); }
.ntr-toplam-etiket { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: 12.5px; letter-spacing: .02em;
                     color: var(--ntr-ana, #0f766e); text-transform: uppercase; white-space: nowrap; }
.ntr-toplam-etiket small { font-weight: 600; text-transform: none; color: var(--ntr-metin-soluk, #64748b); letter-spacing: 0; }
.ntr-hap { display: inline-block; padding: 4px 10px; border-radius: 8px; font-weight: 800; background: #f1f5f9; color: #334155; white-space: nowrap; }
.ntr-hap.borc { background: #fef2f2; color: #b91c1c; box-shadow: inset 0 0 0 1px #fecaca; }
.ntr-hap.alacak { background: #f0fdf4; color: #15803d; box-shadow: inset 0 0 0 1px #bbf7d0; }

/* ── Vaziyet raporları (Firma Özet · Genel Durum) — kart görünümü (kullanıcı isteği 2026-10-09) ── */
.vz { display: flex; flex-direction: column; gap: 16px; padding: 4px 2px 14px; }
.vz-donem { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; color: var(--ntr-metin-soluk, #64748b); }
.vz-donem b { color: var(--ntr-metin, #1f2933); font-size: 15px; }
.vz-donem .vz-cip { padding: 3px 10px; border-radius: 999px; background: var(--ntr-ana-acik, #ccfbf1); color: var(--ntr-ana-koyu, #0b5d56);
                    font-weight: 700; font-size: 12px; }
.vz-kpi { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.vz-k { position: relative; overflow: hidden; border-radius: 14px; padding: 14px 16px 13px; color: #fff;
        background: linear-gradient(135deg, var(--k1, #0f766e), var(--k2, #14b8a6)); box-shadow: 0 8px 22px -14px rgba(15,23,42,.55); }
.vz-k::after { content: ""; position: absolute; right: -24px; top: -24px; width: 96px; height: 96px; border-radius: 50%; background: rgba(255,255,255,.12); }
.vz-k .vz-k-bas { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; opacity: .92; }
.vz-k .vz-k-bas i { font-size: 16px; }
.vz-k .vz-k-deger { font-size: 25px; font-weight: 800; margin-top: 6px; line-height: 1.15; font-variant-numeric: tabular-nums; }
.vz-k .vz-k-alt { font-size: 12px; margin-top: 4px; opacity: .9; }
.vz-k.yesil { --k1: #047857; --k2: #10b981; } .vz-k.mavi { --k1: #1d4ed8; --k2: #3b82f6; }
.vz-k.amber { --k1: #b45309; --k2: #f59e0b; } .vz-k.mor { --k1: #6d28d9; --k2: #a78bfa; }
.vz-k.kirmizi { --k1: #b91c1c; --k2: #f87171; } .vz-k.koyu { --k1: #0f172a; --k2: #334155; }
.vz-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); gap: 14px; align-items: start; }
.vz-kart { background: var(--ntr-yuzey, #fff); border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 14px; overflow: hidden;
           box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.vz-kart-bas { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-bottom: 1px solid var(--ntr-kenar, #e2e5ea);
               background: linear-gradient(90deg, color-mix(in srgb, var(--r, #0f766e) 10%, transparent), transparent); }
.vz-kart-bas .vz-ikon { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #fff; background: var(--r, #0f766e); font-size: 15px; }
.vz-kart-bas b { font-size: 14px; }
.vz-kart-bas small { margin-left: auto; color: var(--ntr-metin-soluk, #64748b); font-size: 12px; }
.vz-sat { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 12px; padding: 8px 14px; font-size: 13px;
          border-bottom: 1px dashed var(--ntr-kenar, #eef0f3); }
.vz-sat:last-child { border-bottom: none; }
.vz-sat .vz-deger { font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; }
.vz-sat .vz-deger.eksi { color: #b91c1c; }
.vz-sat .vz-cubuk { grid-column: 1 / -1; height: 4px; border-radius: 4px; background: var(--ntr-zemin, #f1f5f9); overflow: hidden; }
.vz-sat .vz-cubuk span { display: block; height: 100%; border-radius: 4px; background: var(--r, #0f766e); opacity: .55; }
.vz-sat.ara { background: color-mix(in srgb, var(--r, #0f766e) 7%, transparent); border-top: 1px solid color-mix(in srgb, var(--r, #0f766e) 30%, transparent); }
.vz-sat.ara .vz-ad { font-weight: 800; color: var(--r, #0f766e); }
.vz-sat.ara .vz-deger { font-size: 15px; }
.vz-sat.ara .vz-deger.eksi { color: #b91c1c; }
.vz-bos { padding: 14px; color: var(--ntr-metin-soluk, #64748b); font-size: 13px; }
.vz-ayr summary { list-style: none; cursor: pointer; }
.vz-ayr summary::-webkit-details-marker { display: none; }
.vz-ayr summary .vz-ok { margin-left: 8px; transition: transform .15s; color: var(--ntr-metin-soluk, #64748b); }
.vz-ayr[open] summary .vz-ok { transform: rotate(90deg); }
.vz-ayr .vz-govde { max-height: 420px; overflow: auto; }
/* Gelir tablosu şelalesi */
.vz-selale { padding: 12px 14px 6px; display: flex; flex-direction: column; gap: 9px; }
.vz-sel { display: grid; grid-template-columns: 170px 1fr 130px; align-items: center; gap: 10px; font-size: 13px; }
.vz-sel .vz-iz { position: relative; height: 22px; background: var(--ntr-zemin, #f1f5f9); border-radius: 6px; overflow: hidden; }
.vz-sel .vz-iz span { position: absolute; top: 0; bottom: 0; border-radius: 6px; }
.vz-sel .vz-deger { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.vz-sel.ara { font-weight: 800; }
.vz-sel.ara .vz-deger { font-size: 15px; }
.vz-sel .art { background: linear-gradient(90deg, #10b981, #34d399); }
.vz-sel .eks { background: linear-gradient(90deg, #f87171, #ef4444); }
.vz-sel .top { background: linear-gradient(90deg, #0f766e, #14b8a6); }
.vz-sel .top.zarar { background: linear-gradient(90deg, #b91c1c, #ef4444); }
.vz-marj { display: flex; gap: 10px; flex-wrap: wrap; padding: 4px 14px 12px; }
.vz-marj span { font-size: 12px; padding: 4px 10px; border-radius: 999px; background: var(--ntr-zemin, #f1f5f9); }
.vz-marj b { margin-left: 4px; }
@media (max-width: 640px) { .vz-sel { grid-template-columns: 1fr 110px; } .vz-sel .vz-iz { grid-column: 1 / -1; order: 3; } }
@media print { .vz-k { color: #000; background: #fff !important; border: 1px solid #ccc; } .vz-ayr .vz-govde { max-height: none; } }

/* ── Rapor tablo kartları (Firma Özet · Genel Durum; masaüstü FastReport bölümlerinin karşılığı) ── */
.fo { gap: 14px; display: flex; flex-direction: column; }
.fo-ust { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.fo-uyari { padding: 8px 12px; border-radius: 9px; background: #fef3c7; color: #92400e; font-size: 12.5px; }
.fo-kart { background: var(--ntr-yuzey, #fff); border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 14px; overflow: hidden;
           box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.fo-kart > header { display: flex; align-items: center; gap: 9px; padding: 10px 14px; font-weight: 800; font-size: 13px; letter-spacing: .03em;
                    text-transform: uppercase; color: #fff; background: linear-gradient(90deg, var(--r), color-mix(in srgb, var(--r) 60%, #fff)); }
.fo-kart > header small { margin-left: auto; font-weight: 600; text-transform: none; opacity: .9; }
.fo-kart > header i { font-size: 16px; }
.fo-kay { overflow-x: auto; }
.fo-uzun { max-height: 560px; overflow: auto; }
.fo-tb { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.fo-tb th { padding: 8px 12px; text-align: right; font-size: 11.5px; font-weight: 700; color: var(--ntr-metin-soluk, #64748b);
            background: color-mix(in srgb, var(--r) 9%, var(--ntr-yuzey, #fff)); border-bottom: 1px solid var(--ntr-kenar, #e2e5ea);
            position: sticky; top: 0; white-space: nowrap; }
.fo-tb td { padding: 7px 12px; text-align: right; border-bottom: 1px dashed var(--ntr-kenar, #e2e5ea); white-space: nowrap; }
.fo-tb .sol { text-align: left; }
.fo-tb tbody tr:hover td { background: color-mix(in srgb, var(--r) 5%, transparent); }
.fo-tb .eksi { color: #b91c1c; }
.fo-tb td.art { color: #047857; } .fo-tb td.eks { color: #b91c1c; }
.fo-tb tr.fo-top td { font-weight: 800; border-top: 2px solid var(--r); border-bottom: none; background: color-mix(in srgb, var(--r) 7%, transparent); }
.fo-tb tr.fo-denge td { font-weight: 800; color: var(--r); border-bottom: none; }
.fo-tb tr.fo-denge td.eksi { color: #b91c1c; }
.fo-tb tr.fo-soluk td { color: var(--ntr-metin-soluk, #94a3b8); }
.fo-tb tr.fo-grup td { font-weight: 800; background: color-mix(in srgb, var(--r) 6%, transparent); text-align: left; }
.fo-tb tr.fo-ara td { font-weight: 700; border-bottom: 1px solid var(--ntr-kenar, #e2e5ea); }
.fo-uc th:nth-child(1), .fo-uc th:nth-child(3), .fo-uc td:nth-child(1), .fo-uc td:nth-child(3) { text-align: left; }
.fo-uc td:nth-child(2), .fo-uc td:nth-child(4) { font-weight: 600; }
.fo-uc td:nth-child(3), .fo-uc th:nth-child(3), .fo-uc td:nth-child(5), .fo-uc th:nth-child(5) { border-left: 1px solid var(--ntr-kenar, #e2e5ea); }
.fo-uc tr.fo-denge td:first-child { text-align: right; }
.fo-anahtar td:last-child { font-weight: 700; }
.fo-iki { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 14px; align-items: start; }
.fo-fark { display: inline-block; padding: 2px 9px; border-radius: 999px; background: #ecfdf5; color: #047857; font-weight: 700; }
.fo-fark.eksi { background: #fef2f2; color: #b91c1c; }
.fo-tip { padding: 2px 8px; border-radius: 999px; background: var(--ntr-zemin, #f1f5f9); font-size: 12px; }

/* ── İşlem günlüğü (Kullanıcı Log sekmeleri, Log Ayarları) — sekmeler arası ortak ── */
.ntr-log { display: flex; flex-direction: column; gap: 12px; }
.ntr-log-ust { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.ntr-log-ikon { flex: none; width: 46px; height: 46px; border-radius: 13px;
                display: flex; align-items: center; justify-content: center;
                background: var(--ntr-ana-acik, #ccfbf1); color: var(--ntr-ana, #0f766e); font-size: 22px; }
.ntr-log-bas-metin { align-self: center; }
.ntr-log-bas-metin h1 { font-size: 19px; font-weight: 800; margin: 0; }
.ntr-log-bas-metin p { margin: 2px 0 0; font-size: 12.5px; color: var(--ntr-metin-soluk, #6b7684); }
.ntr-log-bosluk { flex: 1; }
.ntr-log-ust label { display: flex; flex-direction: column; gap: 3px; }
.ntr-log-ust label span { font-size: 11px; font-weight: 700; text-transform: uppercase;
                          letter-spacing: .04em; color: var(--ntr-metin-soluk, #6b7684); }
.ntr-log-ust input, .ntr-log-ust select {
    min-height: 38px; padding: 0 9px; font-size: 14px; border-radius: 8px;
    border: 1px solid var(--ntr-kenar, #e2e5ea);
    background: var(--ntr-yuzey, #fff); color: inherit; }
.ntr-log-getir { display: flex; align-items: center; gap: 7px; min-height: 38px; padding: 0 16px;
                 border: none; border-radius: 8px; cursor: pointer; font-weight: 600;
                 background: var(--ntr-ana, #0f766e); color: #fff; }

.ntr-log-liste { background: var(--ntr-yuzey, #fff); border: 1px solid var(--ntr-kenar, #e2e5ea);
                 border-radius: 14px; overflow: hidden; overflow-x: auto;
                 box-shadow: var(--ntr-golge, 0 1px 3px rgba(16,24,40,.08)); }
.ntr-log-liste table { width: 100%; border-collapse: collapse; }
.ntr-log-liste th { text-align: left; font-size: 11px; text-transform: uppercase;
                    letter-spacing: .04em; color: var(--ntr-metin-soluk, #6b7684);
                    background: var(--ntr-zemin, #f8fafc);
                    padding: 11px 12px; border-bottom: 1px solid var(--ntr-kenar, #e2e5ea);
                    white-space: nowrap; }
.ntr-log-liste th.sag, .ntr-log-liste td.sag { text-align: right; }
.ntr-log-liste td { padding: 8px 12px; border-bottom: 1px solid #f1f3f5; font-size: 13px; }
.ntr-log-liste tbody tr:last-child td { border-bottom: none; }
.ntr-log-liste tbody tr:hover { background: var(--ntr-ana-acik, #ccfbf1); }
.ntr-log-liste code { background: #f1f5f9; padding: 1px 6px; border-radius: 4px; }
.ntr-log-zaman { white-space: nowrap; font-variant-numeric: tabular-nums; }
.ntr-log-makine { color: var(--ntr-metin-soluk, #94a3b8); font-size: 12px; }

.ntr-log-not { padding: 9px 12px; background: #eff6ff; color: #1d4ed8; font-size: 12.5px;
               border-bottom: 1px solid var(--ntr-kenar, #e2e5ea); }
.ntr-log-bos { text-align: center; padding: 40px 20px; margin: 16px; color: var(--ntr-metin-soluk, #94a3b8);
               border: 1.5px dashed var(--ntr-kenar, #e2e5ea); border-radius: 12px; }
.ntr-log-bos i { font-size: 42px; display: block; margin-bottom: 8px; color: var(--ntr-ana, #0f766e); opacity: .55; }
.ntr-log-bos p { margin: 0; font-size: 13.5px; }
.ntr-log-uyari { display: flex; align-items: center; gap: 8px; padding: 10px 12px;
                 border-radius: 8px; font-size: 13px; background: #fef2f2; color: #b91c1c; }
.gl-genis { min-width: 150px; }
.gl-rz { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.gl-rz.ekle { background: #dcfce7; color: #166534; } .gl-rz.duzelt { background: #fef3c7; color: #92400e; }
.gl-rz.sil { background: #fee2e2; color: #991b1b; } .gl-rz.ac { background: #f1f5f9; color: #475569; }
.gl-rz.oturum { background: #e0f2fe; color: #075985; } .gl-rz.islem { background: #ede9fe; color: #5b21b6; }
.gl-kayit { cursor: pointer; text-decoration: none; color: inherit; white-space: nowrap; }
.gl-kayit small { color: var(--ntr-metin-soluk, #6b7684); }
.gl-kayit:hover code { background: var(--ntr-ana, #0f766e); color: #fff; }
.kzs-ozet { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px; }
.kzs-kutu { border: 1px solid var(--ntr-kenar, #e2e5ea); border-radius: 10px; padding: 8px 11px; background: var(--ntr-yuzey, #fff); }
.kzs-kutu span { display: block; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--ntr-metin-soluk, #6b7684); }
.kzs-kutu b { font-size: 13px; }
.kzs-kutu.sil { border-color: #fecaca; background: #fef2f2; }
.zc-onay { flex-direction: row !important; align-items: center; gap: 6px !important; font-size: 13px; align-self: center; }
/* Cari detay penceresi alt çubuğu: Yeni Sekmede Aç · Kapat · Cari Kartını Aç (2026-10-14) */
.ntr-cdm-alt { gap: 8px; align-items: center; flex-wrap: wrap; }
.ntr-cdm-ikincil { border: 1px solid var(--ntr-kenar, #e2e8f0); background: var(--ntr-yuzey, #fff); color: var(--ntr-metin, #334155);
    font-weight: 600; font-size: 12.5px; padding: 8px 16px; border-radius: 9px; cursor: pointer; text-decoration: none;
    display: inline-flex; align-items: center; gap: 6px; }
.ntr-cdm-ikincil:hover { background: var(--ntr-zemin, #f8fafc); }
.ntr-cdm-kapat-btn i { margin-right: 6px; }

/* Ana içerik hata sınırı (NatraLayout ErrorBoundary) */
.ntr-sinir-hata { display: flex; align-items: center; gap: 14px; margin: 24px auto; max-width: 640px; padding: 16px 18px;
    border-radius: 14px; border: 1px solid #fecaca; background: #fef2f2; color: #7f1d1d; }
.ntr-sinir-hata > i { font-size: 26px; flex: none; }
.ntr-sinir-hata div { flex: 1; display: flex; flex-direction: column; gap: 3px; font-size: 13.5px; }
.ntr-sinir-hata button { border: 1px solid #fca5a5; background: #fff; color: #991b1b; border-radius: 10px; padding: 7px 12px;
    font: inherit; font-weight: 700; cursor: pointer; white-space: nowrap; }
