/* =====================================================================
   Panel temaları (Ayarlar → Görünüm → Tema)

   İki öznitelik: <html data-theme="…"> paletin adı, <html data-theme-mode="dark">
   koyu zemin (ThemeCatalog'daki Mode). App.razor <head>'indeki
   küçük betik localStorage'daki "adisyon_theme" değerini sayfa çizilmeden önce
   uygular, Ayarlar sayfası da canlı değiştirir (window.adisyonTheme.apply).

   Katmanlar: koyu mod tabanı (data-theme-mode) → palet blokları (data-theme).
   Aynı özgüllükte oldukları için sonra gelen palet, tabanın üstüne yazar: "Gece"
   koyu tabanı alıp yalnız yüzeyleri karartır.

   KAPSAM: yalnız giriş sonrası panel. Her tema bloğu :has(.admin-shell) ile
   kapılanır — .admin-shell yalnız MainLayout'ta çizilir, bu yüzden Landing,
   müşteri menüsü, PaketG, bayi/kurye sayfaları ve giriş öncesi her şey açık
   temada kalır. @media screen: yazdırma her zaman açık temadır.

   Yeni bir tema = bu dosyada bir blok + ThemeCatalog'da bir satır. Bloklar
   yalnız anlamsal tokenları (ve yüzey olarak kullanılan brand tonlarını)
   yeniden tanımlar; sayfa CSS'i token kullandığı sürece kendiliğinden döner.
   ===================================================================== */

:root {
    /* Koyu nötr skala — koyu temanın ham renkleri. Her zaman tanımlı ki tema
       önizleme kartları (Ayarlar) açık temadayken de koyu örneği çizebilsin. */
    --night-950: #070b14;
    --night-900: #0b111d;   /* sayfa zemini */
    --night-850: #101827;   /* kart içi ikincil zemin */
    --night-800: #141d2f;   /* kart / yüzey */
    --night-750: #1a2438;   /* yükseltilmiş yüzey, ince ayraç */
    --night-700: #263249;   /* kenarlık */
    --night-600: #35425d;   /* güçlü kenarlık */
    --night-500: #3d4a65;
    --night-400: #7c89a2;   /* soluk metin — kartta ≥4.5:1 */
    --night-300: #8996ab;   /* ipucu metni  — kartta ≈5.6:1 */
    --night-200: #a9b4c5;   /* üçüncül metin — ≈8:1 */
    --night-100: #c9d2df;   /* ikincil metin — ≈11:1 */
    --night-50:  #e8edf5;   /* ana metin     — ≈14:1 */

    /* Loş — açıkla koyu arası gri: kart beyazın ~%70'i, sayfa ~%60'ı parlaklıkta. */
    --dim-0:   #d5dbe2;   /* kart */
    --dim-50:  #cdd3db;   /* kart içi ikincil zemin */
    --dim-100: #c4cbd4;   /* sayfa zemini */
    --dim-200: #b4bcc7;   /* kenarlık */
    --dim-300: #97a1af;   /* güçlü kenarlık */
    --dim-400: #505c6c;   /* soluk metin — kartta 4.9:1 */
    --dim-500: #424e5f;   /* ipucu — kartta 6:1 */
    --dim-600: #313c4c;
    --dim-700: #232d3c;
    --dim-900: #0f1724;   /* ana metin — kartta 12.9:1 */

    /* Kum — sıcak, krem tonlu açık palet. */
    --sand-0:   #fffdf8;   /* kart */
    --sand-50:  #faf6ee;
    --sand-100: #f3ede2;   /* sayfa zemini */
    --sand-150: #efe7da;
    --sand-200: #e6dccb;   /* kenarlık */
    --sand-300: #d3c4ad;   /* güçlü kenarlık */
    --sand-400: #a39380;   /* devre dışı */
    --sand-500: #75644f;   /* ipucu — kartta 5.6:1 */
    --sand-600: #5c4d3d;
    --sand-700: #463a2d;
    --sand-900: #2a2118;   /* ana metin — 15.5:1 */

    /* Gece — OLED için tam siyaha yakın yüzeyler (metin tonları --night ile ortak). */
    --oled-0:   #000000;   /* sayfa zemini */
    --oled-50:  #07080b;
    --oled-100: #0c0e13;   /* kart */
    --oled-150: #12151c;
    --oled-200: #1e2430;   /* kenarlık */
    --oled-300: #2c3443;   /* güçlü kenarlık */

    /* Marka yazısı (adisyon.ai wordmark + "a" işareti). */
    --wordmark: var(--brand-600);

    /* Mobil üst bar: açık temalarda marka mavisi, koyu temalarda kart yüzeyi. */
    --topbar-bg: var(--accent);
    --topbar-fg: var(--fg-on-accent);
    --topbar-border: transparent;

    /* --accent-text (metin/ikon olarak vurgu) açık temada BİLEREK tanımsız: kullanım
       yerinde var(--accent-text, var(--accent)) yazılır ki müşteri menüsü gibi --accent'i
       yerelde ezen ağaçlarda yerel renk korunsun. Koyu temada aşağıda tanımlanır — dolgu
       rengi (--accent) beyaz yazıyı, bu ise koyu zemini taşıyacak kadar açıktır. */

    /* Her temada BEYAZ kalan yüzey: QR kodları, beyaz zemine göre hazırlanmış logolar,
       fiş/kâğıt önizlemeleri. Koyu temada da okutulabilir/doğru görünmeleri için. */
    --paper: #ffffff;

    /* RGB üçlüleri — rgba(var(--ink-rgb), .06) gibi saydam kullanımlar için.
       ink: ince ayraç/hover tonu (açıkta slate-900, koyuda açık gri);
       surface: yarı saydam "cam" yüzeyler (açıkta beyaz, koyuda kart rengi). */
    --ink-rgb: 15, 23, 42;
    --surface-rgb: 255, 255, 255;

    /* Durum skalasının eksik basamakları (açık değerler = sayfalarda sabit yazılan
       Tailwind tonları; koyu karşılıkları aşağıdaki tema bloğunda). */
    --success-100: #dcfce7;
    --success-200: #bbf7d0;
    --success-800: #166534;
    --danger-200:  #fecaca;
    --danger-300:  #fca5a5;
    --danger-700:  #b91c1c;
    --danger-800:  #991b1b;
    --warning-200: #fde68a;
    --warning-300: #fcd34d;
    --warning-700: #b45309;
    --warning-800: #92400e;
}

