/* =========================================================================
   توکن‌های طراحی — تنها منبع رنگ، فاصله، شعاع، سایه، حرکت و لایه‌ها.
   زبان طراحی: «لوکس آرام» — عاج، طلایی، جوهری؛ سطوح لایه‌ای، سایه نرم چندلایه، حرکت کوتاه.
   تم: data-theme روی هر ریشه (saffron | espresso | garden | night | luxe)
   تراکم: data-density (comfortable | compact)  — حالت سبک: data-lite="true"
   رنگ سفارشی (allowlist‌شده): --brand-primary / --brand-accent از تنظیمات کسب‌وکار
   ========================================================================= */
:root {
  /* ---- رنگ معنایی: پیش‌فرض = زعفرانی/طلایی ---- */
  --color-primary: #a8650f;
  --color-primary-strong: #7f4a07;
  --color-primary-soft: #fbefdc;
  --color-on-primary: #ffffff;
  --color-gold: #c9a24b;
  --color-gold-soft: #f6ecd5;
  --color-accent: #1d1915;
  --color-accent-soft: #efe8df;
  --color-on-accent: #fbf7f0;
  --color-bg: #faf6ef;
  --color-bg-elevated: #ffffff;
  --color-surface: #ffffff;
  --color-surface-2: #f5efe5;
  --color-surface-3: #ebe2d4;
  --color-text: #1b1612;
  --color-text-muted: #645a4f;
  --color-text-subtle: #8b8072;
  --color-border: #ebe1d2;
  --color-border-strong: #d6c8b4;
  --color-focus: #2457d6;
  --color-overlay: rgb(18 14 10 / 0.55);

  --color-success: #11713a;
  --color-success-soft: #e2f4e8;
  --color-warning: #955800;
  --color-warning-soft: #fff3d4;
  --color-danger: #b42318;
  --color-danger-soft: #fdecea;
  --color-info: #1f4fbf;
  --color-info-soft: #e8efff;
  --color-neutral: #5b5550;
  --color-neutral-soft: #efebe6;

  /* وضعیت قلم سفارش (KDS) — همیشه همراه متن و آیکون */
  --status-pending: #5b5550;   --status-pending-soft: #efebe6;
  --status-accepted: #3b4fc4;  --status-accepted-soft: #e8ebff;
  --status-preparing: #955800; --status-preparing-soft: #fff1cf;
  --status-ready: #11713a;     --status-ready-soft: #dcf3e4;
  --status-served: #4b5563;    --status-served-soft: #eceef1;
  --status-cancelled: #b42318; --status-cancelled-soft: #fdecea;

  /* ---- تایپوگرافی ---- */
  --font-family: "Vazirmatn", "Vazir", Tahoma, system-ui, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --text-xs: 0.75rem;   /* 12 */
  --text-sm: 0.875rem;  /* 14 */
  --text-md: 1rem;      /* 16 */
  --text-lg: 1.125rem;  /* 18 */
  --text-xl: 1.375rem;  /* 22 */
  --text-2xl: 1.75rem;  /* 28 */
  --text-3xl: clamp(1.9rem, 1.4rem + 2.4vw, 3rem);
  --text-display: clamp(2.3rem, 1.4rem + 4.2vw, 4.6rem);
  --leading-tight: 1.35;
  --leading-normal: 1.8;
  --weight-regular: 400;
  --weight-bold: 700;
  --weight-black: 800;
  --tracking-tight: -0.015em;

  /* ---- فاصله (مقیاس ۴) ---- */
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
  --space-5: 1.25rem; --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem;
  --space-12: 3rem; --space-16: 4rem; --space-20: 5rem;
  --gutter: clamp(1rem, 0.6rem + 1.6vw, 1.75rem);

  /* ---- شعاع ---- */
  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-card: 22px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  /* ---- سایه نرم چندلایه ---- */
  --shadow-xs: 0 1px 2px rgb(27 22 18 / 0.06);
  --shadow-card: 0 1px 1px rgb(27 22 18 / 0.03), 0 2px 4px rgb(27 22 18 / 0.03), 0 10px 28px -10px rgb(27 22 18 / 0.14);
  --shadow-raised: 0 2px 4px rgb(27 22 18 / 0.04), 0 12px 24px -8px rgb(27 22 18 / 0.12), 0 32px 64px -24px rgb(27 22 18 / 0.22);
  --shadow-overlay: 0 30px 80px -20px rgb(18 14 10 / 0.45);

  /* ---- ابعاد کنترل و پوسته ---- */
  --control-h: 46px;
  --control-h-sm: 36px;
  --control-h-lg: 54px;
  --touch-min: 44px;
  --sidebar-width: 280px;
  --sidebar-width-collapsed: 78px;
  --header-h: 66px;
  --content-max: 1260px;

  /* سایدبار جوهری مدیریت (مستقل از تم روشن/تیره محتوا) */
  --sidebar-bg: #17140f;
  --sidebar-fg: #f1ebe1;
  --sidebar-muted: #9d9384;
  --sidebar-hover: rgb(255 255 255 / 0.06);
  --sidebar-active: rgb(201 162 75 / 0.16);
  --sidebar-active-fg: #f0d79a;
  --sidebar-border: rgb(255 255 255 / 0.07);

  /* ---- حرکت ---- */
  --motion-duration: 220ms;
  --motion-fast: 150ms;
  --motion-slow: 280ms;
  --motion-cart: 420ms;
  --motion-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --motion-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ---- لایه‌ها ---- */
  --z-base: 1;
  --z-sticky: 20;
  --z-header: 30;
  --z-sidebar: 40;
  --z-drawer: 60;
  --z-modal: 70;
  --z-toast: 90;
  --z-skip: 100;

  /* ---- جلوه‌ها (در حالت سبک خاموش) ---- */
  --glass-bg: rgb(255 253 249 / 0.74);
  --glass-blur: 18px;
  --hero-glow: radial-gradient(60% 80% at 85% 0%, rgb(232 176 90 / 0.30), transparent 70%), radial-gradient(40% 60% at 0% 20%, rgb(201 162 75 / 0.14), transparent 70%);
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");

  color-scheme: light;
}


