/*
  Tokens de marca, partilhados pelo design-system.html, pelo institucional e pelo App (DEC-009, DEC-012).
  Fonte de verdade: docs/design-system/produto/tokens.md — bloco ":root" canónico.
  Semânticos que só o produto usa (sucesso/alerta/erro, dimensões de campo) ficam em produto.css.
*/

:root {
  /* Primárias */
  --color-blue: #477FEC;
  --color-red: #FB4A42;

  /* Superfícies sólidas com texto branco — confirmado (A2, 2026-07-30) */
  --color-blue-surface: #3270EA;
  --color-blue-surface-hover: #1E5AD0;
  --color-red-surface: #EC0F05;
  --color-red-surface-hover: #D9231B;

  /* Texto e ícones */
  --color-text-primary: #131313;
  --color-text-secondary: #6B6B6B;
  --color-text-tertiary: #363636;
  --color-red-text: #A60B04;
  --color-blue-text: #134AB5;
  --color-tooltip: #4C4C5C;

  /* Neutros */
  --color-white: #FFFFFF;
  --color-bg: #F2F2F2;
  --color-border-divider: #D6D6D6;
  --color-border-input: #6B6B6B;
  --color-border-control: #8B8B8B;

  /* Foco */
  --color-focus: #477FEC;
  --focus-ring-width: 1px;

  /* Informativo — partilhado pelas duas superfícies (site: painel de carreira, faixa de newsletter) */
  --color-info-bg: #E5F0FF;
  --color-info-text: #003B91;

  /* Espaçamento */
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 32px;
  --space-xl: 48px;

  /* Raios */
  --radius-sm: 5px;
  --radius-md: 8px;
  --radius-lg: 20px;
  --radius-pill: 999px;

  /* Tipografia */
  --font-display: 'Funnel Display', sans-serif;
  --font-heading: 'Instrument Sans', sans-serif;
  --font-body: Arial, sans-serif;

  --text-h1: 500 22px var(--font-display);
  --text-h2: 600 16px var(--font-heading);
  --text-h3: 700 14px var(--font-body);
  --text-h4: 400 14px var(--font-body);

  --shadow-overlay: 0 4px 16px rgba(0, 0, 0, .08);
}