/* ============================================================
   THEME.CSS — Variabel warna, tipografi, dan tema gelap/terang
   ============================================================ */
:root {
  --primary: #2563EB;
  --primary-dark: #1D4ED8;
  --secondary: #0EA5E9;
  --success: #10B981;
  --warning: #F59E0B;
  --danger: #EF4444;

  --bg: #F8FAFC;
  --card: #FFFFFF;
  --text: #0F172A;
  --text-muted: #64748B;
  --border: #E2E8F0;

  --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.12);

  --radius: 16px;
  --radius-sm: 10px;
  --radius-full: 999px;

  --glass-bg: rgba(255, 255, 255, 0.7);
  --glass-border: rgba(255, 255, 255, 0.4);

  --font-base: 'Poppins', system-ui, -apple-system, sans-serif;

  --header-height: 4.5rem;
}

[data-theme="dark"] {
  --bg: #0B1220;
  --card: #131C2E;
  --text: #E5E9F0;
  --text-muted: #94A3B8;
  --border: #253044;

  --glass-bg: rgba(19, 28, 46, 0.7);
  --glass-border: rgba(255, 255, 255, 0.08);

  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.45);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-base);
  background: var(--bg);
  color: var(--text);
  font-size: 1rem;
  line-height: 1.6;
  transition: background 0.25s ease, color 0.25s ease;
  min-height: 100vh;
}

img { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; }

::selection { background: var(--primary); color: #fff; }

/* Scrollbar tipis modern */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: var(--radius-full); }
::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }