/**
 * SIMFONI - tokens.css
 *
 * Design token SIMFONI. Berkas ini MEMBEKUKAN nilai yang sudah dipakai di
 * dalam kode, bukan menyeragamkannya. Tujuh "biru primer" yang bersaing tetap
 * tujuh — masing-masing hanya diberi nama agar dapat dirujuk dan dilacak.
 * Menyatukan nilai-nilai ini berarti mengubah desain, dan itu keputusan
 * tersendiri di luar lingkup refactor.
 *
 * @filename    tokens.css
 * @description Design token: warna, gradien, radius, dan bayangan SIMFONI
 * @author      Syams
 * @created     August 26, 2026
 * @license     SIMFONI Dual License (GPL v3 / Commercial)
 * @version     2.3
 * @project     SIMFONI - Sistem Informasi Monitoring dan Evaluasi Kearsipan
 */

:root {
  /* ── Gradien tanda tangan ─────────────────────────────────────────────── */
  --grad-brand:      linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --grad-uk:         linear-gradient(135deg, #3b82f6 0%, #1e40af 100%);
  --grad-up:         linear-gradient(135deg, #16a34a 0%, #15803d 100%);
  --grad-progress:   linear-gradient(135deg, #10b981 0%, #059669 100%);
  --grad-aspek:      linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
  --grad-readonly:   linear-gradient(135deg, #64748b 0%, #475569 100%);
  --grad-explorer:   linear-gradient(135deg, #4285f4 0%, #34a853 100%);
  --grad-beranda:    linear-gradient(120deg, #3491fa 0%, #30b99a 100%);
  --grad-placeholder:linear-gradient(135deg, #6c757d, #495057);

  /* ── Biru per konteks (sengaja TIDAK disatukan) ───────────────────────── */
  --blue-eval:    #3b82f6;   /* form & instrumen evaluasi  (Tailwind blue-500) */
  --blue-eval-dk: #1e40af;
  --blue-brand:   #667eea;   /* kepala modul               (indigo kustom)     */
  --purple-brand: #764ba2;
  --blue-google:  #4285f4;   /* explorer, login lama       (Google Blue)       */
  --green-google: #34a853;
  --blue-bs4:     #007bff;   /* sisa Bootstrap 4                              */
  --blue-bs5:     #0d6efd;   /* primary Bootstrap 5                           */
  --blue-beranda: #3491fa;
  --teal-beranda: #30b99a;
  --blue-mui:     #1976d2;   /* treeview terpilih          (Material 700)      */

  /* ── Kerangka aplikasi ────────────────────────────────────────────────── */
  --navbar-bg:    #012238;
  --dropdown-bg:  #e0f2ff;
  --dropdown-fg:  #1e3a8a;
  --dropdown-hv:  #cce7ff;
  --wrapper-border: rgba(30, 58, 138, 0.10);   /* garis rambut, bukan bingkai */

  /* Selubung kotak isi. Sengaja TIDAK legap: corak batik pada latar <body>
     dan arus warna di baliknya harus tembus samar, tetapi tetap cukup pekat
     agar teks di atasnya terbaca tanpa kartu putih di bawahnya. */
  --content-veil-top:    rgba(255, 255, 255, 0.82);
  --content-veil-bottom: rgba(236, 246, 255, 0.62);

  /* Arus warna dilukis DI BALIK selubung di atas (lihat simfoni.css), jadi
     yang sampai ke mata hanya sisa yang lolos — sekitar seperlima nilai di
     sini. Karena itu alfanya tampak tinggi untuk sebuah lapisan hias. */
  --content-arus-biru:   rgba(52, 145, 250, 0.55);   /* --blue-beranda */
  --content-arus-toska:  rgba(48, 185, 154, 0.45);   /* --teal-beranda */
  --content-arus-ungu:   rgba(118, 75, 162, 0.30);   /* --purple-brand */

  /* ── Warna semantik ───────────────────────────────────────────────────── */
  --c-success:  #28a745;
  --c-warning:  #ffc107;
  --c-danger:   #dc3545;
  --c-info:     #17a2b8;
  --c-muted:    #6c757d;
  --c-muted-dk: #495057;

  /* ── Skala level penilaian RHAS ───────────────────────────────────────── */
  --level-0-bg: #fee2e2; --level-0-fg: #dc2626;
  --level-1-bg: #fef3c7; --level-1-fg: #d97706;
  --level-2-bg: #dbeafe; --level-2-fg: #2563eb;
  --level-3-bg: #dcfce7; --level-3-fg: #16a34a;
  --level-4-bg: #e0e7ff; --level-4-fg: #7c3aed;
  --level-5-bg: #f3e8ff; --level-5-fg: #9333ea;

  /* ── Lencana status dokumen ───────────────────────────────────────────── */
  --st-draft-bg:     #fef3c7; --st-draft-fg:     #d97706;
  --st-submitted-bg: #dbeafe; --st-submitted-fg: #2563eb;
  --st-reviewed-bg:  #dcfce7; --st-reviewed-fg:  #16a34a;
  --st-approved-bg:  #d1fae5; --st-approved-fg:  #059669;
  --st-rejected-bg:  #fee2e2; --st-rejected-fg:  #dc2626;

  /* ── Radius per konteks (nilai eksisting, bukan skala baru) ───────────── */
  --radius-input:   6px;
  --radius-card:    8px;
  --radius-stat:   10px;
  --radius-panel:  12px;
  --radius-wrapper:15px;
  --radius-hero:   16px;
  --radius-pill:   20px;
  --radius-login:  24px;

  /* ── Bayangan yang berulang ───────────────────────────────────────────── */
  --shadow-card:    0 2px 10px rgba(0, 0, 0, .1);
  --shadow-soft:    0 3px 12px #bdd6fa33;
  --shadow-hover:   0 8px 32px #3491fa22;
  /* Bayangan kerangka utama disusun berlapis, bukan satu embusan gelap:
     lapis sentuh yang rapat menegaskan tepi, dua lapis tengah memberi angkat,
     dan satu lapis dalam yang lebar melebur ke latar. Rona dibuat kebiruan
     (12, 34, 74) — senada --navbar-bg — agar bayangan terasa sewarna
     halaman, bukan abu-abu netral yang mengotori latar bercorak. */
  --shadow-wrapper:
    0 1px 1px rgba(12, 34, 74, .05),
    0 4px 8px -2px rgba(12, 34, 74, .06),
    0 12px 24px -8px rgba(12, 34, 74, .09),
    0 32px 64px -24px rgba(12, 34, 74, .22);
  --shadow-login:   0 30px 60px rgba(0, 0, 0, .12), 0 20px 40px rgba(0, 0, 0, .08);
  --focus-eval:     0 0 0 3px rgba(59, 130, 246, .1);

  /* ── Latar netral ─────────────────────────────────────────────────────── */
  --bg-page:    #e0f7fa;
  --bg-soft:    #f8f9fa;
  --bg-softer:  #f8fafc;
  --border-soft:#dee2e6;
  --border-line:#e9ecef;
}