/* Somaia · identidade visual. Todas as cores do app saem daqui.
   Base clara e quente (papel), tinta azul-marinho e o dourado do Lucas Maia como o valor que soma.
   data-tema: marinho (padrão, "Marinho") | esmeralda ("Sálvia") | rosa ("Coral") | roxo ("Lavanda") | grafite ("Oceano")
   data-modo: claro (padrão) | escuro (opcional, em Ajustes)
   As cores de significado (ok / atenção / alerta, entrada / saída) não mudam com o tema. */

:root {
  --fonte: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --raio: 20px;
  --raio-p: 12px;
  --sombra: 0 1px 2px rgba(27, 35, 51, .04), 0 6px 20px rgba(27, 35, 51, .06);
  --sombra-forte: 0 10px 30px rgba(27, 35, 51, .14);

  --fundo: #F7F5F0;
  --superficie: #FFFFFF;
  --superficie-2: #F2EFE8;
  --borda: #E7E2D8;
  --texto: #1B2333;
  --texto-2: #5B6475;
  --texto-3: #8F96A3;

  --ok: #1E8A4C;      --ok-suave: #E4F3EA;
  --atencao: #B7791F; --atencao-suave: #FBF0DC;
  --alerta: #C8492F;  --alerta-suave: #FBE7E1;
  --entrada: #1E8A4C;
  --saida: #1B2333;

  /* Gráficos (validados para daltonismo e contraste) */
  --g-positivo: #2a78d6;
  --g-negativo: #d03a2f;
  --g-barra: #2a78d6;
  /* 50-30-20: contas da casa, estilo de vida, futuro (validado; sempre com rótulo visível) */
  --g-necessidade: #2a78d6;
  --g-desejo: #eb6834;
  --g-investimento: #1baf7a;
  --g-dividas: #6250d6;

  /* Tema "Marinho" (marinho e dourado do Lucas Maia) */
  --acento: #1F3A68;
  --acento-texto: #FFFFFF;
  --acento-suave: #E8EDF6;
  --ouro: #C99A2E;
  --ouro-suave: #FBF3DF;
  --topo-fundo: #F7F5F0;
  --topo-texto: #1B2333;
  --topo-texto-2: #5B6475;
}

[data-modo="escuro"] {
  --fundo: #10141C;
  --superficie: #181D27;
  --superficie-2: #212734;
  --borda: #2B3242;
  --texto: #F1F2F5;
  --texto-2: #A9B0BE;
  --texto-3: #727A8B;
  --sombra: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .25);

  --ok: #4ADE80;      --ok-suave: rgba(74, 222, 128, .12);
  --atencao: #FBBF24; --atencao-suave: rgba(251, 191, 36, .12);
  --alerta: #FB7A4B;  --alerta-suave: rgba(251, 122, 75, .13);
  --entrada: #4ADE80;
  --saida: #F1F2F5;

  --g-positivo: #3987e5;
  --g-negativo: #e5574b;
  --g-barra: #3987e5;
  --g-necessidade: #3987e5;
  --g-desejo: #d95926;
  --g-investimento: #199e70;
  --g-dividas: #9085e9;

  --acento: #E2B54E;
  --acento-texto: #1B2333;
  --acento-suave: rgba(226, 181, 78, .14);
  --ouro: #E2B54E;
  --ouro-suave: rgba(226, 181, 78, .12);
  --topo-fundo: #10141C;
  --topo-texto: #F1F2F5;
  --topo-texto-2: #A9B0BE;
}

/* Personalização: trocam só o acento */
[data-tema="esmeralda"] { --acento: #2F6F4F; --acento-suave: #E5F1EA; }
[data-tema="rosa"]      { --acento: #C24E63; --acento-suave: #FBE9EC; }
[data-tema="roxo"]      { --acento: #5B47B8; --acento-suave: #EEEAFB; }
[data-tema="grafite"]   { --acento: #17718F; --acento-suave: #E3F1F6; }
[data-tema="esmeralda"][data-modo="escuro"] { --acento: #5CC18B; --acento-texto: #0D2418; --acento-suave: rgba(92, 193, 139, .14); }
[data-tema="rosa"][data-modo="escuro"]      { --acento: #F08AA0; --acento-texto: #3A0E19; --acento-suave: rgba(240, 138, 160, .14); }
[data-tema="roxo"][data-modo="escuro"]      { --acento: #A99AF5; --acento-texto: #1E1446; --acento-suave: rgba(169, 154, 245, .15); }
[data-tema="grafite"][data-modo="escuro"]   { --acento: #5BC0E0; --acento-texto: #072631; --acento-suave: rgba(91, 192, 224, .14); }

/* Calendário de gastos: tons de uma cor só (escala sequencial), mais escuro = gastou mais */
:root { --h1: #cde2fb; --h2: #9ec5f4; --h3: #5598e7; --h4: #256abf; --h5: #104281; --h-texto-forte: #FFFFFF; }
[data-modo="escuro"] { --h1: #184f95; --h2: #256abf; --h3: #3987e5; --h4: #6da7ec; --h5: #b7d3f6; --h-texto-forte: #10141C; }

/* ── Mais cor e vida (Somaia) ───────────────────── */
:root {
  --fundo: #FFF8F1;
  --superficie-2: #F6F1EA;
  --ouro: #E9A912;
  --ouro-suave: #FFF1CC;
  --heroi: linear-gradient(135deg, #1F3A68 0%, #3456B8 55%, #6E52D6 100%);
  --cta: linear-gradient(135deg, #FFC93C 0%, #FF9F2E 100%);
  --cta-texto: #3A2300;
  --fundo-decor: radial-gradient(60% 40% at 0% 0%, #FFE3CC 0%, transparent 70%), radial-gradient(50% 35% at 100% 8%, #E2E7FF 0%, transparent 70%), radial-gradient(45% 30% at 80% 100%, #DDF5EC 0%, transparent 70%);
  /* tinta suave de cada grupo (fundo de ícones e cabeçalhos) */
  --t-receita: #E1F5E7; --t-necessidade: #E2EEFC; --t-desejo: #FDE9DC; --t-investimento: #DDF5EE;
}
[data-modo="escuro"] {
  --heroi: linear-gradient(135deg, #22346A 0%, #3A3F9E 55%, #5B3FA8 100%);
  --fundo-decor: radial-gradient(60% 40% at 0% 0%, rgba(255, 160, 80, .10) 0%, transparent 70%), radial-gradient(50% 35% at 100% 8%, rgba(110, 82, 214, .16) 0%, transparent 70%);
  --t-receita: rgba(74, 222, 128, .12); --t-necessidade: rgba(57, 135, 229, .16); --t-desejo: rgba(217, 89, 38, .16); --t-investimento: rgba(25, 158, 112, .16);
}
[data-tema="esmeralda"] { --heroi: linear-gradient(135deg, #1F5A40 0%, #2F8A5F 55%, #4FB58A 100%); }
[data-tema="rosa"]      { --heroi: linear-gradient(135deg, #8E2C4A 0%, #C24E63 55%, #F08A6C 100%); }
[data-tema="roxo"]      { --heroi: linear-gradient(135deg, #3B2A8C 0%, #5B47B8 55%, #9A6FE0 100%); }
[data-tema="grafite"]   { --heroi: linear-gradient(135deg, #0F4C63 0%, #17718F 55%, #33A7C2 100%); }

:root { --t-dividas: #ECE9FB; }
[data-modo="escuro"] { --t-dividas: rgba(144, 133, 233, .16); }