/* Base Theme & Typography */

:root {
  /* Light theme colors */
  --bg-primary: #ffffff;
  --bg-surface: #f8f9fa;
  --bg-secondary: #f0f2f5;
  --text-primary: #1a1a1a;
  --text-secondary: #555555;
  --text-light: #888888;

  /* Brand colors */
  --brand-primary: #00274d;
  --brand-secondary: #00538a;
  --brand-light: #e8f1f7;

  /* Accent colors */
  --accent-gold: #ffd24a;
  --accent-gold-hover: #ffc107;
  --accent-gold-light: #fff5e1;

  /* Utility colors */
  --border-color: #e0e0e0;
  --border-light: #eeeeee;
  --shadow-light: rgba(0, 0, 0, 0.08);
  --shadow-medium: rgba(0, 0, 0, 0.12);

  --font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", sans-serif;
  --font-heading: "Segoe UI", "Roboto", sans-serif;
}

/* Dark Theme */
[data-theme="dark"] {
  --bg-primary: #0d1117;
  --bg-surface: #161b22;
  --bg-secondary: #21262d;
  --text-primary: #e6edf3;
  --text-secondary: #8b949e;
  --text-light: #6e7681;

  --brand-primary: #58a6ff;
  --brand-secondary: #79c0ff;
  --brand-light: rgba(88, 166, 255, 0.1);

  --accent-gold: #ffd24a;
  --accent-gold-hover: #ffc107;
  --accent-gold-light: rgba(255, 210, 74, 0.1);

  --border-color: #30363d;
  --border-light: #21262d;
  --shadow-light: rgba(0, 0, 0, 0.3);
  --shadow-medium: rgba(0, 0, 0, 0.5);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: var(--font-main);
  background: var(--bg-primary);
  color: var(--text-primary);
  line-height: 1.6;
  padding-top: 60px;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: var(--bg-surface);
}

::-webkit-scrollbar-thumb {
  background: var(--brand-secondary);
  border-radius: 5px;
  border: 2px solid var(--bg-surface);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--accent-gold);
}