/* Ordenar Parágrafos: sequência editável com arraste e controles explícitos —
   mesmos estados de public_html/assets/css/components/event-sequencing.css,
   escopados pra .atividade-sort-paragraphs (duplicata viva de propósito, ver
   a nota de atenção em app/views/components/ordenar-paragrafos.php). */
.atividade-sort-paragraphs .sequencia-lista {
  min-height: 4rem;
  padding: .5rem;
  border: 2px dashed #cbd5e1;
  border-radius: .75rem;
  background: rgba(241, 245, 249, .45);
}
.dark .atividade-sort-paragraphs .sequencia-lista { border-color: #475569; background: rgba(15, 23, 42, .3); }

.atividade-sort-paragraphs .sequencia-vazia {
  margin: .75rem;
  color: #64748b;
  font-size: .8125rem;
  text-align: center;
}

.atividade-sort-paragraphs .sequencia-item {
  position: relative;
  display: grid;
  grid-template-columns: 1.5rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .625rem;
  padding: .625rem .75rem;
  border: 1px solid #cbd5e1;
  border-radius: .625rem;
  background: #fff;
  color: #334155;
  font-size: .8125rem;
  cursor: grab;
}
.dark .atividade-sort-paragraphs .sequencia-item { border-color: #475569; background: #1e293b; color: #e2e8f0; }
.atividade-sort-paragraphs .sequencia-item:focus-visible { outline: 3px solid #818cf8; outline-offset: 2px; }
.atividade-sort-paragraphs .sequencia-item[data-estado="arrastando"] { opacity: .5; }
.atividade-sort-paragraphs .sequencia-item[data-insercao="antes"]::before,
.atividade-sort-paragraphs .sequencia-item[data-insercao="depois"]::after {
  content: '';
  position: absolute;
  right: .25rem;
  left: .25rem;
  height: 3px;
  border-radius: 9999px;
  background: #6366f1;
}
.atividade-sort-paragraphs .sequencia-item[data-insercao="antes"]::before { top: -.2rem; }
.atividade-sort-paragraphs .sequencia-item[data-insercao="depois"]::after { bottom: -.2rem; }

.atividade-sort-paragraphs .sequencia-numero {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 9999px;
  background: rgb(99 102 241 / .15);
  color: #4f46e5;
  font-weight: 700;
}
.dark .atividade-sort-paragraphs .sequencia-numero { color: #c7d2fe; }
.atividade-sort-paragraphs .sequencia-texto { min-width: 0; overflow-wrap: anywhere; }
.atividade-sort-paragraphs .sequencia-acoes { display: flex; gap: .25rem; }
.atividade-sort-paragraphs .sequencia-acoes button {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: .5rem;
  background: #e2e8f0;
  color: #334155;
  font-size: 1rem;
  font-weight: 700;
}
.dark .atividade-sort-paragraphs .sequencia-acoes button { background: #334155; color: #e2e8f0; }
.atividade-sort-paragraphs .sequencia-acoes button:hover:not(:disabled) { background: #c7d2fe; color: #3730a3; }
.atividade-sort-paragraphs .sequencia-acoes button:focus-visible { outline: 2px solid #6366f1; outline-offset: 1px; }
.atividade-sort-paragraphs .sequencia-acoes button:disabled { opacity: .3; cursor: not-allowed; }
.atividade-sort-paragraphs .sequencia-remover { color: #b91c1c !important; }
.dark .atividade-sort-paragraphs .sequencia-remover { color: #fca5a5 !important; }

@media (max-width: 520px) {
  .atividade-sort-paragraphs .sequencia-item { grid-template-columns: 1.5rem minmax(0, 1fr); }
  .atividade-sort-paragraphs .sequencia-acoes { grid-column: 1 / -1; justify-content: flex-end; }
}