/* Estados das relações do Mapa Conceitual. data-estado no .mc-relacao e a
   unica fonte do visual; esta folha vem depois do tailwind.css e pinta os dois
   temas. Fundo, borda E cor do texto mudam por estado — so o fundo nao basta
   para separar acerto de erro em quem enxerga cor de forma diferente, e o
   painel de feedback repete os dois grupos em texto. */

/* --- exemplo e relacao recem-montada: neutros, ainda nao corrigidos --- */
.atividade-concept-map .mc-relacao[data-estado="exemplo"],
.atividade-concept-map .mc-relacao[data-estado="montada"] {
  background: rgb(241 245 249 / .5);
  border: 1px solid #cbd5e1;
}
.atividade-concept-map .mc-relacao[data-estado="exemplo"] .mc-conceito,
.atividade-concept-map .mc-relacao[data-estado="montada"] .mc-conceito { color: #4f46e5; }
.atividade-concept-map .mc-relacao[data-estado="exemplo"] .mc-rotulo-texto,
.atividade-concept-map .mc-relacao[data-estado="montada"] .mc-rotulo-texto { color: #b45309; }

/* --- corrigidas --- */
.atividade-concept-map .mc-relacao[data-estado="acerto"] {
  background: rgb(34 197 94 / .12);
  border: 1px solid rgb(34 197 94 / .5);
}
.atividade-concept-map .mc-relacao[data-estado="acerto"] .mc-conceito,
.atividade-concept-map .mc-relacao[data-estado="acerto"] .mc-rotulo-texto { color: #15803d; }

.atividade-concept-map .mc-relacao[data-estado="erro"] {
  background: rgb(239 68 68 / .12);
  border: 1px solid rgb(239 68 68 / .5);
}
.atividade-concept-map .mc-relacao[data-estado="erro"] .mc-conceito,
.atividade-concept-map .mc-relacao[data-estado="erro"] .mc-rotulo-texto { color: #b91c1c; }

.atividade-concept-map .mc-traco { color: #64748b; }

/* Rotulos citados no enunciado. Recebem o MESMO tratamento que tem dentro das
   relacoes (italico ambar), para a pessoa reconhecer a palavra quando ela
   reaparece no <select> e na lista. Sem fundo nem padding de proposito: a caixa
   abriria um vao antes da virgula que separa os rotulos na frase. */
.atividade-concept-map .mc-rotulo-citado {
  font-style: italic;
  font-weight: 600;
  color: #b45309;
  white-space: nowrap;
}

.dark .atividade-concept-map .mc-rotulo-citado { color: #fbbf24; }

/* --- tema escuro --- */
.dark .atividade-concept-map .mc-relacao[data-estado="exemplo"],
.dark .atividade-concept-map .mc-relacao[data-estado="montada"] {
  background: rgb(30 41 59 / .5);
  border-color: rgb(51 65 85 / .6);
}
.dark .atividade-concept-map .mc-relacao[data-estado="exemplo"] .mc-conceito,
.dark .atividade-concept-map .mc-relacao[data-estado="montada"] .mc-conceito { color: #a5b4fc; }
.dark .atividade-concept-map .mc-relacao[data-estado="exemplo"] .mc-rotulo-texto,
.dark .atividade-concept-map .mc-relacao[data-estado="montada"] .mc-rotulo-texto { color: #fbbf24; }

.dark .atividade-concept-map .mc-relacao[data-estado="acerto"] .mc-conceito,
.dark .atividade-concept-map .mc-relacao[data-estado="acerto"] .mc-rotulo-texto { color: #86efac; }

.dark .atividade-concept-map .mc-relacao[data-estado="erro"] .mc-conceito,
.dark .atividade-concept-map .mc-relacao[data-estado="erro"] .mc-rotulo-texto { color: #fca5a5; }