/* ===== TRACKPO — DESIGN SYSTEM v2 (Hijau/Light) ===== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@500;600&display=swap');

:root {
  --font: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  /* Primary hijau */
  --primary: #16A34A;
  --primary-dark: #128A3E;
  --primary-darker: #0E2E22;
  --primary-light: rgba(22, 163, 74, 0.1);
  --primary-border: rgba(22, 163, 74, 0.22);

  /* Semantic */
  --green: #16A34A;
  --green-light: rgba(22, 163, 74, 0.1);
  --red: #E24444;
  --red-light: rgba(226, 68, 68, 0.1);
  --orange: #D97706;
  --orange-light: rgba(217, 119, 6, 0.1);
  --blue: #3B82F6;
  --blue-light: rgba(59, 130, 246, 0.1);

  /* Gold accent (kekal untuk badge/highlight khas) */
  --gold: #B8923F;
  --gold-light: rgba(184, 146, 63, 0.1);
  --gold-border: rgba(184, 146, 63, 0.2);

  /* Layout */
  --sidebar-w: 84px;
  --nav-h: 68px;
  --header-h: 72px;
  --content-gap: 28px;
}

/* ===== LIGHT THEME (default) ===== */
:root, [data-theme="light"] {
  --bg: #EDEEEA;
  --bg-card: #FFFFFF;
  --bg-card-hover: #FAFAF8;
  --bg-input: #FFFFFF;
  --bg-sidebar: #F0F1EC;

  --text-primary: #10231B;
  --text-secondary: #6B7A72;
  --text-tertiary: #A3ADA4;

  --border: rgba(16, 35, 27, 0.07);
  --border-strong: rgba(16, 35, 27, 0.12);

  --shadow-sm: 0 2px 8px rgba(16, 35, 27, 0.05);
  --shadow-md: 0 6px 20px rgba(16, 35, 27, 0.08);
  --shadow-lg: 0 16px 40px rgba(16, 35, 27, 0.14);
}

/* ===== DARK THEME ===== */
[data-theme="dark"] {
  --bg: #0D1712;
  --bg-card: #152620;
  --bg-card-hover: #1A2E27;
  --bg-input: #0D1712;
  --bg-sidebar: #11201A;

  --text-primary: #EDF5F0;
  --text-secondary: #8FA599;
  --text-tertiary: #56685E;

  --border: rgba(74, 222, 128, 0.12);
  --border-strong: rgba(74, 222, 128, 0.2);

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
}