/* Kommentar-Bereich. Bewusst schlank — stuetzt sich auf redesign.css-Tokens
   (--accent, --border) mit Fallbacks, damit es ohne sie nicht bricht. */
.comments-section {
  border-top: 1px solid var(--border, rgba(255, 255, 255, .12));
  padding-top: 1.5rem;
}
.comment {
  padding: .75rem 0;
  border-bottom: 1px solid var(--border, rgba(255, 255, 255, .06));
}
.comment-body {
  margin: .35rem 0;
}
.comment-body > :last-child {
  margin-bottom: 0;
}
.comment-actions {
  display: flex;
  gap: 1rem;
  align-items: center;
}
.comment-reply-toggle > summary {
  cursor: pointer;
  color: var(--accent, #3b82f6);
  list-style: none;
}
.comment-replies {
  margin-left: 1.5rem;
  margin-top: .5rem;
  padding-left: 1rem;
  border-left: 2px solid var(--border, rgba(255, 255, 255, .12));
}
.comment-reply {
  border-bottom: none;
}

/* Eingabefeld ans Dark-Design angleichen (Bootstrap .form-control ist sonst hell). */
.comment-form textarea {
  background-color: var(--surface-2, #262232);
  color: var(--text-main, #e7e4ee);
  border: 1px solid var(--border-soft, rgba(255, 255, 255, .09));
  border-radius: 12px;
}
.comment-form textarea::placeholder {
  color: var(--text-muted, #94a3b8);
  opacity: 1;
}
.comment-form textarea:focus {
  background-color: var(--surface-2, #262232);
  color: var(--text-main, #e7e4ee);
  border-color: var(--accent, #3b82f6);
  box-shadow: 0 0 0 .2rem var(--accent-soft, rgba(59, 130, 246, .18));
}
.comment-form .form-label {
  color: var(--text-muted, #94a3b8);
  font-size: .92rem;
}
