/* =====================================================================
   دیدبان — توکن های طراحی (مرجع: docs/01-design-system.md)
   هیچ کامپوننتی اجازهٔ Hardcode رنگ/اندازه/فاصله ندارد.
   ===================================================================== */

@font-face {
	font-family: 'Vazirmatn';
	src: url('../fonts/Vazirmatn-Variable.woff2') format('woff2-variations');
	font-weight: 100 900;
	font-display: swap;
	font-style: normal;
}

:root {
	/* رنگ ها — روشن */
	--color-primary: #1D4E89;
	--color-primary-strong: #143A69;
	--color-primary-soft: #EAF1F9;
	--color-accent: #C87E1A;
	--color-accent-soft: #FBF3E4;
	--color-text: #1C2430;
	--color-text-muted: #5C6675;
	--color-bg: #F5F7FA;
	--color-surface: #FFFFFF;
	--color-surface-alt: #EEF2F7;
	--color-border: #E3E8EF;
	--color-success: #1E7F4F;
	--color-warning: #B26E0B;
	--color-danger: #C23A32;
	--color-danger-soft: #FBEAE8;
	--color-on-primary: #FFFFFF;

	/* تایپوگرافی */
	--didban-font: 'Vazirmatn', Tahoma, Arial, sans-serif;
	--text-xs: 0.75rem;    /* 12px */
	--text-sm: 0.8125rem;  /* 13px */
	--text-base: 0.9375rem;/* 15px */
	--text-md: 1rem;       /* 16px */
	--text-lg: 1.125rem;   /* 18px */
	--text-xl: 1.25rem;    /* 20px */
	--text-2xl: 1.5rem;    /* 24px */
	--text-3xl: 1.75rem;   /* 28px */
	--text-4xl: 2.25rem;   /* 36px */
	--text-5xl: 2.75rem;   /* 44px */
	--lh-body: 1.9;
	--lh-tight: 1.4;

	/* فاصله */
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;
	--space-6: 32px;
	--space-7: 48px;
	--space-8: 64px;
	--space-9: 96px;
	--space-10: 128px;

	/* ساختار */
	--radius-sm: 6px;
	--radius-md: 10px;
	--radius-lg: 16px;
	--radius-pill: 999px;
	--container-max: 1240px;
	--container-narrow: 760px;

	/* سایه */
	--shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.06);
	--shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.08);
	--shadow-md: 0 8px 24px rgba(15, 23, 42, 0.12);
	--shadow-lg: 0 16px 48px rgba(15, 23, 42, 0.18);

	/* حرکت */
	--dur-fast: 150ms;
	--dur-base: 250ms;
	--dur-slow: 400ms;
	--ease: cubic-bezier(0.4, 0, 0.2, 1);

	/* لایه */
	--z-header: 100;
	--z-drawer: 200;
	--z-modal: 300;
}

/* دارک مود — فقط با بازتعریف توکن */
[data-theme='dark'] {
	--color-primary: #6C9BD2;
	--color-primary-strong: #8FB4DF;
	--color-primary-soft: #1A2B40;
	--color-accent: #E0A33C;
	--color-accent-soft: #2B2313;
	--color-text: #E7ECF2;
	--color-text-muted: #93A0B1;
	--color-bg: #0E1319;
	--color-surface: #161D26;
	--color-surface-alt: #1C2530;
	--color-border: #2A3542;
	--color-success: #4CBB87;
	--color-warning: #D98E2B;
	--color-danger: #E4685F;
	--color-danger-soft: #2E1614;
	--color-on-primary: #0B111A;
	--shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
	--shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.45);
	--shadow-md: 0 8px 24px rgba(0, 0, 0, 0.5);
	--shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.6);
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme='light']):not([data-theme='dark']) {
		--color-on-primary: #0B111A;
		--color-primary: #6C9BD2;
		--color-primary-strong: #8FB4DF;
		--color-primary-soft: #1A2B40;
		--color-accent: #E0A33C;
		--color-accent-soft: #2B2313;
		--color-text: #E7ECF2;
		--color-text-muted: #93A0B1;
		--color-bg: #0E1319;
		--color-surface: #161D26;
		--color-surface-alt: #1C2530;
		--color-border: #2A3542;
		--color-success: #4CBB87;
		--color-warning: #D98E2B;
		--color-danger: #E4685F;
		--color-danger-soft: #2E1614;
	}
}

/* Reduced Motion — الزامات دسترسی پذیری */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}
