/* Ponte AN → NossoCRM (Tailwind 4 com --color-*). Importe DEPOIS de an-tokens.css; substitui o @theme de primary/dark e os blocos :root/.dark de --color-*. */
@import "./an-tokens.css";

@theme {
  --font-sans: 'Literata', Georgia, 'Times New Roman', serif;
  --font-display: 'Literata', Georgia, 'Times New Roman', serif;
  --color-primary-50: #F2F5F9;
  --color-primary-100: #E4EAF1;
  --color-primary-200: #C8D4E1;
  --color-primary-300: #A1B3C8;
  --color-primary-400: #7992AD;
  --color-primary-500: #567392;
  --color-primary-600: #3C5978;
  --color-primary-700: #2B4662;
  --color-primary-800: #203750;
  --color-primary-900: #172C42;
  --color-dark-bg: #172C42;
  --color-dark-card: #1E3651;
  --color-dark-border: #34506F;
  --color-dark-hover: #26405E;
}

:root {
  --color-bg: var(--an-fundo);
  --color-surface: var(--an-superficie);
  --color-muted: var(--an-superficie-2);
  --color-border: var(--an-borda-controle);
  --color-border-subtle: var(--an-linha);
  --color-text-primary: var(--an-texto);
  --color-text-secondary: var(--an-texto-2);
  --color-text-muted: var(--an-texto-3);
  --color-text-subtle: var(--an-texto-3);
  --color-success: var(--an-sucesso);
  --color-success-hover: var(--an-sucesso);
  --color-success-bg: var(--an-sucesso-fundo);
  --color-success-text: var(--an-sucesso);
  --color-warning: var(--an-atencao);
  --color-warning-hover: var(--an-atencao);
  --color-warning-bg: var(--an-atencao-fundo);
  --color-warning-text: var(--an-atencao);
  --color-error: var(--an-critico);
  --color-error-hover: var(--an-critico);
  --color-error-bg: var(--an-critico-fundo);
  --color-error-text: var(--an-critico);
  --color-info: var(--an-acao);
  --color-info-hover: var(--an-acao-hover);
  --color-info-bg: var(--an-realce);
  --color-info-text: var(--an-sobre-realce);
  --primary: var(--an-acao);
  --primary-foreground: var(--an-sobre-acao);
  --destructive: var(--an-critico);
  --ring: var(--an-foco);
  --background: var(--an-fundo);
  --foreground: var(--an-texto);
  --border: var(--an-linha);
  --input: var(--an-borda-controle);
  --secondary: var(--an-realce);
  --secondary-foreground: var(--an-sobre-realce);
  --muted: var(--an-superficie-2);
  --muted-foreground: var(--an-texto-2);
  --accent: var(--an-realce);
  --accent-foreground: var(--an-sobre-realce);
}

.dark {
  --color-bg: var(--an-fundo);
  --color-surface: var(--an-superficie);
  --color-muted: var(--an-superficie-2);
  --color-border: var(--an-borda-controle);
  --color-border-subtle: var(--an-linha);
  --color-text-primary: var(--an-texto);
  --color-text-secondary: var(--an-texto-2);
  --color-text-muted: var(--an-texto-3);
  --color-text-subtle: var(--an-texto-3);
  --color-success: var(--an-sucesso);
  --color-success-hover: var(--an-sucesso);
  --color-success-bg: var(--an-sucesso-fundo);
  --color-success-text: var(--an-sucesso);
  --color-warning: var(--an-atencao);
  --color-warning-hover: var(--an-atencao);
  --color-warning-bg: var(--an-atencao-fundo);
  --color-warning-text: var(--an-atencao);
  --color-error: var(--an-critico);
  --color-error-hover: var(--an-critico);
  --color-error-bg: var(--an-critico-fundo);
  --color-error-text: var(--an-critico);
  --color-info: var(--an-acao);
  --color-info-hover: var(--an-acao-hover);
  --color-info-bg: var(--an-realce);
  --color-info-text: var(--an-sobre-realce);
  --primary: var(--an-acao);
  --primary-foreground: var(--an-sobre-acao);
  --destructive: var(--an-critico);
  --ring: var(--an-foco);
  --background: var(--an-fundo);
  --foreground: var(--an-texto);
  --border: var(--an-linha);
  --input: var(--an-borda-controle);
  --secondary: var(--an-realce);
  --secondary-foreground: var(--an-sobre-realce);
  --muted: var(--an-superficie-2);
  --muted-foreground: var(--an-texto-2);
  --accent: var(--an-realce);
  --accent-foreground: var(--an-sobre-realce);
}

/* O efeito de vidro (--glass-*) sai: a marca é plana. Mapeie para superfície chapada. */
:root, .dark {
  --glass-bg: var(--an-superficie);
  --glass-border: var(--an-linha);
  --glass-blur: 0px;
}
