:root {
  /* Light Theme (Default) */
  --bg-body: #f5f5f5;
  --bg-card: #ffffff;
  --bg-header: #24292f;
  --bg-sider: #f6f8fa;
  --bg-input: #ffffff;
  --bg-hover: #eaeef2;
  --bg-active: #d0ebff;
  --bg-select: #24292f; /* Header select bg */
  
  --primary-color: #0969da;

  --text-primary: #24292f;
  --text-secondary: #57606a;
  --text-inverse: #ffffff;
  --text-link: #0969da;
  
  --border-color: #d0d7de;
  --border-input: #d0d7de;
  --border-header: #57606a;
  
  --color-success: #1a7f37;
  --color-warning: #9a6700;
  --color-danger: #d1242f;
  
  --chart-line: #0ea5e9;
  --chart-area-start: rgba(56, 189, 248, 0.80);
  --chart-area-end: rgba(56, 189, 248, 0.2);
  
  --shadow-card: 0 1px 3px rgba(0,0,0,0.1);
  --shadow-login: 0 18px 45px rgba(15, 23, 42, 0.12);
}

:root.dark {
  /* Dark Theme */
  --bg-body: #0d1117;
  --bg-card: #161b22;
  --bg-header: #161b22;
  --bg-sider: #010409;
  --bg-input: #0d1117;
  --bg-hover: #21262d;
  --bg-active: #1f6feb33; /* Semi-transparent blue */
  --bg-select: #161b22;

  --primary-color: #58a6ff;

  --text-primary: #c9d1d9;
  --text-secondary: #8b949e;
  --text-inverse: #f0f6fc;
  --text-link: #58a6ff;
  
  --border-color: #30363d;
  --border-input: #30363d;
  --border-header: #30363d;
  
  --color-success: #3fb950;
  --color-warning: #d29922;
  --color-danger: #f85149;
  
  --chart-line: #38bdf8;
  --chart-area-start: rgba(56, 189, 248, 0.50);
  --chart-area-end: rgba(56, 189, 248, 0.1);
  
  --shadow-card: 0 1px 3px rgba(0,0,0,0.5);
  --shadow-login: 0 18px 45px rgba(0, 0, 0, 0.4);
}