/* ══════════════════════════════════════════════════════════════════
   ALINT ERP — alint-tokens.css
   Tokens de design: variáveis, temas, reset, body, animações.
   Extraído de shell.css — conteúdo 100% original, zero alterações.
   ══════════════════════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ── Tokens de design ──────────────────────────────────────────── */
:root {
  --font-head:   'Syne', sans-serif;
  --font-body:   'DM Sans', sans-serif;
  --sidebar-w:   240px;
  --sidebar-w-c: 64px;
  --topbar-h:    52px;
  --tabs-h:      38px;
  --radius:      10px;
  --radius-sm:   7px;
  --shadow:      0 2px 16px rgba(0,0,0,.08);
  --shadow-lg:   0 8px 32px rgba(0,0,0,.14);
  --transition:  .22s cubic-bezier(.4,0,.2,1);
}

/* ── Tema claro ────────────────────────────────────────────────── */
[data-theme="light"] {
  --bg:           #F0F4F8;
  --bg-2:         #E8EEF5;
  --surface:      #FFFFFF;
  --surface-2:    #F8FAFC;
  --border:       #E2E8F0;
  --border-2:     #CBD5E1;
  --text:         #0F172A;
  --text-2:       #475569;
  --text-3:       #94A3B8;
  --primary:      #2563EB;
  --primary-2:    #1D4ED8;
  --primary-bg:   #EFF6FF;
  --primary-text: #1D4ED8;
  --danger:       #DC2626;
  --success:      #16A34A;
  --warning:      #D97706;
  --sidebar-bg:   #0F1E3C;
  --sidebar-txt:  rgba(255,255,255,.65);
  --sidebar-act:  rgba(255,255,255,.10);
  --sidebar-hov:  rgba(255,255,255,.06);
}

/* ── Tema escuro ───────────────────────────────────────────────── */
[data-theme="dark"] {
  --bg:           #0A0F1E;
  --bg-2:         #0F1729;
  --surface:      #131E35;
  --surface-2:    #1A2640;
  --border:       rgba(255,255,255,.07);
  --border-2:     rgba(255,255,255,.12);
  --text:         #F1F5F9;
  --text-2:       #94A3B8;
  --text-3:       #475569;
  --primary:      #3B82F6;
  --primary-2:    #2563EB;
  --primary-bg:   rgba(59,130,246,.12);
  --primary-text: #93C5FD;
  --danger:       #F87171;
  --success:      #4ADE80;
  --warning:      #FCD34D;
  --sidebar-bg:   #0B1629;
  --sidebar-txt:  rgba(255,255,255,.55);
  --sidebar-act:  rgba(59,130,246,.15);
  --sidebar-hov:  rgba(255,255,255,.04);
}

body {
  font-family: var(--font-body);
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  overflow: hidden;
}

/* ══ ANIMAÇÕES ═════════════════════════════════════════════════ */
@keyframes fadeIn   { from { opacity: 0; }                           to { opacity: 1; } }
@keyframes dropIn   { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideUp  { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes shimmer  { 0% { background-position: -200% 0; }          100% { background-position: 200% 0; } }
@keyframes toastIn  { from { opacity: 0; transform: translateX(20px); } }
@keyframes toastOut { to   { opacity: 0; transform: translateX(20px); } }
@keyframes spin     { to   { transform: rotate(360deg); } }