/* ==================================================================
   rich-content.css
   สไตล์สำหรับแสดงเนื้อหาที่สร้างจาก Rich Text Editor (SunEditor)
   ใช้ร่วมกับ RichText::block() ที่ห่อเนื้อหาไว้ใน .rich-content
   ================================================================== */

.rich-content {
	font-family: 'Prompt', 'Sarabun', 'Noto Sans Thai', -apple-system, 'Segoe UI', Tahoma, sans-serif;
	font-size: 1rem;
	line-height: 1.85;
	color: #212529;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

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

.rich-content p {
	margin: 0 0 1rem;
}

.rich-content h1,
.rich-content h2,
.rich-content h3,
.rich-content h4,
.rich-content h5,
.rich-content h6 {
	font-weight: 600;
	line-height: 1.4;
	margin: 1.75rem 0 0.75rem;
	color: #15233b;
}

.rich-content h1 { font-size: 1.75rem; }
.rich-content h2 { font-size: 1.5rem; }
.rich-content h3 { font-size: 1.3rem; }
.rich-content h4 { font-size: 1.15rem; }
.rich-content h5 { font-size: 1.05rem; }
.rich-content h6 { font-size: 1rem; }

/* ---------- รายการ ---------- */
.rich-content ul,
.rich-content ol {
	margin: 0 0 1rem;
	padding-left: 1.75rem;
}

.rich-content li { margin-bottom: 0.35rem; }

/* ---------- ลิงก์ ---------- */
.rich-content a {
	color: #0d6efd;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.rich-content a:hover { color: #0a58ca; }

/* ไฟล์แนบที่ editor สร้างเป็นกล่อง */
.rich-content a[data-se-file-download] {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	max-width: 100%;
	margin: 0.25rem 0.35rem 0.25rem 0;
	padding: 0.5rem 0.9rem;
	border: 1px solid #dee2e6;
	border-radius: 0.5rem;
	background-color: #f8f9fa;
	color: #0d6efd;
	text-decoration: none;
	font-size: 0.95rem;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.rich-content a[data-se-file-download]::before {
	content: '\1F4C4'; /* 📄 */
	font-size: 1.05em;
	line-height: 1;
}

.rich-content a[data-se-file-download]:hover {
	background-color: #e7f1ff;
	border-color: #9ec5fe;
}

/* ---------- รูปภาพ ---------- */
.rich-content img {
	max-width: 100%;
	height: auto;
	border-radius: 0.5rem;
}

.rich-content figure {
	margin: 1.25rem 0;
	max-width: 100%;
}

.rich-content figcaption {
	margin-top: 0.5rem;
	font-size: 0.9rem;
	color: #6c757d;
	text-align: center;
}

/* คลาสจัดตำแหน่งที่ SunEditor ใส่มา */
.rich-content .__se__float-left  { float: left;  margin: 0 1rem 0.75rem 0; }
.rich-content .__se__float-right { float: right; margin: 0 0 0.75rem 1rem; }
.rich-content .__se__float-center { margin-left: auto; margin-right: auto; display: block; }
.rich-content .__se__float-none  { float: none; }

.rich-content::after {
	content: '';
	display: table;
	clear: both;
}

/* ---------- ตาราง ---------- */
.rich-content table {
	width: 100%;
	margin: 1.25rem 0;
	border-collapse: collapse;
	font-size: 0.97rem;
	background-color: #fff;
}

.rich-content table th,
.rich-content table td {
	border: 1px solid #dee2e6;
	padding: 0.6rem 0.75rem;
	vertical-align: top;
}

.rich-content table th {
	background-color: #f1f3f5;
	font-weight: 600;
	text-align: left;
}

.rich-content table tbody tr:nth-child(even) {
	background-color: #fcfcfd;
}

.rich-content table caption {
	caption-side: bottom;
	padding-top: 0.5rem;
	font-size: 0.875rem;
	color: #6c757d;
}

/* ตารางกว้างเกินจอ : เลื่อนแนวนอนได้ ไม่ดันหน้าเว็บพัง */
.rich-content .se-scroll-figure-x,
.rich-content .se-table-scroll-wrapper {
	overflow-x: auto;
	max-width: 100%;
}

/* ---------- ส่วนอื่น ---------- */
.rich-content blockquote {
	margin: 1.25rem 0;
	padding: 0.85rem 1.1rem;
	border-left: 4px solid #0d6efd;
	background-color: #f8f9fa;
	color: #495057;
}

.rich-content pre {
	padding: 0.9rem 1rem;
	background-color: #f8f9fa;
	border: 1px solid #e9ecef;
	border-radius: 0.5rem;
	overflow-x: auto;
	font-size: 0.9rem;
}

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

.rich-content hr.__se__dashed { border-top-style: dashed; }
.rich-content hr.__se__dotted { border-top-style: dotted; }

.rich-content mark {
	padding: 0.1em 0.2em;
	background-color: #fff3cd;
}

/* ---------- จอเล็ก ---------- */
@media (max-width: 576px) {
	.rich-content { font-size: 0.97rem; }

	.rich-content .__se__float-left,
	.rich-content .__se__float-right {
		float: none;
		margin: 0 0 0.75rem;
	}

	.rich-content table { font-size: 0.9rem; }
	.rich-content table th,
	.rich-content table td { padding: 0.45rem 0.5rem; }
}

/* ---------- ตอนสั่งพิมพ์ ---------- */
@media print {
	.rich-content a { color: #000; text-decoration: none; }
	.rich-content table th { background-color: #eee !important; }
}
