/* MH2EDU Teste Usuario — tokens alinhados ao MH2EDU-NEXT. */

:root,
[data-theme="dark"] {
  --bg: #1a1a2e;
  --bg-accent: #16213e;
  --chrome: #10101a;
  --surface: #22243a;
  --surface-2: #1a1f3a;
  --text: #e0e0e0;
  --muted: #a0a0a0;
  --faint: #8a93a8;
  --accent: #00aaff;
  --accent-hover: #0080cc;
  --accent-text: #ffffff;
  --accent-soft: rgba(0, 170, 255, 0.16);
  --ok: #2a9d8f;
  --ok-soft: rgba(42, 157, 143, 0.18);
  --warn: #f59e0b;
  --warn-soft: rgba(245, 158, 11, 0.18);
  --danger: #e63946;
  --danger-soft: rgba(230, 57, 70, 0.18);
  --info: #6fb7ff;
  --info-soft: rgba(111, 183, 255, 0.16);
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.16);
  --modal-card: var(--surface);
  --modal-card-h: var(--surface-2);
  --shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  --overlay: rgba(0, 0, 0, 0.6);
  --header-h: 60px;
  --sidebar-w: 228px;
  --sidebar-collapsed: 56px;
  --radius: 12px;
  --radius-sm: 8px;
  --focus: 0 0 0 3px rgba(0, 170, 255, 0.32);
  --font: "Figtree", "Segoe UI", system-ui, sans-serif;
}

[data-theme="light"] {
  --bg: #f0f2f5;
  --bg-accent: #dbeafe;
  --chrome: #ffffff;
  --surface: #ffffff;
  --surface-2: #f8f9fb;
  --text: #1a1a2e;
  --muted: #6b7280;
  --faint: #9ca3af;
  --accent: #00aaff;
  --accent-hover: #0080cc;
  --accent-text: #ffffff;
  --accent-soft: rgba(0, 170, 255, 0.12);
  --ok: #059669;
  --ok-soft: rgba(5, 150, 105, 0.14);
  --warn: #d97706;
  --warn-soft: rgba(217, 119, 6, 0.16);
  --danger: #dc2626;
  --danger-soft: rgba(220, 38, 38, 0.14);
  --info: #00aaff;
  --info-soft: rgba(0, 170, 255, 0.12);
  --border: rgba(0, 0, 0, 0.08);
  --border-strong: rgba(0, 0, 0, 0.16);
  --modal-card: var(--surface);
  --modal-card-h: var(--surface-2);
  --shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  --overlay: rgba(0, 0, 0, 0.35);
  --focus: 0 0 0 3px rgba(0, 170, 255, 0.28);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}

a {
  color: var(--accent);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

:focus-visible {
  outline: none;
  box-shadow: var(--focus);
}
