/* =====================================================================
   Tema claro.

   Nada aqui redesenha componente: o arquivo so troca o valor das
   variaveis quando o <html> esta com data-tema="claro". Como a escala de
   tons e o branco de sobreposicao ja sao variaveis, trocar estes valores
   vira o app inteiro de uma vez.
   ===================================================================== */
:root { color-scheme: dark; }

:root[data-tema="claro"] {
  color-scheme: light;

  /* A escala nao e so invertida: ela troca de logica. No tema escuro o
     painel e MAIS CLARO que o fundo; no claro tem que ser o contrario --
     fundo cinza, superficies brancas. A primeira versao deixou os dois a
     seis pontos de distancia e a barra lateral sumia dentro da pagina. */
  --tom1:#eceef3;   /* fundo da pagina */
  --tom2:#f5f6f9;   /* fundo alternativo */
  --tom3:#ffffff;   /* barra lateral, topo e faixas */
  --tom4:#ffffff;   /* painel */
  --tom5:#f6f7fa;   /* painel elevado */
  --tom6:#eff1f5;   /* cartao dentro do painel */
  --tom7:#d3d6df;   /* linha e borda forte */
  --tom8:#8b8f9b;   /* borda fraca e texto apagado */
  --tom-azul:#eaf0f7;
  --tom-menu:#3a3d46;

  /* As sobreposicoes eram branco sobre escuro; viram preto sobre claro,
     e as 139 regras que usam rgba(var(--sobre),X) acompanham. */
  --sobre:0,0,0;

  --text:#16161a;
  --muted:#565a64;
  --soft:#8a8e99;
  --shadow:0 10px 30px rgba(0,0,0,.10);
}

/* Superficie branca sobre fundo claro precisa de linha para existir. */
:root[data-tema="claro"] .sidebar { border-right:1px solid var(--tom7); }
:root[data-tema="claro"] .topbar { border-bottom:1px solid var(--tom7); }

/* Pontos que tinham cor escura cravada e nao viraram variavel. Ficam
   aqui, com nome: e a lista do que ainda falta converter. */
:root[data-tema="claro"] .site-header { background: rgba(255,255,255,.75); }
:root[data-tema="claro"] .home-landing { background: var(--tom1); }
:root[data-tema="claro"] .menu-btn.active {
  background: linear-gradient(135deg,#ffe1e2,#ffcfd1) !important;
  color: #b3121b !important;
}