/* =========================================================
   4Body — Design Tokens
   Fonte das cores: /Paleta de Cores.json
   Fonte provisória: Inter (trocar definindo --font-family)
   ========================================================= */

:root {
  /* ---- brand ---- */
  --brand-primary: #256BFF;
  --brand-secondary: #3C3E44;
  --brand-tertiary: #FFFFFF;
  --brand-alternate: #6B6D71;

  /* ---- text ---- */
  --text-primary: #403D3F;
  --text-secondary: #A9B1B8;

  /* ---- background ---- */
  --bg-primary: #262D34;
  --bg-secondary: #E0E5E9;

  /* ---- accent ---- */
  --accent-1: #A66FE6;
  --accent-2: #A5ABB1;
  --accent-3: #4274EA;
  --accent-4: #848382;

  /* ---- semantic ---- */
  --success: #6BBD78;
  --error: #F83B46;
  --warning: #ECC44B;
  --info: #F1F4F8;

  /* ---- liquid glass ---- */
  --glass-dark-bg: #171A1F;
  --glass-surface: #262D34;
  --glass-border-opacity: 0.16;
  --glass-blur: 16px;
  --glass-glow: #256BFF;

  /* ---- superfícies derivadas (tema escuro do app) ---- */
  --on-surface: #F1F4F8;          /* texto principal sobre fundo escuro */
  --on-surface-muted: #A9B1B8;    /* texto secundário */
  --line: rgba(255, 255, 255, 0.10);

  /* ---- tipografia ---- */
  --font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --fs-xs: 12px;
  --fs-sm: 14px;
  --fs-md: 16px;
  --fs-lg: 20px;
  --fs-xl: 26px;
  --fs-2xl: 34px;

  /* ---- raios ---- */
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 26px;
  --radius-pill: 999px;

  /* ---- sombras / brilho ---- */
  --shadow-soft: 0 12px 34px rgba(0, 0, 0, 0.38);
  --shadow-card: 0 8px 24px rgba(0, 0, 0, 0.28);
  --glow-primary: 0 0 32px rgba(37, 107, 255, 0.40);

  /* ---- espaçamento ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
}
