/* =====================================================================
   MODO ESCURO
   Carregado pelo head.php conforme a preferência da pessoa (Meu perfil → Aparência):
     - "Igual ao aparelho" (padrão): só vale quando o aparelho está no tema escuro
       (o <link> leva media="(prefers-color-scheme: dark)");
     - "Escuro": sempre;  - "Claro": este arquivo nem é carregado.
   Funciona redefinindo as variáveis de cor de base.css; aqui só ficam
   os poucos ajustes que não dá para resolver só com variável.
   ===================================================================== */
:root {
    color-scheme: dark;   /* calendário, barras de rolagem e campos nativos no tema escuro */

    --azul-900: #e6edf5;
    --azul-800: #d0dbe7;
    --azul-700: #b4c5d8;
    --azul-600: #98adc3;
    --azul-500: #7c93ab;
    --azul-400: #566a80;
    --azul-300: #3a4859;
    --azul-200: #2a3542;
    --azul-100: #1f2833;
    --azul-50:  #18202a;
    --preto:    #eef3f8;   /* botões "escuros" viram claros: continuam sendo o destaque */
    --texto:    #d6dee8;
    --muted:    #94a2b3;
    --borda:    #2f3b49;
    --branco:   #11171e;   /* fundo da página e dos cartões */
    --ok:       #5fbf94;
    --ok-bg:    #15302a;
    --erro:     #e8828a;
    --erro-bg:  #3a1e23;
    --alerta:   #dcae55;
    --alerta-bg:#372c15;
    --info:     #86ade0;
    --info-bg:  #192a3e;
    --dourado:  #d8ba7e;

    --acento:        #4f6b8a;
    --acento-suave:  #4f6b8a;
    --sobre-acento:  #fff;
    --nav-fundo:     rgba(28, 36, 46, .92);
    --vidro:         rgba(255, 255, 255, .07);
    --vidro-forte:   rgba(255, 255, 255, .14);
    --vidro-cartao:  rgba(17, 23, 30, .9);
    --linha-hover:   #18202a;
    --info-txt:      #a9c7ee;
    --ok-txt:        #93d9b6;
    --erro-txt:      #f2aeb3;
    --alerta-txt:    #ecc77f;
    --trabalho-bg:   #3a2f18;
    --trabalho-txt:  #e3c27f;
    --dica-fundo:    #2c3846;
    --placeholder:   #66778a;
    --icone-foto:    rgba(255, 255, 255, .35);
    --seta-select:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2398adc3' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");
    --sombra:    0 6px 24px rgba(0, 0, 0, .35);
    --sombra-lg: 0 18px 50px rgba(0, 0, 0, .55);
}

/* botões com cor de hover fixa */
.btn-escuro:hover { background: #fff; }
.btn-perigo:hover { background: #f09aa0; }
.btn-ok:hover { background: #77cfa8; }
.btn-login, input[type=file]::file-selector-button { background: var(--acento); color: #fff; }

/* rodapé: no claro os títulos são azuis; no escuro continuam claros como antes */
.rodape h4 { color: var(--preto); }

/* topo e faixas */
.marca { text-shadow: none; }
.faixa-teste { background: #0a0e13; color: #cfd8e2; }
.bolinha { border-color: var(--azul-200); }

/* login/cadastro: arte com o mesmo desenho, em tons escuros */
.auth-arte { background: linear-gradient(160deg, rgba(38, 51, 63, .62), rgba(16, 22, 30, .86)), url("../img/login-arte.png") center 30% / cover no-repeat, #26333f; }

/* fundo atrás das janelas */
.modal { background: rgba(0, 0, 0, .6); }

/* fotos: um pouco menos de brilho para não ofuscar no escuro */
.card-proc .foto img, .hero-grande img, .hero-mini img, .mosaico-item img, .detalhe-foto img { filter: brightness(.94); }

/* o check marcado continua visível */
.chip:has(input:checked), .chip.ativo, .paginacao .atual { border-color: var(--acento); }
.aviso-presente { background: linear-gradient(120deg, #2f2618, #33202a); color: #f2dcc0; border-color: #5a4630; }
.aviso-presente i { color: #e2b778; }
.chip-beneficios { background: linear-gradient(120deg, #2f2618, #33202a); color: #f2dcc0; border-color: #5a4630; }
.faixa-manutencao { background: #2e2618; color: #ecd9b8; border-bottom-color: #4a3c22; }
.faixa-manutencao-ligada { background: #331c1c; color: #f0c9c9; border-bottom-color: #5a2a2a; }
.mnt-status-ligada { border-color: #5a2a2a; }
.mnt-status-ligada .mnt-status-icone { background: #331c1c; color: #f0a5a5; }
.mnt-status-programada .mnt-status-icone { background: #2e2618; color: #e2bd7c; }

.modal-notif .modal-fechar { background: var(--branco); }
.btn-zap { background: #16291f; color: #8fe0b0; border-color: #24503a; }
.btn-zap:hover { background: #1c3527; color: #b5f0cd; }

/* logo branca no tema escuro */
.so-claro { display: none !important; }
.so-escuro { display: block !important; }
@media (min-width: 561px) { .marca .marca-mono.so-escuro { display: none !important; } }
@media (max-width: 560px) { .marca .marca-logo.so-escuro { display: none !important; } }