/*
 * Style cho nội dung soạn bằng TinyMCE — dùng chung cho:
 *  - vùng soạn thảo (RichEditor: content_css + body_class="rich-content")
 *  - mọi chỗ hiển thị v-html (bọc trong <div class="rich-content">)
 * → hiển thị đúng như lúc soạn (WYSIWYG). File không nằm trong layer của Tailwind
 * nên thắng preflight (Tailwind reset list-style, margin, heading...).
 */
.rich-content {
  line-height: 1.4;
  overflow-wrap: break-word;
}

.rich-content p,
.rich-content > div {
  margin: 0 0 5px;
}

.rich-content ul,
.rich-content ol {
  margin: 0 0 10px;
  padding-left: 40px;
}
.rich-content ul { list-style: disc; }
.rich-content ul ul { list-style: circle; }
.rich-content ul ul ul { list-style: square; }
.rich-content ol { list-style: decimal; }
.rich-content li { display: list-item; }
.rich-content li > ul,
.rich-content li > ol { margin-bottom: 0; }

.rich-content h1,
.rich-content h2,
.rich-content h3,
.rich-content h4,
.rich-content h5,
.rich-content h6 {
  font-weight: bold;
  line-height: 1.25;
  margin: 0 0 10px;
}
.rich-content h1 { font-size: 2em; }
.rich-content h2 { font-size: 1.5em; }
.rich-content h3 { font-size: 1.17em; }
.rich-content h4 { font-size: 1em; }
.rich-content h5 { font-size: 0.83em; }
.rich-content h6 { font-size: 0.67em; }

.rich-content strong,
.rich-content b { font-weight: bold; }
.rich-content em,
.rich-content i { font-style: italic; }
.rich-content u { text-decoration: underline; }
.rich-content s,
.rich-content strike { text-decoration: line-through; }

.rich-content a {
  color: #2563eb;
  text-decoration: underline;
}

.rich-content blockquote {
  border-left: 2px solid #ccc;
  margin: 0 0 10px 1.5rem;
  padding-left: 1rem;
}

.rich-content table {
  border-collapse: collapse;
  margin: 0 0 10px;
}
.rich-content td,
.rich-content th {
  border: 1px solid #ccc;
  padding: 0.4rem;
}

.rich-content img {
  display: inline-block;
  max-width: 100%;
  height: auto;
}

.rich-content hr {
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1rem 0;
}

.rich-content code {
  background-color: #e8e8e8;
  border-radius: 3px;
  padding: 0.1rem 0.2rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.rich-content pre {
  white-space: pre-wrap;
  margin: 0 0 10px;
}

.rich-content > :last-child { margin-bottom: 0; }
