/*
 * BZ TASARIM DEĞİŞKENLERİ (design tokens) — arayüz standardının TEK kaynağı.
 * Kurallar ve gerekçeler: docs/ui-standardi.md
 *
 * ÇERÇEVEDEN BAĞIMSIZ: bu dosyada yalnız CSS özel özellikleri var; sınıf, Bootstrap/AdminLTE
 * kuralı ve sayfa seçicisi YOK. Razor sayfaları bugün, ileride React (ya da başka bir çerçeve)
 * bileşenleri aynı dosyayı olduğu gibi kullanır: geçişte değerler yeniden yazılmaz, yalnız
 * bileşenler bu değişkenleri okur.
 *
 * KATMANLAR
 *   1) Ölçek   — ham değerler (--bz-space-*). Bileşenler bunları DOĞRUDAN kullanmaz.
 *   2) Roller  — değerin ne için olduğu (--bz-page-gutter, --bz-plate-pad ...). Bileşenler bunları
 *                kullanır; kompaktlık değişirse yalnız eşleme değişir, bileşenler değişmez.
 *   3) Yüzeyler — plaka / pencere / kanal / tuş tarifleri.
 *
 * BOOTSTRAP BAĞI YALNIZ BURADA: tema renkleri --bs-* değişkenlerinden okunur. Bootstrap bırakılırsa
 * değişen tek yer bu eşlemedir; bileşen kuralları yalnız --bz-* okuduğu için dokunulmaz.
 *
 * TEMA: seçici `:root, [data-bs-theme]`. Özel özelliğin değeri TANIMLANDIĞI öğede çözülür; yalnız
 * :root'ta tanımlansaydı --bs-body-bg / --bs-primary kökteki haliyle donar, alt ağaçta başka tema
 * taşıyan bölgeye (kenar menüsü `dark`, Destek grubu `red`) yansımazdı. Her tema sınırında yeniden
 * tanımlanınca o bölgenin renkleriyle çözülür. Karanlık tema (belge bölüm 8) bu dosyaya ayrı bir
 * `[data-bs-theme="dark"]` bloğu olarak eklenecek; bileşen kurallarına dokunulmayacak.
 *
 * YENİ DEĞER EKLEMEDEN ÖNCE: var olan rol yetiyorsa yeni değişken açılmaz. Yeni rol gerekiyorsa
 * önce belgeye (docs/ui-standardi.md) yazılır, sonra buraya.
 */
