/* تایپوگرافی محتوای پست (چون از پلاگین Tailwind typography نداریم، دستی می‌نویسیم) */
.sbw-entry-content p {
	margin: 0 0 1.25em;
}

.sbw-entry-content h2,
.sbw-entry-content h3 {
	font-weight: 800;
	color: #0f172a;
	margin: 1.75em 0 0.75em;
}

.sbw-entry-content h2 { font-size: 1.25rem; }
.sbw-entry-content h3 { font-size: 1.1rem; }

.sbw-entry-content img {
	border-radius: 16px;
	height: auto;
	max-width: 100%;
}

.sbw-entry-content a {
	color: #00724A;
	text-decoration: underline;
}

.sbw-entry-content ul,
.sbw-entry-content ol {
	padding-right: 1.5em;
	margin: 0 0 1.25em;
}

.sbw-entry-content blockquote {
	border-right: 4px solid #00724A;
	background: #f8fafc;
	padding: 1em 1.25em;
	border-radius: 12px;
	margin: 1.5em 0;
	color: #475569;
}

.sw-tag-pill {
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.sw-tag-pill:hover {
	background-color: #e2e8f0;
}

@media (max-width: 1023px) {
	.sbw-single-sidebar {
		width: 100%;
	}
}

.sbw-breadcrumb-box {
	background: #ffffff;
	border-radius: 14px;
	padding: 10px 16px;
	color: #64748b;
	line-height:2em;

	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.5rem;
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
	cursor: grab;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	-ms-overflow-style: none;
	user-select: none;
}
.sbw-breadcrumb-box::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

.sbw-breadcrumb-link,
.sbw-breadcrumb-current,
.sbw-breadcrumb-sep {
	flex: 0 0 auto;
}

.sbw-breadcrumb-link {
	color: #64748b;
	text-decoration: none;
	transition: color 0.2s ease;
}

.sbw-breadcrumb-link:hover {
	color: #00724A;
}

.sbw-breadcrumb-current {
	color: #1e293b;
	font-weight: 700;
}

.sbw-breadcrumb-sep {
	display: inline-flex;
	align-items: center;
	color: #cbd5e1;
}

.sbw-breadcrumb-sep svg {
	width: 12px;
	height: 12px;
	margin: 0 0.5rem;
}

/* کادر جستجوی سایدبار */
.sbw-search-form {
	display: flex;
	align-items: center;
	height: 48px;
	background: #00724A;
	border-radius: 12px;
	overflow: hidden;
}

.sbw-search-input {
	flex: 1;
	min-width: 0;
	height: 100%;
	background: transparent;
	border: none;
	outline: none;
	box-shadow: none;
	padding: 0 16px;
	font-size: 0.875rem;
	color: #fff;
}
.sbw-search-input,
.sbw-search-input:focus,
.sbw-search-input:active{
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
}

.sbw-search-input::placeholder {
	color: #99bdb2;
}

.sbw-search-btn {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 100%;
	background: #00462D;
	color: #ffffff;
}
.sbw-search-btn:hover {
	background: #0E271E;
}

/* فهرست مطالب خودکار (اکاردئونی) */
.sbw-toc {
	background: #f8fafc;
	border-radius: 16px;
	padding: 16px;
}

.sbw-toc-toggle {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.sbw-toc-title {
	font-size: 1rem;
	font-weight: 700;
	color: #0E271E;
}

.sbw-toc-toggle {
	background: transparent;
}
.sbw-toc-toggle:hover .sbw-toc-title{
	color:#00724A;
}
.sbw-toc-toggle:hover,
.sbw-toc-toggle:focus,
.sbw-toc-toggle:active{
	background: transparent;
	outline:none;
	border:none;
}
.sbw-toc-toggle svg {
	flex-shrink: 0;
	color: #64748b;
	transition: transform 0.25s ease;
}

.sbw-toc.sbw-toc-open .sbw-toc-toggle svg {
	transform: rotate(180deg);
}

.sbw-toc-list {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease;
}

.sbw-toc.sbw-toc-open .sbw-toc-list {
	max-height: 600px;
	overflow-y: auto;
	margin-top: 12px;
}

.sbw-toc-list li {
	border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.sbw-toc-list li:first-child {
	border-top: none;
}

.sbw-toc-list a {
	display: block;
	padding: 10px 2px;
	font-size: 0.875rem;
	color: #475569;
	text-decoration: none;
	transition: color 0.2s ease;
}

.sbw-toc-list a:hover {
	color: #00724A;
}
/*2563eb*/

.sbw-single-content h1{
	margin:0;
	font-size:1.5em;
}

@media (max-width: 1023px) {
	.sbw-single-content h1{
		font-size:1.1em;
	}
}


:root {
	--comments-primary: #00724A;
	--comments-primary-dark: #005d3d;
	--comments-primary-light: #e8f5f0;
	--comments-text: #1d2925;
	--comments-muted: #71807a;
	--comments-border: #e5ebe8;
	--comments-bg: #f7faf9;
	--comments-white: #ffffff;
	--comments-radius: 18px;
	--comments-shadow: 0 10px 35px rgba(0, 72, 47, 0.07);
}

.comments-area {
	width: 100%;
	margin: 0 auto;
	color: var(--comments-text);
	direction: rtl;
}

.comments-area > * {
	box-sizing: border-box;
}

.comments-title, .comment-reply-title {
	position: relative;
	margin: 0 0 30px;
	padding-right: 18px;
	font-size: 24px;
	font-weight: 800;
	line-height: 1.6;
	color: var(--comments-text);
}

.comments-title::before, .comment-reply-title::before {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	width: 5px;
	height: 28px;
	border-radius: 10px;
	background: var(--comments-primary);
	transform: translateY(-50%);
}

.comment-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.comment-list .comment {
	position: relative;
	margin: 0 0 18px;
	padding: 24px;
	background: var(--comments-white);
	border: 1px solid var(--comments-border);
	border-radius: var(--comments-radius);
	box-shadow: var(--comments-shadow);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.comment-list .comment:hover {
	border-color: rgba(0, 114, 74, .18);
	box-shadow: 0 15px 45px rgba(0, 72, 47, .10);
	transform: translateY(-2px);
}

.comment-body {
	position: relative;
}

.comment-content {
	margin-top: 18px;
	font-size: 15px;
	line-height: 2;
	color: #394640;
}

.comment-content p:last-child {
	margin-bottom: 0;
}

.comment-author {
	display: flex;
	align-items: center;
	gap: 12px;
}

.comment-author .avatar {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid var(--comments-primary-light);
	box-shadow: 0 4px 12px rgba(0, 114, 74, .12);
}

.comment-author .fn {
	font-size: 15px;
	font-weight: 800;
	font-style: normal;
	color: var(--comments-text);
}

.comment-author .says {
	display: none;
}

.comment-metadata {
	margin-top: 3px;
	margin-right: 60px;
}

.comment-metadata a {
	color: var(--comments-muted);
	font-size: 12px;
	text-decoration: none;
	transition: color .2s ease;
}

.comment-metadata a:hover {
	color: var(--comments-primary);
}

.comment-list .reply {
	margin-top: 18px;
}

.comment-reply-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	padding: 7px 15px;
	border-radius: 10px;
	background: var(--comments-primary-light);
	color: var(--comments-primary);
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
	transition: background .2s ease, color .2s ease, transform .2s ease;
}

.comment-reply-link:hover {
	background: var(--comments-primary);
	color: #fff;
	transform: translateY(-1px);
}

.comment-list .children {
	margin: 18px 0 0;
	padding: 0 25px 0 0;
	list-style: none;
	border-right: 2px solid var(--comments-primary-light);
}

.comment-list .children .comment {
	background: #fbfdfc;
	box-shadow: none;
}

.comment-respond {
	margin-top: 45px;
	padding: 30px;
	background: var(--comments-white);
	border: 1px solid var(--comments-border);
	border-radius: 22px;
	box-shadow: var(--comments-shadow);
}

.comment-notes, .logged-in-as, .must-log-in {
	margin: -12px 0 25px;
	color: var(--comments-muted);
	font-size: 13px;
	line-height: 1.9;
}

.logged-in-as a, .must-log-in a {
	color: var(--comments-primary);
	font-weight: 700;
	text-decoration: none;
}

.logged-in-as a:hover, .must-log-in a:hover {
	text-decoration: underline;
}

.comment-form {
	display: grid;
	gap: 18px;
}

.comment-form p {
	margin: 0;
}

.comment-form label {
	display: block;
	margin-bottom: 8px;
	color: var(--comments-text);
	font-size: 13px;
	font-weight: 700;
}

.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 14px 16px;
	border: 1px solid var(--comments-border);
	border-radius: 13px;
	background: var(--comments-bg);
	color: var(--comments-text);
	font-family: inherit;
	font-size: 14px;
	outline: none;
	transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.comment-form input::placeholder, .comment-form textarea::placeholder {
	color: #9aa7a1;
}

.comment-form input[type="text"]:focus, .comment-form input[type="email"]:focus, .comment-form input[type="url"]:focus, .comment-form textarea:focus {
	background: #fff;
	border-color: var(--comments-primary);
}

.comment-form textarea {
	min-height: 150px;
	resize: vertical;
	line-height: 1.9;
}

.comment-form .comment-form-author, .comment-form .comment-form-email, .comment-form .comment-form-url {
	width: 100%;
}

@media (min-width: 768px) {
	.comment-form {
		grid-template-columns: repeat(2, 1fr);
	}

	.comment-form-comment, .comment-form-cookies-consent, .form-submit, .comment-notes {
		grid-column: 1 / -1;
	}

	.comment-form-author, .comment-form-email, .comment-form-url {
		grid-column: span 1;
	}
}

.comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 13px 15px;
	border-radius: 12px;
	background: var(--comments-bg);
}

.comment-form-cookies-consent input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin: 2px 0 0;
	accent-color: var(--comments-primary);
	flex: 0 0 auto;
}

.comment-form-cookies-consent label {
	margin: 0;
	color: var(--comments-muted);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.8;
}

.comment-form .submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	padding: 12px 28px;
	border: 0;
	border-radius: 13px;
	background: var(--comments-primary);
	color: #fff;
	font-family: inherit;
	font-size: 14px;
	font-weight: 800;
	cursor: pointer;
	box-shadow: 0 8px 20px rgba(0, 114, 74, .18);
	transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}

