/* ============================================================
   Token warna halaman publik (login, pusat bantuan, portal,
   penilaian, widget) — palet yang sama dengan aplikasi agent dan
   app Manage. Satu sumber: ubah warna di sini, bukan di tiap halaman.
   Halaman publik mengikuti tema sistem pengunjung (tanpa tombol tema).
   Aksen dua peran: --primary untuk teks/tautan/garis, --primary-fill
   untuk latar pekat bertulisan putih (tombol).
   ============================================================ */
:root {
  color-scheme: light dark;
  --primary: #17843f;
  --primary-fill: #1d8f47;
  --primary-hover: #187c3d;
  --primary-soft: rgba(29, 143, 71, .11);
  --bg: #f5f5f7;
  --surface: #ffffff;
  --surface-2: #f5f5f7;
  --fill: rgba(118, 118, 128, .12);
  --fill-2: rgba(118, 118, 128, .20);
  --border: rgba(60, 60, 67, .16);
  --text: #1d1d1f;
  --text-2: #6e6e73;
  --text-3: #8e8e93;
  --success: #17843f; --success-soft: rgba(29, 143, 71, .11);
  --warning: #b25f00; --warning-soft: rgba(255, 149, 0, .14);
  --danger: #d92d20;  --danger-soft: rgba(255, 59, 48, .11);
  --neutral: #6e6e73; --neutral-soft: rgba(118, 118, 128, .12);
  --shadow-sm: 0 1px 1px rgba(0, 0, 0, .03), 0 1px 3px rgba(0, 0, 0, .04);
  --shadow-md: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .04), 0 4px 18px rgba(0, 0, 0, .045);
  --shadow-lg: 0 0 0 .5px rgba(0, 0, 0, .05), 0 12px 48px rgba(0, 0, 0, .16), 0 2px 10px rgba(0, 0, 0, .06);
  --radius: 12px;
  /* Pendaran aksen lembut di atas halaman — pengganti latar gradien penuh */
  --glow: radial-gradient(1200px 600px at 50% -120px, color-mix(in srgb, var(--primary) 16%, transparent), transparent 70%);
}
@media (prefers-color-scheme: dark) {
  :root {
    --primary: #4cd97b;
    --primary-fill: #248a47;
    --primary-hover: #2b9a52;
    --primary-soft: rgba(48, 209, 88, .16);
    --bg: #000000;
    --surface: #1c1c1e;
    --surface-2: #2c2c2e;
    --fill: rgba(118, 118, 128, .24);
    --fill-2: rgba(118, 118, 128, .36);
    --border: rgba(84, 84, 88, .6);
    --text: #f5f5f7;
    --text-2: #a1a1a6;
    --text-3: #7c7c80;
    --success: #4cd97b; --success-soft: rgba(48, 209, 88, .16);
    --warning: #ffb340; --warning-soft: rgba(255, 159, 10, .18);
    --danger: #ff6961;  --danger-soft: rgba(255, 69, 58, .18);
    --neutral: #a1a1a6; --neutral-soft: rgba(118, 118, 128, .24);
    --shadow-sm: none;
    --shadow-md: 0 0 0 .5px rgba(255, 255, 255, .08);
    --shadow-lg: 0 0 0 .5px rgba(255, 255, 255, .10), 0 16px 60px rgba(0, 0, 0, .6);
  }
}
/* Kolom isian ikut tema (halaman menentukan bentuknya sendiri) */
input, textarea, select { background-color: var(--surface-2); color: var(--text); }
input:focus, textarea:focus, select:focus { background-color: var(--surface); box-shadow: 0 0 0 4px var(--primary-soft); }
::placeholder { color: var(--text-3); opacity: 1; }