/* =========================================================================
   DESIGN SYSTEM — TOKENS
   Bawamai LMS

   File ini adalah SATU-SATUNYA tempat mendefinisikan warna, font, spacing,
   radius, dan shadow. Jangan hardcode hex color / font-family di file blade
   manapun — selalu pakai variabel di sini (var(--color-primary), dst),
   supaya ganti tema di masa depan cukup edit 1 file ini saja.

   Filosofi: hijau sebagai identitas sekolah, dihangatkan dengan krem &
   kuning supaya ramah untuk 2 kelompok pengguna utama: siswa SD (butuh
   visual besar, ceria, mudah dikenali) dan guru senior (butuh kontras
   tinggi, teks besar, target klik besar, navigasi jelas).
   ========================================================================= */

:root {
  /* --- WARNA: HIJAU (Brand/Primary) --- */
  --color-primary: #1F7A4D;        /* Hijau daun - tombol utama, link, ikon aktif */
  --color-primary-dark: #0D3B26;   /* Hijau tua - heading, teks penekanan */
  --color-primary-light: #E8F3EC;  /* Tint hijau sangat muda - hover, background lembut */
  --color-primary-hover: #17603C;  /* Hover state tombol primary */

  /* --- WARNA: KUNING (Aksen ceria, ramah anak) --- */
  --color-accent: #F4B740;
  --color-accent-soft: #FFF3D6;
  --color-accent-dark: #B9820E;    /* Untuk teks di atas background kuning (kontras) */

  /* --- WARNA: TERRACOTTA (Peringatan/notifikasi, dipakai TERBATAS) --- */
  --color-warm: #E85D3D;
  --color-warm-soft: #FDE7E0;

  /* --- WARNA: NETRAL & PERMUKAAN --- */
  --color-bg: #FAF7F0;             /* Background halaman - krem hangat, bukan putih polos */
  --color-surface: #FFFFFF;        /* Kartu, modal, permukaan konten */
  --color-surface-alt: #F3EFE4;    /* Permukaan sekunder (mis. striped table) */
  --color-ink: #2B2B26;            /* Teks utama - hitam hangat, bukan #000 pekat */
  --color-ink-soft: #6B6B63;       /* Teks sekunder/muted */
  --color-ink-faint: #A8A499;      /* Placeholder, teks sangat pudar */
  --color-border: #E8E3D8;         /* Border halus, warm */
  --color-border-strong: #D8D2C2;

  /* --- WARNA STATUS --- */
  --color-success: #1F7A4D;
  --color-success-soft: #E8F3EC;
  --color-danger: #D6483B;
  --color-danger-soft: #FBE4E1;
  --color-info: #2F80A8;
  --color-info-soft: #E2F0F6;
  --color-warning: #B9820E;
  --color-warning-soft: #FFF3D6;

  /* --- TIPOGRAFI --- */
  --font-display: "Baloo 2", "Nunito", sans-serif;  /* Judul/heading - rounded, hangat, ramah anak */
  --font-body: "Nunito", sans-serif;                 /* Isi teks - sangat mudah dibaca lintas usia */

  /* Skala ukuran teks - sengaja dibuat LEBIH BESAR dari default web biasa,
     karena target pengguna termasuk lansia (guru) & anak yang baru belajar baca. */
  --text-xs: 0.8125rem;   /* 13px - caption, label kecil */
  --text-sm: 0.9375rem;   /* 15px - teks sekunder */
  --text-base: 1.0625rem; /* 17px - teks isi utama (bukan 16px standar) */
  --text-lg: 1.25rem;     /* 20px - subheading, teks penting */
  --text-xl: 1.5rem;      /* 24px - heading kecil */
  --text-2xl: 1.875rem;   /* 30px - heading section */
  --text-3xl: 2.25rem;    /* 36px - heading halaman */
  --text-4xl: 3rem;       /* 48px - hero title */

  /* --- SPACING (skala 4px) --- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;

  /* --- RADIUS ---
     Signature bentuk: sudut asimetris (leaf-shape) dipakai KHUSUS pada kartu
     utama/hero untuk kesan "daun/tumbuh" yang halus, tidak dipakai di semua
     elemen (biar tidak berlebihan). Elemen biasa pakai radius simetris. */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-full: 999px;
  --radius-leaf: 28px 16px 28px 16px; /* signature shape - kartu hero/unggulan */

  /* --- SHADOW (selalu warm-tinted, bukan abu-abu netral) --- */
  --shadow-sm: 0 2px 8px rgba(13, 59, 38, 0.06);
  --shadow-md: 0 8px 24px rgba(13, 59, 38, 0.10);
  --shadow-lg: 0 16px 40px rgba(13, 59, 38, 0.14);
  --shadow-focus: 0 0 0 4px rgba(31, 122, 77, 0.25);

  /* --- UKURAN TARGET SENTUH (aksesibilitas: anak & lansia) --- */
  --tap-target-min: 44px;

  /* --- TRANSISI --- */
  --transition-fast: 0.15s ease;
  --transition-base: 0.25s ease;
}