/* ═══════════════════════════════════════════════════════════
   YORAI ADMIN — variables.css
   Todas as variáveis CSS do sistema.
   Login usa o primeiro bloco; Dashboard usa o segundo (ativado via JS).
═══════════════════════════════════════════════════════════ */

/* LOGIN VARS */
:root {
  --teal: #5CC8C2;
  --pink: #F4A7B9;
  --teal-light: #A8E4E1;
  --dark: #1A1A2E;
  --mid: #3D3D5C;
  --soft: #6B6B8A;
  --surface: #FFFFFF;
  --border: rgba(92,200,194,0.18);
  --border2: rgba(92,200,194,0.28);
  --text: #1A1A2E;
  --text2: #6B6B8A;
  --r: 16px;
  --accent-gradient: linear-gradient(135deg, var(--teal), var(--pink));
}

/* DASHBOARD VARS — sobrepostos quando dashboard-styles é ativado */
.dashboard-active :root,
#screen-dashboard ~ * {
  --teal: #5CC8C2;
  --pink: #F4A7B9;
  --teal-light: #A8E4E1;
  --pink-light: #FAD4DE;
  --dark: #0F0F1A;
  --mid: #1E1E30;
  --soft: #6B6B8A;
  --bg: #0F0F1A;
  --white: #161625;
  --surface: #1A1A2E;
  --surface2: #1E1E30;
  --surface3: #252538;
  --border: rgba(92,200,194,0.12);
  --border2: rgba(92,200,194,0.20);
  --text: #E8E8F0;
  --text2: #9090B0;
  --text3: #5A5A7A;
  --sidebar-w: 220px;
  --green: #22c55e;
  --red: #ef4444;
  --gold: #f59e0b;
  --blue: #3b82f6;
  --purple: #8b5cf6;
  --r: 16px;
  --accent-gradient: linear-gradient(135deg, var(--teal), var(--pink));
  --cta-gradient: linear-gradient(135deg, var(--teal), var(--teal-light));
}