/* ============================================================
   Project Management — Tasarım Token'ları
   Tek kaynak. Renk bir değerle değil amacıyla adlandırılır.
   Eski değişken adları dosyanın sonunda takma ad olarak korunur;
   16 raporun mevcut CSS'i bu sayede dokunulmadan çalışır.
   ============================================================ */

:root {
    /* --- Marka: tenant'a göre override edilir --- */
    --brand: #c92532;
    --brand-strong: #9f1823;
    --brand-soft: #fff0f1;
    --brand-contrast: #ffffff;

    /* --- Yüzey ölçeği: gölge yerine katman farkı --- */
    --surface-page: #f4f5f7;
    --surface-1: #ffffff;
    --surface-2: #fafafb;
    --surface-3: #eef0f3;
    --surface-inset: #e7eaee;
    --surface-chrome: #ffffff;
    --surface-rail: #e9ebef;

    /* --- Metin --- */
    --text-1: #14161a;
    --text-2: #525a66;
    --text-3: #7d8694;

    /* --- Çizgi --- */
    --line: #e3e6ec;
    --line-strong: #cdd2db;

    /* --- Anlam renkleri: tümü beyaz üstünde WCAG AA --- */
    --ok: #0f7a43;
    --ok-bg: #e8f6ee;
    --warn: #9a5b00;
    --warn-bg: #fdf1de;
    --danger: #b3261e;
    --danger-bg: #fdecea;
    --info: #1b5fbe;
    --info-bg: #e8f1fd;
    --neutral: #5c6470;
    --neutral-bg: #eef0f3;

    /* --- Grafik serileri: sıra sabit, aynı kategori her raporda aynı renk --- */
    --series-1: #2f6fd0;
    --series-2: #0f7a43;
    --series-3: #9a5b00;
    --series-4: #6b3fa0;
    --series-5: #b3261e;
    --series-6: #0c6b74;
    --series-7: #5c6470;
    /* 7'den fazla kategorisi olan raporlar için uzantı. Tasarım tercihi
       hâlâ "ilk N + Diğer"; bunlar zorunlu hâlde döngüye girer. */
    --series-8: #8e44ad;
    --series-9: #1f7a8c;
    --series-10: #a9431e;
    --series-11: #45577a;
    --series-12: #7d5a1f;

    /* --- Tipografi --- */
    --font: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
    --font-num: "IBM Plex Mono", ui-monospace, Consolas, monospace;
    --fs-display: 28px;
    --fs-h1: 20px;
    --fs-h2: 15px;
    --fs-body: 13px;
    --fs-sm: 12px;
    --fs-xs: 11px;

    /* --- Boşluk: 4pt tabanlı, ara değer yok --- */
    --s1: 4px;
    --s2: 8px;
    --s3: 12px;
    --s4: 16px;
    --s5: 20px;
    --s6: 24px;
    --s8: 32px;

    --r-xs: 4px;
    --r-sm: 5px;
    --r-md: 8px;
    --r-lg: 12px;
    --r-full: 999px;

    --shadow-1: 0 1px 2px rgba(16, 20, 30, 0.07);
    --shadow-2: 0 6px 20px rgba(16, 20, 30, 0.12);
    --shadow-3: 0 18px 44px rgba(16, 20, 30, 0.16);

    /* Sol menü: daralmış hâli içerik alanını belirler. Genişleyen hâli
       içeriğin üstüne biner, bu yüzden yerleşimi hiç etkilemez. */
    --nav-w: 46px;
    --nav-w-open: 232px;
    /* Menü imleçle açılıp kapanır: açılma/kapanma animasyonu ve imleç
       ayrıldıktan sonraki bekleme. Bekleme, çubuğun üstünden geçerken
       menünün gereksiz yere kapanmasını önler. */
    --nav-anim: 300ms;
    --nav-close-delay: 1000ms;

    /* --- Kabuk yükseklikleri: kompaktlığın tek kaynağı --- */
    --h-bar: 46px;
    --h-ctx: 34px;
    --h-status: 24px;

    /* Aktif nav tuşunun etiket payı. Sabit olması ray genişliğini değişmez
       kılar: rapor değiştirince veya hover'da hiçbir şey oynamaz. */
    --nav-label-w: 186px;

    /* --- Tablo satır yoğunluğu: kullanıcı seçer, localStorage'da saklanır --- */
    --row-h: 36px;

    --focus-ring: color-mix(in srgb, var(--brand) 55%, transparent);
    --transition: 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

[data-density="mid"] {
    --row-h: 44px;
}

[data-density="wide"] {
    --row-h: 54px;
}

/* ============================================================
   Tenant markaları
   Yalnızca marka üçlüsü değişir. Yüzeyler ve anlam renkleri
   sabit kalır ki 9 tenant arasında rapor okuma alışkanlığı bozulmasın.
   A101 #00a9c7 -> #007e96: beyaz üstünde AA'ya çekildi.
   ============================================================ */
[data-tenant-theme="OLKA"] {
    --brand: #086bc1; --brand-strong: #064b88; --brand-soft: #e2f2ff; --brand-secondary: #ffffff;
}

[data-tenant-theme="HD"] {
    --brand: #f05a0b; --brand-strong: #c2430a; --brand-soft: #ffe9d9; --brand-secondary: #171717;
}

[data-tenant-theme="MCC"] {
    --brand: #2f2f2f; --brand-strong: #000000; --brand-soft: #f2f2f2; --brand-secondary: #ffffff;
}

[data-tenant-theme="SCH"] {
    --brand: #3c3939; --brand-strong: #171515; --brand-soft: #f4f2f2; --brand-secondary: #ffffff;
}

/* Marka rengi artık beyaz metnin arka planı (aktif nav tuşu, birincil buton).
   A101 #00a9c7, GRC #c18b25 ve MRDIY #e77800 beyaz üstünde AA'yı geçmiyordu;
   tonları korunarak koyulaştırıldı. Kurumsal renkler --brand-secondary'de duruyor. */
[data-tenant-theme="A101"] {
    --brand: #007e96; --brand-strong: #00596a; --brand-soft: #ddf8fc; --brand-secondary: #00a9c7;
}

[data-tenant-theme="GRC"] {
    --brand: #96690f; --brand-strong: #6b4a09; --brand-soft: #fff4d6; --brand-secondary: #777777;
}

[data-tenant-theme="MRDIY"] {
    --brand: #b35c00; --brand-strong: #7e4100; --brand-soft: #fff0c2; --brand-secondary: #d7192d;
}

[data-tenant-theme="DEC"] {
    --brand: #263fcb; --brand-strong: #1a2b91; --brand-soft: #e7ebff; --brand-secondary: #ffffff;
}

/* ============================================================
   Geriye dönük takma adlar
   Rapor CSS'leri hâlâ bu adları kullanıyor. Buradan beslendikleri
   sürece yeni token setiyle tutarlı kalırlar.
   ============================================================ */
:root {
    --brand-red: var(--brand);
    --brand-red-dark: var(--brand-strong);
    --brand-red-soft: var(--brand-soft);

    --bg-primary: var(--surface-page);
    --bg-secondary: var(--surface-1);
    --bg-tertiary: var(--surface-1);
    --bg-hover: var(--surface-3);

    --border-color: var(--line);
    --text-primary: var(--text-1);
    --text-secondary: var(--text-2);
    --text-muted: var(--text-3);

    --input-bg: var(--surface-1);
    --input-border: var(--line-strong);
    --card-bg: var(--surface-1);
    --modal-bg: var(--surface-1);
    --select-option-bg: var(--surface-1);
    --table-header-bg: var(--surface-3);
    --table-row-hover: var(--surface-2);

    --accent: var(--brand);
    --accent-blue: var(--brand);
    --accent-green: var(--ok);
    --accent-orange: var(--warn);
    --accent-red: var(--danger);
    --accent-purple: var(--series-4);
    --accent-pink: var(--series-5);
    --accent-cyan: var(--series-6);
}
