/*
 * توکن‌های طراحی سایت «با عیار».
 *
 * منبع حقیقت رنگ‌ها و قلم‌ها «رنگ‌های سراسری» و «قلم‌های سراسری» Elementor است
 * (Elementor ← تنظیمات سایت). هر توکن این‌جا همان متغیر Elementor را می‌خواند و فقط
 * اگر Elementor نباشد به مقدار پیش‌فرض برمی‌گردد. پس تغییر یک رنگ در Elementor همه‌ی
 * سایت را عوض می‌کند، حتی بخش‌هایی که با CSS این پوسته ساخته شده‌اند.
 *
 * رنگ‌های پیش‌فرض همان رنگ‌های سامانه‌ی حسابداری‌اند (packages/ui/src/styles/palette-gold.css
 * و docs/adr/0079): سبز کاجی #0e6e58، صحنه‌ی تیره‌ی صفحه‌ی ورود #050b09، زمینه‌ی عاجی #f7f5f0
 * و طلایی «جنس» #b8892e.
 */

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansXFaNum-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansXFaNum-Medium.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansXFaNum-DemiBold.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "IRANSansX";
	src: url("../fonts/IRANSansXFaNum-Bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* اندازه‌ها، فاصله‌ها و حرکت — به رنگ وابسته نیستند و روی :root می‌نشینند. */
:root {
	--bya-font-fallback: Tahoma, "Segoe UI", system-ui, sans-serif;

	/*
	 * مقیاس نوشتار: روان بین ۳۷۵ و ۱۴۴۰ پیکسل؛ Elementor همین‌ها را در «قلم‌های سراسری» دارد و هر بخش
	 * «برچسب ← H2 ← متن درشت ← محتوا» است. مینیمال، نه درشت: H1 تا ۶۰، H2 تا ۴۰، متن بدنه ۱۶ پیکسل.
	 */
	--bya-text-display: clamp(2.125rem, 1.55rem + 2.44vw, 3.75rem);
	--bya-text-h2: clamp(1.625rem, 1.33rem + 1.3vw, 2.5rem);
	--bya-text-h3: clamp(1.0625rem, 1rem + 0.25vw, 1.25rem);
	--bya-text-h4: 1.0625rem;
	--bya-text-lead: clamp(1rem, 0.955rem + 0.19vw, 1.125rem);
	--bya-text-body: clamp(0.9375rem, 0.91rem + 0.12vw, 1rem);
	--bya-text-title: 1.0625rem;
	--bya-text-card: 0.9375rem;
	--bya-text-small: 0.875rem;
	--bya-text-micro: 0.8125rem;
	--bya-text-stat: clamp(1.75rem, 1.45rem + 1.2vw, 2.5rem);

	/* فارسی با IRANSansX جعبه‌ی محتوای ۱٫۵em دارد؛ خط عنوان کوتاه‌تر از ۱٫۳ حرف‌ها را به هم می‌چسباند. */
	--bya-leading-display: 1.32;
	--bya-leading-h2: 1.42;
	--bya-leading-heading: 1.55;
	--bya-leading-body: 1.95;

	/* فاصله‌ها */
	--bya-gutter: clamp(1rem, 0.35rem + 2.75vw, 2.5rem);
	--bya-section: clamp(4rem, 2.4rem + 6.4vw, 7.5rem);
	--bya-stack: clamp(1.25rem, 1rem + 1vw, 2rem);
	--bya-head-gap: clamp(2.25rem, 1.6rem + 2.6vw, 3.75rem);
	--bya-container: 1240px;
	--bya-container-wide: 1360px;
	--bya-header-height: 76px;

	/* گوشه‌ها: یک خانواده‌ی آرام. نه قرص بزرگ، نه مستطیل پفکی. */
	--bya-radius-xs: 8px;
	--bya-radius-s: 12px;
	--bya-radius: 16px;
	--bya-radius-l: 22px;
	--bya-radius-pill: 999px;

	/* حرکت: دقیق، آرام. بی جهش و بی کمانه. */
	--bya-ease: cubic-bezier(0.22, 0.7, 0.18, 1);
	--bya-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--bya-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
	--bya-duration: 760ms;
	--bya-duration-fast: 200ms;
	--bya-duration-mid: 420ms;
}

/*
 * رنگ‌ها روی body: Elementor متغیرهای --e-global-color-* را روی کلاس کیت (که روی body است)
 * تعریف می‌کند و var() در همان عنصری حل می‌شود که اعلام شده است.
 */
body {
	--bya-pine: var(--e-global-color-primary, #0e6e58);
	--bya-stage: var(--e-global-color-secondary, #0b1f19);
	--bya-ink: var(--e-global-color-text, #1c1917);
	--bya-gold: var(--e-global-color-accent, #b8892e);

	--bya-pine-deep: var(--e-global-color-pinedeep, #06463a);
	--bya-pine-mid: var(--e-global-color-pinemid, #2a8a6f);
	--bya-pine-bright: var(--e-global-color-pinebright, #3fae8c);
	--bya-mint: var(--e-global-color-mint, #8bdec4);
	--bya-pine-wash: var(--e-global-color-pinewash, #e3f3ec);

	--bya-stage-deep: var(--e-global-color-stagedeep, #071612);
	--bya-stage-raised: var(--e-global-color-stageraised, #13312a);
	--bya-stage-ink: var(--e-global-color-stageink, #f2f5f3);
	--bya-stage-ink-2: var(--e-global-color-stageink2, #a9bdb5);

	--bya-ivory: var(--e-global-color-ivory, #f7f5f0);
	--bya-cream: var(--e-global-color-cream, #f0eadf);
	--bya-surface: var(--e-global-color-surface, #ffffff);
	--bya-surface-muted: var(--e-global-color-surfacemuted, #fbfaf6);
	--bya-mint-pale: var(--e-global-color-mintpale, #ebf4ef);
	--bya-sage: var(--e-global-color-sage, #dfe9e2);
	--bya-sage-line: var(--e-global-color-sageline, #c6d8cc);
	--bya-border: var(--e-global-color-border, #e8e2d6);
	--bya-border-strong: var(--e-global-color-borderstrong, #d8cfbe);
	--bya-ink-2: var(--e-global-color-ink2, #4a4336);
	--bya-ink-3: var(--e-global-color-ink3, #6b6253);

	--bya-gold-light: var(--e-global-color-goldlight, #e6c677);
	--bya-gold-deep: var(--e-global-color-golddeep, #8a661c);
	--bya-gold-soft: var(--e-global-color-goldsoft, #f6edd6);

	/* خط‌های روی تیره از جوهر روشن ساخته می‌شوند تا با آن عوض شوند */
	--bya-stage-line: color-mix(in oklab, var(--bya-stage-ink) 11%, transparent);
	--bya-stage-line-strong: color-mix(in oklab, var(--bya-stage-ink) 20%, transparent);
	--bya-stage-glass: color-mix(in oklab, var(--bya-stage-ink) 5%, transparent);

	--bya-font: var(--e-global-typography-text-font-family, "IRANSansX"), var(--bya-font-fallback);

	/* سایه‌ها گرم و کم، مثل پالت سامانه؛ فقط جایی که عمق معنا دارد */
	--bya-shadow-xs: 0 1px 2px 0 rgb(48 36 16 / 0.05);
	--bya-shadow-s: 0 1px 2px 0 rgb(48 36 16 / 0.05), 0 6px 14px -6px rgb(48 36 16 / 0.1);
	--bya-shadow-m: 0 2px 4px -1px rgb(48 36 16 / 0.05), 0 22px 44px -18px rgb(48 36 16 / 0.2);
	--bya-shadow-l: 0 4px 8px -2px rgb(48 36 16 / 0.05), 0 40px 80px -32px rgb(48 36 16 / 0.28);
	--bya-shadow-dark: 0 0 0 1px rgb(255 255 255 / 0.06), 0 50px 100px -40px rgb(0 0 0 / 0.75);
	--bya-focus: 0 0 0 3px color-mix(in oklab, var(--bya-pine) 35%, transparent);
}
