.comments .comment {
  background: var(--comment-bg);
  border: 1px solid var(--comment-border);
  border-radius: var(--comment-radius);
  padding: 0.75rem 1rem;
}

.comments .reply-form {
  background: var(--reply-bg);
  border: 1px dashed var(--reply-border);
  border-radius: var(--reply-radius);
  padding: 0.75rem;
}

.comments .comment .small.text-muted {
  color: var(--comment-meta) !important;
  font-size: .92rem;
  letter-spacing: .2px;
}

.comments .comment .small.text-muted strong {
  color: var(--ui-text) !important;
  font-weight: 600;
}

.comments .ms-4.border-start {
  border-color: var(--comment-thread-line) !important;
}

/* LIKE BUTTON */
.comments .btn-like{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
}

.comments .btn-like svg { width: 1rem; height: 1rem; }
.comments .btn-like svg path{
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.comments .btn-like .count{
  min-width: 1.2rem;
  padding: 0 .35rem;
  font-size: .85rem;
  font-weight: 600;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ui-link) 18%, transparent);
  color: var(--ui-text);
}

.comments .btn-like:hover{
  background: color-mix(in srgb, var(--ui-link) 12%, transparent);
  border-color: var(--ui-link);
  color: var(--ui-text);
}
.comments .btn-like:focus{ box-shadow: none; }

.comments .btn-like.liked{
  color: var(--ui-text);
  background: color-mix(in srgb, var(--ui-link) 22%, transparent);
  border-color: var(--ui-link);
}
.comments .btn-like.liked svg path{
  fill: currentColor;
  stroke: currentColor;
}
.comments .btn-like.liked .count{
  background: var(--ui-link);
  color: var(--ui-hover-text);
}

@keyframes like-pop{ 0%{transform:scale(.9)} 70%{transform:scale(1.07)} 100%{transform:scale(1)} }
.comments .btn-like.liked svg{ animation: like-pop .15s ease-out; }

.comments .btn-like.liked{ pointer-events: none; opacity:.85; }
