/* ============================================================
   variables.css — Tokens de design do Painel Corniani
   ============================================================ */

:root {
  /* ── Cores base (paleta dark "corniani gold") ── */
  --bg:           #0f0e0c;
  --surface:      #181714;
  --surface2:    #1f1d1a;
  --surface3:    #26231f;
  --border:       #2a2825;
  --border-soft:  #221f1c;

  --gold:         #c9a84c;
  --gold-dim:     #8a6e30;
  --gold-soft:    rgba(201, 168, 76, 0.15);
  --gold-softer:  rgba(201, 168, 76, 0.08);

  --text:         #e8e0d0;
  --text-dim:     #8a8278;
  --text-muted:   #4a4744;

  --danger:       #e07070;
  --danger-soft:  rgba(224, 112, 112, 0.12);
  --success:      #4a7c59;
  --warning:      #d4a55a;

  /* ── Cores das etapas do Kanban ── */
  --etapa-contato:        #6B7280;
  --etapa-triagem:        #F59E0B;
  --etapa-aguardando:     #3B82F6;
  --etapa-atendimento:    #8B5CF6;
  --etapa-proposta:       #F97316;
  --etapa-fechado:        #10B981;
  --etapa-desqualificado: #EF4444;

  /* ── Indicadores de última mensagem ── */
  --dot-cliente:   #ef4444;  /* vermelho: cliente respondeu por último */
  --dot-advogado:  #22c55e;  /* verde: advogado respondeu por último */
  --dot-nenhuma:   #6b7280;  /* cinza: sem mensagens */

  /* ── Tipografia ── */
  --font-serif:    'Cormorant Garamond', Georgia, serif;
  --font-sans:     'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --fs-xs:    11px;
  --fs-sm:    12px;
  --fs-base:  14px;
  --fs-md:    15px;
  --fs-lg:    18px;
  --fs-xl:    22px;
  --fs-2xl:   28px;
  --fs-3xl:   36px;

  --fw-light:    300;
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semi:     600;

  /* ── Espaçamento ── */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-7:  32px;
  --sp-8:  40px;
  --sp-9:  48px;
  --sp-10: 64px;

  /* ── Borda e arredondamento ── */
  --radius-sm:   6px;
  --radius:      10px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   20px;
  --radius-pill: 999px;

  /* ── Sombras ── */
  --shadow-sm:  0 2px 6px rgba(0, 0, 0, 0.25);
  --shadow:     0 6px 18px rgba(0, 0, 0, 0.35);
  --shadow-lg:  0 16px 40px rgba(0, 0, 0, 0.45);

  /* ── Transições ── */
  --transition-fast: 120ms ease;
  --transition:      200ms ease;
  --transition-slow: 320ms ease;

  /* ── Z-index ── */
  --z-base:    1;
  --z-sticky:  100;
  --z-overlay: 800;
  --z-modal:   900;
  --z-toast:   1000;

  /* ── Layout ── */
  --sidebar-w:        260px;
  --header-h:         64px;
  --slideover-w:      460px;
  --slideover-w-lg:   540px;
  --kanban-col-w:     290px;
}

/* Etapas — mapa rápido para uso em ::before/borders */
[data-etapa="contato_inicial"]     { --etapa-cor: var(--etapa-contato); }
[data-etapa="em_triagem"]          { --etapa-cor: var(--etapa-triagem); }
[data-etapa="aguardando_advogado"] { --etapa-cor: var(--etapa-aguardando); }
[data-etapa="em_atendimento"]      { --etapa-cor: var(--etapa-atendimento); }
[data-etapa="proposta_enviada"]    { --etapa-cor: var(--etapa-proposta); }
[data-etapa="fechado"]             { --etapa-cor: var(--etapa-fechado); }
[data-etapa="desqualificado"]      { --etapa-cor: var(--etapa-desqualificado); }