/**
 * دُرشکه — لایهٔ توکن‌های طراحی (DOROSHKE Theme Tokens v2.0 «کبالت روشن»، تأییدشده ۲۰۲۶-۰۹).
 *
 * فقط حالت روشن. سفید + خاکستری یخی + کبالت. پترول/استخوانی بازنشسته شده‌اند.
 *
 * چرا این توکن‌ها زیر .dk-app و .dk-confirm تعریف می‌شوند و نه روی :root؟
 * قالب فعال سایت ممکن است همین نام‌ها را با مقدار دیگری (پالت قبلی) روی :root
 * تعریف کرده باشد. تعریف محلی تضمین می‌کند رابط افزونه در هر قالبی دقیقاً همین
 * پالت را دارد و در عوض به هیچ استایل سراسری یا پیشخوان وردپرس دست نمی‌زند.
 *
 * قرارداد: هیچ کامپوننتی مستقیماً از سطح A (--dk-*) نمی‌خواند؛ فقط سطح B
 * (معنایی: --surface-*, --text-*, --border-*, --state-*) یا سطح C (کامپوننت).
 * فایل‌های components.css و showroom.css هیچ مقدار هگز یا اندازهٔ خامی ندارند.
 */

/* ---------------------------------------------------------------------------
   فونت‌های محلی — Vazirmatn و Inter، زیرمجموعهٔ WOFF2 با محور وزن ۱۰۰–۹۰۰.
   هر دو زیر پروانهٔ SIL OFL 1.1 (assets/fonts/OFL-*.txt). اگر قالب همین
   خانواده‌ها را از پیش بارگذاری کرده باشد، مرورگر فقط یکی را دانلود می‌کند.
   --------------------------------------------------------------------------- */
