/*!
 * DigitalEDU — Design Tokens
 * ----------------------------------------------------------------------------
 * Arquivo base de variáveis CSS (design system mínimo).
 * Carregado globalmente antes dos demais CSS do tema para que qualquer
 * componente possa referenciar os tokens.
 *
 * Criado em: Abr/2026 — Sprint Performance & UX
 * Complementa: docs/AUDITORIA-CABINE-RESPONSIVIDADE-VISUAL-ABR-2026.md §4.5
 *
 * POLÍTICA DE RETROCOMPATIBILIDADE
 * --------------------------------
 * Os nomes antigos que já existiam em CSSs do tema (--primary-blue,
 * --primary-green, --secondary-blue, --secondary-green, --white) foram
 * mantidos como ALIASES via var(...). Assim, nenhum CSS existente quebra.
 * A migração para os nomes novos (--cor-primaria, --cor-secundaria, ...)
 * é gradual e opcional.
 *
 * COMO MUDAR A COR DE MARCA NO FUTURO
 * -----------------------------------
 * Basta trocar o valor de --cor-primaria (ou --cor-secundaria) neste
 * arquivo. Todos os aliases e usos seguirão automaticamente.
 *
 * FEATURE FLAG
 * ------------
 * Caso precise desativar o arquivo rapidamente sem editar functions.php,
 * defina DIGITALEDU_SKIP_TOKENS_CSS no wp-config.php: o enqueue no PHP
 * checa essa constante.
 */

:root {
    /* ------------------------------------------------------------------ */
    /* COR — Marca                                                         */
    /* ------------------------------------------------------------------ */
    --cor-primaria:        #002f77;   /* Azul DigitalEDU (canônico) */
    --cor-primaria-hover:  #0041a0;
    --cor-primaria-light:  #e7eef9;
    --cor-primaria-dark:   #001f50;

    --cor-secundaria:        #1d9500; /* Verde DigitalEDU (canônico) */
    --cor-secundaria-hover:  #26b300;
    --cor-secundaria-light:  #e8f7e5;
    --cor-secundaria-dark:   #0f6b00;

    /* ------------------------------------------------------------------ */
    /* COR — Estados (feedback semântico)                                  */
    /* ------------------------------------------------------------------ */
    --cor-success: #28a745;
    --cor-success-bg: #e8f7e5;
    --cor-danger:  #dc3545;
    --cor-danger-bg: #fbe7e9;
    --cor-warning: #f59e0b;
    --cor-warning-bg: #fef3c7;
    --cor-info:    #0ea5e9;
    --cor-info-bg: #e0f2fe;

    /* ------------------------------------------------------------------ */
    /* COR — Neutros                                                       */
    /* ------------------------------------------------------------------ */
    --cor-texto:       #212529;
    --cor-texto-sec:   #6c757d;
    --cor-texto-light: #adb5bd;
    --cor-borda:       #e5e7eb;
    --cor-borda-light: #f1f3f5;
    --cor-fundo:       #ffffff;
    --cor-fundo-alt:   #f8f9fa;
    --cor-fundo-dark:  #f1f3f5;

    /* ------------------------------------------------------------------ */
    /* TIPOGRAFIA                                                          */
    /* ------------------------------------------------------------------ */
    --fonte-base: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    --fonte-mono: ui-monospace, SFMono-Regular, 'SF Mono', Consolas, 'Liberation Mono', monospace;

    /* Escala de tamanho — px para manter previsibilidade */
    --fonte-xs:   12px;
    --fonte-sm:   14px;
    --fonte-md:   16px;
    --fonte-lg:   18px;
    --fonte-xl:   20px;
    --fonte-2xl:  24px;
    --fonte-3xl:  32px;
    --fonte-4xl:  40px;

    /* Pesos */
    --peso-regular:  400;
    --peso-medium:   500;
    --peso-semibold: 600;
    --peso-bold:     700;

    /* Line-heights */
    --lh-tight:  1.2;
    --lh-normal: 1.5;
    --lh-loose:  1.75;

    /* ------------------------------------------------------------------ */
    /* ESPAÇAMENTO — escala base-4                                         */
    /* ------------------------------------------------------------------ */
    --espaco-1:  4px;
    --espaco-2:  8px;
    --espaco-3:  12px;
    --espaco-4:  16px;
    --espaco-5:  24px;
    --espaco-6:  32px;
    --espaco-7:  48px;
    --espaco-8:  64px;
    --espaco-9:  96px;

    /* ------------------------------------------------------------------ */
    /* RAIO                                                                */
    /* ------------------------------------------------------------------ */
    --raio-sm:    6px;
    --raio-md:    12px;
    --raio-lg:    16px;
    --raio-xl:    24px;
    --raio-pill:  9999px;
    --raio-circle: 50%;

    /* ------------------------------------------------------------------ */
    /* SOMBRAS                                                             */
    /* ------------------------------------------------------------------ */
    --sombra-sm:  0 1px 3px rgba(0, 47, 119, 0.08);
    --sombra-md:  0 4px 12px rgba(0, 47, 119, 0.12);
    --sombra-lg:  0 8px 32px rgba(0, 47, 119, 0.16);
    --sombra-xl:  0 16px 48px rgba(0, 47, 119, 0.22);

    /* Focus ring (acessibilidade) */
    --sombra-focus: 0 0 0 3px rgba(0, 47, 119, 0.35);

    /* ------------------------------------------------------------------ */
    /* MOTION                                                              */
    /* ------------------------------------------------------------------ */
    --transicao-rapida: 150ms ease;
    --transicao-padrao: 200ms ease;
    --transicao-lenta:  300ms ease;
    --easing-saida:     cubic-bezier(0.4, 0, 0.2, 1);

    /* ------------------------------------------------------------------ */
    /* Z-INDEX                                                             */
    /* ------------------------------------------------------------------ */
    --z-dropdown:   1000;
    --z-sticky:     1020;
    --z-fixed:      1030;
    --z-overlay:    1040;
    --z-modal:      1050;
    --z-popover:    1060;
    --z-tooltip:    1070;
    --z-toast:      1080;

    /* ------------------------------------------------------------------ */
    /* BREAKPOINTS — apenas referência (media queries não usam vars)       */
    /* Use em @media: 480 / 768 / 992 / 1200 / 1400                         */
    /* ------------------------------------------------------------------ */

    /* ================================================================== */
    /* ALIASES RETROCOMPATÍVEIS                                            */
    /* Nomes antigos usados em CSS/PHP inline do tema — apontam para os    */
    /* tokens canônicos acima. Removê-los quebra estilos existentes.       */
    /* ================================================================== */
    --primary-blue:    var(--cor-primaria);
    --primary-green:   var(--cor-secundaria);
    --secondary-blue:  var(--cor-primaria-hover);
    --secondary-green: var(--cor-secundaria-hover);
    --white:           #ffffff;
}