$commentsHistoryCommentOnLabelColor: var(--palette-text-100);
$commentsHistoryStoryTitleColor: var(--palette-text-500);
$commentsHistoryDividerColor: var(--palette-grey-200);

.root:not(:first-child) {
  border-top: 1px solid var(--palette-divider);
  padding-top: var(--spacing-3);
}

.container {
  border-bottom: 1px solid $commentsHistoryDividerColor;
  padding-bottom: var(--spacing-3);
}

.commentOn {
  margin-bottom: 0;

  font-family: var(--font-family-primary);
  font-weight: var(--font-weight-primary-semi-bold);
  font-size: var(--font-size-1);
  line-height: 1.33;
  color: $commentsHistoryCommentOnLabelColor;
}

.storyTitle {
  font-family: var(--font-family-secondary);
  font-weight: var(--font-weight-secondary-bold);
  font-size: var(--font-size-3);
  line-height: 1.125;
  color: $commentsHistoryStoryTitleColor;
}

.subBar {
  margin-bottom: calc(0.5 * var(--mini-unit));
}

.content {
  font-family: var(--font-family-primary);
  font-weight: var(--font-weight-primary-regular);
  font-size: var(--font-size-3);
  line-height: 1.5;
  color: #353f44;
}
