/** * KenzoYadak — Design Tokens * برند: #222021 (مشکی) · #ffffff · #fed404 (زرد تأکیدی) */ :root { /* === پالت پایه — لایت === */ --C0: #ffffff; --C1: #222021; --C2: #f4f4f3; --C3: #fed404; --C4: #e8e7e6; --C5: #787675; --C6: #222021; --C7: #1a1919; --C8: #fafaf9; --C9: #222021; --C10: #222021ed; --on-primary: #ffffff; --on-accent: #222021; --on-accent-rgb: 34, 32, 33; --selection-bg: var(--C1); --selection-text: #ffffff; --bs-body-bg: color-mix(in srgb, var(--C2) 68%, var(--C8)); --bs-secondary-bg: color-mix(in srgb, var(--C4) 55%, var(--C0)); /* === شعاع گوشه فرم‌ها و کپچا === */ --bs-border-radius: 0.865rem; --bs-border-radius-sm: 0.865rem; --bs-border-radius-lg: 0.865rem; --captcha-radius: 0.865rem; /* === Bootstrap === */ --bs-primary: var(--C1); --bs-secondary: var(--C3); --bs-primary-rgb: 34, 32, 33; --bs-secondary-rgb: 254, 212, 4; /* === گرادینت‌ها === */ --gradient-brand: linear-gradient(135deg, var(--C1) 0%, color-mix(in srgb, var(--C1) 78%, #3d3b3b) 100%); --gradient-brand-hover: linear-gradient(135deg, color-mix(in srgb, var(--C1) 88%, #000) 0%, var(--C1) 100%); --gradient-cta: linear-gradient(135deg, var(--C3) 0%, color-mix(in srgb, var(--C3) 82%, #e6b800) 100%); --gradient-cta-hover: linear-gradient(135deg, color-mix(in srgb, var(--C3) 90%, #fff) 0%, color-mix(in srgb, var(--C3) 75%, #d4a900) 100%); --gradient-promo: linear-gradient(242deg, var(--C1) 0%, color-mix(in srgb, var(--C1) 70%, var(--C3)) 38%, var(--C3) 72%, color-mix(in srgb, var(--C3) 88%, #fff) 100%); --gradient-promo-bg: var(--C3); --gradient-promo-shadow: color-mix(in srgb, var(--C1) 28%, transparent); --gradient-promo-dark-bg: color-mix(in srgb, var(--C7) 94%, #000); --gradient-promo-dark: linear-gradient(242deg, #0a0a0a 0%, var(--C1) 42%, #111010 78%, color-mix(in srgb, var(--C1) 65%, #000) 100%); --gradient-toggle-thumb-dark: linear-gradient(135deg, var(--C3) 0%, color-mix(in srgb, var(--C3) 55%, var(--C1)) 100%); --cta-shadow: color-mix(in srgb, var(--C3) 35%, transparent); --cta-shadow-hover: color-mix(in srgb, var(--C3) 48%, transparent); --gradient-image-overlay: linear-gradient(to top, color-mix(in srgb, var(--C7) 92%, #000) 0%, color-mix(in srgb, var(--C1) 38%, transparent) 58%, transparent 100%); --bs-success: #2d8a4e; --bs-success-rgb: 45, 138, 78; --financial-in: #16a34a; --financial-out: #dc3545; --input-focus-ring: 0 0 0 0.25rem color-mix(in srgb, var(--C3) 28%, transparent); /* === کپچا — لایت: ملایم === */ --captcha-bg: color-mix(in srgb, var(--C2) 85%, var(--C4)); --captcha-bg-end: color-mix(in srgb, var(--C4) 50%, var(--C0)); --captcha-text: var(--C1); --captcha-text-alt: color-mix(in srgb, var(--C3) 80%, var(--C1)); --captcha-noise: color-mix(in srgb, var(--C3) 22%, transparent); --captcha-noise-rgb: var(--bs-secondary-rgb); /* === لودر === */ --spinner-duration: 0.75s; --spinner-size-xs: 0.875rem; --spinner-size-sm: 1.125rem; --spinner-size-md: 1.375rem; --spinner-size-lg: 2.25rem; --spinner-size-xl: 3rem; --spinner-size-btn: 1.375rem; --spinner-border-xs: 2px; --spinner-border-sm: 2px; --spinner-border-md: 2px; --spinner-border-lg: 3px; --spinner-border-xl: 3px; --spinner-border-btn: 2px; --loader-accent: var(--C1); --loader-accent-dark: var(--C3); --loader-track: rgba(34, 32, 33, 0.08); --loader-track-dark: rgba(255, 255, 255, 0.1); --loader-overlay: color-mix(in srgb, var(--C2) 78%, transparent); --loader-overlay-dark: color-mix(in srgb, var(--C7) 85%, transparent); --btn-loader-track-filled: rgba(34, 32, 33, 0.15); --btn-loader-accent-filled: var(--C1); --btn-loader-track-outline: color-mix(in srgb, var(--C6) 10%, transparent); --btn-loader-accent-outline: var(--C1); --btn-loader-track-outline-dark: rgba(255, 255, 255, 0.14); --btn-loader-accent-outline-dark: var(--C3); --skeleton-base: color-mix(in srgb, var(--C4) 45%, var(--C0)); --skeleton-shine: color-mix(in srgb, var(--C4) 70%, var(--C0)); --skeleton-base-dark: color-mix(in srgb, var(--C7) 60%, #1f1f1f); --skeleton-shine-dark: color-mix(in srgb, var(--C4) 35%, #3a3939); /* === روزشمار شگفت‌انگیز (کارت محصول) === */ --dc-track-bg: color-mix(in srgb, var(--C3) 11%, var(--C8)); --dc-track-border: color-mix(in srgb, var(--C3) 36%, var(--C4)); --dc-badge-color: color-mix(in srgb, var(--C3) 68%, var(--C1)); --dc-val-color: var(--C1); --dc-lbl-color: var(--C5); --dc-sep-color: color-mix(in srgb, var(--C3) 48%, var(--C5)); /* === بج تعداد دسته در /fa/category/ === */ --category-count-badge-bg: var(--gradient-brand); --category-count-badge-color: var(--on-primary); } :root[data-bs-theme="dark"] { /* === پالت پایه — دارک (متمایل به مشکی) === */ --C0: #1a1919; --C1: #222021; --C2: #141313; --C3: #fed404; --C4: #2d2c2c; --C5: #a8a6a5; --C6: #f5f4f3; --C7: #0a0a0a; --C8: #111010; --C9: #222021; --C10: #222021f5; --selection-bg: var(--C3); --selection-text: var(--C1); color-scheme: dark; --bs-body-bg: var(--C8); --bs-secondary-bg: color-mix(in srgb, var(--C4) 55%, var(--C7)); --bs-primary-rgb: 34, 32, 33; --bs-secondary-rgb: 254, 212, 4; --gradient-promo-title-dark: color-mix(in srgb, var(--C6) 15%, var(--C3)); --financial-in: #22c55e; --financial-out: #f87171; --input-focus-ring: 0 0 0 0.2rem color-mix(in srgb, var(--C3) 34%, transparent); --btn-focus-ring-rgb: var(--on-accent-rgb); /* === کپچا — دارک: تیره، بدون بک روشن === */ --captcha-bg: color-mix(in srgb, var(--C7) 48%, var(--C4)); --captcha-bg-end: color-mix(in srgb, var(--C8) 94%, var(--C7)); --captcha-text: color-mix(in srgb, var(--C6) 86%, var(--C5)); --captcha-text-alt: color-mix(in srgb, var(--C3) 62%, var(--C5)); --captcha-noise: color-mix(in srgb, var(--C3) 14%, transparent); --captcha-noise-rgb: var(--bs-secondary-rgb); --dc-track-bg: color-mix(in srgb, var(--C3) 17%, var(--C7)); --dc-track-border: color-mix(in srgb, var(--C3) 44%, var(--C4)); --dc-badge-color: color-mix(in srgb, var(--C3) 78%, #fff); --dc-val-color: color-mix(in srgb, var(--C3) 32%, var(--C6)); --dc-lbl-color: var(--C5); --dc-sep-color: color-mix(in srgb, var(--C3) 42%, transparent); --category-count-badge-bg: linear-gradient(135deg, color-mix(in srgb, var(--C3) 55%, var(--C1)) 0%, var(--C3) 100%); --category-count-badge-color: var(--on-primary); }