/* =========================================
 * PREPPY CSS – DESIGN TOKENS v2
 * Pode ser usado por qualquer página (login, dashboard, etc.)
 * ========================================= */

:root {
  /* ===== Dark surfaces ===== */
  --preppy-color-bg-900: #020617; /* page */
  --preppy-color-bg-800: #02081a; /* surface principal */
  --preppy-color-bg-700: #0b1220; /* cartas / blocos */

  /* ===== Brand primary (Preppy Blue) ===== */
  --preppy-color-primary-400: #4f7cff;
  --preppy-color-primary-500: #3b57f4;
  --preppy-color-primary-600: #2732c9;

  /* ===== Accent (Preppy Green) ===== */
  --preppy-color-accent-400: #3fffa8;
  --preppy-color-accent-500: #39e68f;
  --preppy-color-accent-600: #16a34a;

  /* ===== Semantic ===== */
  --preppy-color-danger-500: #ef4444;
  --preppy-color-danger-soft: rgba(239, 68, 68, 0.16);
  --preppy-color-warning-500: #facc15;
  --preppy-color-info-500: #38bdf8;

  /* ===== Neutros premium ===== */
  --preppy-neutral-100: #e5e7eb;
  --preppy-neutral-200: #cbd5f5;
  --preppy-neutral-300: #9ca3af;
  --preppy-neutral-400: #6b7280;
  --preppy-neutral-500: #4b5563;
  --preppy-neutral-600: #374151;

  /* ===== Radius & elevation ===== */
  --preppy-radius-lg: 22px;
  --preppy-radius-md: 12px;
  --preppy-radius-pill: 999px;
  --preppy-shadow-card: 0 25px 70px rgba(15, 23, 42, 0.9);

  /* ===== LEGACY ALIASES (backwards compat) ===== */
  --preppy-bg-page: var(--preppy-color-bg-900);
  --preppy-bg-surface: var(--preppy-color-bg-800);
  --preppy-bg-soft: var(--preppy-color-bg-700);
  --preppy-bg-alt: #000000;
  --preppy-border-soft: rgba(148, 163, 184, 0.35);

  --preppy-text-main: var(--preppy-neutral-100);
  --preppy-text-soft: var(--preppy-neutral-300);
  --preppy-text-softer: var(--preppy-neutral-400);

  --preppy-accent: var(--preppy-color-accent-500);
  --preppy-accent-soft: rgba(57, 230, 143, 0.14);
  --preppy-accent-strong: var(--preppy-color-accent-600);

  --preppy-danger: var(--preppy-color-danger-500);
  --preppy-danger-soft: var(--preppy-color-danger-soft);
}