/*
 * ریست و پایه‌های عمومی
 * از همین مرحله (سایدبار سراسری)، توکن‌های رنگ/تایپوگرافی سراسری قالب هم اینجا تعریف می‌شن
 * تا هم sidebar.css هم single-project.css (و هر CSS بعدی) بتونن بهشون وابسته باشن.
 */

:root {
	--sbp-ink: #141413;
	--sbp-paper: #F7F5F1;
	--sbp-muted: rgba(20, 20, 19, 0.55);
	--sbp-line: rgba(20, 20, 19, 0.12);
	--sbp-placeholder: #EDEAE2;
	/* لوگو یک بار دیگه بزرگ‌تر شد → ریل هم به‌همون‌نسبت عریض‌تر شد (قبلاً 88px) */
	--sbp-rail-width: 104px;

	/*
	 * ریتم فاصله‌ی عمودیِ مشترکِ کل سایت — یک بار اینجا تعریف می‌شه، همه‌ی صفحات
	 * (صفحه اصلی، آرشیو پروژه‌ها، تک‌پروژه، وبلاگ) و حتی خودِ سایدبار ازش استفاده
	 * می‌کنن؛ یعنی هر صفحه‌ای که باز کنی، شروعِ محتوا دقیقاً همون فاصله‌ی همیشگی از
	 * بالای صفحه رو داره، نه یه عدد رندوم مخصوص خودش.
	 */
	--sbp-space-top: 80px;
	--sbp-space-bottom: 96px;
	--sbp-space-top-mobile: 48px;
	--sbp-space-bottom-mobile: 64px;

	/*
	 * همون منطق، این‌بار برای فاصله‌ی چپ/راست — قبلاً هر تمپلیت یک عدد جدا برای
	 * padding چپ/راستِ خودش داشت (یکی 24px، یکی 32px)؛ الان همه از همین یک توکن
	 * مشترک استفاده می‌کنن تا فاصله‌ی افقیِ محتوا از لبه‌ی صفحه، دقیقاً مثل فاصله‌ی
	 * بالا/پایین، توی کل سایت یکدست باشه (یک «باکس» بی‌رنگ با فاصله‌ی ثابت از هر ۴ طرف).
	 */
	--sbp-space-side: 40px;
	--sbp-space-side-mobile: 20px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	line-height: 1.5;
	background: var(--sbp-paper);
	color: var(--sbp-ink);
	/* فضای رزروشده برای سایدبار ثابت چپ — تا محتوای واقعی صفحه هیچ‌وقت زیرش قایم نشه.
	   (فوتر دوباره پایین صفحه برگشته، پس دیگه نوار راست و padding-right نداریم) */
	padding-left: var(--sbp-rail-width);
}

img,
picture,
video,
canvas,
svg {
	display: block;
	max-width: 100%;
	height: auto;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

a {
	text-decoration: none;
	color: inherit;
}

button,
input,
textarea,
select {
	font: inherit;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.skip-link:focus {
	position: fixed;
	top: 8px;
	left: 8px;
	width: auto;
	height: auto;
	padding: 8px 16px;
	background: #fff;
	color: #000;
	z-index: 100;
}

@media (max-width: 640px) {
	:root {
		--sbp-rail-width: 76px;
	}
}

/*
 * تک‌نوشته‌های وبلاگ (نه صفحه‌ی پروژه یا صفحه اصلی) سایدبار چپ رو نمی‌خوان؛
 * یه صفحه‌ی خوندنِ ساده و تک‌ستونه (فوتر و بخش‌های پایینی همچنان نشون داده می‌شن). کلاس sbp-no-sidebar رو sbp_body_classes() در functions.php (بار اول)
 * یا pjax.js (وقتی با PJAX وارد می‌شیم) می‌ذاره.
 */
body.sbp-no-sidebar {
	padding-left: 0;
}

body.sbp-no-sidebar .site-sidebar {
	display: none;
}