:root,
[data-bs-theme] {
    /* ---------- 1) ÖLÇEK — kök yazı 12.24px (1rem). Kompakt: kullanıcı kararı "olabildiğince sıkışık". */
    --bz-space-1: .33rem; /* ≈4px */
    --bz-space-2: .5rem; /* 6.12px */

    /* ---------- 2) BOŞLUK ROLLERİ */
    /* İçerik ile üst bar / kenar menüsü / ekran kenarı arası; DÖRT YÖNDE aynı. */
    --bz-page-gutter: var(--bz-space-2);
    /* Yan yana ve alt alta paneller arası. */
    --bz-panel-gap: var(--bz-space-2);
    /* Plakanın iç dolgusu (harita kartı dahil) ve plaka içindeki parçalar arası. */
    --bz-plate-pad: var(--bz-space-1);
    --bz-stack-gap: var(--bz-space-1);
    /* Pencerenin iç dolgusu (tablo, harita kabı). */
    --bz-window-pad: var(--bz-space-1);

    /* ---------- ÇERÇEVE — tek ekran sayfaları (kaymayan liste + harita / tablo + KPI düzenleri)
       Üst barın yüksekliği (custom-navbar) ve tek ekran çerçevesinin en küçük boyu. Çerçevenin
       kuralı panel-chrome.css `.bz-frame`: sayfalar yükseklik YAZMAZ (eskiden `calc(100vh - 57px)`,
       `150px`, JS'te 10 / 12px paylar). Kısa ekranda çerçeve bu boydan küçülmez, sayfa kayar.
       ÜST ÇUBUK = YÜZER ŞERİT (2026-10-06; kullanıcı önizlemede A'yı seçti, örnekleri Athleats / hap gezinme / Ruul):
       çubuğun bütün içeriği zeminden ayrılan beyaz BANTTA (--bz-bar-height); bant üstten ve yanlardan sayfa kenar payı
       kadar içeride, ALTINDAKİ boşluk sayfanın kendi kenar payı (ikisi üst üste binmez: önizlemede bant ile plaka arası
       12,78 px, öteki aralıklar 6 px ölçülmüştü). Eskiden 44 px'lik yarı saydam beyaz şerit + bulanıklık + 20 px gölge. */
    --bz-bar-height: 40px;
    --bz-header-height: calc(var(--bz-page-gutter) + var(--bz-bar-height));
    /* BAŞLIK ŞERİDİ TEK BOYDA (2026-10-06; kullanıcı: "burada tasarım ortaklansın, hâlâ farklılıklar var bu alanlarda"):
       sayfa başlığı, Bilgilendirme şeridi, bağlam başlığı ve araç başlığı içlerinde ne olursa olsun aynı boyda. Boy, içinde
       tek KOMPAKT DENETİM olan şeridin boyu: denetim (düğme, şeritteki sekme) sm yazı × 1,5 satır + .25rem dolgu × 2 +
       kenar × 2 (panel-chrome.css DÜĞME BOYU), şerit .3rem dolgu × 2 + kenar. Eskiden yalnız başlıklı şerit 27,8 px,
       rozetli 29,7, düğmeli 32,2 px'ti (ölçüldü): sayfadan sayfaya geçerken içerik zıplıyordu. Sarılan şerit uzar. */
    --bz-control-height: calc(var(--bz-font-sm) * 1.5 + .5rem + 2 * var(--bz-border-width));
    --bz-strip-height: calc(var(--bz-control-height) + .6rem + 2 * var(--bz-border-width));
    --bz-frame-min-height: 460px;

    /* ---------- İKON RAYI — daraltılmış yan menü, kapalı yan çekmece ve kapalı harita paneli AYNI genişlikte.
       Yan menüde öğeler plakanın üstündeki BEYAZ içerik alanında: ikon (paketin en küçük çizim ölçüsü) +
       öğenin iki yan dolgusu (--bz-space-2) + iki pencere dolgusu + iki plaka dolgusu + üç katın kenarları
       (öğe, pencere, plaka) = 16 + 2 × 6,12 + 2 × 4,04 + 2 × 4,04 + 6 ≈ 50,4 px. */
    --bz-rail-icon: 16px;
    --bz-rail-w: calc(var(--bz-rail-icon) + 2 * var(--bz-space-2) + 2 * var(--bz-window-pad) + 2 * var(--bz-plate-pad) + 6 * var(--bz-border-width));

    /* ---------- BİÇİM — kart köşesi denetimden (Bootstrap 6,12 px) bir kademe büyük: modern düz dilde yüzeyler
       yumuşak köşeli kart (2026-10-02). Denetimler (düğme, giriş) Bootstrap köşesinde kalır. */
    --bz-radius: 8px;
    --bz-border-width: var(--bs-border-width);

    /* ---------- TİPOGRAFİ (2026-10-06; docs/ui-kilavuzu.md bölüm 6). Kullanıcı: "font ve punto standartı koyalım, siteye
       farklı farklı puntolar var denildi". Arayüz SİSTEMİN yazısını kullanır: yazı tipi dosyası indirilmez (kapalı ağ) ve
       aynı makinede bütün sayfalar aynı çizilir (Windows'ta Segoe UI). Boy yalnız bu ölçekten; bileşen rolünün adımını
       okur (belge 6.3). Adımlar 58 sayfanın görünen metninde ölçülen boy kümelerinden seçildi (docs/ui-standardi.md
       bölüm 22). */
    --bz-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;
    --bz-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    --bz-font-xs: .75rem;   /* 9,18 px  yardımcı: tablo, çip, rozet, etiket, açıklama */
    --bz-font-sm: .875rem;  /* 10,71 px denetim: düğme, giriş, seçim kutusu; özet şeridi */
    --bz-font-md: 1rem;     /* 12,24 px gövde ve gezinme */
    --bz-font-lg: 1.15rem;  /* 14,08 px alt başlık, sayfa sekmesi */
    --bz-font-xl: 1.3rem;   /* 15,91 px panel başlığı */
    --bz-font-2xl: 1.5rem;  /* 18,36 px sayfa başlığı */
    --bz-font-num: 1.65rem; /* 20,2 px  gösterge değeri */
    --bz-font-display: 2.85rem; /* 34,9 px büyük baş harf rozeti (profil sayfası, .bz-avatar-xl) */
    --bz-line-tight: 1.2;   /* başlık, gösterge değeri */
    --bz-line-normal: 1.5;  /* metin, denetim */
    /* Bootstrap'in yazı tipi değişkenleri buradan: Bootstrap bileşenleri de aynı aileyi çizer. */
    --bs-font-sans-serif: var(--bz-font-sans);
    --bs-body-font-family: var(--bz-font-sans);
    --bs-font-monospace: var(--bz-font-mono);

    /* ---------- RENK ROLLERİ (2026-10-06; belge bölüm 7). Tema renkleri AdminLTE tema bloklarından gelir
       ([data-bs-theme="red"] …); Bootstrap değişkeni YALNIZ burada role eşlenir, ev ve sayfa kuralları rolü okur.
       Durum aileleri ikon paketinin seviyeleriyle aynı adda: ok / warn / bad / info. */
    --bz-color-brand: var(--bs-primary);
    --bz-color-brand-rgb: var(--bs-primary-rgb);
    --bz-color-text: var(--bs-body-color);
    --bz-color-text-muted: var(--bs-secondary-color);
    --bz-color-border: var(--bs-border-color);
    --bz-color-surface: var(--bs-body-bg);
    /* Üzerine gelme zemini, beyaz yüzeyde bir ton koyu (2026-10-06; eskiden --bs-tertiary-bg #f8f9fa: beyazda 1,05:1,
       görünmüyordu). Gömülü sekme izinin zemini de bu ton (yüzeyler: KANAL). */
    --bz-color-hover: #eef0f3;
    --bz-color-page: #f4f4f4;
    --bz-status-ok: var(--bs-success);
    --bz-status-ok-fg: var(--bs-success-text-emphasis);
    --bz-status-ok-bg: var(--bs-success-bg-subtle);
    --bz-status-ok-border: var(--bs-success-border-subtle);
    --bz-status-warn: var(--bs-warning);
    --bz-status-warn-fg: var(--bs-warning-text-emphasis);
    --bz-status-warn-bg: var(--bs-warning-bg-subtle);
    --bz-status-warn-border: var(--bs-warning-border-subtle);
    --bz-status-bad: var(--bs-danger);
    --bz-status-bad-fg: var(--bs-danger-text-emphasis);
    --bz-status-bad-bg: var(--bs-danger-bg-subtle);
    --bz-status-bad-border: var(--bs-danger-border-subtle);
    --bz-status-info: var(--bs-info);
    --bz-status-info-fg: var(--bs-info-text-emphasis);
    --bz-status-info-bg: var(--bs-info-bg-subtle);
    --bz-status-info-border: var(--bs-info-border-subtle);

    /* HARİTA ROLLERİ (2026-10-12, AVL-842). Yalnız istatistik sayfalarının haritaları okur (Rota, Sürüş, Şarj, Araç);
       bz-map ve diğer sayfalar okumaz. Haritanın üstüne çizilen işaretler; karo temadan bağımsız açık çizildiği için
       temaya bağlanmaz. MapLibre CSS değişkeni okumadığından betik değeri getComputedStyle ile alır (UI-R7). Değerler
       eski sabit renklerin birebir aynısı. */
    --bz-map-track-start: #22c55e;
    --bz-map-track-end: #ef4444;
    --bz-map-track-point: #f59e0b;
    --bz-map-track-edge: #fff;
    --bz-map-track-shadow: rgba(0, 0, 0, .45);
    --bz-map-route-planned: #dc3545;
    /* Sürüş / Araç: aracın yaptığı yol ve gölgesi, altta soluk planlı güzergâh; Şarj: oturum çizgisi ve SOC sınıfları;
       ihlal / arıza işaretinin kenarı ve gölgesi (2026-10-12, aynı kural). */
    --bz-map-route-actual: #dc3545;
    --bz-map-route-actual-shadow: #991b1b;
    --bz-map-route-planned-muted: #64748b;
    --bz-map-session-line: #2563eb;
    --bz-map-soc-low: #dc2626;
    --bz-map-soc-mid: #f59e0b;
    --bz-map-soc-high: #16a34a;
    --bz-map-soc-unknown: #64748b;
    --bz-map-marker-edge: #fff;
    --bz-map-marker-shadow: rgba(15, 23, 42, .25);

    /* ---------- 3) YÜZEYLER — MODERN DÜZ DİL (2026-10-02). Kullanıcı: "griler için de eski tasarım oldu dedi
       herkes, tab alanları vs WinForms gibi dediler"; "css ortaklandığı için kolaylıkla yenilikçi bir tasarıma
       çevirebiliriz". Kaldırılanlar: iç gölge (gömülü tepsi / kanal), alttaki 1 px ışık dudağı, üstten alta parlak
       geçiş, oyma kenar (üst koyu / alt açık), orta gri (gri-200 / 300) tepsiler, koyu gölgeli kabarık tuş. Kalan:
       DÜZ, AÇIK zeminler, TEK RENK ince kenar, yumuşak tek gölge. Rol dağılımı ve sınıflar AYNI (önceki dil: seçenek
       B "gömülü plaka, yükselen pencere", 2026-10-01; geçmiş docs/ui-standardi.md bölüm 5).
       AYNI GÜN VURGU (V5): kullanıcı "modern ama bazı yerler daha fazla göze batsın", "glossy'ye biraz renk katsak",
       "bordo tonunu kullansak?"; önizlemede V0-V5 yan yana, "v4 çok kötü" (parlak bordo dolgu), "v5 güzel". Tepsi ve
       iz bir ton koyu + kenarlı + ÜSTTEN hafif parlak (ışık yalnız üstten; gömülü iç gölge YOK), seçili öğe açık BORDO
       ton + bordo halka + bordo yazı.
       V7 (2026-10-05): kullanıcı "aslında fena değil ama hâlâ bir şeyler içine sinmiyor"; teşhis kutu içinde kutu
       (kenarlı tepsi › 4 px › kenarlı pencere) + çubuk içinde küçük başlık. Önizlemede V5 / V6 / V7 1:1: "evet uygula
       v7'yi, olmadı geri alırız". TEPSİ KATMANI GÖRÜNMEZ: plaka gruplar ama çizmez; içerik tek katman beyaz kart,
       gruplamayı boşluk ve başlık yapar. Sayfa başlığı kutusuz ve büyük (customstyle.css). Geri dönüş: aşağıdaki üç
       plaka değeri V5'te `linear-gradient(180deg, #fafbfc, #eef1f5)` / `#d6dbe1` / `linear-gradient(180deg, #f1f3f6,
       #e6e9ee)`.
       V7.1 (aynı gün): görünmez plaka, içeriği DOĞRUDAN taşıyan plakaları (formlar: "Profil öylece atılmış gibi"),
       çok kutucuklu pano bölümlerini ("hangi öğe hangi başlığın karmaşıklaştı") ve kapalı rayları ("collapse olunca
       çok boş kaldı") dağıttı. Tek katman TERSİNDEN: PLAKA KARTIN KENDİSİ (beyaz, ince kenar, yumuşak gölge), içindeki
       içerik penceresi düzleşir (YUZEYLER), öğe kartları (kutucuk, bilgi kutusu, adım kartı) kenarını korur, sayfa
       başlığı kutusuz kalır. */

    /* YÜZEYLERİN KURALI TEK YERDE: panel-chrome.css "YUZEYLER - TEK TANIM" (bileşenler zemin / kenar
       rengi / gölge yazmaz). Kullanıcı kararı 2026-10-01: "hepsi aynı olsun sitede". */

    /* PLAKA (.mapbox, .dashboard-card, yan menü, çekmece, kapalı ray, tek başına araç çubuğu, filtre şeridi): V7.1'den
       beri KART — beyaz, ince kenar, yumuşak gölge (pencereyle aynı değerler). Sayfa başlığı plakası yüzey çizmez
       (YUZEYLER). Bileşen `background` kısaltmasıyla okur. */
    --bz-plate-bg: var(--bs-body-bg);
    /* Tek değer; bileşen yalnız `border-color` ile kullanır. */
    --bz-plate-border: #dce0e6;
    --bz-plate-shadow: 0 1px 3px rgba(16, 24, 40, .08);
    /* Tıklanabilir plakanın üzerine gelince: marka tonunda ince halka + yumuşak kalkış. */
    --bz-plate-shadow-raised: 0 0 0 1px rgba(var(--bs-primary-rgb), .35), 0 2px 8px rgba(16, 24, 40, .08);
    /* İç plaka: kartın içindeki plaka ikinci bir kart çizmez (zemin saydam; kenar ve gölge YUZEYLER'de kalkar). */
    --bz-plate-inner-bg: transparent;

    /* PENCERE: plakanın üstündeki beyaz içerik alanı (tablo, harita, form, KPI kutucuğu): belirgin ince kenar +
       yumuşak tek gölge (eskiden %20 siyah gölge). */
    --bz-window-bg: var(--bs-body-bg);
    --bz-window-border: #dce0e6;
    --bz-window-shadow: 0 1px 3px rgba(16, 24, 40, .08);

    /* KANAL: sekme şeridinin / navbar segmentinin İZİ — DÜZ açık gri hap: kenar, parlama ve gölge yok (DENEME,
       2026-10-05; kullanıcı: "seçili olmayan sekmeleri daha flat yapsak? hâlâ arka plan WinForms gibi, daha az
       ışıltılı"). Önizlemede üç seçenek: şimdiki / F1 düz iz (bu) / F2 iz yok (yalnız seçili hap). Kenar saydam ama
       kalınlığı duruyor: şerit ölçüsü değişmez. Önceki değerler: bg #e3e7ec, sheen `linear-gradient(180deg,
       rgba(255,255,255,.75), rgba(255,255,255,0) 60%)`, border #cfd5dc.
       BU DEĞERLER GÖMÜLÜ İZDİR (plakanın içi). Şerit ve öğeleri HAP (2026-10-06). İz bulunduğu yere göre üç biçimde
       çizilir (yer = YUZEYLER KANAL bağlamı): plakada gömülü gri (bunlar), SAYFA ZEMİNİNDE yüzen beyaz hap (YÜZER
       değerleri: zeminde #eef0f3 iz ile #f4f4f4 zemin arası 1,04:1'di, iz görünmüyordu; "Liste | Harita"da seçili tuş
       yalnız kalıyordu) ve üst çubuğun bandında kapsız (bant kabın kendisi). Üzerine gelme izin TERSİ: gri izde beyaz,
       beyaz izde gri (--bz-channel-hover-bg). */
    --bz-channel-bg: var(--bz-color-hover);
    --bz-channel-sheen: none;
    --bz-channel-border: transparent;
    --bz-channel-shadow: none;
    --bz-channel-hover-bg: var(--bs-body-bg);

    /* YÜZER (2026-10-06): zeminden ayrılan çubuk parçaları - üst çubuğun bandı, çubuğun açılır menüsü, kenar menüsünün
       paneli - ve zemindeki sekme izi. Beyaz, çok ince yarı saydam kenar, geniş yumuşak gölge (kullanıcının örnekleri:
       "tab alanlarını floating yapsak"). Köşe plakayla aynı (--bz-radius): ilk denemedeki 12 px plakaların 8 px'i
       yanında "orantısız" bulundu. Açılır menü bir kademe yüksekte (--bz-float-shadow-raised). */
    --bz-float-bg: var(--bs-body-bg);
    --bz-float-border: rgba(16, 24, 40, .08);
    --bz-float-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 4px 14px rgba(16, 24, 40, .07);
    --bz-float-shadow-raised: 0 2px 6px rgba(16, 24, 40, .06), 0 12px 32px rgba(16, 24, 40, .14);

    /* TUŞ: seçili öğe (sekme, navbar bölümü, sayfalama, tarih kısayolu, yan menü, çekmece). DOLU BİRİNCİL RENK
       (DENEME, 2026-10-05; kullanıcı: "bunların hepsi solid primary olsun, light/soft gözükmesin, bir bakalım"):
       zemin marka rengi, yazı beyaz (--bz-key-fg), seçili öğenin soluk satırları yarı saydam beyaz (--bz-key-muted-fg),
       çizgi YOK (dolguyla aynı renk olurdu), hafif bordo gölge. Yazı rengi artık bileşende değil, YUZEYLER'de
       (yalnız bu değerler değişerek iki dil arasında geçilir). Önceki V5 (açık ton) değerleri: bg #f8e8eb, fg
       var(--bs-primary), muted var(--bs-secondary-color), çizgi 3px, gölge `0 1px 3px rgba(primary,.22), 0 0 0 1px
       rgba(primary,.40), inset 0 1px 0 rgba(255,255,255,.9)`. (V4 parlak bordo DOLGU "çok kötü" bulunmuştu: geçişli +
       parlamalıydı; bu düz.) ÇİZGİ ARKA PLAN KATMANIDIR (bileşen: background-image --bz-key-line, boyu
       --bz-key-line-width, konumu kenar), iç gölge DEĞİL: `inset 0 -3px 0` yuvarlak köşede incelen hilal çiziyordu. */
    --bz-key-bg: var(--bs-primary);
    --bz-key-fg: #fff;
    --bz-key-muted-fg: rgba(255, 255, 255, .78);
    --bz-key-line: linear-gradient(var(--bs-primary), var(--bs-primary));
    --bz-key-line-width: 0px;
    --bz-key-shadow: 0 1px 2px rgba(var(--bs-primary-rgb), .35);

    /* ÜST KATMAN: sayfanın ÜSTÜNDE açılan pencere (modal, yan offcanvas). Pencereyle aynı beyaz zemin; sayfadan
       ayrılsın diye belirgin, yumuşak gölge; arkasındaki perde yarı saydam koyu. Eskiden offcanvas'ın kendi dili
       (bm-offcanvas.css, !important) ve modalın Bootstrap varsayılanı (kenarlık, siyah %50 perde): iki ayrı üst
       katman. Kural panel-chrome.css YUZEYLER "KATMAN". */
    --bz-overlay-shadow: 0 16px 40px rgba(0, 0, 0, .18);
    --bz-overlay-backdrop: rgba(15, 23, 42, .32);
}

