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

html, body {
  font-family: "Inter", sans-serif;
}

body {
  background: var(--bg);
  color: var(--text-primary);
}

/* Theme */
:root {
  /* existing */
  --accent: #00796b;
  --accent-rgb: 0,121,107;
  --accent-dark: #00695c;

  /* NEW semantic tokens */
  --bg: #f6f7f8;
  --surface: #ffffff;
  --surface-muted: #f9fafb;

  --border: #e5e7eb;
  --border-subtle: #e6e9ed;

  --text-primary: #1e1e2f;
  --text-secondary: #64748b;
}

.theme-dark {
  --bg: #0f172a;            /* slate-900 */
  --surface: #111827;       /* gray-900 */
  --surface-muted: #0b1220;

  --border: #1f2933;
  --border-subtle: #1e293b;

  --text-primary: #e5e7eb;
  --text-secondary: #94a3b8;
}


.theme-teal {
  --accent: #00796b;
  --accent-rgb: 0,121,107;
  --accent-dark: #00695c;

  --bg: #f6f7f8;
  --text-primary: #1e1e2f;
}

.theme-green {
  --accent: #2e7d32;
  --accent-rgb: 46,125,50;
  --accent-dark: #1b5e20;

  --bg: #f6f7f8;
  --text-primary: #1e1e2f;
}

.theme-orange {
  --accent: #ff7a00;
  --accent-rgb: 255,122,0;
  --accent-dark: #e86b00;

  --bg: #f6f7f8;
  --text-primary: #1e1e2f;
}

.theme-blue {
  --accent: #1976d2;
  --accent-rgb: 25,118,210;
  --accent-dark: #1565c0;

  --bg: #f6f7f8;
  --text-primary: #1e1e2f;
}

/* Buttons */
.btn {
  background: var(--accent);
  color: #fff;
  border: none;
  padding: 8px 10px;
  border-radius: 6px;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(var(--accent-rgb), 0.25);
}

.btn.small { padding:6px 8px; font-size:.9rem; }
.btn.danger { background:#c62828; }

/* Utilities */
.muted { color:#9aa0c3; }
.small { font-size:.85rem; }

h1, h2, h3 {
  font-weight: 600;
}

button {
  font-weight: 500;
}

p, input {
  font-weight: 400;
}