/*
 * Article building blocks («دانستنی‌ها») — fixed class names used inside article content.
 * اجزای آماده‌ی داخل متن مقاله. نام کلاس‌ها ثابت است؛ راهنمای HTML در docs/article-blocks.md
 *   sg-summary · sg-stats/sg-stat · sg-tip · sg-warning · sg-mistake · sg-steps · sg-faq · (جدول‌ها خودکار)
 * Also loaded inside the block editor, so selectors are not scoped to the article wrapper.
 */
.sg-summary, .sg-stats, .sg-tip, .sg-warning, .sg-mistake, .sg-steps, .sg-faq, .sg-table {
	--sgb-ink: #2B2420;
	--sgb-muted: #6E655C;
	--sgb-line: #ECE6DB;
	--sgb-soft: #FBF8F1;
	--sgb-gold: #C9A227;
	--sgb-gold-d: #A88418;
	--sgb-up: #1E8E5A;
	--sgb-down: #C0392B;
	box-sizing: border-box;
}
.sg-summary *, .sg-stats *, .sg-tip *, .sg-warning *, .sg-mistake *, .sg-steps *, .sg-faq * { box-sizing: border-box; }

/* 1) خلاصه در یک نگاه */
.sg-summary {
	margin: 0 0 1.8em;
	padding: 18px 20px 14px;
	border: 1px solid var(--sgb-line);
	border-top: 3px solid var(--sgb-gold);
	border-radius: 12px;
	background: var(--sgb-soft);
}
.sg-summary__title {
	margin: 0 0 8px !important;
	font-size: 1rem;
	font-weight: 700;
	color: var(--sgb-ink);
}
.sg-summary ul {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
}
.sg-summary li {
	position: relative;
	margin: 0 0 6px !important;
	padding-inline-start: 22px;
	line-height: 2;
	color: var(--sgb-ink);
}
.sg-summary li::before {
	content: '';
	position: absolute;
	inset-inline-start: 2px;
	top: 0.85em;
	width: 8px;
	height: 8px;
	border-radius: 2px;
	background: var(--sgb-gold);
	transform: rotate(45deg);
}

