/* Modo escuro do TreineIA.
   Só é carregado quando o aparelho está no modo escuro:
   <link rel="stylesheet" href="/escuro.css" media="(prefers-color-scheme: dark)">
   Vem depois do CSS de cada página e troca as variáveis de cor e as cores
   escritas direto nas páginas. O topo azul e a calculadora continuam iguais. */

:root{
  color-scheme:dark;
  --cal:#0E1A21;          /* fundo da página */
  --papel:#16242D;        /* cartões */
  --grafite:#E4E9E1;      /* texto */
  --grafite2:#A3B1B8;     /* texto secundário */
  --risco:#2B3B45;        /* linhas e bordas */
  --sim:#2F9E64;--sim-bg:#15301F;
  --nao:#F08A80;--nao-bg:#3A1D1A;
  --tal:#F0B550;--tal-bg:#33280F;
}

/* links: texto claro com o sublinhado âmbar de sempre */
a{color:var(--grafite)}
.detalhado span a,.tabajuda tbody th a{color:var(--grafite)}

/* cartões que eram brancos */
.menu ul{background:var(--papel);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.q-ops span,.q-card{background:var(--cal)}
.loja-sup,.pcard,.naolista li{background:var(--papel)}
.outras a:hover{background:#1C2C36}

/* bordas escuras grossas viram cinza */
.tabela,.quiz{border-color:#3A4B56}

/* cabeçalhos de tabela: azul do topo */
.linha.cab,.tabcomp thead th,.tabajuda thead th{background:var(--azul);color:rgba(255,255,255,.8)}

/* selos e números que eram escuros com texto branco: claros com texto escuro */
.t-num,.nv-selo,.sup-card .sup-kicker,.detalhado li::before,.q-ops input:checked+span{color:#13242E}

/* fundos creme e âmbar claro */
.sup-card,.falta-sup,.veredito,.sup{background:#241D0E;border-color:#5E4A1E}
.linha.top,.nome a:hover,.q-card.primeira,.aviso-golpe{background:rgba(243,167,18,.09)}
.q-vazio{background:rgba(243,167,18,.13)}
td.st-talvez{background:rgba(243,167,18,.10)}

/* fundos verde-claro */
.compartilhe,.fim-pp{background:#132A1F;border-color:#24503A}
.quem .gratis{border-color:#24503A}

/* textos coloridos que eram escuros */
.loja-sup span{color:#F0B550}
.q-motivos li::before{color:#5CC48B}
.resposta.algumas strong{color:#F0B550}
.resposta.nao strong{color:#F08A80}
.lvalor{color:var(--acento)}

/* cartãozinho do suporte no topo continua claro: texto escuro */
.suporte-canto{color:#13242E}
.suporte-canto small{color:#4E5F69}

/* verificador de celular: campo de busca e sugestões escuros */
.campo input{background:var(--papel);color:var(--grafite);border-color:#3A4B56}
#sugestoes{background:var(--papel);color:var(--grafite);box-shadow:0 12px 30px rgba(0,0,0,.5)}

/* sombras azuladas somem no escuro: sombra preta leve */
.comece-card,.lcard,.resposta,.resumo-card,.passo-card,.loja,.cartao{box-shadow:0 12px 30px rgba(0,0,0,.28)}
.calc{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}

/* botão do topo: no escuro mostra o sol (para voltar ao claro) */
.tema-topo .lua{display:none}
.tema-topo .sol{display:block}