.comment-form .submit:hover {
	background: var(--comments-primary-dark);
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(0, 114, 74, .25);
}

.comment-form .submit:active {
	transform: translateY(0);
}

#cancel-comment-reply-link {
	display: inline-flex;
	align-items: center;
	margin-right: 10px;
	color: #b14b4b;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
}

#cancel-comment-reply-link:hover {
	text-decoration: underline;
}

.required {
	color: var(--comments-primary);
}

.comment-navigation {
	display: flex;
	justify-content: space-between;
	gap: 15px;
	margin: 25px 0;
}

.comment-navigation a {
	display: inline-flex;
	align-items: center;
	padding: 10px 16px;
	border-radius: 11px;
	background: var(--comments-primary-light);
	color: var(--comments-primary);
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
	transition: .2s ease;
}

.comment-navigation a:hover {
	background: var(--comments-primary);
	color: #fff;
}

.no-comments {
	padding: 25px;
	border: 1px dashed var(--comments-border);
	border-radius: 16px;
	background: var(--comments-bg);
	color: var(--comments-muted);
	text-align: center;
	font-size: 14px;
}

.comment-awaiting-moderation {
	display: block;
	margin-bottom: 12px;
	padding: 10px 14px;
	border-radius: 10px;
	background: #fff7e6;
	color: #8a641e;
	font-size: 12px;
	line-height: 1.8;
}