/* 2) کارت‌های عدد (تحلیل‌ها) */
.sg-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 10px;
	margin: 1.4em 0 1.8em;
}
.sg-stat {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 14px 16px;
	border: 1px solid var(--sgb-line);
	border-radius: 12px;
	background: #FFF;
}
.sg-stat__label { font-size: 0.82rem; color: var(--sgb-muted); }
.sg-stat__value { font-size: 1.35rem; font-weight: 700; color: var(--sgb-ink); line-height: 1.6; }
.sg-stat__change {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 1px 8px;
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 700;
	background: #F1ECE3;
	color: var(--sgb-muted);
}
.sg-stat__change.is-up { color: var(--sgb-up); background: #E7F4ED; }
.sg-stat__change.is-down { color: var(--sgb-down); background: #FBEAE8; }
.sg-stat__change.is-up::before { content: '▲'; font-size: 0.7em; }
.sg-stat__change.is-down::before { content: '▼'; font-size: 0.7em; }
.sg-stat__note { font-size: 0.76rem; color: var(--sgb-muted); }

/* 3) نکته / هشدار / اشتباه رایج */
.sg-tip, .sg-warning, .sg-mistake {
	position: relative;
	margin: 1.6em 0;
	padding: 14px 18px 12px;
	padding-inline-start: 52px;
	border: 1px solid var(--sgb-line);
	border-inline-start-width: 3px;
	border-radius: 12px;
	line-height: 2;
	color: var(--sgb-ink);
}
.sg-tip { background: #FBF8F1; border-inline-start-color: var(--sgb-gold); }
.sg-warning { background: #FDF3E7; border-inline-start-color: #D9822B; }
.sg-mistake { background: #FBEFEE; border-inline-start-color: var(--sgb-down); }
.sg-tip::before, .sg-warning::before, .sg-mistake::before {
	content: '';
	position: absolute;
	inset-inline-start: 16px;
	top: 16px;
	width: 22px;
	height: 22px;
	background: currentColor;
	-webkit-mask: var(--sgb-icon) center / contain no-repeat;
	mask: var(--sgb-icon) center / contain no-repeat;
}
.sg-tip::before {
	color: var(--sgb-gold-d);
	--sgb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4'/%3E%3Cpath d='M12 3a6 6 0 0 0-3.5 10.9c.6.5 1 1.2 1 2.1h5c0-.9.4-1.6 1-2.1A6 6 0 0 0 12 3z'/%3E%3C/svg%3E");
}
.sg-warning::before {
	color: #C2701F;
	--sgb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 2 20h20L12 3z'/%3E%3Cpath d='M12 10v4M12 17h.01'/%3E%3C/svg%3E");
}
.sg-mistake::before {
	color: var(--sgb-down);
	--sgb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9 9l6 6M15 9l-6 6'/%3E%3C/svg%3E");
}
.sg-box__title { margin: 0 0 2px !important; font-weight: 700; font-size: 0.98rem; }
.sg-tip > :last-child, .sg-warning > :last-child, .sg-mistake > :last-child { margin-bottom: 0 !important; }
.sg-tip > p, .sg-warning > p, .sg-mistake > p { margin: 0 0 0.5em !important; }

/* 4) جدول‌ها — همه‌ی جدول‌های متن مقاله خودکار؛ .sg-table برای HTML خام */
.sg-art__content figure.wp-block-table,
.sg-table {
	margin: 1.6em 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--sgb-line, #ECE6DB);
	border-radius: 12px;
	background: #FFF;
}
.sg-art__content table,
.sg-table table {
	width: 100%;
	min-width: 480px; /* narrower screens scroll sideways instead of squeezing numbers */
	margin: 0 !important;
	border-collapse: collapse;
	border: 0 !important;
	font-size: 0.93rem;
	line-height: 1.8;
	display: table !important;
}
.sg-art__content > table { display: block !important; overflow-x: auto; min-width: 0; border: 1px solid #ECE6DB !important; border-radius: 12px; }
.sg-art__content th,
.sg-art__content td,
.sg-table th,
.sg-table td {
	padding: 10px 14px !important;
	border: 0 !important;
	border-bottom: 1px solid #F1ECE3 !important;
	text-align: right;
	vertical-align: middle;
	white-space: nowrap;
}
.sg-art__content thead th,
.sg-art__content tr:first-child th,
.sg-table thead th {
	background: #2B2420 !important;
	color: #F4EFE6 !important;
	font-weight: 700;
	font-size: 0.88rem;
}
.sg-art__content tbody tr:nth-child(even) td,
.sg-table tbody tr:nth-child(even) td { background: #FBF8F1; }
.sg-art__content tbody tr:last-child td,
.sg-table tbody tr:last-child td { border-bottom: 0 !important; }
.sg-art__content figure.wp-block-table figcaption { padding: 8px 14px; margin: 0; font-size: 0.82rem; color: #6E655C; text-align: right; }

/* 5) مراحل شماره‌دار */
.sg-steps {
	counter-reset: sg-step;
	list-style: none !important;
	margin: 1.6em 0 !important;
	padding: 0 !important;
}
.sg-steps > li {
	counter-increment: sg-step;
	position: relative;
	margin: 0 !important;
	padding: 0 0 22px;
	padding-inline-start: 58px;
	min-height: 44px;
}
.sg-steps > li::before {
	content: counter(sg-step, persian);
	position: absolute;
	inset-inline-start: 0;
	top: 0;
	width: 40px;
	height: 40px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--sgb-ink);
	color: var(--sgb-gold);
	font-weight: 700;
	font-size: 1.05rem;
}
.sg-steps > li:not(:last-child)::after {
	content: '';
	position: absolute;
	inset-inline-start: 19.5px;
	top: 44px;
	bottom: 4px;
	width: 1px;
	background: var(--sgb-line);
}
.sg-steps__title { margin: 6px 0 2px !important; font-weight: 700; font-size: 1.02rem; color: var(--sgb-ink); }
.sg-steps > li > p:not(.sg-steps__title) { margin: 0 0 0.4em !important; color: #3A322C; line-height: 2; }
.sg-steps img { margin-top: 8px; border-radius: 10px; }

/* 7) سؤالات متداول (آکاردئون) */
.sg-faq { margin: 2.2em 0 1em; }
.sg-faq > h2, .sg-faq > h3 { margin-bottom: 0.6em !important; }
.sg-faq details {
	border: 1px solid var(--sgb-line);
	border-radius: 12px;
	background: #FFF;
	margin: 0 0 8px;
}
.sg-faq summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px;
	list-style: none;
	font-weight: 700;
	font-size: 0.98rem;
	line-height: 1.8;
	color: var(--sgb-ink);
	cursor: pointer;
}
.sg-faq summary::-webkit-details-marker { display: none; }
.sg-faq summary::after { content: '+'; flex: none; font-weight: 400; font-size: 1.3rem; color: var(--sgb-gold-d); }
.sg-faq details[open] summary::after { content: '−'; }
.sg-faq details[open] summary { border-bottom: 1px solid var(--sgb-line); }
.sg-faq details > :not(summary) { margin: 0 !important; padding: 12px 16px 14px; line-height: 2; color: #3A322C; }

/* chart images (بند ۶): a calm frame + caption */
.sg-chart { margin: 1.6em 0; }
.sg-chart img { width: 100%; height: auto; border: 1px solid #ECE6DB; border-radius: 12px; background: #FFF; }
.sg-chart figcaption { margin-top: 6px; font-size: 0.82rem; color: #6E655C; text-align: center; }

@media (max-width: 600px) {
	.sg-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sg-stat__value { font-size: 1.15rem; }
	.sg-tip, .sg-warning, .sg-mistake { padding-inline-start: 46px; }
	.sg-tip::before, .sg-warning::before, .sg-mistake::before { inset-inline-start: 13px; }
}

/* justified body text: paragraphs, list items, tip/warning/mistake, summary, FAQ answers.
   Editor-set alignment (has-text-align-*) and short centred captions are left alone. */
.sg-art__content p:not([class*="has-text-align"]),
.sg-art__content li,
.sg-art__content .sg-faq details > :not(summary) {
	text-align: justify;
	text-justify: inter-word;
}
