/* 7Bee CRM — design tokens
   Paleta trazida do Dashboard CDT: grafite azulado quase preto, lima neon como
   cor da marca e amarelo neon para o que pede atenção humana.
   Tema escuro é o padrão. Tema claro: <html data-theme="light">. */

:root, [data-theme="dark"] {
  --bg: #0A0A10; /* Fundo da página, o mesmo preto azulado do dashboard. */
  --bg-aura: rgb(172 234 72 / .07); /* Brilho verde no canto superior esquerdo, atrás do cabeçalho. */
  --surface: #13131B; /* Cards, cabeçalho e painéis. */
  --surface-raised: #1B1B26; /* Hover de card, botões secundários, abas inativas. */
  --surface-sunken: #0E0E15; /* Campos de texto e selects. */
  --border: #23232F; /* Contornos decorativos de card e divisórias. */
  --border-control: #6E6E88; /* Borda de inputs e botões secundários (≥3:1). */
  --sheen: linear-gradient(180deg, rgb(255 255 255 / .035), transparent 38%); /* Reflexo discreto no topo dos cards. */

  --ink: #ECECF1; /* Texto principal. */
  --ink-muted: #A3A3B5; /* Texto secundário, legendas, empresa do contato. */
  --ink-subtle: #8B8BA0; /* Metadados e rótulos pequenos. O cinza do dashboard (#6B6B80) fica abaixo de 4.5:1, por isso este é um tom acima. */

  --accent: #ACEA48; /* Lima neon: cor da marca. Botão principal, aba ativa, barras de progresso, dado que é o destaque do período. */
  --accent-strong: #C2F56A; /* Hover do botão principal. */
  --on-accent: #0B1003; /* Texto e ícone sobre lima. */
  --accent-soft: #1A2310; /* Fundo de aba de filtro ativa e realces suaves. */
  --accent-text: #ACEA48; /* Lima como texto sobre surface e bg. */

  --honey: #FFF176; /* Amarelo neon: atenção humana. O agente escalou, "Precisam de você". */
  --honey-strong: #FFF59D;
  --on-honey: #1A1600;
  --honey-soft: #2A2712; /* Fundo do painel do agente quando ele escala. */
  --honey-text: #FFF176;

  --amber: #FBBF24; /* Só para linhas de seção, como o "Ontem" do dashboard. */
  --orange: #FB923C; /* Só para linhas de seção, como o "Semana" do dashboard. */

  --success: #4ADE9B; /* Positivo: resolvida, acertou, tudo em dia. */
  --success-soft: #0F2A1F;
  --danger: #FF7A66; /* Negativo ou urgente: prioridade alta, fora do prazo, descartar. */
  --danger-soft: #2E1512;
  --info: #7CB4FF; /* O que o agente de IA fez sozinho. */
  --info-soft: #111D33;

  --focus: var(--accent); /* Anel de foco em todo controle. */

  /* Brilhos neon: usados só em poucos dados, para que eles saltem da tela. */
  --glow-accent: 0 0 0 1px rgb(172 234 72 / .45), 0 0 26px -4px rgb(172 234 72 / .40), inset 0 0 36px rgb(172 234 72 / .06);
  --glow-honey: 0 0 0 1px rgb(255 241 118 / .45), 0 0 26px -4px rgb(255 241 118 / .35), inset 0 0 36px rgb(255 241 118 / .05);
  --glow-danger: 0 0 0 1px rgb(255 122 102 / .45), 0 0 24px -4px rgb(255 122 102 / .32), inset 0 0 32px rgb(255 122 102 / .05);
  --text-glow-accent: 0 0 16px rgb(172 234 72 / .55), 0 0 2px rgb(172 234 72 / .45);
  --text-glow-honey: 0 0 16px rgb(255 241 118 / .50), 0 0 2px rgb(255 241 118 / .40);
  --text-glow-danger: 0 0 14px rgb(255 122 102 / .45);
  --bar-glow-accent: 0 0 10px rgb(172 234 72 / .65);
  --tint-accent: linear-gradient(135deg, rgb(172 234 72 / .10), transparent 60%);
  --tint-honey: linear-gradient(135deg, rgb(255 241 118 / .09), transparent 60%);
  --tint-danger: linear-gradient(135deg, rgb(255 122 102 / .09), transparent 60%);

  --shadow-card: 0 1px 0 rgb(255 255 255 / .03) inset, 0 10px 30px rgb(0 0 0 / .45);
  --shadow-accent: 0 0 20px -2px rgb(172 234 72 / .45);
  --backdrop: rgb(4 4 8 / .72);
  --qr-bg: #FFFFFF; /* Fundo do QR code: o leitor do celular precisa de claro atrás do código, nos dois temas. */
  color-scheme: dark;
}

[data-theme="light"] {
  --bg: #F5F6F1;
  --bg-aura: rgb(172 234 72 / .16);
  --surface: #FFFFFF;
  --surface-raised: #EEF0E8;
  --surface-sunken: #FFFFFF;
  --border: #E2E4DA;
  --border-control: #8C8CA0;
  --sheen: linear-gradient(180deg, rgb(255 255 255 / .6), transparent 38%);

  --ink: #14141C;
  --ink-muted: #55556A;
  --ink-subtle: #62627A;

  --accent: #ACEA48;
  --accent-strong: #9AD83A;
  --on-accent: #0B1003;
  --accent-soft: #EEF8DC;
  --accent-text: #3F6212;

  --honey: #E5C100;
  --honey-strong: #CCAB00;
  --on-honey: #1A1600;
  --honey-soft: #FBF5D0;
  --honey-text: #7A5A00;

  --amber: #B45309;
  --orange: #C2410C;

  --success: #177245;
  --success-soft: #E1F5EA;
  --danger: #B42318;
  --danger-soft: #FDE6E2;
  --info: #1D5FA8;
  --info-soft: #E3EDFB;

  --focus: #3F6212;

  /* No claro o neon vira sombra: brilho em fundo branco só apaga o dado. */
  --glow-accent: 0 0 0 1px rgb(63 98 18 / .40), 0 8px 22px -6px rgb(63 98 18 / .22);
  --glow-honey: 0 0 0 1px rgb(122 90 0 / .40), 0 8px 22px -6px rgb(122 90 0 / .20);
  --glow-danger: 0 0 0 1px rgb(180 35 24 / .40), 0 8px 22px -6px rgb(180 35 24 / .18);
  --text-glow-accent: none;
  --text-glow-honey: none;
  --text-glow-danger: none;
  --bar-glow-accent: none;
  --tint-accent: linear-gradient(135deg, rgb(172 234 72 / .18), transparent 60%);
  --tint-honey: linear-gradient(135deg, rgb(229 193 0 / .14), transparent 60%);
  --tint-danger: linear-gradient(135deg, rgb(180 35 24 / .08), transparent 60%);

  --shadow-card: 0 1px 2px rgb(20 20 28 / .06), 0 8px 24px rgb(20 20 28 / .06);
  --shadow-accent: 0 6px 16px -4px rgb(63 98 18 / .35);
  --backdrop: rgb(20 20 28 / .45);
  --qr-bg: #FFFFFF;
  color-scheme: light;
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --radius-sm: 6px; /* Chips e pontuação. */
  --radius-md: 8px; /* Botões e campos. */
  --radius-lg: 12px; /* Cards, como no dashboard. */
  --radius-pill: 999px;
  --font-display: "Sora", "Plus Jakarta Sans", system-ui, sans-serif;
  --font-sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
}