/* Indicador de situação dos Cartões de Diálogo. O JS so escreve data-estado;
   esta folha vem depois do tailwind.css e define cor e largura nos dois temas.
   Mesmo padrão do Carrossel de Imagens — o ponto ativo é mais largo, a
   diferença não pode ser só de cor. */
.atividade-dialogue-cards .cd-dot[data-estado="inativo"] { background: #e2e8f0; }
.atividade-dialogue-cards .cd-dot[data-estado="inativo"]:hover { background: #94a3b8; }
.atividade-dialogue-cards .cd-dot[data-estado="ativo"]   { background: #6366f1; width: 1rem; }

.dark .atividade-dialogue-cards .cd-dot[data-estado="inativo"] { background: #334155; }
.dark .atividade-dialogue-cards .cd-dot[data-estado="inativo"]:hover { background: #475569; }