/* CG Drywall · Dashboard · tokens.css (v1.0 · 03/11/2026)
   Cópia do tokens.css do Designer CG (v1.0), só com os caminhos das fontes ajustados.
   Mapeia o guia de marca v1.1 (/workspace/marketing/marca/guia_marca.md). */
@font-face{font-family:Barlow;src:url(../fonts/Barlow-Regular.ttf);font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url(../fonts/Barlow-SemiBold.ttf);font-weight:600;font-display:swap}
@font-face{font-family:Barlow;src:url(../fonts/Barlow-Bold.ttf);font-weight:700;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(../fonts/BarlowCondensed-SemiBold.ttf);font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(../fonts/BarlowCondensed-Bold.ttf);font-weight:700;font-display:swap}

:root{
  /* ---- Marca ---- */
  --cg-green:#5BA898;      /* verde oficial: barras, ícones, fundos de botão (texto #0f2420 por cima) */
  --cg-green-shade:#4D9D90;/* degradês */
  --cg-green-dark:#2F6B5F; /* texto verde, números, links; fundo com texto branco (6,2:1) */
  --cg-green-deep:#1F4D44; /* hover do verde escuro */
  --cg-ink:#162824;        /* texto principal / fundos escuros */
  --cg-on-green:#0f2420;   /* texto SOBRE #5BA898 (5,8:1). Nunca branco sobre #5BA898 */
  --cg-paper:#F0F2EF;      /* fundo da app */
  --cg-mint:#E6F0ED;       /* cartões secundários, faixas, tabelas */
  --cg-white:#FFFFFF;

  /* ---- Semânticas (tema claro) ---- */
  --bg:var(--cg-paper);
  --surface:#FFFFFF;
  --surface-2:var(--cg-mint);
  --glass:rgba(255,255,255,.72);      /* SÓ barras fixas e cartões fixos */
  --glass-border:rgba(255,255,255,.75);
  --text:var(--cg-ink);
  --text-2:#4A5E59;                   /* 6,6:1 sobre #fff */
  --text-3:#5F716C;                   /* 5,2:1 sobre #fff · 4,6:1 sobre #F0F2EF */
  --line:rgba(22,40,36,.09);
  --line-2:rgba(22,40,36,.16);
  --accent:var(--cg-green);
  --accent-text:var(--cg-green-dark);
  --focus:#2F6B5F;

  /* Estados (badges e gráficos) — todos com texto escuro em fundo claro, AA */
  --st-prep-bg:#ECEFEE;  --st-prep-fg:#4A5E59;  --st-prep:#9AA9A5;   /* em preparação */
  --st-env-bg:#E3EEF6;   --st-env-fg:#235A80;   --st-env:#5B8FB8;    /* enviado */
  --st-agu-bg:#FBF0DC;   --st-agu-fg:#83560F;   --st-agu:#D9A443;    /* aguarda aprovação */
  --st-apr-bg:#DDF0EA;   --st-apr-fg:#1F5E51;   --st-apr:#5BA898;    /* aprovado */
  --st-rec-bg:#F8E4E1;   --st-rec-fg:#8E3027;   --st-rec:#C9604F;    /* recusado / atrasado / acima do orçado */
  --pos:#2F6B5F; --neg:#B4473A; --warn:#9A6512;

  /* Obras (fase) */
  --ob-curso:#5BA898; --ob-comecar:#5B8FB8; --ob-parada:#D9A443; --ob-concluida:#9AA9A5;

  /* ---- Tipografia (escala v1.1: 12·14·16·18·22·28·40·64) ---- */
  --font:Barlow,system-ui,"Segoe UI",Roboto,Arial,sans-serif;
  --font-display:"Barlow Condensed",Barlow,system-ui,sans-serif;
  --fs-12:12px; --fs-14:14px; --fs-16:16px; --fs-18:18px; --fs-22:22px; --fs-28:28px; --fs-40:40px; --fs-64:64px;
  --lh-tight:1.1; --lh:1.4;
  --track-label:.09em;     /* etiquetas MAIÚSCULAS */

  /* ---- Espaço (base 4) ---- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px;
  --tap:44px;              /* alvo de toque mínimo */

  /* ---- Raios ---- */
  --r-xs:6px; --r-sm:10px; --r-md:14px; --r-lg:20px; --r-xl:28px; --r-pill:999px;

  /* ---- Sombras (tom verde-tinta, nunca preto puro) ---- */
  --sh-1:0 1px 2px rgba(22,40,36,.06),0 1px 1px rgba(22,40,36,.04);
  --sh-2:0 4px 14px -4px rgba(22,40,36,.12),0 2px 4px rgba(22,40,36,.05);
  --sh-3:0 18px 40px -14px rgba(22,40,36,.28),0 4px 10px rgba(22,40,36,.06);
  --glow:0 0 0 1px rgba(91,168,152,.45),0 14px 34px -12px rgba(91,168,152,.55);
  --blur:saturate(1.4) blur(16px);

  /* ---- Movimento ---- */
  --dur-xs:120ms;   /* toque, pressão */
  --dur-sm:180ms;   /* hover, tabs */
  --dur-md:280ms;   /* entradas de cartões, transição de ecrã */
  --dur-lg:400ms;   /* desenho de gráficos (máx. no telemóvel) */
  --dur-count:900ms;/* contadores (só desktop; telemóvel 600ms) */
  --stagger:60ms;   /* atraso entre cartões (máx. 6 → 300 ms) */
  --ease-out:cubic-bezier(.22,1,.36,1);     /* entradas */
  --ease-in-out:cubic-bezier(.65,0,.35,1);  /* tabs, indicadores */
  --ease-in:cubic-bezier(.55,0,1,.45);      /* saídas */
  --ease-spring:cubic-bezier(.34,1.56,.64,1);/* só pequenos detalhes (badge, ponto do mapa) */
  --lift:-3px;

  /* ---- Layout ---- */
  --side-w:248px; --top-h:64px; --bottom-h:68px; --content-max:1320px;
}