/* توکن‌های مشتق‌شده روی هر ریشه تم دوباره محاسبه می‌شوند تا تم‌های تودرتو (پیش‌نمایش منو) رنگ درست بگیرند */
:root, [data-theme] {
  --grad-primary: linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 78%, #fff 22%) 0%, var(--color-primary) 45%, var(--color-primary-strong) 100%);
  --grad-gold: linear-gradient(135deg, #f3dfa8 0%, #c9a24b 45%, #8e6a22 100%);
  --grad-ink: linear-gradient(160deg, #24201b 0%, #14110e 100%);
  --grad-surface: linear-gradient(180deg, var(--color-surface) 0%, color-mix(in srgb, var(--color-surface) 92%, var(--color-primary) 8%) 100%);
  --ring-gold: linear-gradient(135deg, rgb(201 162 75 / 0.7), rgb(201 162 75 / 0.05) 40%, rgb(201 162 75 / 0.5));

  --shadow-glow: 0 10px 30px -8px color-mix(in srgb, var(--color-primary) 55%, transparent);
}

/* ---------------- اسپرسو: قهوه‌ای، شیری، مسی ---------------- */
[data-theme="espresso"] {
  --color-primary: #6b4430;
  --color-primary-strong: #4f301f;
  --color-primary-soft: #f3e7dc;
  --color-accent: #a35d2a;
  --color-accent-soft: #f6e6d8;
  --color-bg: #f6f1ea;
  --color-surface: #fffcf8;
  --color-bg-elevated: #fffcf8;
  --color-surface-2: #f0e8de;
  --color-surface-3: #e5d9cb;
  --color-text: #2a1d15;
  --color-text-muted: #6c5a4d;
  --color-text-subtle: #8c7a6c;
  --color-border: #e3d6c7;
  --color-border-strong: #c9b6a2;
  --hero-glow: radial-gradient(60% 80% at 80% 0%, rgb(196 128 72 / 0.3), transparent 70%);
}

/* ---------------- باغ تازه: سبز، سفید، مرجانی ---------------- */
[data-theme="garden"] {
  --color-primary: #17703f;
  --color-primary-strong: #0f5530;
  --color-primary-soft: #e2f4e8;
  --color-accent: #c2412b;
  --color-accent-soft: #fde8e3;
  --color-bg: #f4faf5;
  --color-surface: #ffffff;
  --color-bg-elevated: #ffffff;
  --color-surface-2: #eaf4ec;
  --color-surface-3: #d8eadc;
  --color-text: #13241a;
  --color-text-muted: #4e6457;
  --color-text-subtle: #718a7b;
  --color-border: #d5e6da;
  --color-border-strong: #b2cdb9;
  --hero-glow: radial-gradient(60% 80% at 80% 0%, rgb(255 140 110 / 0.28), transparent 70%);
}

/* ---------------- شب: سطوح تیره، متن روشن ---------------- */
[data-theme="night"] {
  --color-primary: #f2a93b;
  --color-primary-strong: #ffc26b;
  --color-primary-soft: #3a2a12;
  --color-on-primary: #1a1206;
  --color-accent: #8fb3ff;
  --color-accent-soft: #1d2740;
  --color-on-accent: #0b1020;
  --color-bg: #0e1014;
  --color-bg-elevated: #171a21;
  --color-surface: #161920;
  --color-surface-2: #1d2129;
  --color-surface-3: #262b35;
  --color-text: #eceef2;
  --color-text-muted: #a5adbb;
  --color-text-subtle: #7f8899;
  --color-border: #2b303b;
  --color-border-strong: #3c4350;
  --color-focus: #8fb3ff;
  --color-overlay: rgb(0 0 0 / 0.62);
  --color-success: #4ade80;  --color-success-soft: #12301f;
  --color-warning: #fbbf24;  --color-warning-soft: #33270a;
  --color-danger: #f87171;   --color-danger-soft: #3a1414;
  --color-info: #93b4ff;     --color-info-soft: #172443;
  --color-neutral: #b6bcc7;  --color-neutral-soft: #262b35;
  --status-pending: #c3c8d1;   --status-pending-soft: #262b35;
  --status-accepted: #a5b4fc;  --status-accepted-soft: #1e2347;
  --status-preparing: #fbbf24; --status-preparing-soft: #33270a;
  --status-ready: #4ade80;     --status-ready-soft: #12301f;
  --status-served: #9ca3af;    --status-served-soft: #22262e;
  --status-cancelled: #f87171; --status-cancelled-soft: #3a1414;
  --shadow-card: 0 1px 2px rgb(0 0 0 / 0.4), 0 8px 24px -10px rgb(0 0 0 / 0.6);
  --shadow-raised: 0 2px 8px rgb(0 0 0 / 0.45), 0 20px 44px -12px rgb(0 0 0 / 0.7);
  --glass-bg: rgb(22 25 32 / 0.78);
  --hero-glow: radial-gradient(60% 80% at 80% 0%, rgb(242 169 59 / 0.18), transparent 70%);
  color-scheme: dark;
}

/* ---------------- لوکس: مشکی و طلایی ---------------- */
[data-theme="luxe"] {
  --color-primary: #d2a54c;
  --color-primary-strong: #f0cf86;
  --color-primary-soft: #2b2416;
  --color-on-primary: #17120a;
  --color-gold: #d9b15f;
  --color-gold-soft: #2b2416;
  --color-accent: #efe4cc;
  --color-accent-soft: #24211b;
  --color-on-accent: #15120d;
  --color-bg: #0c0b09;
  --color-bg-elevated: #15130f;
  --color-surface: #14120e;
  --color-surface-2: #1c1914;
  --color-surface-3: #27231c;
  --color-text: #f5efe4;
  --color-text-muted: #b6aa96;
  --color-text-subtle: #8a7f6d;
  --color-border: #2a251d;
  --color-border-strong: #3d362a;
  --color-focus: #f0cf86;
  --color-overlay: rgb(0 0 0 / 0.66);
  --color-success: #5fd393;  --color-success-soft: #10291b;
  --color-warning: #f4c45a;  --color-warning-soft: #2e230b;
  --color-danger: #ff8a7e;   --color-danger-soft: #3a1513;
  --color-info: #9fb8ff;     --color-info-soft: #162244;
  --color-neutral: #c2b8a6;  --color-neutral-soft: #24211b;
  --status-pending: #c9bfae;   --status-pending-soft: #24211b;
  --status-accepted: #a9b7ff;  --status-accepted-soft: #1c2245;
  --status-preparing: #f4c45a; --status-preparing-soft: #2e230b;
  --status-ready: #5fd393;     --status-ready-soft: #10291b;
  --status-served: #a39b8d;    --status-served-soft: #211e19;
  --status-cancelled: #ff8a7e; --status-cancelled-soft: #3a1513;
  --grad-primary: linear-gradient(135deg, #f6dfa4 0%, #d2a54c 45%, #9d7428 100%);
  --shadow-card: 0 1px 0 rgb(255 255 255 / 0.03) inset, 0 12px 32px -12px rgb(0 0 0 / 0.7);
  --shadow-raised: 0 1px 0 rgb(255 255 255 / 0.04) inset, 0 24px 50px -16px rgb(0 0 0 / 0.8);
  --glass-bg: rgb(20 18 14 / 0.72);
  --hero-glow: radial-gradient(60% 80% at 85% 0%, rgb(210 165 76 / 0.22), transparent 70%), radial-gradient(40% 60% at 0% 30%, rgb(210 165 76 / 0.08), transparent 70%);
  color-scheme: dark;
}

/* ---- تراکم ---- */
[data-density="compact"] {
  --control-h: 40px;
  --space-4: 0.875rem;
  --space-6: 1.25rem;
  --radius-card: 14px;
}

/* ---- حالت سبک: حذف blur، سایه سنگین و حرکت تزئینی ---- */
[data-lite="true"] {
  --glass-blur: 0px;
  --glass-bg: var(--color-surface);
  --shadow-card: 0 0 0 1px var(--color-border);
  --shadow-raised: 0 0 0 1px var(--color-border-strong);
  --hero-glow: none;
  --noise: none;
  --grad-primary: var(--color-primary);
  --shadow-glow: none;
  --motion-duration: 0ms;
  --motion-fast: 0ms;
  --motion-slow: 0ms;
  --motion-cart: 0ms;
}

@media (prefers-reduced-motion: reduce) {
  :root { --motion-duration: 0ms; --motion-fast: 0ms; --motion-slow: 0ms; --motion-cart: 0ms; }
}