/* ورق زندگی — توکن‌های طراحی
   منبع: assets/tokens.css + مقادیری که پروتوتایپ به‌صورت درون‌خطی داشت.
   قاعده: هیچ رنگ یا اندازه‌ای بیرون از این فایل تعریف نشود. */

:root {
  /* رنگ رابط */
  --vz-bg:            #FFF9F7;
  --vz-app-bg:        #FFFBF9;   /* زمینهٔ بوم اپ در پروتوتایپ */
  --vz-surface:       #FFFFFF;
  --vz-surface-soft:  #F4EAE7;
  --vz-surface-warm:  #F7EDE9;   /* کارت‌های قدم‌ها و جمع قیمت */
  --vz-surface-rose:  #FDF4F2;   /* کادر خط‌چین و تب فعال */
  --vz-surface-mute:  #F2E8E4;   /* نوار جست‌وجو و چیپ خاموش */
  --vz-surface-step:  #F7F2EF;   /* مرحلهٔ طی‌نشدهٔ نوار تسویه */
  --vz-ink:           #3A2A2C;
  --vz-ink-2:         rgba(58, 42, 44, .62);
  --vz-ink-3:         rgba(58, 42, 44, .45);
  --vz-ink-4:         rgba(58, 42, 44, .30);
  --vz-line:          rgba(58, 42, 44, .12);
  --vz-border:        rgba(58, 42, 44, .08);
  --vz-accent:        #B96A6A;
  --vz-accent-deep:   #8F4E4E;
  --vz-accent-soft:   #D98B8B;
  --vz-accent-pale:   #E3A6A6;
  --vz-accent-dark:   #BE7676;
  --vz-on-accent:     #FFF9F7;
  --vz-ok:            #7A9A6E;

  /* رنگ نوع رویداد (پنل ادمین) */
  --vz-ev-photo:  #5C7A4E;
  --vz-ev-design: #B96A6A;
  --vz-ev-order:  #3F5F80;
  --vz-ev-chat:   #8A7433;
  --vz-ev-view:   rgba(58, 42, 44, .3);

  /* چیپ وضعیت سفارش — زوج (زمینه، متن) از پروتوتایپ */
  --vz-st-pay-bg:     #FDF0F0;  --vz-st-pay-fg:     #A34B4B;
  --vz-st-photos-bg:  #FDF4F2;  --vz-st-photos-fg:  #B96A6A;
  --vz-st-design-bg:  #F2ECDD;  --vz-st-design-fg:  #8A7433;
  --vz-st-print-bg:   #E9F0E6;  --vz-st-print-fg:   #5C7A4E;
  --vz-st-ship-bg:    #E6EDF4;  --vz-st-ship-fg:    #3F5F80;
  --vz-st-done-bg:    #EDEAE7;  --vz-st-done-fg:    #5A5250;

  /* تایپوگرافی — وزیرمتن محلی در public/assets/fonts/ */
  --vz-font: "Vazirmatn", system-ui, "Segoe UI", Roboto, sans-serif;
  --vz-fs-hero:    32px;
  --vz-fs-title:   20px;
  --vz-fs-section: 15px;
  --vz-fs-body:    13px;
  --vz-fs-note:    11.5px;
  --vz-fs-micro:   10.5px;
  --vz-fs-nano:    9.5px;
  --vz-lh-text: 1.75;
  --vz-lh-head: 1.3;

  /* فاصله */
  --vz-s1: 4px;  --vz-s2: 6px;  --vz-s3: 8px;  --vz-s4: 10px;
  --vz-s5: 13px; --vz-s6: 16px; --vz-s7: 22px; --vz-s8: 32px;

  /* شکل */
  --vz-r-xs: 9px;  --vz-r-sm: 11px; --vz-r-md: 14px;
  --vz-r-lg: 18px; --vz-r-xl: 22px; --vz-r-2xl: 26px; --vz-r-full: 99px;
  --vz-shadow-card:  0 8px 20px rgba(58, 42, 44, .06);
  --vz-shadow-float: 0 14px 30px rgba(58, 42, 44, .3);
  --vz-shadow-cta:   0 10px 22px rgba(217, 139, 139, .4);
  --vz-shadow-hero:  0 10px 24px rgba(120, 60, 60, .25);
  --vz-shadow-book:  0 18px 34px rgba(58, 42, 44, .28);

  /* هدف لمسی حداقلی موبایل */
  --vz-tap: 44px;
  /* بیشترین عرض ستون محتوا؛ موبایل‌اول است و دسکتاپ فقط وسط‌چین می‌شود. */
  --vz-shell: 480px;
  --vz-header-h: 58px;
  --vz-tabbar-h: 64px;
}

/* در موبایل عنوان هیرو کوچک‌تر می‌شود تا در ۳۶۰px نشکند */
@media (max-width: 420px) {
  :root { --vz-fs-hero: 26px; }
}

/* کاربر می‌تواند حرکت را خاموش کند؛ همهٔ انیمیشن‌های پروتوتایپ تزئینی‌اند. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}