/* ============================================================================
   TEMAS DAS TELAS DE CONTA (Login, EsqueciSenha, RedefinirSenha, AlterarSenha,
   VerificarMfa) - fonte UNICA.

   POR QUE ESTE ARQUIVO EXISTE
   Essas cinco telas tem Layout = null e NAO carregam o site.css: cada uma trazia o
   proprio CSS inline, e o bloco de tema estava COPIADO em tres delas - ja divergido
   (Login tinha verde+escuro+claro, EsqueciSenha e RedefinirSenha so verde, e
   AlterarSenha e VerificarMfa nao tinham tema nenhum, abrindo sempre em azul).
   Aqui a regra mora uma vez so e vale para as cinco.

   COMO FUNCIONA
   Cada tela mantem o proprio LAYOUT inline (tamanho, espacamento, raio de borda) e
   le as CORES por var(--acc-*). Este arquivo declara os tokens: o :root com os
   valores EXATOS que o azul ja tinha, e um bloco por tema redefinindo o que muda.
   Tema novo = um bloco de tokens, nunca uma regra nova disputando cascata.

   ORDEM NO <head>: este arquivo entra ANTES do <style> inline da tela. Nao ha
   conflito - os seletores de tema daqui ([data-theme="x"] .classe, 0-2-0) ganham das
   regras base inline (.classe, 0-1-0) por ESPECIFICIDADE, e nao por ordem.

   LIMITE QUE NAO DA PARA CONTORNAR: estas telas sao PRE-LOGIN. Nao existe claim
   TemaCor antes de autenticar, entao quem decide a cor aqui e o localStorage do
   proprio navegador. Em maquina nova o login sai azul, escolha o operador o que
   escolher - e so depois de entrar que o tema gravado na conta passa a valer.
   ============================================================================ */

/* ----------------------------------------------------------------------------
   AZUL - o padrao. Os valores abaixo sao os que ja estavam cravados nas telas;
   trocar qualquer um deles muda o azul de TODAS as cinco.
   ---------------------------------------------------------------------------- */
