/* Comment styling */

/* Comment container */
.comment {
  max-width: 100%;
}

/* Comment form Lexxy editor styling */
.comment-form {
  --lexxy-bg-color: rgb(243 244 246); /* gray-100 */
}

.dark .comment-form {
  --lexxy-bg-color: rgb(31 41 55); /* gray-800 */
}

/* Remove border from Lexxy editor in comment forms */
.comment-form lexxy-editor {
  border: none !important;
  background-color: var(--lexxy-bg-color) !important;
}

/* Lexxy toolbar should match comment form background */
.comment-form lexxy-toolbar {
  background-color: var(--lexxy-bg-color) !important;
  border-bottom: 1px solid rgb(209 213 219) !important; /* gray-300 */
  border-radius: 0.5rem 0.5rem 0 0;
}

.dark .comment-form lexxy-toolbar {
  border-bottom-color: rgb(75 85 99) !important; /* gray-600 */
}

/* Lexxy toolbar buttons should be transparent */
.comment-form lexxy-toolbar button {
  background-color: transparent !important;
}

.comment-form .lexxy-editor--empty {
  min-height: 80px !important;
}

/* Remove any wrapper borders */
.comment-form .lexxy-editor,
.comment-form [data-controller*="lexxy"],
.comment-form .trix-content {
  border: none !important;
  box-shadow: none !important;
}

/* Comment body rich text styling */
.comment__body {
  text-align: left;
}

.comment__body p {
  margin: 0;
}

.comment__body p + p {
  margin-top: 0.5em;
}