@font-face {
	font-family: "Vazirmatn";
	src: url("../fonts/Vazirmatn-Variable.subset.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

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

.dk-app,
.dk-confirm {
	/* =========================================================================
	   سطح A — مقادیر پایه (هویت کبالت روشن)
	   ========================================================================= */
	--dk-ink: #202936;
	--dk-muted: #647184;
	--dk-bg: #F7F9FC;
	--dk-paper: #FFFFFF;
	--dk-panel: #F3F6FA;
	--dk-sand: #EDF2F8;
	--dk-line: #E1E7EF;
	--dk-white: #FFFFFF;
	--dk-cobalt: #2454D6;
	--dk-cobalt-hover: #1C43B2;
	--dk-cobalt-deep: #173691;
	--dk-selected: #E8EFFF;
	--dk-cobalt-wash-16: #D6E2FF;
	--dk-on-ink-muted: #A7B2C2;
	--dk-on-ink-accent: #9DB8F5;

	--dk-ok: #2E7D4F;
	--dk-warn: #9A6700;
	--dk-err: #B3261E;
	--dk-info: #2F5F98;
	--dk-ok-bg: #EAF4EE;
	--dk-warn-bg: #F9F1DF;
	--dk-err-bg: #FAEAE8;
	--dk-info-bg: #EAF0F9;
	--dk-err-hover: #98201A;
	--dk-err-active: #7D1A15;
	--dk-ink-60: rgba(32, 41, 54, 0.55);

	/* جای‌نگهدار عکس — عمداً رنگ پالت نیست. */
	--dk-photo-1: #DDE3EB;
	--dk-photo-2: #B8C0CC;

	--dk-font-persian: "Vazirmatn", "Vazir", Tahoma, sans-serif;
	--dk-font-latin: "Inter", Arial, Helvetica, sans-serif;

	--space-1: 4px;
	--space-2: 8px;
	--space-3: 16px;
	--space-4: 24px;
	--space-5: 32px;
	--space-6: 48px;
	--space-7: 64px;
	--space-8: 96px;

	/* =========================================================================
	   سطح B — معنایی
	   ========================================================================= */
	--surface-page: var(--dk-bg);
	--surface-card: var(--dk-paper);
	--surface-raised: var(--dk-paper);
	--surface-muted: var(--dk-panel);
	--surface-panel: var(--dk-panel);
	--surface-fill: var(--dk-sand);
	--surface-selected: var(--dk-selected);
	--surface-inverse: var(--dk-ink);
	--surface-brand: var(--dk-cobalt);
	--surface-brand-hover: var(--dk-cobalt-hover);
	--surface-brand-active: var(--dk-cobalt-deep);
	--surface-brand-wash: var(--dk-selected);
	--surface-brand-wash-strong: var(--dk-cobalt-wash-16);
	--surface-disabled: var(--dk-line);
	--surface-scrim: var(--dk-ink-60);

	--text-body: var(--dk-ink);
	--text-secondary: var(--dk-muted);
	--text-muted: var(--dk-muted);
	--text-accent: var(--dk-cobalt);
	--text-on-brand: var(--dk-white);
	--text-on-inverse: var(--dk-white);
	--text-secondary-on-inverse: var(--dk-on-ink-muted);
	--text-accent-on-inverse: var(--dk-on-ink-accent);
	--text-disabled: #9AA5B5;
	--text-on-status: var(--dk-white);
	--text-selected: var(--dk-cobalt-hover);
	--text-link: var(--dk-cobalt);
	--text-link-hover: var(--dk-cobalt-hover);

	--border-default: var(--dk-line);
	--border-strong: var(--dk-ink);
	--border-accent: var(--dk-cobalt);
	--border-on-inverse: rgba(255, 255, 255, 0.18);
	--border-on-brand: rgba(255, 255, 255, 0.25);
	--focus-ring: var(--dk-cobalt);

	--state-success: var(--dk-ok);
	--state-warning: var(--dk-warn);
	--state-error: var(--dk-err);
	--state-info: var(--dk-info);
	--state-success-bg: var(--dk-ok-bg);
	--state-warning-bg: var(--dk-warn-bg);
	--state-error-bg: var(--dk-err-bg);
	--state-info-bg: var(--dk-info-bg);

	/* =========================================================================
	   تایپوگرافی — مقیاس تأییدشده (پایهٔ ۱۴، فشرده و آرام). --text-body رنگ است؛
	   اندازهٔ متن --text-size-body است تا برخورد نام‌ها تکرار نشود.
	   ========================================================================= */
	--font-fa: var(--dk-font-persian);
	--font-en: var(--dk-font-latin);
	--font-body: var(--font-fa);
	--font-display: var(--font-fa);
	--font-data: var(--font-en);

	--text-display: 40px;
	--lh-display: 1.25;
	--text-h1: 27px;
	--lh-h1: 1.5;
	--text-h2: 21px;
	--lh-h2: 1.5;
	--text-h3: 16px;
	--lh-h3: 1.5;
	--text-size-body: 14px;
	--lh-body: 1.8;
	--text-caption: 12px;
	--lh-caption: 1.7;
	--text-price: 20px;
	--lh-price: 1.2;
	--text-stat: 32px;
	--lh-stat: 1.1;
	--text-table: 13px;
	--lh-table: 1.6;
	--text-label: 13px;
	--lh-label: 1;
	--text-button: 13px;
	--lh-button: 1;

	--weight-regular: 400;
	--weight-medium: 500;
	--weight-semibold: 600;
	--weight-bold: 700;
	--weight-h1: 800;

	--tracking-vin: 0.06em;
	--tracking-eyebrow: 0.14em;
	--measure-body: 70ch;

	/* =========================================================================
	   هندسه، شبکه، اندازه‌ها، حرکت
	   ========================================================================= */
	--radius-xs: 4px;
	--radius-sm: 7px;
	--radius-md: 10px;
	--radius-lg: 14px;
	--radius-full: 999px;
	--radius: var(--radius-md);
	--shadow-dialog: 0 20px 70px rgba(32, 41, 54, 0.13);

	/* برش ۴۵ درجهٔ نسخهٔ قبلی بازنشسته شده است؛ این نام‌ها فقط برای این‌که
	   قواعد قدیمی نشکنند بی‌اثر می‌مانند. */
	--cut-sm: 0px;
	--cut-lg: 0px;
	--clip-cut-sm: none;
	--clip-cut-lg: none;

	--border-width: 1px;
	--focus-width: 2px;
	--focus-offset: 3px;

	--grid-max: 1200px;
	--grid-gutter: 24px;
	--grid-margin: 24px;
	--grid-gutter-mobile: 16px;
	--grid-margin-mobile: 16px;
	--bp-mobile: 600px;
	--bp-tablet: 900px;

	--control-h: 44px;
	--control-h-sm: 36px;
	--control-h-lg: 52px;
	--chip-h: 24px;
	--chip-h-filter: 32px;
	--touch-min: 44px;

	--ease: cubic-bezier(0.2, 0, 0, 1);
	--dur-fast: 120ms;
	--dur-base: 200ms;

	/* =========================================================================
	   سطح C — توکن‌های کامپوننت. هر مقدار از سطح B می‌آید، هرگز هگز.
	   ========================================================================= */
	--button-primary-background: var(--surface-brand);
	--button-primary-text: var(--text-on-brand);
	--button-primary-hover: var(--surface-brand-hover);
	--button-primary-pressed: var(--surface-brand-active);
	--button-secondary-border: var(--border-accent);
	--button-secondary-text: var(--text-accent);
	--button-secondary-hover: var(--surface-brand-wash);
	--button-secondary-pressed: var(--surface-brand-wash-strong);
	--button-ghost-text: var(--text-accent);
	--button-ghost-hover: var(--surface-brand-wash);
	--button-destructive-background: var(--state-error);
	--button-destructive-hover: var(--dk-err-hover);
	--button-destructive-pressed: var(--dk-err-active);
	--button-destructive-text: var(--dk-white);
	--button-disabled-background: var(--surface-disabled);
	--button-disabled-text: var(--text-disabled);
	--button-height: var(--control-h);
	--button-height-sm: var(--control-h-sm);
	--button-height-lg: var(--control-h-lg);
	--button-padding-x: var(--space-4);
	--button-font-size: var(--text-button);
	--button-font-weight: var(--weight-semibold);
	--button-radius: var(--radius-sm);

	--card-background: var(--surface-card);
	--card-border: var(--border-default);
	--card-border-hover: var(--border-accent);
	--card-padding: var(--space-3);
	--card-radius: var(--radius-md);
	--card-title-size: var(--text-h3);

	--input-background: var(--surface-card);
	--input-border: var(--border-default);
	--input-border-hover: var(--text-secondary);
	--input-border-focus: var(--border-accent);
	--input-border-error: var(--state-error);
	--input-height: var(--control-h);
	--input-height-sm: var(--control-h-sm);
	--input-padding-x: var(--space-3);
	--input-text: var(--text-body);
	--input-placeholder: var(--text-secondary);
	--input-disabled-background: var(--surface-muted);
	--input-disabled-text: var(--text-disabled);
	--checkbox-size: 20px;

	--navigation-background: var(--surface-card);
	--navigation-border: var(--border-default);
	--navigation-text: var(--text-body);
	--navigation-text-hover: var(--text-accent);
	--navigation-active-indicator: var(--surface-brand);
	--navigation-active-background: var(--surface-selected);
	--navigation-active-text: var(--text-selected);

	--table-header-background: transparent;
	--table-header-rule: var(--border-default);
	--table-row-border: var(--border-default);
	--table-zebra: var(--surface-muted);
	--table-key-text: var(--text-secondary);
	--table-font-size: var(--text-table);

	--alert-padding: 12px var(--space-3);
	--alert-border-width: var(--border-width);

	--badge-background: var(--surface-selected);
	--badge-text: var(--text-selected);
	--chip-height: var(--chip-h);
	--chip-border: var(--border-default);
	--chip-text: var(--text-body);
	--chip-font-size: var(--text-caption);

	--overlay-scrim: var(--surface-scrim);
	--overlay-radius: var(--radius-lg);
	--overlay-shadow: var(--shadow-dialog);
	--overlay-background: var(--surface-card);
	--overlay-border: var(--border-default);
	--overlay-max-width: 480px;

	--price-figure-size: var(--text-price);
	--price-figure-weight: var(--weight-bold);

	--image-frame-background: var(--dk-photo-1);
	--image-frame-radius: var(--radius-md);
	--thumb-radius: var(--radius-xs);

	/* -------------------------------------------------------------------------
	   پایه
	   ------------------------------------------------------------------------- */
	box-sizing: border-box;
	color: var(--text-body);
	color-scheme: light only;
	direction: rtl;
	font-family: var(--font-body);
	text-align: start;
	-webkit-font-smoothing: antialiased;
}

.dk-app *,
.dk-app *::before,
.dk-app *::after,
.dk-confirm *,
.dk-confirm *::before,
.dk-confirm *::after {
	box-sizing: border-box;
}

/* display صریح روی فیلدها و پوشش‌ها از قاعدهٔ [hidden] مرورگر قوی‌تر است. */
.dk-app [hidden],
.dk-confirm [hidden] {
	display: none !important;
}

/* هر رشتهٔ لاتین داخل متن فارسی جدا می‌شود. ارقام فارسی در Vazirmatn می‌مانند. */
:is(.dk-app, .dk-confirm) .dk-en {
	direction: ltr;
	display: inline-block;
	font-family: var(--font-en);
	unicode-bidi: isolate;
}

:is(.dk-app, .dk-confirm) .dk-num {
	direction: ltr;
	font-variant-numeric: tabular-nums;
	unicode-bidi: isolate;
}

:is(.dk-app, .dk-confirm) .dk-vin {
	direction: ltr;
	font-family: var(--font-en);
	font-variant-numeric: tabular-nums;
	letter-spacing: var(--tracking-vin);
	text-transform: uppercase;
	unicode-bidi: isolate;
}

.dk-app .screen-reader-text,
.dk-app .dk-visually-hidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

:is(.dk-app, .dk-confirm) :focus-visible {
	outline: var(--focus-width) solid var(--focus-ring);
	outline-offset: var(--focus-offset);
}

/* حرکت فقط کارکردی است. */
@media (prefers-reduced-motion: reduce) {
	.dk-app *,
	.dk-app *::before,
	.dk-app *::after,
	.dk-confirm *,
	.dk-confirm *::before,
	.dk-confirm *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}