:root {
    --acc-fundo:            linear-gradient(135deg, #1a3460 0%, #142745 100%);
    --acc-fundo-chapado:    #142745;   /* VerificarMfa sempre teve fundo chapado, nao degrade */

    --acc-card-bg:          #fff;
    --acc-card-sombra:      0 10px 40px rgba(0, 0, 0, 0.2);

    --acc-titulo:           #333;
    --acc-texto:            #212529;
    --acc-texto-2:          #666;
    --acc-texto-3:          #999;
    --acc-texto-corpo:      #444;   /* o paragrafo do VerificarMfa, que sempre foi mais escuro */

    --acc-campo-bg:         #fff;
    --acc-campo-fg:         #212529;
    --acc-campo-fg-forte:   #212529;   /* o campo do CNS, que e maior e em destaque */
    --acc-campo-borda:      #e0e0e0;
    --acc-campo-ph:         #6c757d;

    --acc-accent:           #142745;
    --acc-accent-rgb:       20, 39, 69;
    --acc-accent-texto:     #fff;

    --acc-btn-grad:         linear-gradient(135deg, #1a3460 0%, #142745 100%);
    --acc-btn-grad-hover:   linear-gradient(135deg, #1f3d70 0%, #1a3460 100%);
    --acc-btn-fg:           #fff;

    --acc-destaque-bg:      #eef2f7;   /* .cns-input */
    --acc-destaque-borda:   #c5d0de;
    --acc-destaque-label:   #142745;

    --acc-caixa-bg:         #f8f9fa;   /* .criteria-box */
    --acc-caixa-borda:      #e0e0e0;
    --acc-caixa-titulo:     #555;

    --acc-badge-bg:         #142745;
    --acc-badge-fg:         #fff;

    --acc-link:             #0d6efd;   /* o do Bootstrap: hoje nenhuma dessas telas estiliza <a> */
    --acc-link-hover:       #0a58ca;

    --acc-danger:           #dc3545;
    --acc-alerta-bg:        #fff8e1;   /* .alert-warning-custom / .erro */
    --acc-alerta-borda:     #ffe082;
    --acc-alerta-fg:        #e65100;

    --acc-check-bg:         #fff;
    --acc-check-borda:      rgba(0, 0, 0, 0.25);
}

/* ----------------------------------------------------------------------------
   PALETAS - so redefinicao de token.

   Os valores de verde, escuro e claro sao os MESMOS que estavam literais no
   Login.cshtml: este arquivo substitui aqueles blocos, nao acrescenta um segundo
   comportamento. Os quatro temas novos repetem a paleta do site.css, para que a
   tela de login combine com a tela de atendimento que vem depois dela.
   ---------------------------------------------------------------------------- */

[data-theme="verde"] {
    --acc-fundo:          linear-gradient(135deg, #25D366 0%, #128C7E 100%);
    --acc-fundo-chapado:  #128C7E;
    --acc-accent:         #25D366;
    --acc-accent-rgb:     37, 211, 102;
    --acc-btn-grad:       linear-gradient(135deg, #25D366 0%, #128C7E 100%);
    --acc-btn-grad-hover: linear-gradient(135deg, #128C7E 0%, #075E54 100%);
    --acc-destaque-bg:    #f0faf4;
    --acc-destaque-borda: #c8e6d5;
    --acc-destaque-label: #128C7E;
    --acc-badge-bg:       #075E54;
}

[data-theme="escuro"] {
    --acc-texto-corpo:    #949ba4;
    --acc-fundo:          linear-gradient(135deg, #1e1f22 0%, #111214 100%);
    --acc-fundo-chapado:  #111214;
    --acc-card-bg:        #2b2d31;
    --acc-card-sombra:    0 10px 40px rgba(0, 0, 0, 0.5);
    --acc-titulo:         #f2f3f5;
    --acc-texto:          #dbdee1;
    --acc-texto-2:        #949ba4;
    --acc-texto-3:        #6d6f78;
    --acc-campo-bg:       #383a40;
    --acc-campo-fg:       #dbdee1;
    --acc-campo-fg-forte: #f2f3f5;
    --acc-campo-borda:    #1e1f22;
    --acc-campo-ph:       #6d6f78;
    --acc-accent:         #5865f2;
    --acc-accent-rgb:     88, 101, 242;
    --acc-btn-grad:       linear-gradient(135deg, #5865f2 0%, #4752c4 100%);
    --acc-btn-grad-hover: linear-gradient(135deg, #4752c4 0%, #3c45a5 100%);
    --acc-destaque-bg:    #313338;
    --acc-destaque-borda: #3f4147;
    --acc-destaque-label: #dbdee1;
    --acc-caixa-bg:       #313338;
    --acc-caixa-borda:    #3f4147;
    --acc-caixa-titulo:   #dbdee1;
    --acc-badge-bg:       #5865f2;
    --acc-link:           #949ba4;
    --acc-link-hover:     #dbdee1;
    --acc-danger:         #ed4245;
    --acc-alerta-bg:      #3d2024;
    --acc-alerta-borda:   #ed4245;
    --acc-alerta-fg:      #f2f3f5;
    --acc-check-bg:       #383a40;
    --acc-check-borda:    #4e5058;
}

[data-theme="claro"] {
    --acc-fundo:          linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
    --acc-fundo-chapado:  #dee2e6;
    --acc-card-sombra:    0 10px 40px rgba(0, 0, 0, 0.08);
    --acc-accent:         #6c757d;
    --acc-accent-rgb:     108, 117, 125;
    --acc-btn-grad:       linear-gradient(135deg, #6c757d 0%, #495057 100%);
    --acc-btn-grad-hover: linear-gradient(135deg, #5a6268 0%, #3d4349 100%);
    --acc-destaque-bg:    #f8f9fa;
    --acc-destaque-borda: #ced4da;
    --acc-destaque-label: #495057;
    --acc-badge-bg:       #6c757d;
}

/* Grafite: escuro neutro, acento teal. Mesma paleta do site.css. */
[data-theme="grafite"] {
    --acc-texto-corpo:    #9aa0a6;
    --acc-fundo:          linear-gradient(135deg, #1b1c1f 0%, #101012 100%);
    --acc-fundo-chapado:  #101012;
    --acc-card-bg:        #1b1c1f;
    --acc-card-sombra:    0 10px 40px rgba(0, 0, 0, 0.5);
    --acc-titulo:         #f5f6f7;
    --acc-texto:          #e3e5e8;
    --acc-texto-2:        #9aa0a6;
    --acc-texto-3:        #9aa0a6;
    --acc-campo-bg:       #232427;
    --acc-campo-fg:       #e3e5e8;
    --acc-campo-fg-forte: #f5f6f7;
    --acc-campo-borda:    #2c2e33;
    --acc-campo-ph:       #9aa0a6;
    --acc-accent:         #12a594;
    --acc-accent-rgb:     18, 165, 148;
    --acc-btn-grad:       linear-gradient(135deg, #12a594 0%, #0f766e 100%);
    --acc-btn-grad-hover: linear-gradient(135deg, #0f766e 0%, #0b5d57 100%);
    --acc-destaque-bg:    #16171a;
    --acc-destaque-borda: #3a3d43;
    --acc-destaque-label: #e3e5e8;
    --acc-caixa-bg:       #16171a;
    --acc-caixa-borda:    #3a3d43;
    --acc-caixa-titulo:   #e3e5e8;
    --acc-badge-bg:       #0f766e;
    --acc-link:           #9aa0a6;
    --acc-link-hover:     #e3e5e8;
    --acc-danger:         #f2555a;
    --acc-alerta-bg:      #2a2320;
    --acc-alerta-borda:   #e8a33d;
    --acc-alerta-fg:      #e8a33d;
    --acc-check-bg:       #232427;
    --acc-check-borda:    #3a3d43;
}

/* Sepia: claro quente, acento terracota. Mesma paleta do site.css. */
[data-theme="sepia"] {
    --acc-texto-corpo:    #7a6a58;
    --acc-fundo:          linear-gradient(135deg, #f6efe4 0%, #e6d9c4 100%);
    --acc-fundo-chapado:  #f6efe4;
    --acc-card-bg:        #fffaf2;
    --acc-card-sombra:    0 10px 40px rgba(0, 0, 0, 0.15);
    --acc-titulo:         #2b241c;
    --acc-texto:          #3d342a;
    --acc-texto-2:        #7a6a58;
    --acc-texto-3:        #7a6a58;
    --acc-campo-bg:       #fffdf9;
    --acc-campo-fg:       #3d342a;
    --acc-campo-fg-forte: #2b241c;
    --acc-campo-borda:    #e0d3bf;
    --acc-campo-ph:       #7a6a58;
    --acc-accent:         #b4531f;
    --acc-accent-rgb:     180, 83, 31;
    --acc-btn-grad:       linear-gradient(135deg, #b4531f 0%, #8f3f16 100%);
    --acc-btn-grad-hover: linear-gradient(135deg, #8f3f16 0%, #6f3011 100%);
    --acc-destaque-bg:    #f1e7d8;
    --acc-destaque-borda: #cdbda4;
    --acc-destaque-label: #8f3f16;
    --acc-caixa-bg:       #f1e7d8;
    --acc-caixa-borda:    #cdbda4;
    --acc-caixa-titulo:   #3d342a;
    --acc-badge-bg:       #8f3f16;
    --acc-link:           #8f3f16;
    --acc-link-hover:     #6f3011;
    --acc-danger:         #b3261e;
    --acc-alerta-bg:      #f9efd9;
    --acc-alerta-borda:   #e0c48a;
    --acc-alerta-fg:      #7a4a0a;
    --acc-check-bg:       #fffdf9;
    --acc-check-borda:    #cdbda4;
}

/* Rosa: claro, acento rosa. Mesma paleta do site.css. */
[data-theme="rosa"] {
    --acc-texto-corpo:    #7a5c68;
    --acc-fundo:          linear-gradient(135deg, #fdf2f6 0%, #efd2df 100%);
    --acc-fundo-chapado:  #fdf2f6;
    --acc-card-bg:        #fffafc;
    --acc-card-sombra:    0 10px 40px rgba(0, 0, 0, 0.15);
    --acc-titulo:         #2b1d23;
    --acc-texto:          #3d2b33;
    --acc-texto-2:        #7a5c68;
    --acc-texto-3:        #7a5c68;
    --acc-campo-bg:       #fffdfe;
    --acc-campo-fg:       #3d2b33;
    --acc-campo-fg-forte: #2b1d23;
    --acc-campo-borda:    #eed3de;
    --acc-campo-ph:       #7a5c68;
    --acc-accent:         #c42a72;
    --acc-accent-rgb:     196, 42, 114;
    --acc-btn-grad:       linear-gradient(135deg, #c42a72 0%, #a3195b 100%);
    --acc-btn-grad-hover: linear-gradient(135deg, #a3195b 0%, #7d1245 100%);
    --acc-destaque-bg:    #f7e4ec;
    --acc-destaque-borda: #ddb9c9;
    --acc-destaque-label: #a3195b;
    --acc-caixa-bg:       #f7e4ec;
    --acc-caixa-borda:    #ddb9c9;
    --acc-caixa-titulo:   #3d2b33;
    --acc-badge-bg:       #a3195b;
    --acc-link:           #a3195b;
    --acc-link-hover:     #7d1245;
    --acc-danger:         #b3261e;
    --acc-alerta-bg:      #f9efd9;
    --acc-alerta-borda:   #e0c48a;
    --acc-alerta-fg:      #7a4a0a;
    --acc-check-bg:       #fffdfe;
    --acc-check-borda:    #ddb9c9;
}

/* Lilas: claro, acento lilas. Mesma paleta do site.css. */
[data-theme="lilas"] {
    --acc-texto-corpo:    #665a7a;
    --acc-fundo:          linear-gradient(135deg, #f5f2fb 0%, #ded3f0 100%);
    --acc-fundo-chapado:  #f5f2fb;
    --acc-card-bg:        #fdfbff;
    --acc-card-sombra:    0 10px 40px rgba(0, 0, 0, 0.15);
    --acc-titulo:         #241d2e;
    --acc-texto:          #332b40;
    --acc-texto-2:        #665a7a;
    --acc-texto-3:        #665a7a;
    --acc-campo-bg:       #fefdff;
    --acc-campo-fg:       #332b40;
    --acc-campo-fg-forte: #241d2e;
    --acc-campo-borda:    #ddd3ee;
    --acc-campo-ph:       #665a7a;
    --acc-accent:         #7a53b8;
    --acc-accent-rgb:     122, 83, 184;
    --acc-btn-grad:       linear-gradient(135deg, #7a53b8 0%, #5b3a94 100%);
    --acc-btn-grad-hover: linear-gradient(135deg, #5b3a94 0%, #42296e 100%);
    --acc-destaque-bg:    #ebe4f7;
    --acc-destaque-borda: #c4b6dd;
    --acc-destaque-label: #5b3a94;
    --acc-caixa-bg:       #ebe4f7;
    --acc-caixa-borda:    #c4b6dd;
    --acc-caixa-titulo:   #332b40;
    --acc-badge-bg:       #5b3a94;
    --acc-link:           #5b3a94;
    --acc-link-hover:     #42296e;
    --acc-danger:         #b3261e;
    --acc-alerta-bg:      #f9efd9;
    --acc-alerta-borda:   #e0c48a;
    --acc-alerta-fg:      #7a4a0a;
    --acc-check-bg:       #fefdff;
    --acc-check-borda:    #c4b6dd;
}

/* Alto contraste: preto sobre branco. O card ganha borda PRETA logo abaixo - com
   todas as superficies brancas, e a borda que separa a caixa do fundo. */
[data-theme="alto-contraste"] {
    --acc-texto-corpo:    #262626;
    --acc-fundo:          linear-gradient(135deg, #0b57d0 0%, #08409b 100%);
    --acc-fundo-chapado:  #08409b;
    --acc-card-bg:        #fff;
    --acc-card-sombra:    0 10px 40px rgba(0, 0, 0, 0.25);
    --acc-titulo:         #000;
    --acc-texto:          #000;
    --acc-texto-2:        #262626;
    --acc-texto-3:        #262626;
    --acc-campo-bg:       #fff;
    --acc-campo-fg:       #000;
    --acc-campo-fg-forte: #000;
    --acc-campo-borda:    #000;
    --acc-campo-ph:       #262626;
    --acc-accent:         #08409b;
    --acc-accent-rgb:     11, 87, 208;
    --acc-btn-grad:       linear-gradient(135deg, #0b57d0 0%, #08409b 100%);
    --acc-btn-grad-hover: linear-gradient(135deg, #08409b 0%, #062f73 100%);
    --acc-destaque-bg:    #fff;
    --acc-destaque-borda: #000;
    --acc-destaque-label: #08409b;
    --acc-caixa-bg:       #fff;
    --acc-caixa-borda:    #000;
    --acc-caixa-titulo:   #000;
    --acc-badge-bg:       #08409b;
    --acc-link:           #08409b;
    --acc-link-hover:     #062f73;
    --acc-danger:         #b3261e;
    --acc-alerta-bg:      #fff;
    --acc-alerta-borda:   #000;
    --acc-alerta-fg:      #8a6100;
    --acc-check-bg:       #fff;
    --acc-check-borda:    #000;
}

/* Daltonico (Okabe-Ito): NAO repinta superficie - a tela continua clara como o azul.
   O que muda e a SINALIZACAO, com o vermelho indo para o #D55E00. */
[data-theme="daltonico"] {
    --acc-fundo:          linear-gradient(135deg, #3b8fc4 0%, #0072B2 100%);
    --acc-fundo-chapado:  #0072B2;
    --acc-accent:         #0072B2;
    --acc-accent-rgb:     0, 114, 178;
    --acc-btn-grad:       linear-gradient(135deg, #3b8fc4 0%, #0072B2 100%);
    --acc-btn-grad-hover: linear-gradient(135deg, #0072B2 0%, #005b8f 100%);
    --acc-destaque-bg:    #eef6fb;
    --acc-destaque-borda: #bcd9ea;
    --acc-destaque-label: #0072B2;
    --acc-badge-bg:       #0072B2;
    --acc-danger:         #D55E00;
    --acc-alerta-bg:      #fdf3e2;
    --acc-alerta-borda:   #E69F00;
    --acc-alerta-fg:      #8a5d00;
}

/* ----------------------------------------------------------------------------
   REGRAS QUE A BASE DAS TELAS NAO TEM.

   .form-label, <a>, ::placeholder, .alert-danger, .form-check-input (desmarcado) e
   .text-muted nao sao estilizados por nenhuma das telas - hoje eles saem no padrao
   do Bootstrap. As regras abaixo existem porque, num tema de fundo escuro ou de
   paleta quente, esse padrao fica ilegivel.

   POR QUE A LISTA DE TEMAS E EXPLICITA, e nao "todo tema menos o azul": verde e
   claro TAMBEM caem no padrao do Bootstrap hoje. Aplicar estas regras a eles
   mudaria duas telas que ninguem pediu para mudar. Escuro entra porque ja tinha
   exatamente estas regras escritas a mao - com os mesmos valores que os tokens dele
   agora carregam.
   ---------------------------------------------------------------------------- */
:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .form-label { color: var(--acc-texto); }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .form-control { background: var(--acc-campo-bg); color: var(--acc-campo-fg); border-color: var(--acc-campo-borda); }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .form-control::placeholder { color: var(--acc-campo-ph); }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .input-group-text { background: var(--acc-campo-bg); color: var(--acc-texto-2); }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .cns-input .form-control { background: var(--acc-campo-bg); color: var(--acc-campo-fg-forte); }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .cns-input .text-muted { color: var(--acc-texto-2) !important; }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .form-check-input { background-color: var(--acc-check-bg); border-color: var(--acc-check-borda); }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .form-check-label { color: var(--acc-texto); }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .text-danger { color: var(--acc-danger) !important; }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) .alert-danger {
    background: var(--acc-alerta-bg);
    border-color: var(--acc-danger);
    color: var(--acc-alerta-fg);
}

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) a { color: var(--acc-link); }

:is([data-theme="escuro"],
    [data-theme="grafite"],
    [data-theme="sepia"],
    [data-theme="alto-contraste"],
    [data-theme="daltonico"],
    [data-theme="rosa"],
    [data-theme="lilas"]) a:hover { color: var(--acc-link-hover); }

/* Troca do logo nos temas de fundo ESCURO: o logo colorido some e entra a versao
   branca/dourada. Nao e cor, e display - por isso nao vira token.
   O Login e a unica tela que tem as duas imagens; nas outras a regra nao casa com
   nada e nao custa nada. */
:is([data-theme="escuro"], [data-theme="grafite"]) .logo-login-padrao { display: none !important; }
:is([data-theme="escuro"], [data-theme="grafite"]) .logo-login-claro { display: inline-block !important; }

/* Alto contraste: com todas as superficies brancas, a caixa some no fundo se nao
   tiver borda. A borda entra SO neste tema - declarar `border: 0` no :root e
   engrossar aqui mudaria o tamanho da caixa nos outros sete. */
[data-theme="alto-contraste"] .login-card,
[data-theme="alto-contraste"] .card { border: 2px solid #000; }
