/* ============================================================ Ponte de tokens — legado do TalentInhA → tokens oficiais ============================================================ O styles.css do TalentInhA tem ~20 mil linhas escritas contra uma nomenclatura própria (--purple-*, --slate-*, --surface-*, --text-*, --color-success…). Em vez de reescrever cada regra, os nomes antigos passam a APONTAR para os tokens oficiais do Design System 2. Uma linha aqui reveste centenas de regras lá. Isto é ponte de migração, não destino. Código novo usa o token oficial direto (var(--violet-500)), nunca o apelido legado. O `:root` original foi REMOVIDO do styles.css — este arquivo é a única definição desses nomes, para não haver dois valores concorrendo pelo mesmo nome. Carregar DEPOIS de tokens.css. ============================================================ */ :root { /* ---------- Roxo Vértice = ação ---------- O 600 legado era exatamente #6F2BFF, o roxo oficial. */ --purple-300: var(--violet-200); --purple-400: var(--violet-300); --purple-500: var(--violet-400); --purple-600: var(--violet-500); --purple-700: var(--violet-700); --purple-800: var(--violet-800); --purple-900: var(--violet-900); /* ---------- Azul Noite = estrutura · Azul Precisão = detalhe ---------- */ --navy: var(--night-700); --navy-2: var(--night-600); --precisao: var(--precision-500); /* ---------- Neutros ---------- A rampa slate do Tailwind vira a rampa cinza da marca, que tem leve viés azulado e conversa com o Azul Noite. */ --slate-50: var(--gray-050); --slate-100: var(--gray-100); --slate-200: var(--gray-200); --slate-300: var(--gray-300); --slate-400: var(--gray-400); --slate-500: var(--gray-500); --slate-600: var(--gray-600); --slate-700: var(--gray-700); --slate-800: var(--gray-800); --slate-900: var(--gray-900); --slate-950: var(--night-900); /* ---------- Gradiente: ACHATADO em cor sólida ---------- O DS2 restringe o gradiente ao símbolo do logo e proíbe espalhá-lo pela interface. Achatar aqui resolve de uma vez os 35 usos destas três variáveis — inclusive os títulos com background-clip:text, que passam a renderizar em roxo sólido. Continuam sendo declarações válidas de `background`. */ --gradient-primary: var(--violet-500); --gradient-accent: var(--violet-500); --gradient-dark: var(--surface-page); /* ---------- Glassmorphism: DESATIVADO ---------- Vidro fosco está na lista de proibições do DS2. As superfícies ficam sólidas e o desfoque vai a zero, matando de uma vez os 18 `blur(var(--glass-blur))`. Os literais remanescentes foram removidos do styles.css. */ --glass-bg: var(--surface-card); --glass-bg-light: var(--surface-card); --glass-border: var(--border-subtle); --glass-border-hover: var(--violet-300); --glass-blur: 0px; /* ---------- Superfícies ---------- */ --surface-primary: var(--surface-card); --surface-secondary: var(--surface-page); --surface-tertiary: var(--surface-sunken); --surface-elevated: var(--surface-raised); --surface-overlay: color-mix(in srgb, var(--night-900) 62%, transparent); --surface-hover: var(--gray-100); /* ---------- Texto ---------- --text-primary era exatamente #0B1630, o Azul Lettering. */ --text-primary: var(--text-strong); --text-secondary: var(--text-body); --text-tertiary: var(--text-subtle); --text-inverse: var(--text-on-brand); /* --text-link não é redeclarado: o token oficial já manda. */ /* ---------- Bordas ---------- */ --border-primary: var(--border-subtle); --border-secondary: var(--gray-100); --border-focus: var(--violet-500); /* ---------- Estado ---------- Os verdes/âmbares/vermelhos do Tailwind saem de cena; entram os semânticos da marca, que são dessaturados de propósito para não competir com o roxo de ação. */ --color-success: var(--success-500); --color-success-bg: var(--success-100); --color-success-border: color-mix(in srgb, var(--success-500) 35%, var(--white)); --color-warning: var(--warning-500); --color-warning-bg: var(--warning-100); --color-warning-border: color-mix(in srgb, var(--warning-500) 35%, var(--white)); --color-error: var(--danger-500); --color-error-bg: var(--danger-100); --color-error-border: color-mix(in srgb, var(--danger-500) 35%, var(--white)); --color-info: var(--info-500); --color-info-bg: var(--info-100); --color-info-border: color-mix(in srgb, var(--info-500) 35%, var(--white)); /* ---------- Tipografia ---------- A escala legada casa quase exatamente com a do DS2. Os três degraus maiores não têm par (a escala do DS2 salta para tamanho de peça), então ficam no valor de produto. */ --text-xs: var(--text-caption); --text-sm: var(--text-body-sm); --text-base: var(--font-size-body); --text-lg: var(--text-body-lg); --text-xl: 1.25rem; --text-2xl: 1.5rem; --text-3xl: 2rem; /* ---------- Sombra ---------- --shadow-sm/md/lg vêm de tokens.css e já sobrescrevem os antigos. O "glow" roxo não existe no DS2: vira elevação neutra. */ --shadow-glow: var(--shadow-md); --shadow-glow-sm: var(--shadow-xs); --shadow-glow-btn: var(--shadow-sm); /* ---------- Camadas ---------- Mapeadas para a escala do DS2 preservando a ordem relativa (toast acima de modal). */ --z-modal: var(--layer-modal); --z-toast: var(--layer-toast); /* ---------- Movimento ---------- Uma única curva, a padrão do DS2. O "spring" com overshoot sai: o DS2 pede movimento sóbrio. */ --ease-out-expo: var(--ease-standard); --ease-spring: var(--ease-standard); --transition-fast: var(--dur-fast) var(--ease-standard); --transition-normal: var(--dur-base) var(--ease-standard); --transition-slow: var(--dur-slow) var(--ease-standard); /* ---------- Medidas do shell ---------- Específicas do TalentInhA, não são token de marca. Ficam aqui porque o styles.css legado depende delas. */ --header-height: 72px; --footer-height: 90px; --sidebar-width: 245px; --sidebar-collapsed-width: 60px; }