/* =====================================================================
   HIMBA Forest & Fire Patrol — Design Token Layer (SATU SUMBER TEMA)
   ---------------------------------------------------------------------
   File ini adalah SATU-SATUNYA tempat mendefinisikan warna brand, radius,
   bayangan, dan tipografi aplikasi. Semua stylesheet lain (auth.css,
   admin.css, schedule-sync.css, app-shell.css) HARUS memakai var(--...)
   dari sini, bukan menulis ulang nilai hex.

   Nilai di bawah diambil PERSIS dari palet #_v4 yang sudah dipakai
   (bukan warna baru), sehingga migrasi v4 -> v5 tidak mengubah tampilan.

   Cara mengganti tema: ubah nilai di blok :root ini saja.
   Aturan lengkap ada di CLAUDE.md bagian "Aturan Tema".
   ===================================================================== */

:root {
  color-scheme: light;

  /* --- Brand: hijau hutan -------------------------------------------- */
  --brand:            #1b7864;  /* aksi utama, tautan, fokus              */
  --brand-strong:     #155045;  /* hover / gradien tengah                 */
  --brand-deep:       #0d332d;  /* gradien paling gelap, panel hero       */
  --brand-soft:       #1a6858;  /* gradien terang pada hero               */
  --brand-tint:       #dce8e2;  /* latar chip / border lembut             */
  --brand-wash:       #eaf8f2;  /* latar status positif                   */

  /* --- Aksen: amber (peringatan lunak, highlight) --------------------- */
  --accent:           #f1b34f;
  --accent-strong:    #f1ae41;
  --accent-deep:      #d99520;
  --accent-wash:      #fff9ed;

  /* --- Status ------------------------------------------------------- */
  --danger:           #c84e42;
  --danger-strong:    #8c3026;
  --danger-wash:      #fff5f3;
  --success:          #1d806b;
  --success-wash:     #f2fbf6;

  /* --- Teks --------------------------------------------------------- */
  --ink:              #17342e;  /* teks utama                            */
  --ink-soft:         #29473f;  /* teks sekunder gelap                   */
  --ink-muted:        #718078;  /* label, keterangan                     */
  --ink-invert:       #f7fbf8;  /* teks di atas latar gelap              */

  /* --- Permukaan ---------------------------------------------------- */
  --white:            #ffffff;
  --surface:          #ffffff;  /* kartu, panel                          */
  --surface-page:     #eaf0ec;  /* latar halaman                         */
  --surface-sunken:   #f4f6f3;  /* baris tabel, area tenggelam           */
  --line:             #dce9e2;  /* garis pemisah                         */
  --line-strong:      #cdd8d4;

  /* --- Bentuk ------------------------------------------------------- */
  --radius-sm:        7px;
  --radius-md:        9px;
  --radius-lg:        14px;
  --radius-xl:        28px;

  /* --- Bayangan ----------------------------------------------------- */
  --shadow-sm:        0 2px 8px rgba(19, 49, 41, .13);
  --shadow-md:        0 6px 20px rgba(19, 49, 41, .12);
  --shadow-lg:        0 28px 80px rgba(19, 49, 41, .17), 0 3px 10px rgba(19, 49, 41, .07);

  /* --- Tipografi ---------------------------------------------------- */
  --font-sans:        Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:        ui-monospace, SFMono-Regular, "Cascadia Mono", Consolas, monospace;


  /* --- App shell / badge akun di atas dashboard ----------------------- */
  --shell-badge-border:  #d6d6d2;
  --shell-badge-bg:      var(--white);
  --shell-badge-ink:     #222222;
  --shell-badge-meta:    #666666;
  --shell-badge-link:    #176354;
  --shell-badge-danger:  #a12828;
  --shell-badge-divider: #dddddd;

  /* --- Banner peringatan sistem --------------------------------------- */
  --warn-bg:     #fff4d6;
  --warn-border: #e0b451;
  --warn-ink:    #6b4a05;

  /* --- Ukuran badge / shell ----------------------------------------- */
  /* Bar utilitas saat berada DI DALAM #app-nav (latar hijau tua #123f37).
     Ditambahkan 17 Agustus 2026 bersama perbaikan gaya bar atas. */
  --topbar-hover-bg:  rgba(247, 251, 248, .14);
  --topbar-chip-bg:   rgba(247, 251, 248, .10);
  --topbar-chip-line: rgba(247, 251, 248, .30);
  --badge-min-height: 44px;
}