@media (max-width: 767px) {
	.comments-area {
		margin-top: 40px;
	}

	.comments-title, .comment-reply-title {
		font-size: 20px;
	}

	.comment-list .comment {
		padding: 18px;
		border-radius: 15px;
	}

	.comment-respond {
		padding: 20px;
		border-radius: 17px;
	}

	.comment-list .children {
		padding-right: 12px;
	}

	.comment-author .avatar {
		width: 42px;
		height: 42px;
	}

	.comment-content {
		font-size: 14px;
	}

	.comment-form .submit {
		width: 100%;
	}

	.comment-navigation {
		flex-direction: column;
	}

	.comment-navigation a {
		justify-content: center;
	}
}

/* جعبه‌ی نویسنده (قبلاً inline style بود، برای پشتیبانی دارک‌مود کلاس شد) */
.sbw-author-box {
	background: #f8fafc;
}

/* ============================================================
 * حالت تیره — مخصوص کلاس‌های خودکفای این فایل (که کلاس‌های عمومی
 * پلاگین ویجت‌ها رو استفاده نمی‌کنن، پس اون‌جا override نمی‌شن).
 * ============================================================ */

html.sw-dark .sbw-single-content,
html.sw-dark .sbw-author-box,
html.sw-dark .sbw-breadcrumb-box,
html.sw-dark .sbw-entry-content blockquote {
	background: #131c2e;
}

html.sw-dark .sbw-toc{
	background: #0a0f1a;
}

html.sw-dark .sbw-single-content h1,
html.sw-dark .sbw-toc-title,
html.sw-dark .sbw-breadcrumb-current,
html.sw-dark .font-bold.text-slate-800,
html.sw-dark .text-slate-800 {
	color: #f1f5f9;
}

html.sw-dark .sbw-breadcrumb-link,
html.sw-dark .sbw-breadcrumb-sep,
html.sw-dark .sbw-toc-toggle svg,
html.sw-dark .sbw-toc-list a,
html.sw-dark .sbw-entry-content,
html.sw-dark .sbw-entry-content blockquote {
	color: #94a3b8;
}

/* تیترهای داخل متن پست (h2/h3) رنگ ثابت تیره داشتن که توی حالت تیره ناخونا می‌شد */
html.sw-dark .sbw-entry-content h2,
html.sw-dark .sbw-entry-content h3 {
	color: #f1f5f9;
}

