/* JP Projects — tokens de design (Frente E da revitalização, 09/10/2026).
   Carregado ANTES de styles.css no app e nas páginas públicas (status-executivo,
   share, onepage, calendario-portfolio). Uma fonte de verdade: cor, tipo, raio, sombra.

   COR DO WORKSPACE: o tenant pode trocar a cor da marca. O mecanismo existente continua
   valendo e NÃO deve ser contornado — `src/app.js` (aplicarCorDoTenant) e o cache de cor do
   `jp-brand.js` (`jpBrand:cores`, <style id="jp-cores-cache">) sobrescrevem, com !important,
   `--accent`, `--accent-dark`, `--accent-soft`, `--accent-border`, `--accent-shadow`,
   `--accent-tint`, `--accent-tint-border`, `--jp-color-primary` e `--jp-color-primary-rgb`.
   Por isso o CSS deve consumir `var(--accent)` e nunca copiar o hex do marinho.

   Tema escuro: `body.theme-dark` em styles.css redefine --accent* e as cores de status. */
:root {
  /* ── Neutros (rampa slate; n-0 = branco) ── */
  --n-0: #ffffff;
  --n-50: #f8fafc;
  --n-100: #f1f5f9;
  --n-200: #e2e8f0;
  --n-300: #cbd5e1;
  --n-400: #94a3b8;
  --n-500: #64748b;
  --n-600: #475569;
  --n-700: #334155;
  --n-800: #1e293b;
  --n-900: #0f172a;

  /* ── Marca: marinho por padrão (o workspace pode sobrescrever) ── */
  --accent: #0b4f8f;
  --accent-dark: #083c6e;
  --accent-soft: rgba(11, 79, 143, 0.08);
  --accent-border: rgba(11, 79, 143, 0.2);
  --accent-shadow: rgba(11, 79, 143, 0.15);
  --accent-tint: #eaf2fa;
  --accent-tint-border: #b7d1ea;
  --jp-color-primary-rgb: 11 79 143;
  --jp-color-primary: rgb(var(--jp-color-primary-rgb));

  /* ── Semânticas: um tom cada ── */
  --ok: #15803d;
  --ok-bg: #dcfce7;
  --warn: #b45309;
  --warn-bg: #fef3c7;
  --crit: #b91c1c;
  --crit-bg: #fee2e2;

  /* ── Escala tipográfica (nada abaixo de 12px) ── */
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 28px;

  /* ── Raios ── */
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;

  /* ── Sombras: só para o que flutua (menus, modais) ── */
  --shadow-overlay: 0 4px 16px rgba(15, 23, 42, 0.12);
  --shadow-modal: 0 16px 48px rgba(15, 23, 42, 0.22);
}
