/* ============================================================
   TASARIM TOKEN'LARI — TEK KAYNAK (single source of truth)
   ============================================================
   Bu dosya, panelin tüm modernize edilmiş ekranlarında (ana panel,
   arşiv sistemi, giriş ekranı, istatistik dashboard'u) kullanılan
   renk / spacing / radius / gölge / tipografi değerlerini tek bir
   yerde tanımlar.

   Önceden bu değerler her sayfada ayrı ayrı (--sb-*, --ist-*,
   --brand, --bs-primary...) tekrar tekrar hardcode edilmişti —
   bu da zamanla değerlerin birbirinden sapması riskini taşıyordu.
   Artık diğer dosyalar (modern-panel.css, arsiv_iskelet.css,
   index.php, istatistik.php, #formID scoped Bootstrap override'ları)
   kendi değişkenlerini BURADAKİ token'lara referans veriyor.

   Yükleme sırası önemli: bu dosya, ondan yararlanan her CSS/sayfadan
   ÖNCE <head> içinde linklenmelidir.
   ============================================================ */

:root {

    /* ---------- Marka / nötr renk paleti ---------- */
    --brand: #4f46e5;
    --brand-dark: #3f37c9;
    --brand-light: #eef2ff;

    --ink: #1f2137;        /* birincil metin */
    --muted: #6b7189;      /* ikincil / yardımcı metin */
    --line: #e4e6ef;       /* kenarlık / ayırıcı */

    --bg-page: #eef1f5;    /* sayfa arkaplanı */
    --bg-surface: #ffffff; /* kart / panel arkaplanı */
    --table-hover: #fafbfc; /* tablo satırı üzerine gelince */

    /* ---------- Semantik durum renkleri ---------- */
    --success: #16a34a;
    --success-light: #ecfdf3;
    --warning: #d97706;
    --warning-light: #fffbeb;
    --danger: #dc2626;
    --danger-light: #fef2f2;
    --info: #0ea5e9;
    --info-light: #eff8ff;

    /* ---------- 8px grid spacing ölçeği ---------- */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-7: 32px;
    --space-8: 40px;
    --space-9: 48px;

    /* ---------- Köşe yuvarlaklığı ---------- */
    --radius-sm: 8px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;
    --radius-pill: 999px;

    /* ---------- Gölgeler (heavy border yerine) ---------- */
    --shadow-xs: 0 1px 2px rgba(16,24,40,.04);
    --shadow-sm: 0 1px 3px rgba(16,24,40,.06);
    --shadow-md: 0 8px 20px -6px rgba(31,33,55,.14);
    --shadow-lg: 0 20px 45px -12px rgba(31,33,55,.22);
    --shadow-brand: 0 8px 20px -6px rgba(79,70,229,.45);

    /* ---------- Tipografi ---------- */
    --font-sans: 'Inter', 'Roboto', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    --text-xs: 12px;
    --text-sm: 13.5px;
    --text-base: 14.5px;
    --text-md: 16px;
    --text-lg: 18px;
    --text-xl: 22px;
    --text-2xl: 28px;

    /* ---------- Geçiş süreleri ---------- */
    --transition-fast: 150ms ease;
    --transition-base: 200ms ease;

    /* ---------- Yerleşim ----------
       İçerik sarmalayıcısının azami genişliği. Geniş ekranlarda (1920px+)
       içerik kenardan kenara yayılıp okunmaz hâle gelmesin diye sınırlanır
       ve ortalanır. Tek yerden ayarlanabilsin diye token. */
    --content-max: 1280px;


    /* ============================================================
       FORM TASARIM STANDARDI
       ============================================================
       css/form-system.css'in TEK dayanağı. Panelin her yerindeki
       input / select / textarea / select2 / tokenfield / çoklu seçim
       widget'ları bu değerlerden besleniyor.

       Ölçümle tespit edilen sorun: aynı panelde 34px, 38px, 42px ve
       44px yüksekliğinde kontroller yan yana duruyordu; dolgu 5/9,
       9/14 ve 10/12 arasında değişiyordu; etiketler kimi ekranda
       14px normal gri, kiminde 13px BÜYÜK HARF, kiminde 12px koyu
       idi. Tek kaynağa bağlandı.

       Yükseklik neden 44px: 40px'in altı dokunmatik hedef için
       küçük, 48px kurumsal panelde fazla iri. 44px, WCAG 2.5.8'in
       önerdiği 44x44 hedefini de karşılıyor.
       ============================================================ */

    /* Kontrol gövdesi */
    --control-h: 44px;              /* standart yükseklik */
    --control-h-sm: 36px;           /* araç çubuğu / tablo içi kompakt */
    --control-pad-y: 10px;
    --control-pad-x: 14px;
    --control-radius: 10px;
    --control-fs: 14.5px;
    --control-border: #dcdfe8;      /* --line'dan bir tık koyu: kutu kenarı okunur olmalı */
    --control-bg: #ffffff;
    --control-bg-disabled: #f5f6f9;
    --control-placeholder: #a2a7bd;

    /* Odak halkası */
    --focus-ring: 0 0 0 4px rgba(79, 70, 229, .14);
    --focus-ring-danger: 0 0 0 4px rgba(220, 38, 38, .14);

    /* Etiket ve yardımcı metin */
    --label-fs: 13px;
    --label-weight: 600;
    --label-color: #3c4257;         /* saf siyah değil: başlıktan ayrışsın, gri kadar da soluk olmasın */
    --label-gap: 6px;               /* etiket ile kontrol arası */
    --hint-fs: 12.5px;
    --hint-gap: 6px;                /* kontrol ile yardımcı metin arası */

    /* Alanlar arası dikey boşluk */
    --field-gap: 20px;

}