/* AF Advocacia — fichas de etapa e áudio do WhatsApp. 25/08/2026 (b)
   Reaproveita as classes do painel de follow-up; aqui só o que é novo. */

/* a etiqueta da ficha fica logo abaixo da etiqueta de follow-up */
.afe-pill {
  margin-top: .35rem;
}

/* a resposta marcada se lê pela cor: verde quando é sim, vermelho quando é
   não. Nas listas de marcar, marcar é sempre confirmação — fica verde. */
.afl-chip.afe-chip-sim {
  background: #e7f6ec;
  color: #1f7a41;
  border-color: #b6e0c6;
}
.afl-chip.afe-chip-nao {
  background: #fdeaea;
  color: #b3261e;
  border-color: #f0b3ae;
}

/* ---------- áudio do WhatsApp ---------- */

.af-audio-botao {
  padding: .3rem .7rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  opacity: .85;
}
.af-audio-botao:hover:not(:disabled) { opacity: 1; }
.af-audio-botao:disabled { cursor: default; opacity: .6; }

.af-audio {
  width: 100%;
  min-width: 200px;
  height: 34px;
  margin-top: .15rem;
}

/* ---------- abas das fichas de etapa ---------- */

/* Todas as etapas do lead ficam a um clique: a aberta em destaque, as já
   preenchidas com o quadradinho, a etapa atual com a borda tracejada. */
.afe-abas {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  padding: .7rem 1.25rem .1rem;
}
.afe-aba {
  padding: .25rem .6rem;
  border-radius: 999px;
  border: 1px solid hsl(var(--border));
  background: transparent;
  color: hsl(var(--muted-foreground));
  font-size: 11px;
  font-weight: 600;
  line-height: 1.3;
  cursor: pointer;
  transition: filter .12s ease;
}
.afe-aba:hover { filter: brightness(.94); }
.afe-aba-cheia { color: hsl(var(--foreground)); }
.afe-aba-atual { border-style: dashed; }
.afe-aba-on {
  background: hsl(var(--primary) / .12);
  border-color: hsl(var(--primary) / .35);
  color: hsl(var(--primary));
}