/* FanTR Cooling — Design Tokens Fonte de verdade para cores, tipografia, espaçamento, sombras e transições. Todas as cores do app devem referenciar estas variáveis — nunca hardcoded. */ :root { /* ── Paleta institucional (Manual da Marca FanTR) ─────────────────────── */ --color-brand-blue: #067cb1; /* azul institucional */ --color-brand-green: #94c11f; /* verde institucional — uso parcimonioso */ --color-brand-dark: #345a74; /* azul escuro */ --color-brand-light: #e0ecf2; /* azul claro */ --color-white: #ffffff; /* ── Cores semânticas de feedback ────────────────────────────────────── */ --color-success: #2d8653; /* verde semântico — harmoniza com a paleta */ --color-success-bg: #eaf7f0; --color-warning: #b87700; /* âmbar — não conflita com a paleta */ --color-warning-bg: #fff8e6; --color-error: #c0392b; /* vermelho — não conflita com a paleta */ --color-error-bg: #fdf0ef; --color-info: #067cb1; /* azul institucional */ --color-info-bg: #e8f4fa; /* ── Texto ────────────────────────────────────────────────────────────── */ --color-text-body: #333333; /* preto 80% — conforme Manual da Marca */ --color-text-secondary: #6b7f8e; /* azul-cinza derivado do azul escuro */ --color-text-disabled: #a0adb8; --color-text-on-dark: #ffffff; /* texto sobre fundos escuros */ --color-text-heading: #345a74; /* títulos em azul escuro */ /* ── Bordas ───────────────────────────────────────────────────────────── */ --color-border: #c8d9e3; /* derivado do azul claro */ --color-border-focus: #067cb1; /* azul institucional no foco */ --color-border-error: #c0392b; /* ── Fundos de aplicação (decisões do PLAN.md) ────────────────────────── */ --color-bg-page: #e0ecf2; /* fundo das páginas internas */ --color-bg-card: #ffffff; /* fundo de cards */ --color-bg-nav: #345a74; /* navbar */ /* `--color-bg-sidebar` e `--color-bg-table-header` removidos na faxina de herança PSM (ago/2026): nenhum `var()` os consumia — o sidebar usa `--color-bg-nav` e o header da AG Grid é branco desde a 1.6a. */ --color-bg-input: #ffffff; --color-bg-input-disabled:#f0f4f7; /* ── Tipografia ───────────────────────────────────────────────────────── */ --font-primary: 'Aller', 'Calibri', sans-serif; /* `--font-secondary` removido na faxina de herança PSM (ago/2026): sem consumo. A tipografia dos documentos exportados é decidida no template Word/Excel e no `services/motor_documentos.py`, não por CSS. */ --font-mono: 'Consolas', 'Courier New', monospace; --font-size-xs: 0.75rem; /* 12px */ --font-size-sm: 0.875rem; /* 14px */ --font-size-base: 1rem; /* 16px */ --font-size-lg: 1.125rem; /* 18px */ --font-size-xl: 1.25rem; /* 20px */ --font-size-2xl: 1.5rem; /* 24px */ --font-weight-light: 300; --font-weight-regular: 400; --font-weight-bold: 700; --line-height-tight: 1.25; --line-height-base: 1.5; --line-height-loose: 1.75; /* ── Espaçamento (grade de 8px) ───────────────────────────────────────── */ --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px; /* ── Raios de borda (subdued — app técnico, sem excessos) ─────────────── */ --radius-sm: 3px; --radius-md: 5px; --radius-lg: 8px; --radius-pill: 100px; /* para botões de idioma e badges */ /* ── Sombras (sutis — coerentes com app de engenharia) ────────────────── */ --shadow-sm: 0 1px 3px rgba(52, 90, 116, 0.08); --shadow-md: 0 2px 8px rgba(52, 90, 116, 0.12); --shadow-lg: 0 4px 16px rgba(52, 90, 116, 0.16); /* ── Transições ───────────────────────────────────────────────────────── */ --transition-fast: 120ms ease; --transition-base: 200ms ease; /* `--transition-slow` removido na faxina de herança PSM (ago/2026): sem consumo. */ /* ── Z-index ────────────────────────────────────────────────────────────── RECONCILIADOS com o CSS real (faxina — correção 18, ago/2026). Os valores antigos (150/100/200/300/400) eram uma escala inventada que NUNCA foi usada: a varredura não achou um único `var(--z-*)` no repositório, e todo componente hardcodava número na escala do **Bootstrap 5** (dropdown 1000, offcanvas 1045, backdrop 1050, modal 1055, popover 1070, tooltip 1080) — que é a que de fato manda, porque o tema Bootstrap é o 1º stylesheet carregado. Usar os tokens antigos teria colocado qualquer componente novo ABAIXO do navbar sem ninguém entender por quê (foi o que aconteceu no overlay do Abrir — ver assets/css/overlay.css). Camadas medidas, de baixo para cima: 900 botões flutuantes da página (--z-page-actions) components.css 1000 navbar fixa (--z-navbar) styles.css 1044 backdrop da sidebar mobile (--z-sidebar-backdrop) sidebar.css 1045 sidebar (--z-sidebar) sidebar.css 1055 modais (dbc/Bootstrap) — não definimos, é do tema 1100 card de usuário do navbar (--z-navbar-menu) navbar.css 1101 overlay de carregamento (--z-overlay) overlay.css 9999 menus de dropdown (dcc/AG) (--z-dropdown-menu) inputs.css As telas de autenticação são um plano à parte: o navbar e a sidebar não são renderizados nelas, então a faixa 500-502 basta e não conflita. Ao criar componente novo: use o token, não um número. Se precisar de camada nova, acrescente aqui — e confira contra a escala do Bootstrap acima. */ --z-page-actions: 900; --z-navbar: 1000; --z-sidebar-backdrop: 1044; --z-sidebar: 1045; --z-navbar-menu: 1100; --z-overlay: 1101; --z-dropdown-menu: 9999; --z-auth: 500; /* telas de auth (+1 logo, +2 idiomas) */ /* Botões PT/EN/ES das telas de auth — ACIMA do modal do Bootstrap (1055). Leva 15.4: os Termos do /primeiro-acesso passaram a abrir em modal, e com o backdrop na frente o usuário não conseguia mais trocar de idioma (medido: o clique era interceptado). Como o requisito é ver os termos mudarem de idioma AO VIVO, o seletor sobe para cima do modal — é a camada mais alta dessas telas, que não têm navbar nem sidebar. */ --z-auth-lang: 1060; /* ── Dimensões de componentes fixos ───────────────────────────────────── */ --navbar-height: 56px; --sidebar-width: 230px; /* `--sidebar-width-collapsed` removido na faxina de herança PSM (ago/2026): sem consumo — o sidebar do app não colapsa (no mobile ele desliza inteiro). */ }