/* =============================================================================
   PUMANGOL — TOKENS DE DESENHO
   Fonte única de cor, espaçamento, raio, sombra e tipografia dos módulos.

   Porquê este ficheiro
   --------------------
   O MGF e o MGS tinham 119 cores distintas entre as duas folhas de estilo,
   mais 7 903 linhas de CSS embutido em 29 ecrãs — quatro dos quais
   redefiniam :root com os mesmos nomes de variável e valores diferentes,
   alterando os tokens de todas as outras páginas enquanto estavam carregados.
   Coexistiam quatro sistemas de cor: a paleta Pumangol, o teal #0E676F de um
   esquema antigo, uma escala Tailwind e um esquema azul-escuro próprio.

   Regra
   -----
   Nenhum valor de cor é escrito fora deste ficheiro. Os ficheiros de módulo
   (mgf-module.css, mgs-module.css) consomem estes tokens e não redefinem
   nenhum. Os ecrãs não declaram :root.

   Contraste
   ---------
   Todos os pares fundo/texto abaixo foram verificados contra WCAG 2.1 AA
   (4.5:1 para texto normal). O rácio medido está anotado em cada par.

   Ordem de carregamento: pumangol-cores.css antes de qualquer folha de módulo.
   ============================================================================= */

:root {

    /* -------------------------------------------------------------------------
       1. MARCA
       ------------------------------------------------------------------------- */

    --pum-verde:            #017649;   /* verde institucional Pumangol */
    --pum-verde-escuro:     #01502F;   /* estados hover e activo */
    --pum-verde-claro:      #E8F3EE;   /* fundos de realce */
    --pum-verde-borda:      #C4E0D4;
    --pum-vermelho:         #DE1827;   /* EXCLUSIVAMENTE destrutivo ou crítico */
    --pum-vermelho-escuro:  #B01220;
    --pum-vermelho-claro:   #FDECEE;
    --pum-vermelho-borda:   #F6C9CE;

    /* verde sobre branco ...... 5.69:1  AA
       verde-escuro sobre claro  8.44:1  AA
       verde sobre verde-claro   5.01:1  AA
       vermelho sobre branco ... 4.92:1  AA */

    /* -------------------------------------------------------------------------
       2. NEUTROS

       A escala é ligeiramente esverdeada, para assentar sobre o verde da marca
       sem cinzento frio a competir com ele.
       ------------------------------------------------------------------------- */

    --pum-tela:             #F5F7F6;   /* fundo da página */
    --pum-superficie:       #FFFFFF;   /* cartões, tabelas, diálogos */
    --pum-superficie-alt:   #FAFBFA;   /* cabeçalho de tabela, linha alternada */
    --pum-borda:            #E2E8E5;
    --pum-borda-clara:      #F0F3F2;

    --pum-texto:            #12211B;   /* títulos e valores .... 15.50:1  AA */
    --pum-texto-corpo:      #4A5A53;   /* texto corrente .........7.30:1  AA */
    --pum-texto-apoio:      #67736E;   /* rótulos e legendas .... 4.94:1  AA */

    /* Nota: --pum-texto-apoio era #8A9A93, que dava 2.95:1 sobre branco e
       falhava AA mesmo para texto grande. Foi escurecido para o valor mais
       claro da mesma família que passa 4.5:1 sobre branco e sobre a tela. */

    /* -------------------------------------------------------------------------
       3. CRITICIDADE

       Cinco níveis, cada um com par fundo/texto/borda garantindo AA.
       O vermelho é reservado ao nível crítico; nada mais o usa.
       ------------------------------------------------------------------------- */

    /* Crítico — exige acção imediata */
    --pum-critico:          #B01220;
    --pum-critico-fundo:    #FDECEE;
    --pum-critico-borda:    #F6C9CE;   /* 6.23:1  AA */

    /* Alto — desvio relevante, ainda recuperável */
    --pum-alto:             #A34A2E;
    --pum-alto-fundo:       #FDEFEA;
    --pum-alto-borda:       #F2D3C7;

    /* Médio — atenção, sem urgência */
    --pum-medio:            #A36100;
    --pum-medio-fundo:      #FFF6E5;
    --pum-medio-borda:      #F0DCB4;   /* 4.59:1  AA */

    /* Baixo — informativo */
    --pum-baixo:            #1F5C7A;
    --pum-baixo-fundo:      #EAF2F6;
    --pum-baixo-borda:      #C3DAE5;   /* 6.46:1  AA */

    /* Nulo — conforme, nada a assinalar */
    --pum-nulo:             #01502F;
    --pum-nulo-fundo:       #E8F3EE;
    --pum-nulo-borda:       #C4E0D4;   /* 8.44:1  AA */

    /* -------------------------------------------------------------------------
       4. SEMÂNTICA DE ESTADO

       Nomes pelo que significam, não pela cor. Um estado que passe de verde a
       âmbar muda aqui, e não nos 67 ecrãs.
       ------------------------------------------------------------------------- */

    --pum-ok:               var(--pum-verde);
    --pum-ok-fundo:         var(--pum-verde-claro);
    --pum-ok-borda:         var(--pum-verde-borda);

    --pum-espera:           var(--pum-medio);
    --pum-espera-fundo:     var(--pum-medio-fundo);
    --pum-espera-borda:     var(--pum-medio-borda);

    --pum-recusa:           var(--pum-critico);
    --pum-recusa-fundo:     var(--pum-critico-fundo);
    --pum-recusa-borda:     var(--pum-critico-borda);

    --pum-info:             var(--pum-baixo);
    --pum-info-fundo:       var(--pum-baixo-fundo);
    --pum-info-borda:       var(--pum-baixo-borda);

    /* Em curso / ocupado — distinto de «espera» e de «ok» */
    --pum-curso:            #B23A48;
    --pum-curso-fundo:      #FCEFF0;
    --pum-curso-borda:      #F0CDD1;   /* 5.22:1  AA */

    /* Inerte — expirado, arquivado, sem efeito */
    --pum-inerte:           #627077;
    --pum-inerte-fundo:     #F1F4F3;
    --pum-inerte-borda:     var(--pum-borda);   /* 4.62:1  AA */

    /* Acento secundário — usado em classificações e gráficos, nunca em estado */
    --pum-acento:           #4A3D9E;
    --pum-acento-fundo:     #F1EFFA;
    --pum-acento-borda:     #D8D2F0;   /* 7.53:1  AA */

    /* -------------------------------------------------------------------------
       5. ESPAÇAMENTO

       Escala de 4px. Usar sempre o token, nunca o valor.
       ------------------------------------------------------------------------- */

    --pum-esp-1:            4px;
    --pum-esp-2:            8px;
    --pum-esp-3:            12px;
    --pum-esp-4:            16px;
    --pum-esp-5:            24px;
    --pum-esp-6:            32px;
    --pum-esp-7:            48px;

    /* -------------------------------------------------------------------------
       6. RAIO E SOMBRA

       O portal usa cantos discretos e não usa sombra em superfícies planas —
       a separação é feita por borda. A sombra fica reservada ao que flutua.
       ------------------------------------------------------------------------- */

    --pum-raio-sm:          3px;
    --pum-raio:             4px;
    --pum-raio-lg:          6px;
    --pum-raio-pill:        999px;

    --pum-sombra:           none;
    --pum-sombra-md:        none;
    --pum-sombra-flutuante: 0 16px 48px rgba(18, 33, 27, .18);

    /* -------------------------------------------------------------------------
       7. TIPOGRAFIA
       ------------------------------------------------------------------------- */

    --pum-fonte:            "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;

    --pum-txt-xs:           10.5px;   /* rótulos em maiúsculas */
    --pum-txt-sm:           12px;     /* tabelas */
    --pum-txt-base:         13px;     /* corpo */
    --pum-txt-md:           15px;
    --pum-txt-lg:           18px;     /* títulos de bloco */
    --pum-txt-xl:           22px;     /* título de página */
    --pum-txt-kpi:          28px;     /* valor de indicador */

    --pum-peso-normal:      400;
    --pum-peso-medio:       600;
    --pum-peso-forte:       700;

    --pum-track-rotulo:     .1em;     /* espaçamento de letra em rótulos */
    --pum-linha:            1.5;

    /* -------------------------------------------------------------------------
       8. MEDIDAS DE TABELA
       ------------------------------------------------------------------------- */

    --pum-tabela-linha-h:   38px;
    --pum-tabela-cabec-h:   34px;

    /* -------------------------------------------------------------------------
       9. PONTO DE CORTE DE REFERÊNCIA

       O parque instalado é maioritariamente 1366×768. Havia nove pontos de
       corte diferentes espalhados pelos dois módulos e nenhum em 1366.
       ------------------------------------------------------------------------- */

    --pum-largura-max:      1320px;   /* cabe em 1366 com margem lateral */

    /* -------------------------------------------------------------------------
       10. BARRA SUPERIOR — título e filtros

       Medidas do componente que o `app-barra-superior.css` consome. Estavam
       repetidas em literal em oito folhas de módulo e no `<style>` embutido do
       `topbarFiltros.xhtml`; mudar a altura de um campo de filtro obrigava a
       editar nove ficheiros.

       O fundo da barra é o único azul-acinzentado do portal. Fica aqui como
       token para poder ser convergido para a escala neutra numa fase posterior,
       sem caçar o literal por 1 010 ecrãs.
       ------------------------------------------------------------------------- */

    --pum-barra-fundo:      #F3F6FB;

    /* O gradiente da barra superior. Vivia inline com !important no
       topbar.xhtml, invencível por qualquer folha; agora o inline consome o
       token, a identidade no claro é byte a byte a mesma, e o tema escuro
       pode enfim mudá-lo. */
    --pum-barra-sup:        linear-gradient(135deg, #005c3b, #00794e);

    /* O gradiente da barra superior. Vivia inline com !important no
       topbar.xhtml, invencível por qualquer folha; agora o inline consome o
       token, a identidade no claro é byte a byte a mesma, e o tema escuro
       pode enfim mudá-lo. */
    --pum-barra-sup:        linear-gradient(135deg, #005c3b, #00794e);
    --pum-barra-h:          55px;     /* altura da barra; igual ao topbar */

    --pum-filtro-h:         36px;     /* altura de cada campo de filtro */
    --pum-filtro-w:         150px;    /* largura de referência */
    --pum-filtro-w-min:     130px;
    --pum-filtro-w-max:     180px;
    --pum-filtro-w-busca:   210px;    /* campo de pesquisa livre, mais largo */

    /* Cinco é o número de filtros que cabem em 1366px ao lado do título sem
       comprimir. Do sexto em diante, o `topbarFiltros.xhtml` recolhe-os para o
       painel «Mais filtros». O valor está fixado no selector `:nth-child(n+6)`
       da folha e no contador em JavaScript — se mudar, mudam os dois. */

    /* -------------------------------------------------------------------------
       11. ACÇÃO E TEXTO INVERSO

       Um mesmo token não pode servir de texto sobre superfície escura E de
       fundo de botão sob texto claro: os dois papéis exigem luminâncias
       incompatíveis — 4.5:1 contra quase-preto e contra branco ao mesmo
       tempo não existe. No tema claro estes tokens valem exactamente o que
       os ecrãs já usam; no escuro divergem, e é isso que mantém os botões
       legíveis. A migração dos botões para *-accao faz-se módulo a módulo
       na entrada de cada um no tema escuro.
       ------------------------------------------------------------------------- */

    --pum-texto-inverso:    #FFFFFF;                    /* texto sobre a marca */
    --pum-inverso-80:       rgba(255, 255, 255, .8);
    --pum-inverso-18:       rgba(255, 255, 255, .18);

    --pum-verde-accao:      var(--pum-verde);           /* fundo de botão primário */
    --pum-vermelho-accao:   var(--pum-vermelho);        /* fundo de botão destrutivo */

    /* -------------------------------------------------------------------------
       12. LEGADO A CONVERGIR

       Identidades de módulo fora da paleta, centralizadas aqui para que
       nenhuma folha de módulo escreva um valor de cor — nem as que ainda
       não convergiram. O teal é «o esquema antigo» referido no cabeçalho
       deste ficheiro; os azuis são a identidade do painel do MGA. Convergem
       (ou ganham par escuro) quando cada módulo entrar no tema escuro — até
       lá, mudá-los aqui muda-os em todo o lado, que é o objectivo.
       ------------------------------------------------------------------------- */

    --pum-leg-teal:         #0E676F;   /* MCA — esquema antigo */
    --pum-leg-teal-escuro:  #0A4D53;

    --pum-leg-azul-mga:         #2563EB;   /* MGA — painel */
    --pum-leg-azul-mga-escuro:  #1E3A8A;
    --pum-leg-azul-mga-claro:   #3B82F6;

    /* MMP. Único tom que ganhou token próprio na Fase 5, e ganhou-o por
       peso: 185 ocorrências em duro, todas texto, e das poucas que já
       passavam em AA (7,40:1). Convergi-lo para um azul da paleta mudava a
       identidade do módulo sem nada ganhar em legibilidade. */
    --pum-leg-azul-mmp:         #01579B;   /* sobre superfície ....... 7.40:1  AA */

    /* Escala sequencial de gráficos, herdada do MGI — seis verdes do mais
       escuro ao mais claro, com o contraste do texto sobreposto documentado
       na folha de origem. É a única escala sequencial do portal e fica
       central como candidata a paleta oficial de dataviz. */
    --pum-seq-verde-1:      #083324;
    --pum-seq-verde-2:      #1B4B3B;
    --pum-seq-verde-3:      #356455;
    --pum-seq-verde-4:      #4E7E71;
    --pum-seq-verde-5:      #73978D;
    --pum-seq-verde-6:      #98B0AA;
    --pum-seq-verde-7:      #C8D4D1;   /* superfícies e linhas de base */
    --pum-seq-verde-8:      #E3E9E8;   /* superfícies e grelhas */

    /* -------------------------------------------------------------------------
       13. MOVIMENTO

       Quatro durações e três curvas. O movimento diz ao olho o que mudou e
       de onde veio; o que não responde a uma pergunta do utilizador não
       anima. Anima-se transform e opacity; nunca width, height, top, left
       ou margin — com 662 tabelas e 1 378 cartões, o reflow vê-se.

       Nota: a escala tipográfica que o plano pedia como secção 11 já existe
       — é a secção 7 deste ficheiro. Não se duplica; faz-se valer.
       ------------------------------------------------------------------------- */

    --pum-dur-instantaneo:  90ms;    /* realce, foco, estado de botão */
    --pum-dur-rapido:      160ms;    /* abrir menu, mostrar painel */
    --pum-dur-normal:      240ms;    /* transição de disposição, diálogo */
    --pum-dur-lento:       380ms;    /* só mudança de tema */

    --pum-curva:           cubic-bezier(.4, 0, .2, 1);   /* entrada e saída */
    --pum-curva-saida:     cubic-bezier(.4, 0, 1, 1);    /* a sair */
    --pum-curva-entrada:   cubic-bezier(0, 0, .2, 1);    /* a entrar */

    /* -------------------------------------------------------------------------
       13.1 Foco (Fase 7)

       O anel de foco é um elemento não textual: o mínimo é 3:1 pela 1.4.11, e
       o verificar-contraste.py mede-o contra a superfície, a tela e a barra de
       migalhas.

       Não leva par escuro: `var(--pum-verde)` resolve-se no momento do uso, e
       no tema escuro o --pum-verde já é #4CC38A. Repetir a linha na §14 não
       mudava nada e passava a haver dois sítios para manter a mesma decisão.

       Sobre a barra superior o anel é --pum-texto-inverso, porque ali o verde
       da marca é o próprio fundo. Ver app-acabamento.css §1.
       ---------------------------------------------------------------------- */
    --pum-foco-cor:        var(--pum-verde);
    --pum-foco-anel:       2px;
    --pum-foco-desvio:     2px;   /* sem desvio, o anel funde-se com a borda */
}

/* =============================================================================
   14. TEMA ESCURO

   Só os tokens que mudam. Os aliases da secção 4 (ok/espera/recusa/info)
   seguem automaticamente. O atributo data-tema é escrito no <html> pelo
   template a partir da preferência do utilizador (Fase 3); enquanto ninguém
   o escrever, este bloco é inerte e nada muda.

   prefers-color-scheme NÃO liga o tema sozinho, de propósito: com 19 128
   estilos em duro por converter nos ecrãs, um utilizador com o sistema
   operativo em escuro receberia metade dos ecrãs partidos sem nunca ter
   escolhido nada. A detecção do sistema entra como valor INICIAL da
   preferência, no bean, quando o utilizador ainda não escolheu (decisão
   aprovada na Fase 0).

   Todos os pares fundo/texto verificados WCAG 2.1 AA pela ferramenta
   ferramentas/verificar-contraste.py; o rácio medido está anotado.
   ============================================================================= */

:root[data-tema="escuro"] {

    /* 1. Marca */
    --pum-verde:            #4CC38A;   /* sobre superfície ....... 7.59:1  AA */
    --pum-verde-escuro:     #6FD3A5;   /* hover/activo ........... 9.24:1  AA */
    --pum-verde-claro:      #12291E;   /* verde sobre este fundo   6.96:1  AA */
    --pum-verde-borda:      #1F4630;
    --pum-vermelho:         #F2707C;   /* sobre superfície ....... 5.92:1  AA */
    --pum-vermelho-escuro:  #F58F99;   /* sobre superfície ....... 7.43:1  AA */
    --pum-vermelho-claro:   #351418;
    --pum-vermelho-borda:   #57242B;

    /* 2. Neutros */
    --pum-tela:             #101714;   /* texto sobre tela ...... 15.57:1  AA */
    --pum-superficie:       #171F1B;   /* texto sobre superfície  14.40:1  AA */
    --pum-superficie-alt:   #1D2621;
    --pum-borda:            #2C3833;
    --pum-borda-clara:      #232D28;

    --pum-texto:            #E8EFEB;
    --pum-texto-corpo:      #B6C4BD;   /* sobre superfície ....... 9.31:1  AA */
    /* CORRIGIDO DEPOIS DE VER O PORTAL A CORRER.
       Era #8FA098, escolhido contra --pum-superficie (#171F1B). Mas o texto de
       apoio não assenta só aí: o Poseidon pinta o corpo a #394149 e o
       cabeçalho de tabela a #434B54, ambos muito mais claros do que a
       superfície que a conta assumia. Sobre eles, o #8FA098 dava 3,78:1 e
       3,22:1 — abaixo do mínimo, e visível a olho num painel do MGP.

       O valor de agora passa sobre a mais clara das três: 4,66:1 no cabeçalho,
       5,46:1 no corpo, 9,14:1 no cartão. Aproxima-se do --pum-texto-corpo e a
       hierarquia entre os dois perde força no escuro — é o preço, e a ordem do
       plano é clara: primeiro a informação lê-se. */
    --pum-texto-apoio:      #B0C0B7;   /* cabeçalho 4.66 · corpo 5.46 ... AA */

    /* 3. Criticidade — o rácio anotado é texto sobre o próprio fundo e
       texto sobre superfície, por esta ordem */
    --pum-critico:          #F2818C;   /* 6.56 · 6.64  AA */
    --pum-critico-fundo:    #351418;
    --pum-critico-borda:    #57242B;

    --pum-alto:             #E89B7B;   /* 7.31 · 7.54  AA */
    --pum-alto-fundo:       #2F1B12;
    --pum-alto-borda:       #4D2E1F;

    --pum-medio:            #DDAE5A;   /* 7.65 · 8.23  AA */
    --pum-medio-fundo:      #2C2210;
    --pum-medio-borda:      #4A3A1C;

    --pum-baixo:            #7FB6D9;   /* 7.43 · 7.69  AA */
    --pum-baixo-fundo:      #12222C;
    --pum-baixo-borda:      #23404F;

    --pum-nulo:             #7CCFA6;   /* 8.71 · 9.08  AA */
    --pum-nulo-fundo:       #10251A;
    --pum-nulo-borda:       #1F4630;

    /* 4. Semântica sem alias directo */
    --pum-curso:            #E58E9B;   /* 7.01 · 6.95  AA */
    --pum-curso-fundo:      #2C161A;
    --pum-curso-borda:      #4A272E;

    --pum-inerte:           #9AA8A1;   /* 6.42 · 6.80  AA */
    --pum-inerte-fundo:     #1C2420;
    --pum-inerte-borda:     #2C3833;

    --pum-acento:           #B7A9F0;   /* 8.06 · 7.97  AA */
    --pum-acento-fundo:     #1D1930;
    --pum-acento-borda:     #363057;

    /* 6. Sombra — no escuro a elevação precisa de mais peso */
    --pum-sombra-flutuante: 0 16px 48px rgba(0, 0, 0, .55);

    /* 10. Barra superior */
    --pum-barra-fundo:      #151B21;   /* texto sobre a barra ... 14.85:1  AA */
    --pum-barra-sup:        linear-gradient(135deg, #0A231A, #0E3325);
                            /* texto inverso sobre os extremos: 13.9 e 12.1:1  AA */

    /* 11. Acção e inverso */
    --pum-texto-inverso:    #F2F7F4;
    --pum-inverso-80:       rgba(242, 247, 244, .8);
    --pum-inverso-18:       rgba(242, 247, 244, .18);
    --pum-verde-accao:      #0E7A4E;   /* texto inverso sobre ele  4.95:1  AA */
    --pum-vermelho-accao:   #C4313F;   /* texto inverso sobre ele  5.02:1  AA */

    /* 12. Legado

       Ganharam par escuro na Fase 5, e a premissa que estava aqui escrita
       caiu: não são só fundos. O levantamento do estilo em duro encontrou
       116 `color: teal` e 57 `color: #0A4D53` nos ecrãs — são texto, e
       texto de módulo com o valor claro sobre superfície escura dava 2,55:1
       e 1,76:1. Ilegível.

       Os tons abaixo mantêm a identidade de cada módulo — continuam a ser
       o teal do MCA e os azuis do MGA e do MMP — mas na claridade que uma
       superfície escura exige. */
    --pum-leg-teal:             #5FB8C2;   /* sobre superfície ....... 7.31:1  AA */
    --pum-leg-teal-escuro:      #3E9AA4;   /* sobre superfície ....... 5.10:1  AA */

    --pum-leg-azul-mga:         #7FA9F5;   /* sobre superfície ....... 7.13:1  AA */
    --pum-leg-azul-mga-escuro:  #5B8AE8;   /* sobre superfície ....... 5.00:1  AA */
    --pum-leg-azul-mga-claro:   #93BAF8;   /* sobre superfície ....... 8.51:1  AA */

    --pum-leg-azul-mmp:         #5FB0E8;   /* sobre superfície ....... 7.10:1  AA */
}

/* =============================================================================
   15. MOVIMENTO REDUZIDO

   Quem pediu ao sistema operativo para reduzir o movimento não recebe
   nenhum. A regra é global e definitiva — o interruptor do painel de
   preferências (Fase 3) permitirá ainda desligar por cima disto.
   ============================================================================= */

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}