/* ============================================================
   TOKENS · CRM do Jordão
   ============================================================
   Todos os valores abaixo foram COPIADOS do código-fonte do produto
   (e:\crm-do-jordao). Nenhuma cor foi estimada a olho, nenhuma veio do
   site comercial. Cada bloco cita o arquivo de origem.

   Decisão de paleta (30/07/2026): a biblioteca segue a paleta do
   PRODUTO, não a das telas de marketing. Os componentes em
   src/components/marketing/screens/ são referência de ESTRUTURA e de
   TIMELINE de animação, não de cor.
   ============================================================ */

:root {
  /* ── Marca Rainmaker ────────────────────────────────────────
     Origem: tailwind.config.ts → theme.extend.colors.rainmaker */
  --rm-yellow:      #FFD400;   /* DEFAULT */
  --rm-yellow-50:   #FFFCE5;
  --rm-yellow-100:  #FFF7B8;
  --rm-yellow-200:  #FFEF7A;
  --rm-yellow-300:  #FFE547;
  --rm-yellow-400:  #FFDC1F;
  --rm-yellow-500:  #FFD400;
  --rm-yellow-600:  #E5BD00;
  --rm-yellow-700:  #B89700;
  --rm-yellow-800:  #8A7100;
  --rm-yellow-900:  #5C4B00;

  --rm-black:       #0A0A0A;   /* DEFAULT */
  --rm-black-soft:  #171717;
  --rm-black-line:  #262626;

  --rm-white:        #FFFFFF;
  --rm-white-muted:  #F5F5F5;
  --rm-white-subtle: #E5E5E5;

  /* ── Tokens semânticos (tema claro) ─────────────────────────
     Origem: src/app/globals.css → :root
     Guardados em HSL porque é assim que o produto declara. */
  --background:            hsl(0 0% 100%);
  --foreground:            hsl(0 0% 4%);
  --card:                  hsl(0 0% 100%);
  --card-foreground:       hsl(0 0% 4%);
  --popover:               hsl(0 0% 100%);
  --popover-foreground:    hsl(0 0% 4%);
  --primary:               hsl(51 100% 50%);   /* = #FFD400 */
  --primary-foreground:    hsl(0 0% 4%);
  --secondary:             hsl(0 0% 96%);
  --secondary-foreground:  hsl(0 0% 9%);
  --muted:                 hsl(0 0% 96%);
  --muted-foreground:      hsl(0 0% 40%);
  --accent:                hsl(51 100% 50%);
  --accent-foreground:     hsl(0 0% 4%);
  --destructive:           hsl(0 72% 51%);
  --destructive-foreground: hsl(0 0% 100%);
  --border:                hsl(0 0% 90%);
  --input:                 hsl(0 0% 90%);
  --ring:                  hsl(51 100% 50%);
  --radius:                0.625rem;

  /* ── Tokens "Análise de Calls" (tema Jordão) ────────────────
     Origem: tailwind.config.ts → success / warning / danger.
     Usados em scores, aderência a playbook e tags de call.
     Convivem com destructive/primary, não substituem. */
  --success:        hsl(160 84% 39%);   /* score >= 7.5, playbook done */
  --success-fg:     hsl(0 0% 100%);
  --success-soft:   hsl(160 70% 92%);
  --warning:        hsl(37 95% 55%);    /* score 6.5-7.4, playbook parcial */
  --warning-fg:     hsl(0 0% 12%);
  --warning-soft:   hsl(40 95% 92%);
  --danger:         hsl(0 78% 55%);
  --danger-fg:      hsl(0 0% 100%);
  --danger-soft:    hsl(0 80% 95%);

  /* ── Marca da IA ────────────────────────────────────────────
     Origem: tailwind.config.ts → backgroundImage["ai-mark"].
     Comentário literal do código: "NUNCA usar roxo". */
  --ai-pink:  hsl(355 80% 85%);
  --ai-mark:  linear-gradient(135deg, hsl(50 100% 52%) 0%, hsl(355 80% 85%) 100%);

  /* ── Tipografia ─────────────────────────────────────────────
     Origem: tailwind.config.ts → fontFamily.
     --font-sans = Inter (body) · --font-display = Space Grotesk
     (KPIs, scores, títulos grandes) · --font-script = Caveat
     (toques manuscritos, ex.: assinatura na Missão do dia). */
  --font-sans:    "Inter", system-ui, sans-serif;
  --font-display: "Space Grotesk", "Inter", system-ui, sans-serif;
  --font-script:  "Caveat", cursive;

  /* ── Raio ───────────────────────────────────────────────────
     Origem: tailwind.config.ts → borderRadius (derivados de --radius) */
  --radius-lg: var(--radius);
  --radius-md: calc(var(--radius) - 2px);
  --radius-sm: calc(var(--radius) - 4px);
}

