/* ============================================================
   variables.css — Tokens de design da plataforma Projetos 123
   Altere aqui para mudar toda a identidade visual de uma vez.
   ============================================================ */

:root {
  /* ── Backgrounds ───────────────────────────────────────── */
  --bg-page:       #0b0b14;
  --bg-surface:    #12121f;
  --bg-card:       #181828;
  --bg-card-hover: #1e1e35;
  --bg-input:      #0f0f1e;

  /* ── Marca / Primária ──────────────────────────────────── */
  --primary:       #6c63ff;
  --primary-dark:  #5a52e0;
  --primary-light: #8b85ff;
  --primary-glow:  rgba(108, 99, 255, 0.15);

  /* ── Acento tecnológico ────────────────────────────────── */
  --accent:        #00c2ff;
  --accent-dark:   #007bcc;
  --accent-glow:   rgba(0, 194, 255, 0.12);

  /* ── Status ────────────────────────────────────────────── */
  --success:  #10b981;
  --warning:  #f59e0b;
  --danger:   #ef4444;
  --info:     #3b82f6;

  /* ── Bordas ────────────────────────────────────────────── */
  --border:       #232338;
  --border-light: #2e2e50;

  /* ── Texto ─────────────────────────────────────────────── */
  --text-primary:   #e2e8f0;
  --text-secondary: #94a3b8;
  --text-muted:     #5a6a82;

  /* ── Layout ────────────────────────────────────────────── */
  --sidebar-w: 240px;
  --topbar-h:  64px;

  /* ── Bordas arredondadas ───────────────────────────────── */
  --radius-sm: 8px;
  --radius:    12px;
  --radius-lg: 16px;
  --radius-xl: 24px;

  /* ── Sombras ───────────────────────────────────────────── */
  --shadow:         0 4px 20px rgba(0, 0, 0, 0.45);
  --shadow-primary: 0 4px 24px rgba(108, 99, 255, 0.28);
  --shadow-card:    0 2px 12px rgba(0, 0, 0, 0.3);

  /* ── Transições ────────────────────────────────────────── */
  --t:      0.2s ease;
  --t-slow: 0.35s ease;
}