@media screen {
    :root[data-theme-mode="dark"]:has(.admin-shell) {
        color-scheme: dark;

        /* ── Marka tonları ─────────────────────────────────────────────
           50–300 açık temada yumuşak zemin/kenarlık olarak kullanılıyor →
           koyu karşılıklar. 600 dolgu (beyaz yazı ≥4.5:1), 700–900 açık
           temada koyu mavi METİN → koyu temada açık mavi metin. */
        --brand-50:  #102440;
        --brand-100: #142d4c;
        --brand-200: #1c3d64;
        --brand-300: #275281;
        --brand-400: #4c9be8;
        --brand-500: #2a84d8;
        --brand-600: #1d77cd;
        --brand-700: #6cb0f2;
        --brand-800: #9ccaf6;
        --brand-900: #cfe5fb;

        --wordmark: #ffffff;
        --topbar-bg: var(--bg);
        --topbar-fg: var(--wordmark);
        --topbar-border: var(--border);
        --ink-rgb: 226, 232, 240;
        --surface-rgb: 20, 29, 47;

        /* ── Yüzeyler ── */
        --ds-surface:        var(--night-800);
        --ds-surface-alt:    var(--night-850);
        --ds-surface-sunken: var(--night-900);
        --bg:                var(--night-800);
        --bg-subtle:         var(--night-900);
        --bg-muted:          var(--night-850);
        --layer-1:           var(--night-800);
        --layer-2:           var(--night-900);
        --dialog-background-color: var(--night-850);

        /* ── Kenarlıklar ── */
        --ds-border:        var(--night-700);
        --ds-border-strong: var(--night-600);
        --border:           var(--night-700);
        --border-strong:    var(--night-600);
        --border-subtle:    var(--night-750);
        --border-focus:     var(--brand-400);

        /* ── Metin ── */
        --ds-text:        var(--night-50);
        --ds-text-muted:  var(--night-300);
        --ds-text-subtle: var(--night-400);
        --fg-1:        var(--night-50);
        --fg-2:        var(--night-100);
        --fg-3:        var(--night-200);
        --fg-hint:     var(--night-300);
        --fg-disabled: var(--night-400);

        /* ── Vurgu ── */
        --accent:            var(--brand-600);
        --accent-hover:      var(--brand-500);
        --accent-soft:       var(--brand-50);
        --accent-text:       var(--brand-700);
        --accent-foreground: var(--brand-700);
        --accent-foreground-rest: var(--brand-700);
        --accent-foreground-hover: var(--brand-800);
        --ds-info:           var(--brand-400);

        /* ── Durum renkleri: metin koyu zeminde okunur, zemin tonları koyu ── */
        --ds-success: #22c55e;
        --ds-warning: #f59e0b;
        --ds-danger:  #f05252;
        /* -600'ler buton/rozet DOLGUSU olarak kullanılıyor (beyaz yazı) — açık
           temadaki doygun tonda kalır; metin için yukarıdaki --ds-* açık tonlar. */
        --success-600: #16a34a;
        --warning-600: #d97706;
        --danger-600:  #dc2626;
        --success-50:  #0e2a1c;
        --success-100: #12361f;
        --success-700: #4ade80;
        --success-200: #1b4d2c;
        --success-800: #86efac;
        --danger-200:  #5a2228;
        --danger-700:  #f87171;
        --danger-800:  #fca5a5;
        --warning-200: #5c4512;
        --warning-300: #7a5a14;
        --warning-700: #fbbf24;
        --warning-800: #fcd34d;
        --danger-50:   #2e1519;
        --danger-100:  #3d1a1f;
        --danger-300:  #7f2d33;
        --warning-50:  #2c2210;
        --warning-100: #3a2c11;

        /* ── Gölgeler: koyu zeminde daha yoğun, kenar çizgisiyle birlikte ── */
        --ds-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.45);
        --ds-shadow-2: 0 4px 14px rgba(0, 0, 0, 0.5);
        --ds-shadow-3: 0 10px 28px rgba(0, 0, 0, 0.55);
        --shadow-xl:   0 20px 45px rgba(0, 0, 0, 0.6);
        --shadow-hero: 0 20px 60px rgba(0, 0, 0, 0.6);

        /* ── Bootstrap 5.3 (yalnız değişkenleri; landing'e dokunmamak için
           data-bs-theme kullanılmıyor) ── */
        --bs-body-bg:        var(--bg-subtle);
        --bs-body-color:     var(--fg-1);
        --bs-emphasis-color: var(--fg-1);
        --bs-secondary-color: var(--fg-3);
        --bs-secondary-bg:   var(--bg-muted);
        --bs-tertiary-bg:    var(--bg-muted);
        --bs-border-color:   var(--border);
        --bs-heading-color:  var(--fg-1);
        --bs-link-color:     var(--accent-text, var(--brand-600));
        --bs-link-hover-color: var(--brand-800);

        background-color: var(--bg-subtle);
    }

    /* ── Gece: koyu tabanın üstüne tam siyah yüzeyler ─────────────── */
    :root[data-theme="oled"]:has(.admin-shell) {
        --ds-surface:        var(--oled-100);
        --ds-surface-alt:    var(--oled-50);
        --ds-surface-sunken: var(--oled-0);
        --bg:                var(--oled-100);
        --bg-subtle:         var(--oled-0);
        --bg-muted:          var(--oled-50);
        --layer-1:           var(--oled-100);
        --layer-2:           var(--oled-0);
        --dialog-background-color: var(--oled-50);
        --ds-border:        var(--oled-200);
        --ds-border-strong: var(--oled-300);
        --border:           var(--oled-200);
        --border-strong:    var(--oled-300);
        --border-subtle:    var(--oled-150);
        --brand-50:  #0a1a30;
        --brand-100: #0e2240;
        --surface-rgb: 12, 14, 19;
        --bs-body-bg: var(--oled-0);
        background-color: var(--oled-0);
    }

    /* ── Loş: gri ara ton. Açık modda kalır (koyu yazı); beyaz parlaklık yok ── */
    :root[data-theme="dim"]:has(.admin-shell) {
        --ds-surface:        var(--dim-0);
        --ds-surface-alt:    var(--dim-50);
        --ds-surface-sunken: var(--dim-100);
        --bg:                var(--dim-0);
        --bg-subtle:         var(--dim-100);
        --bg-muted:          var(--dim-50);
        --layer-1:           var(--dim-0);
        --layer-2:           var(--dim-100);
        --dialog-background-color: var(--dim-50);
        --ds-border:        var(--dim-200);
        --ds-border-strong: var(--dim-300);
        --border:           var(--dim-200);
        --border-strong:    var(--dim-300);
        --border-subtle:    var(--dim-50);
        --ds-text:        var(--dim-900);
        --ds-text-muted:  var(--dim-500);
        --ds-text-subtle: var(--dim-400);
        --fg-1:        var(--dim-900);
        --fg-2:        var(--dim-700);
        --fg-3:        var(--dim-600);
        --fg-hint:     var(--dim-500);
        --fg-disabled: var(--dim-400);
        /* Marka mavisi gri zeminde bir ton koyu: metin olarak da kartta 5:1, beyaz yazıyla 7:1. */
        --brand-600: #035aa8;
        --brand-700: #02467f;
        --accent-text: var(--brand-600);
        /* Açık tint zeminler (rozet, seçili satır) griye çekilir ki beyaz parlamasın. */
        --brand-50:    #c3d3e6;
        --brand-100:   #b6c9e0;
        --accent-soft: var(--brand-50);
        --success-50:  #c7dccd;
        --success-100: #bcd5c3;
        --danger-50:   #e2cbcb;
        --danger-100:  #dbbcbc;
        --warning-50:  #e2d6bd;
        --warning-100: #dccdab;
        --ds-success: #166534;
        --ds-warning: #92400e;
        --ds-danger:  #b91c1c;
        --surface-rgb: 213, 219, 226;
        --bs-body-bg: var(--dim-100);
        --bs-body-color: var(--dim-900);
        background-color: var(--dim-100);
    }

    /* Loş: app.css'teki durum rozetleri sabit Tailwind tonlarında — gri zeminde koyulaştır. */
    :root[data-theme="dim"]:has(.admin-shell) .status-pill.is-success { color: #065f46; }
    :root[data-theme="dim"]:has(.admin-shell) .status-pill.is-muted   { color: #3f4b5c; }
    :root[data-theme="dim"]:has(.admin-shell) .status-pill.is-info    { color: #1e40af; }
    :root[data-theme="dim"]:has(.admin-shell) .status-pill.is-warning { color: #7c2d12; }
    :root[data-theme="dim"]:has(.admin-shell) .status-pill.is-danger  { color: #9f1239; }

    /* ── Kum: sıcak krem tonlu açık palet (vurgu marka mavisi kalır) ── */
    :root[data-theme="sand"]:has(.admin-shell) {
        --ds-surface:        var(--sand-0);
        --ds-surface-alt:    var(--sand-50);
        --ds-surface-sunken: var(--sand-100);
        --bg:                var(--sand-0);
        --bg-subtle:         var(--sand-100);
        --bg-muted:          var(--sand-50);
        --layer-1:           var(--sand-0);
        --layer-2:           var(--sand-100);
        --dialog-background-color: var(--sand-150);
        --ds-border:        var(--sand-200);
        --ds-border-strong: var(--sand-300);
        --border:           var(--sand-200);
        --border-strong:    var(--sand-300);
        --border-subtle:    var(--sand-150);
        --ds-text:        var(--sand-900);
        --ds-text-muted:  var(--sand-500);
        --ds-text-subtle: var(--sand-400);
        --fg-1:        var(--sand-900);
        --fg-2:        var(--sand-700);
        --fg-3:        var(--sand-600);
        --fg-hint:     var(--sand-500);
        --fg-disabled: var(--sand-400);
        --ink-rgb: 42, 33, 24;
        --surface-rgb: 255, 253, 248;
        --bs-body-bg: var(--sand-100);
        --bs-body-color: var(--sand-900);
        background-color: var(--sand-100);
    }

    /* ── Yüksek Kontrast: siyah metin, belirgin kenarlık, koyu vurgu ── */
    :root[data-theme="contrast"]:has(.admin-shell) {
        --bg-subtle:  #eef1f5;
        --bg-muted:   #f6f8fa;
        --layer-2:    #eef1f5;
        --ds-surface-alt:    #f6f8fa;
        --ds-surface-sunken: #eef1f5;
        --ds-border:        #6b7280;
        --ds-border-strong: #374151;
        --border:           #6b7280;
        --border-strong:    #374151;
        --border-subtle:    #9ca3af;
        --ds-text:        #000000;
        --ds-text-muted:  #374151;
        --ds-text-subtle: #4b5563;
        --fg-1:        #000000;
        --fg-2:        #111827;
        --fg-3:        #1f2937;
        --fg-hint:     #374151;
        --fg-disabled: #6b7280;
        --brand-600: #00509e;   /* beyaz yazı 8:1 */
        --brand-700: #003b75;
        --accent:       var(--brand-600);
        --accent-hover: var(--brand-700);
        --wordmark:     var(--brand-600);
        --ds-success: #15803d;
        --ds-warning: #b45309;
        --ds-danger:  #b91c1c;
        --ink-rgb: 0, 0, 0;
        background-color: #eef1f5;
    }
}