/* ---- Tema escuro (opcional) ---- */
[data-theme="dark"]{
  --bg:#0E1A17; --surface:#15241F; --surface-2:#1B2E28;
  --glass:rgba(21,36,31,.72); --glass-border:rgba(255,255,255,.07);
  --text:#E8EFEC; --text-2:#B2C2BD; --text-3:#8A9C97;
  --line:rgba(255,255,255,.07); --line-2:rgba(255,255,255,.13);
  --accent-text:#7FC3B4;       /* verde legível sobre escuro (7,9:1) */
  --focus:#7FC3B4;
  --st-prep-bg:#24332F; --st-prep-fg:#B2C2BD;
  --st-env-bg:#1C2F3D;  --st-env-fg:#9CC6E6;
  --st-agu-bg:#3A2F1A;  --st-agu-fg:#F0C97A;
  --st-apr-bg:#1D3A33;  --st-apr-fg:#93D3C4;
  --st-rec-bg:#3D2420;  --st-rec-fg:#F2A497;
  --pos:#7FC3B4; --neg:#F08C7C; --warn:#F0C97A;
  --sh-1:0 1px 2px rgba(0,0,0,.3); --sh-2:0 6px 16px -6px rgba(0,0,0,.5); --sh-3:0 20px 44px -16px rgba(0,0,0,.7);
  --glow:0 0 0 1px rgba(127,195,180,.4),0 16px 36px -14px rgba(91,168,152,.45);
}

/* ---- Movimento reduzido: tudo instantâneo ---- */
@media (prefers-reduced-motion: reduce){
  :root{--dur-xs:0ms;--dur-sm:0ms;--dur-md:0ms;--dur-lg:0ms;--dur-count:0ms;--stagger:0ms;--lift:0px}
  *,*::before,*::after{animation-duration:0ms!important;animation-delay:0ms!important;transition-duration:0ms!important;scroll-behavior:auto!important}
}