/* ==========================================================================
   MARCA QUALIENSAIOS — cores e componentes que carregam a identidade.
   ==========================================================================

   POR QUE ESTE ARQUIVO EXISTE

   O botao de acao primaria (`.neumorphic-button-blue`) morava so no
   `premium-theme.css`. Duas telas usam esse botao mas herdam de `base.html`,
   que NAO carrega aquela folha:

       client/user_profile.html
       client/user_notification_prefs.html

   Resultado, medido em 06/set/2026: os botoes de salvar dessas duas telas
   estavam SEM ESTILO NENHUM -- e ninguem tinha notado, porque a pagina nao
   quebra, so fica feia. E o mesmo padrao das 96 bordas e dos blocos de template
   com nome errado achados no mesmo dia.

   Duplicar a regra nas duas folhas resolveria hoje e divergiria amanha. Entao a
   marca ficou aqui, num arquivo so, carregado por TODAS as bases.

   REGRA: cor da marca se muda AQUI, e chega em todas as telas.
   ========================================================================== */

:root {
    /* Cor exata do simbolo "OE" no kit oficial da marca. */
    --qe-oliva: #bbb73a;

    /* Mesma familia, mais saturada. Sobre fundo escuro a oliva fica apagada;
       esta e a lima usada na tela de login. */
    --qe-lima: #cde000;

    /* Verde das leituras normais nos cards de equipamento. Mais verde que a
       lima de propósito: numero grande em lima cansa a vista. */
    --qe-verde-leitura: #a3e635;
}

/* --------------------------------------------------------------------------
   Botao de acao primaria.

   O NOME diz "blue" e a cor e a lima da marca. Renomear exigiria editar as 16
   telas que o usam; fica registrado como divida, nao como descuido.
   -------------------------------------------------------------------------- */
.neumorphic-button-blue {
    background-color: var(--qe-lima);
    color: #0b1220;
    box-shadow: 0 4px 14px 0 rgba(205, 224, 0, 0.28);
}

.neumorphic-button-blue:hover {
    background-color: #dbf000;
    box-shadow: 0 6px 20px rgba(205, 224, 0, 0.34);
}

/* No tema claro vai o oliva: a lima sobre fundo branco cansa a vista. */
html:not(.dark) .neumorphic-button-blue {
    background-color: var(--qe-oliva);
    color: #0b1220;
    box-shadow: 0 4px 14px 0 rgba(187, 183, 58, 0.32);
}

html:not(.dark) .neumorphic-button-blue:hover {
    background-color: #a9a533;
}


/* --------------------------------------------------------------------------
   Card de equipamento.

   O modelo tem um degrade sutil azul-esverdeado; o card chapado sumia no fundo
   da pagina, que tambem e quase preto. So no tema escuro -- no claro o cartao ja
   se separa por contraste.
   -------------------------------------------------------------------------- */
html.dark .equipment-card {
    background-image: linear-gradient(155deg,
        rgba(34, 58, 74, 0.55) 0%,
        rgba(17, 32, 47, 0.35) 45%,
        rgba(10, 20, 32, 0.15) 100%);
}


/* --------------------------------------------------------------------------
   ESTADO NORMAL DO CARD — cor por variavel de tema, nao por classe fixa.

   O verde da marca (#a3e635) nasceu para fundo escuro. Sobre o cartao branco do
   tema claro ele media 1,51:1 -- o WCAG AA pede 4,5:1 para texto. O numero da
   temperatura e a pilula "Normal" ficavam quase invisiveis de dia.

   A cor agora sai de uma variavel que o tema redefine. As classes abaixo
   substituem as `text-[#a3e635]` que estavam escritas no template: assim nao ha
   utilitaria do Tailwind competindo na cascata e nenhum `!important` e preciso.

   No claro entra o lima-800 (#3f6212): mesma familia, so mais fechado. O
   lima-700 foi medido antes e deu 4,44:1 -- reprovado por pouco, entao desceu
   mais um tom. Medido no ambiente contra o fundo de pagina (#edf2f8, o pior
   caso, porque o cartao e branco translucido e so ajuda): 6,3:1. Passa nos
   4,5:1 do texto e sobra para os 3:1 do traco do minigrafico, que herda a
   mesma cor via `currentColor`.
   -------------------------------------------------------------------------- */
:root {
    --qe-verde-borda: rgba(163, 230, 53, 0.40);
    --qe-verde-borda-card: rgba(163, 230, 53, 0.35);
}

html:not(.dark) {
    --qe-verde-leitura: #3f6212;
    --qe-verde-borda: rgba(63, 98, 18, 0.50);
    --qe-verde-borda-card: rgba(63, 98, 18, 0.40);
}

/* Numero da leitura e traco do minigrafico (stroke="currentColor"). */
.leitura-normal {
    color: var(--qe-verde-leitura);
}

/* Pilula de status: cor do texto e do contorno na mesma regra. */
.pilula-normal {
    color: var(--qe-verde-leitura);
    border-color: var(--qe-verde-borda);
}

/* Contorno do cartao em estado normal. */
.card-normal {
    border-color: var(--qe-verde-borda-card);
}

/* Nome do equipamento ao passar o mouse. Era `group-hover:text-[#a3e635]`,
   que no claro tinha o mesmo problema de contraste. */
.group:hover .titulo-equipamento {
    color: var(--qe-verde-leitura);
}