/*
 * Eivan Blog Style — v1.0.0
 * استایل بلوک‌های محتوایی پست‌های وبلاگ ایوان
 *
 * فونت از قالب (دیجی‌لند) به ارث می‌رسد؛ اینجا فونتی enqueue نمی‌شود.
 * رنگ‌های برند فقط از همین متغیرها تغذیه می‌شوند — برای تغییر پالت،
 * فقط مقادیر :root را عوض کنید.
 */

:root {
	--eivan-navy: #16233b;
	--eivan-navy-2: #1f3154;
	--eivan-orange: #f26522;
	--eivan-orange-soft: #fef0e8;
	--eivan-green: #0f9d6b;
	--eivan-green-soft: #effaf5;
	--eivan-text: #2a3342;
	--eivan-muted: #6b7688;
	--eivan-line: #e4e8ef;
}

/* smooth anchor scrolling for the auto-TOC; offset for sticky headers */
html {
	scroll-behavior: smooth;
}
.single-post h2[id] {
	scroll-margin-top: 120px;
}

/* ------------------------------------------------------------------ */
/* فهرست مطالب (auto-injected by PHP)                                  */
/* ------------------------------------------------------------------ */
.single-post .toc-box {
	background: #f8fafc;
	border: 1px solid var(--eivan-line);
	border-radius: 12px;
	padding: 20px 24px;
	margin: 0 0 26px;
}
.single-post .toc-box h4 {
	font-size: 14px;
	font-weight: 900;
	color: var(--eivan-navy);
	margin: 0 0 10px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.single-post .toc-box h4::before {
	content: '';
	width: 8px;
	height: 8px;
	background: var(--eivan-orange);
	border-radius: 2px;
}
.single-post .toc-box ol {
	list-style: none;
	counter-reset: eivan-toc;
	columns: 2;
	column-gap: 30px;
	margin: 0;
	padding: 0;
}
.single-post .toc-box li {
	counter-increment: eivan-toc;
	padding: 6px 0;
	font-size: 14px;
	break-inside: avoid;
	list-style: none;
}
.single-post .toc-box li::before {
	content: counter(eivan-toc, persian) '. ';
	color: var(--eivan-orange);
	font-weight: 800;
}
.single-post .toc-box a {
	color: var(--eivan-text);
	text-decoration: none;
	box-shadow: none;
}
.single-post .toc-box a:hover {
	color: var(--eivan-orange);
}

/* ------------------------------------------------------------------ */
/* نکات کلیدی مقاله (emitted first in content by n8n writer)           */
/* ------------------------------------------------------------------ */
.single-post .keybox {
	background: linear-gradient(140deg, var(--eivan-navy), var(--eivan-navy-2));
	color: #fff;
	border-radius: 14px;
	padding: 26px 30px;
	margin: 0 0 30px;
}
.single-post .keybox h4 {
	font-size: 17px;
	font-weight: 900;
	color: #fff;
	margin: 0 0 14px;
	display: flex;
	align-items: center;
	gap: 10px;
}
.single-post .keybox h4::before {
	content: '★';
	color: var(--eivan-orange);
}
.single-post .keybox ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.single-post .keybox li {
	padding: 8px 26px 8px 0;
	position: relative;
	font-size: 14.5px;
	color: #dce4f0;
	border-bottom: 1px dashed rgba(255, 255, 255, 0.12);
	list-style: none;
}
.single-post .keybox li:last-child {
	border-bottom: none;
}
.single-post .keybox li::before {
	content: '✓';
	position: absolute;
	right: 0;
	color: var(--eivan-orange);
	font-weight: 900;
}

/* ------------------------------------------------------------------ */
/* جعبه‌های هشدار / توصیه                                              */
/* ------------------------------------------------------------------ */
.single-post .tip {
	border-radius: 10px;
	padding: 16px 20px 16px 18px;
	margin: 24px 0;
	font-size: 14.5px;
	border-right: 4px solid;
}
.single-post .tip.good {
	background: var(--eivan-green-soft);
	border-right-color: var(--eivan-green);
}
.single-post .tip.warn {
	background: var(--eivan-orange-soft);
	border-right-color: var(--eivan-orange);
}
.single-post .tip b {
	display: block;
	margin-bottom: 4px;
}

/* ------------------------------------------------------------------ */
/* «در یک نگاه» — بلوک اختیاری (برای صفحات هاب اعتباری/اسنیپت)          */
/* ------------------------------------------------------------------ */
.single-post .glance {
	background: var(--eivan-green-soft);
	border: 1px solid #cdeadd;
	border-radius: 12px;
	padding: 20px 24px;
	margin: 0 0 30px;
}
.single-post .glance h4 {
	font-size: 14px;
	font-weight: 900;
	color: var(--eivan-green);
	margin: 0 0 8px;
}
.single-post .glance p {
	font-size: 14.5px;
	color: #33574a;
	line-height: 2;
	margin: 0;
}

/* ------------------------------------------------------------------ */
/* جدول مقایسه                                                         */
/* ------------------------------------------------------------------ */
.single-post .tbl-scroll {
	overflow-x: auto;
	margin: 26px 0;
}
.single-post table.tbl {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	border: 1px solid var(--eivan-line);
	border-radius: 10px;
	overflow: hidden;
	margin: 0;
}
.single-post table.tbl th {
	background: var(--eivan-navy);
	color: #fff;
	font-weight: 700;
	padding: 12px 14px;
	text-align: right;
	border: none;
}
.single-post table.tbl td {
	padding: 12px 14px;
	border: none;
	border-bottom: 1px solid var(--eivan-line);
}
.single-post table.tbl tr:nth-child(even) td {
	background: #f8fafc;
}
.single-post table.tbl .win {
	color: var(--eivan-green);
	font-weight: 800;
}

/* ------------------------------------------------------------------ */
/* کارت محصول (CTA اقساطی)                                             */
/* ------------------------------------------------------------------ */
.single-post .prod-cta {
	border: 2px solid var(--eivan-orange);
	border-radius: 14px;
	padding: 22px;
	margin: 34px 0;
	display: flex;
	gap: 20px;
	align-items: center;
	background: linear-gradient(180deg, #fffaf6, #fff);
}
.single-post .prod-cta .thumb {
	width: 110px;
	height: 110px;
	flex: none;
	border-radius: 10px;
	overflow: hidden;
	background: #f2f5f9;
}
.single-post .prod-cta .thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.single-post .prod-cta h4 {
	font-size: 16.5px;
	font-weight: 900;
	margin: 0 0 6px;
}
.single-post .prod-cta .inst {
	font-size: 13px;
	color: var(--eivan-muted);
	margin-bottom: 12px;
}
.single-post .prod-cta .inst b {
	color: var(--eivan-green);
	font-size: 15px;
}
.single-post .prod-cta a.btn,
.single-post .prod-cta a:not(.no-btn) {
	display: inline-block;
	background: var(--eivan-orange);
	color: #fff !important;
	text-decoration: none;
	font-weight: 800;
	font-size: 14px;
	padding: 10px 26px;
	border-radius: 8px;
	box-shadow: none;
}
.single-post .prod-cta a:hover {
	background: #d9540f;
}

/* ------------------------------------------------------------------ */
/* پرسش‌های پرتکرار                                                     */
/* ------------------------------------------------------------------ */
.single-post .faq {
	margin-top: 40px;
}
.single-post .faq details {
	border: 1px solid var(--eivan-line);
	border-radius: 10px;
	padding: 14px 18px;
	margin-bottom: 10px;
	background: #fbfcfe;
}
.single-post .faq summary {
	font-weight: 800;
	font-size: 15px;
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}
.single-post .faq summary::-webkit-details-marker {
	display: none;
}
.single-post .faq summary::after {
	content: '▾';
	color: var(--eivan-orange);
	flex: none;
}
.single-post .faq details[open] {
	background: #fff;
}
.single-post .faq details p {
	margin: 10px 0 0;
	font-size: 14px;
	color: var(--eivan-muted);
}

/* ------------------------------------------------------------------ */
/* موبایل                                                              */
/* توجه: !important در مدیاکوئری‌ها عمدی است — المنتور استایل inline    */
/* تزریق می‌کند و بدون !important override نمی‌شود.                    */
/* ------------------------------------------------------------------ */
@media (max-width: 640px) {
	.single-post .toc-box ol {
		columns: 1 !important;
	}
	.single-post .prod-cta {
		flex-direction: column !important;
		text-align: center;
	}
	.single-post .keybox {
		padding: 20px 18px !important;
	}
}