/* KARANLIK BÖLGE (bugün yalnız kenar menüsü: `data-bs-theme="dark"`). Şimdilik yalnız KANAL: kenar menüsünün
   seçili sayfası yan menüyle aynı SEÇİLİ tarifini kullanır (kanal zemini + solda marka çizgisi; panel-chrome.css
   YUZEYLER). Modern düz dilde (2026-10-02) koyu zeminde AÇIK, düz bir örtü: kenar, parlaklık ve iç gölge yok
   (eskiden zeminden koyu gömülü oyuk). Plaka / pencere / tuş karanlık bölgede kullanılmıyor; tam karanlık tema
   (belge bölüm 8) bu bloğu genişletir. Ana bloktan SONRA: aynı özgüllük, sıra kazanır; içinde başka tema taşıyan
   öğe ana blokla kendi değerlerini yeniden tanımlar. */
[data-bs-theme="dark"] {
    --bz-channel-bg: rgba(255, 255, 255, .08);
    --bz-channel-sheen: none;
    --bz-channel-border: transparent;
    --bz-channel-shadow: none;

    /* Harita rolleri: karo karanlık bölgede de açık çizilir, değerler ana blokla aynı (UI-R6). */
    --bz-map-track-start: #22c55e;
    --bz-map-track-end: #ef4444;
    --bz-map-track-point: #f59e0b;
    --bz-map-track-edge: #fff;
    --bz-map-track-shadow: rgba(0, 0, 0, .45);
    --bz-map-route-planned: #dc3545;
    --bz-map-route-actual: #dc3545;
    --bz-map-route-actual-shadow: #991b1b;
    --bz-map-route-planned-muted: #64748b;
    --bz-map-session-line: #2563eb;
    --bz-map-soc-low: #dc2626;
    --bz-map-soc-mid: #f59e0b;
    --bz-map-soc-high: #16a34a;
    --bz-map-soc-unknown: #64748b;
    --bz-map-marker-edge: #fff;
    --bz-map-marker-shadow: rgba(15, 23, 42, .25);
}