/* ============================================================
   TEMA ESCURO
   Origem: src/app/globals.css → .dark
   O produto alterna por classe (darkMode: "class" no tailwind.config).
   ============================================================ */
.tema-escuro {
  --background:            hsl(0 0% 4%);
  --foreground:            hsl(0 0% 98%);
  --card:                  hsl(0 0% 9%);
  --card-foreground:       hsl(0 0% 98%);
  --popover:               hsl(0 0% 9%);
  --popover-foreground:    hsl(0 0% 98%);
  --primary:               hsl(51 100% 50%);
  --primary-foreground:    hsl(0 0% 4%);
  --secondary:             hsl(0 0% 14%);
  --secondary-foreground:  hsl(0 0% 98%);
  --muted:                 hsl(0 0% 14%);
  --muted-foreground:      hsl(0 0% 64%);
  --accent:                hsl(51 100% 50%);
  --accent-foreground:     hsl(0 0% 4%);
  --destructive:           hsl(0 72% 51%);
  --destructive-foreground: hsl(0 0% 98%);
  --border:                hsl(0 0% 18%);
  --input:                 hsl(0 0% 18%);
  --ring:                  hsl(51 100% 50%);
}

/* ============================================================
   TEMAS DE ROTA (escopados)
   ============================================================
   ACHADO IMPORTANTE (registrado em documentation/missing-information.md):
   algumas rotas do produto declaram a própria paleta escopada, que NÃO
   é idêntica à paleta global. A rota /mentor (Jordão IA) é o caso mais
   claro: usa #F5C518 no lugar de #FFD400 e uma escala de tinta própria
   (papel), não os cinzas neutros do tema global.

   A biblioteca reproduz a paleta ESCOPADA quando ela existe, porque é
   o que o vendedor de fato vê naquela tela. Os tokens globais acima
   continuam valendo pra tudo que não tem tema próprio.
   ------------------------------------------------------------ */

/* Origem: src/app/(app)/mentor/mentor.css → .mentor-page */
:root {
  --m-bg:           #FFFFFF;
  --m-bg-soft:      #FAFAF7;
  --m-bg-card:      #FFFFFF;
  --m-bg-tint:      #FCFAF3;
  --m-bg-wa:        #E5DDD5;              /* fundo WhatsApp clássico */
  --m-rule:         #ECE9E2;
  --m-rule-soft:    #F2F0EB;

  --m-ink:          #1A1814;
  --m-ink-soft:     #3D3A33;
  --m-ink-mute:     #807A6E;
  --m-ink-dim:      #B5AFA3;

  --m-yellow:       #F5C518;
  --m-yellow-deep:  #D9A800;
  --m-yellow-soft:  rgba(245, 197, 24, 0.35);
  --m-glow:         rgba(245, 197, 24, 0.45);

  --m-success:      #16A34A;
  --m-success-soft: rgba(22, 163, 74, 0.10);
  --m-danger:       #DC2626;

  /* Cores dos ícones de insight · mentor.css → .mt-insight .icon.kind-* */
  --m-kind-replied-bg:  rgba(220, 38, 38, 0.10);
  --m-kind-replied-fg:  #B91C1C;
  --m-kind-meeting-bg:  rgba(37, 99, 235, 0.10);
  --m-kind-meeting-fg:  #1D4ED8;
  --m-kind-cooling-bg:  rgba(245, 158, 11, 0.14);
  --m-kind-cooling-fg:  #B45309;
  --m-kind-overdue-bg:  rgba(234, 88, 12, 0.12);
  --m-kind-overdue-fg:  #C2410C;

  /* Balão de saída do WhatsApp · mentor.css → .mt-bubble.out */
  --m-wa-out: #D8F0D6;
}

/* ============================================================
   ESCALA DE SOMBRA
   ============================================================
   O produto não define escala de sombra no tailwind.config · usa
   valores inline por componente. As duas abaixo foram copiadas
   literalmente de mentor.css e servem de referência pras telas do
   mesmo módulo. Sombra nova só entra aqui com origem citada.
   ------------------------------------------------------------ */
:root {
  /* mentor.css → .mt-artifact */
  --sombra-card: 0 1px 0 rgba(0, 0, 0, 0.02), 0 2px 8px rgba(40, 30, 10, 0.04);
  /* mentor.css → .mt-sidebar-menu */
  --sombra-menu: 0 4px 16px rgba(0, 0, 0, 0.08);
  /* mentor.css → .mt-mention-pop */
  --sombra-popover: 0 6px 24px rgba(0, 0, 0, 0.10);
}