/**
 * theme-default.css — o tema PADRÃO do sistema, exatamente como ele já
 * roda hoje. Nada aqui muda a aparência de quem nunca mexeu em temas —
 * é só o mesmo visual de sempre, só que agora nomeado em variáveis, pra
 * dar pra trocar tudo de uma vez quando outro tema for escolhido.
 *
 * Como funciona: cada variável abaixo é um "nome" pra uma cor que já
 * existia espalhada pelo código (ex: o texto principal do app sempre foi
 * a cor #EDE7DA — agora ela tem um nome, --cor-texto-principal). O
 * restante do app passa a USAR esses nomes (var(--cor-texto-principal))
 * em vez do código de cor direto — e quando um tema diferente é
 * escolhido, é só REDEFINIR o valor de cada nome aqui embaixo que a tela
 * inteira muda sozinha, sem precisar mexer em nenhum outro arquivo.
 *
 * :root[data-theme="default"] — essas variáveis só valem quando o tema
 * ativo é "default" (o atributo data-theme na tag <html>, controlado
 * pelo theme-manager.js). O outro tema (theme-fintech-pro.css) tem seu
 * próprio bloco :root[data-theme="..."] com os MESMOS NOMES de
 * variável, só que com valores diferentes.
 */
:root[data-theme="default"],
:root:not([data-theme]) {
  /* Avisa o navegador que esse tema é escuro — sem isso, o menu do
     <select> (dropdown nativo do sistema, tipo "Escolha o bloco...")
     costuma abrir com fundo BRANCO fixo, mesmo com toda a paleta escura
     configurada acima, porque o navegador não tem como saber sozinho.
     O texto (que já é claro, pra combinar com o resto do tema escuro)
     ficava então quase ilegível em cima desse branco — texto claro
     sobre fundo claro. Com "dark" aqui, o navegador já abre esse menu
     com um fundo escuro por padrão, combinando com o texto claro. */
  color-scheme: dark;

  /* ---------- Fundos (do mais escuro ao mais claro) ---------- */
  --cor-fundo-app: #10201A;        /* fundo geral do app, atrás de tudo */
  --cor-fundo-escuro: #0E1C16;     /* fundo de campos de formulário (inputs) */
  --cor-fundo-escuro2: #17281F;    /* fundo escuro alternativo, usado em alguns painéis */
  --cor-fundo-input: #1D2E25;      /* fundo de linha/hover em listas e tabelas */
  --cor-borda-sutil: #223229;      /* borda sutil usada em cards/separadores (era chamada de "fundo alternativo", mas na prática é sempre usada como borda) */
  --cor-fundo-alt2: #1F2E27;       /* outro fundo alternativo, tom próximo do anterior */
  --cor-card: #16241D;             /* fundo padrão dos cards (S.card) */
  --cor-card-alt: #26392F;         /* fundo de card em destaque/hover */

  /* ---------- Textos (do mais forte ao mais apagado) ---------- */
  --cor-texto-principal: #EDE7DA;   /* texto principal, títulos, valores importantes */
  --cor-texto-secundario: #9CB0A4;  /* labels de campo, texto de apoio */
  --cor-texto-meta: #7C9186;        /* texto pequeno de metadado (datas, legendas) */
  --cor-texto-claro-alt: #B7C4BB;   /* texto claro alternativo, usado em alguns títulos secundários */
  --cor-texto-apagado: #5A6E62;     /* texto bem discreto (links secundários, "saiba mais") */
  --cor-cinza-neutro: #8A8A8A;      /* cinza neutro, usado em relatórios/PDF exportado */

  /* ---------- Bordas ---------- */
  --cor-borda: #2C4038;            /* borda padrão de cards e inputs */
  --cor-borda-secundaria: #3A4E43; /* borda de botões secundários/outline */

  /* ---------- Cores de sentido (sucesso, erro, info, destaque) ---------- */
  --cor-sucesso: #7FA88F;          /* verde — valores positivos, "valorizou", confirmações */
  --cor-sucesso-claro: #9CCBAA;    /* verde mais claro, usado em detalhes/ícones de sucesso */
  --cor-erro: #D08A6F;             /* terracota — avisos, "desvalorizou", exclusão */
  --cor-erro-forte: #B0664A;       /* terracota mais forte — botões de ação destrutiva */
  --cor-info: #8E9BC7;             /* azul/roxo suave — status neutros (ex: "aguardando") */
  --cor-icone-neutro: #4A5D53;     /* cor de ícone em estados vazios/neutros */

  /* --cor-destaque já existe como configuração de Personalização (Painel
     → Personalização) — o tema NÃO redefine ela, só respeita o que a
     pessoa já escolheu lá (dourado #C9A050 é só o valor padrão de
     fábrica, antes de qualquer personalização). */

  /* ---------- Formas — arredondamento e espessura de borda ---------- */
  --raio-card: 14px;                 /* arredondamento padrão dos cards (valor original do sistema) */
  --raio-botao: 10px;                /* arredondamento dos botões (valor original do sistema) */
  --raio-input: 8px;                 /* arredondamento dos campos de formulário (valor original do sistema) */
  --espessura-borda: 1px;            /* espessura padrão das bordas */
  --sombra-card: none;               /* o tema padrão não usa sombra nos cards */

  /* ---------- Tipografia ---------- */
  --fonte-titulo: 'Fraunces', serif;       /* fonte dos títulos grandes (nome do sistema, etc) */
  --fonte-corpo: 'Inter', sans-serif;      /* fonte do resto do app */
}

/* Texto apagado/ilegível dentro do menu do <select> (ex: "Conta de onde
   sai o pagamento"). Motivo: a cor do texto (--cor-texto-principal, um
   tom claro pra combinar com o tema escuro) É herdada por padrão pelas
   <option> de dentro — mas o FUNDO não é herdado (não é uma propriedade
   de CSS que passa dos pais pros filhos), e o "color-scheme: dark" ali
   em cima nem sempre é o bastante sozinho pra fazer o navegador pintar
   esse fundo de escuro (varia por navegador/sistema operacional) — daí o
   fundo às vezes fica branco, com aquele texto claro quase invisível em
   cima. Aqui é dito explicitamente qual fundo e qual cor de texto usar
   em cada <option>, sem depender do navegador adivinhar. */
:root[data-theme="default"] select option,
:root:not([data-theme]) select option {
  background-color: var(--cor-fundo-escuro);
  color: var(--cor-texto-principal);
}