/* لینک‌های داخل متن پست، سبز روشن‌تر برای کنتراست بهتر روی پس‌زمینه‌ی تیره */
html.sw-dark .sbw-entry-content a {
	color: #34d399;
}

html.sw-dark .sbw-toc-list li {
	border-top-color: rgba(255, 255, 255, 0.08);
}

html.sw-dark .sw-tag-pill {
	background-color: rgba(255, 255, 255, 0.08);
	color: #cbd5e1;
}

html.sw-dark .sw-tag-pill:hover {
	background-color: rgba(255, 255, 255, 0.14);
}

/*
 * حالت تیره‌ی بخش دیدگاه‌ها — چون CSS خودت از متغیر (--comments-*)
 * استفاده می‌کنه، کافیه فقط مقدار همون متغیرها رو زیر html.sw-dark
 * بازتعریف کنیم؛ همه‌ی قوانین بالا (که بهشون ارجاع می‌دن) خودکار
 * عوض می‌شن، بدون این‌که هیچ سلکتوری رو دوباره بنویسیم.
 */
html.sw-dark {
	--comments-primary: #34d399;
	--comments-primary-dark: #10b981;
	--comments-primary-light: rgba(52, 211, 153, 0.12);
	--comments-text: #f1f5f9;
	--comments-muted: #94a3b8;
	--comments-border: rgba(255, 255, 255, 0.08);
	--comments-bg: #0b1220;
	--comments-white: #131c2e;
	--comments-shadow: 0 10px 35px rgba(0, 0, 0, 0.35);
}

/* رنگ‌های ثابت (نه متغیر) که توی CSS خودت هاردکد شده بودن */
html.sw-dark .comment-content {
	color: #cbd5e1;
}

html.sw-dark .comment-list .children .comment {
	background: #0f1729;
}

html.sw-dark .comment-form input::placeholder,
html.sw-dark .comment-form textarea::placeholder {
	color: #64748b;
}

html.sw-dark .comment-form input[type="text"]:focus,
html.sw-dark .comment-form input[type="email"]:focus,
html.sw-dark .comment-form input[type="url"]:focus,
html.sw-dark .comment-form textarea:focus {
	background: #131c2e;
}

html.sw-dark .comment-awaiting-moderation {
	background: rgba(250, 204, 21, 0.12);
	color: #facc15;
}

html.sw-dark #cancel-comment-reply-link {
	color: #f87171;
}

/* ============================================================
 * ناحیه‌ی ابزارک وردپرسی سایدبار (Appearance -> Widgets). چون هر
 * ابزارکی می‌تونه توش قرار بگیره (لیست پیوند، متن، RSS، دسته‌بندی و...)
 * یه استایل پایه‌ی عمومی و ساده براشون می‌نویسیم که با بقیه‌ی
 * کارت‌های سایدبار (سفید، گرد، پدینگ) هماهنگ باشه.
 * ============================================================ */

.sbw-widget-box {
	background: #ffffff;
	border-radius: 16px;
	padding: 16px;
}

.sbw-widget-title {
	font-size: 1rem;
	font-weight: 700;
	color: #1e293b;
	margin: 0 0 12px;
}

.sbw-widget-box ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sbw-widget-box li {
	padding: 8px 0;
	border-top: 1px solid rgba(15, 23, 42, 0.08);
	font-size: 0.875rem;
	color: #475569;
}

.sbw-widget-box li:first-child {
	border-top: none;
	padding-top: 0;
}

.sbw-widget-box a {
	color: #334155;
	text-decoration: none;
	transition: color 0.2s ease;
}

.sbw-widget-box a:hover {
	color: #00724A;
}

.sbw-widget-box select,
.sbw-widget-box input[type="text"],
.sbw-widget-box input[type="search"],
.sbw-widget-box input[type="email"] {
	width: 100%;
	border: 1px solid rgba(15, 23, 42, 0.1);
	border-radius: 10px;
	padding: 8px 12px;
	font-size: 0.875rem;
	background: #f8fafc;
	box-sizing: border-box;
}

.sbw-widget-box img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}

/* حالت تیره */
html.sw-dark .sbw-widget-box {
	background: #131c2e;
}

html.sw-dark .sbw-widget-title {
	color: #f1f5f9;
}

html.sw-dark .sbw-widget-box li {
	color: #94a3b8;
	border-top-color: rgba(255, 255, 255, 0.08);
}

html.sw-dark .sbw-widget-box a {
	color: #cbd5e1;
}

html.sw-dark .sbw-widget-box a:hover {
	color: #34d399;
}

html.sw-dark .sbw-widget-box select,
html.sw-dark .sbw-widget-box input[type="text"],
html.sw-dark .sbw-widget-box input[type="search"],
html.sw-dark .sbw-widget-box input[type="email"] {
	background: #0b1220;
	border-color: rgba(255, 255, 255, 0.1);
	color: #e2e8f0;
}
