/* ============================================================
   THEME.CSS — Tokens de marca (white-label)
   Para criar um novo cliente, duplique este arquivo e altere
   apenas as variáveis abaixo. Nenhum outro CSS precisa mudar.
   ============================================================ */

:root {
  /* ----- Identidade ----- */
  --brand-name: "IDB360";

  /* ----- Cores primárias ----- */
  --brand-primary: #2f6bff;          /* azul principal (botões, links, destaques) */
  --brand-primary-dark: #1e4fd6;
  --brand-primary-soft: #e8efff;     /* fundo suave de ícones/badges */
  --brand-accent: #8b3dff;           /* roxo de apoio (gradientes, campanha) */
  --brand-gradient: linear-gradient(135deg, var(--brand-primary) 0%, var(--brand-accent) 100%);

  /* ----- Sidebar / topo escuro ----- */
  --sidebar-bg: #0a102e;
  --sidebar-bg-2: #0e1740;
  --sidebar-text: #aab3d6;
  --sidebar-text-active: #ffffff;
  --sidebar-active-bg: rgba(47, 107, 255, .18);
  --sidebar-width: 240px;

  /* ----- Hero / campanha ----- */
  --hero-bg: radial-gradient(1200px 400px at 70% 20%, #1c2a6e 0%, #0a102e 60%);

  /* ----- Superfícies ----- */
  --body-bg: #f3f5fb;
  --card-bg: #ffffff;
  --card-border: #e7eaf3;
  --card-radius: 14px;
  --card-shadow: 0 1px 2px rgba(16, 24, 64, .04), 0 4px 16px rgba(16, 24, 64, .05);

  /* ----- Texto ----- */
  --text-strong: #131c3d;
  --text-body: #3d4666;
  --text-muted: #7b84a3;

  /* ----- Estados / feedback ----- */
  --success: #16a34a;
  --success-soft: #e6f7ec;
  --danger: #e11d48;
  --danger-soft: #fdeaef;
  --warning: #d97706;
  --warning-soft: #fdf3e2;
  --info: #0284c7;
  --info-soft: #e4f3fb;

  /* ----- Qualificações (gemas) ----- */
  --gem-rubi: #e11d48;
  --gem-esmeralda: #15803d;
  --gem-safira: #2563eb;
  --gem-diamante: #94a3b8;
  --gem-duplo: #8b3dff;
  --gem-executivo: #d4a017;
  --gem-embaixador: #eab308;

  /* ----- Tipografia -----
     "Noto Sans SC" cobre os glyphs CJK (chinês), que as latinas (Inter / Plus
     Jakarta Sans) não têm. O Google Fonts usa unicode-range, então os glyphs
     CJK só são baixados quando há texto chinês na página.

     Ela fica no FIM da pilha, e não em segundo lugar, por causa dos caracteres
     LATINOS: a ordem só importa quando a fonte da frente não desenha algum
     caractere — porque não carregou, por exemplo. Aí a próxima da pilha assume,
     e uma CJK desenha em largura inteira. Foi o que apareceu no campo de senha,
     cuja bolinha saía maior aqui do que no Painel (que não tem CJK na pilha):
     medido em pixels, passo de 16 px com a CJK na frente contra 13 px sem ela.
     No fim da pilha o chinês continua coberto — nem a Inter nem a do sistema o
     cobrem, então esses caracteres chegam à Noto de qualquer jeito. */
  --font-display: "Plus Jakarta Sans", system-ui, sans-serif, "Noto Sans SC";
  --font-body: "Inter", system-ui, sans-serif, "Noto Sans SC";

  /* ----- Gráficos (Chart.js lê via JS) ----- */
  --chart-1: #2f6bff;
  --chart-2: #8b3dff;
  --chart-3: #10b981;
  --chart-4: #f43f5e;
  --chart-grid: #edf0f7;
}

/* ============================================================
   EXEMPLO DE OUTRO CLIENTE (Atlântica Natural) — basta trocar
   o atributo data-theme="atlantica" na tag <html>.
   ============================================================ */
[data-theme="atlantica"] {
  --brand-primary: #b08a1e;
  --brand-primary-dark: #8f6f14;
  --brand-primary-soft: #f7f0dc;
  --brand-accent: #1c1c1c;
  --brand-gradient: linear-gradient(135deg, #b08a1e 0%, #6b5410 100%);
  --sidebar-bg: #141414;
  --sidebar-bg-2: #1e1e1e;
  --sidebar-active-bg: rgba(176, 138, 30, .22);
  --hero-bg: radial-gradient(1200px 400px at 70% 20%, #3a2f0e 0%, #141414 60%);
  --chart-1: #b08a1e;
  --chart-2: #6b5410;
}