/* ⛔ تولیدشده — دست نزن.
   کپیِ `Design_System/oui-tokens.css` است و با
   `python Platform_Blog/_sync_tokens.py` دوباره ساخته می‌شود.
   هر ویرایشی این‌جا دفعه‌ی بعد پاک می‌شود؛ مالک آن فایل است. */
/* ==========================================================================
 * oui-tokens.css — توکن‌های زبانِ طراحیِ سامانه (One UI)
 *
 * ⛔ این تنها جای تعریفِ `--oui-*` است.
 *
 * چرا ساخته شد: ۱۲ شهریور ۱۴۰۵ شمرده شد — **۲۱ فایلِ زنده** هر کدام نسخه‌ی
 * خودشان از همین بلوک را داخل `<style>` یا CSS ماژول کپی کرده بودند
 * (PIM · Employees ×۵ · Attendance · Contracts · Emails · Hardware ·
 * Investment · Payroll · Platform_Users ×۲ · Vehicles · …). یعنی «آبیِ
 * سامانه» بیست‌ویک تعریف داشت و عوض‌کردنش بیست‌ویک ویرایش بود. همان چیزی
 * که DESIGN.md درباره‌اش می‌گوید «یک مالک».
 *
 * ⚠ فروشگاه از این فایل استفاده نمی‌کند. زبانِ فروشگاه `--gd-*` در
 *   `gd-tokens.css` است و One UI عمداً آنجا نمی‌رود (← DESIGN.md، «سه سطح،
 *   سه زبان»). این دو پالت مستقل‌اند و هیچ‌کدام دیگری را import نمی‌کند.
 *
 * ⚠ هیچ رنگی تعریفِ یگانه‌اش داخل مدیاکوئری نیست. سامانه امروز پوسته‌ی
 *   تیره ندارد؛ اگر روزی آمد، پالت سه‌بار نوشته می‌شود (ریشه · media ·
 *   [data-theme]) — نه اینکه اینجا شرطی شود.
 *
 * مهاجرت: `python tools/oui_token_lint.py` می‌شمارد چند فایل هنوز نسخه‌ی
 * خودشان را دارند و نمی‌گذارد این عدد بالا برود.
 * ========================================================================== */

:root {

    /* ---------- سطح‌ها ---------- */
    --oui-bg:            #f2f4f8;   /* بومِ صفحه */
    --oui-card:          #ffffff;   /* رویه‌ی کارت */
    --oui-soft:          #f7f8fa;   /* پرکردنِ ورودی و سطحِ آرام */
    --oui-softer:        #eceff3;   /* حالتِ hover روی سطحِ آرام */
    --oui-border:        #e8ebf0;   /* خطِ مو */
    /* ⚠⚠ مرزِ یک کنترل باید ۳:۱ باشد (WCAG 1.4.11) — این کف است نه سلیقه.
       مقدارِ قبلی #dfe3ea روی سفید فقط ۱٫۲۹:۱ بود — قصد درست بود
       («هر ورودی خطِ دور داشته باشد») ولی خطی که دیده نمی‌شود قصد را اجرا
       نمی‌کند. کاربر دو بار گزارش کرد «تضاد رنگی در بعضی اینپوت‌ها
       دیده نمی‌شود». نگهبانش tools/ui_audit.py است. */
    --oui-border-input:  #838f9e;   /* ۳٫۳:۱ روی سفید — کفِ مرزِ کنترل */
    /* ⚠ پرده‌ی زیرِ مودال. تا ۱۸ شهریور ۱۴۰۵ وجود نداشت، پس هر پوشاننده‌ای
       خودش می‌نوشتش: `oui-drawer.css` خام `rgba(17,24,39,.45)` و درِاورِ PIM
       کلاسِ `bg-slate-900/40` تیلویند — یعنی پرده **async** بود و چند فریمِ
       اول اصلاً پرده‌ای نبود. از هیچ توکنِ دیگری هم مشتق نمی‌شود: پرده در
       هر دو پوسته باید تیره بماند، در حالی که `--oui-text` و `--oui-bg`
       هر دو در تیره وارونه می‌شوند. */
    --oui-scrim:         rgba(17,24,39,.45);

    /* ---------- متن ---------- */
    --oui-text:          #1b1d21;   /* نزدیکِ سیاه */
    --oui-muted:         #7d8590;   /* متنِ دوم */
    --oui-faint:         #94a3b8;   /* آیکنِ خنثی و placeholder */
    --oui-label:         #475569;   /* برچسبِ فیلد */

    /* ---------- برند ---------- */
    --oui-primary:       #2563eb;
    --oui-primary-2:     #1d4ed8;   /* hover */
    --oui-chip:          #e8f0fe;   /* چیپِ انتخاب‌شده */
    /* ⚠ متن/آیکون روی هر سطحِ پرِ برندی یا معنایی.
       تا ۱۵ شهریور ۱۴۰۵ این توکن **وجود نداشت**، پس هر کامپوننتی
       `#fff` خام می‌نوشت — یعنی پوسته‌ی تیره هم نمی‌توانست
       عوضش کند. `stylelint` پیدایش کرد، نه چشم. */
    --oui-on-accent:     #ffffff;   /* روی primary · danger · warn · accent */
    --oui-primary-ink:   #1e40af;   /* متنِ آبی روی چیپِ روشن */
    /* همان نقشِ `-ink` برای سبز: متن روی `--oui-ok-soft`. تا امروز هر
       ماژول `#047857` را خام می‌نوشت. ۵٫۹:۱ روی `--oui-ok-soft`. */
    --oui-ok-ink:        #047857;
    --oui-ring:          rgba(37,99,235,.12);   /* حلقه‌ی فوکوس */

    /* ---------- معنایی ----------
       ⚠ قرمز فقط برای «برداشتن/خارج‌شدن» است، نه برای هر تأکیدی. */
    --oui-danger:        #dc2626;
    --oui-danger-soft:   #fef2f2;
    --oui-ok:            #16a34a;
    --oui-ok-soft:       #ecfdf5;

    /* ---------- شش تُنِ روایتی ----------
       ۱۳ شهریور ۱۴۰۵. تا امروز مالک فقط سه معنی داشت (برند · خطر · موفق)
       و ۲۴ ماژول برای هر معنیِ چهارم رنگِ خودشان را تعریف می‌کردند:
       amber و cyan و violet و slate و teal و indigo — با شش مقدارِ متفاوت
       برای «کهربایی». این‌ها همان‌ها هستند، یک بار.

       ⚠ تُن معنی است نه رنگ. `warn` یعنی «نگاه کن»، `info` یعنی «آگاهی»،
         `accent` یعنی «دسته‌ی متفاوت». اگر معنیِ تازه‌ای لازم شد، اینجا
         اضافه شود — نه در فایلِ ماژول.
       ⚠ هر `-soft` پس‌زمینه‌ی همان تُن است و **فقط** زیرِ متنِ هم‌تُنِ
         خودش کنتراست دارد. پس‌زمینه‌ی سیر با متنِ سیر ننویس. */
    --oui-warn:          #d97706;   /* کهربایی — هشدارِ نرم، سررسید، در انتظار */
    --oui-warn-soft:     #fef3c7;
    --oui-info:          #0891b2;   /* فیروزه‌ای — آگاهی‌رسانی، برچسبِ خنثی */
    --oui-info-soft:     #cffafe;
    --oui-accent:        #7c3aed;   /* بنفش — دسته‌ی متفاوت، نه اولویتِ بالاتر */
    --oui-accent-soft:   #ede9fe;
    --oui-neutral:       #475569;   /* سربی — حالتِ خاموش و بایگانی */
    --oui-neutral-soft:  #e2e8f0;
    --oui-teal:          #0d9488;   /* سبزآبی — جریانِ مالیِ ورودی */
    --oui-teal-soft:     #ccfbf1;
    --oui-indigo:        #6366f1;   /* نیلی — سریِ دومِ نمودار */
    --oui-indigo-soft:   #e0e7ff;

    /* ---------- شعاع ---------- */
    --oui-r-card:        20px;
    --oui-r-el:          12px;
    --oui-r-pill:        999px;

    /* ---------- سایه ---------- */
    --oui-shadow:        0 2px 12px rgba(17,24,39,.06);
    --oui-shadow-lg:     0 16px 48px rgba(17,24,39,.18);
    --oui-shadow-hover:  0 6px 20px rgba(17,24,39,.10);   /* کارتِ زیرِ اشاره */
    --oui-shadow-pop:    0 12px 32px rgba(17,24,39,.14);   /* منو و کشوی شناور */
    /* بلندیِ برندی زیرِ کنشِ اصلیِ پر. سه بار به‌شکلِ خام نوشته شده بود
       (`oui-filterbar.css` و دو جای `PIM.view.php`، یکی‌شان با .22
       به‌جای .25) و هیچ پوسته‌ای نمی‌توانست عوضش کند. */
    --oui-shadow-accent: 0 2px 8px rgba(37,99,235,.25);

    /* ---------- بلندیِ کنترل‌ها ----------
       سه پله و نه بیشتر. ۴۴ کفِ لمسیِ WCAG 2.5.5 است و برای کنترل‌های
       ردیفِ اولِ هر نوار استفاده می‌شود؛ ۳۸ برای فیلدهای داخلِ گرید که با
       موس پر می‌شوند؛ ۳۴ فقط برای ورودی‌های فشرده‌ی داخلِ کشو. */
    --oui-h-control:     44px;
    --oui-h-field:       38px;
    --oui-h-dense:       34px;
    /* ⚠ این پله‌ی چهارمِ کنترل **نیست** و قاعده‌ی «سه پله و نه بیشتر» را
       نمی‌شکند: چیپ برچسب است، نه کنترل — زده نمی‌شود، پس کفِ لمسیِ ۴۴
       به آن ربطی ندارد. جدا نوشته شد چون تا امروز هر فهرستی چیپش را با
       عددِ خودش می‌ساخت و روی کارتِ محصول دو چیپِ هم‌نوع ۲۶٫۷ و ۲۸٫۷
       پیکسل درآمده بودند — دو شکل برای یک معنی. */
    --oui-h-chip:        26px;

    /* ---------- ریتم ---------- */
    --oui-gap:           10px;   /* بینِ دو کنترلِ هم‌گروه */
    --oui-gap-group:     18px;   /* بینِ دو گروهِ متفاوت */
}

/* ==========================================================================
 * پوسته‌ی تیره — ۱۴ شهریور ۱۴۰۵
 *
 * همان‌طور که بالا نوشته شده بود: «اگر روزی آمد، پالت سه‌بار نوشته می‌شود
 * (ریشه · media · [data-theme])». امروز آمد، ولی **فقط یک لایه‌اش**:
 *
 * ⛔ عمداً `@media (prefers-color-scheme: dark)` ندارد. اگر داشت، هر
 *   کارمندی که سیستمش تیره است فردا کلِ سامانه را تیره می‌دید — تغییری
 *   که کسی نخواسته و بیست ماژول برایش سنجیده نشده‌اند. این لایه فقط با
 *   انتخابِ صریحِ `data-theme="dark"` روی `<html>` روشن می‌شود، و امروز
 *   تنها مصرف‌کننده‌اش سایتِ دروازه است.
 *
 * ⚠ سطح‌ها وارونه نمی‌شوند، **بازچیده** می‌شوند: در روشن `--oui-bg` از
 *   `--oui-card` تیره‌تر است (بومِ خاکستری، کارتِ سفید)؛ در تیره برعکس
 *   باید باشد، وگرنه کارت روی بوم گم می‌شود.
 *
 * ⚠ آبیِ برند در تیره روشن‌تر می‌شود. `#2563eb` روی زمینه‌ی تیره کنتراستِ
 *   کافی برای متن ندارد؛ `#5c8dff` دارد.
 * ========================================================================== */
:root[data-theme="dark"] {

    /* ---------- سطح‌ها ---------- */
    --oui-bg:            #0b0d11;
    --oui-card:          #14171d;
    --oui-soft:          #1a1e26;
    --oui-softer:        #222732;
    --oui-border:        #232833;
    /* ⚠⚠ همان کفِ ۳:۱ که در پالتِ روشن گرفته شد (WCAG 1.4.11) این‌جا هم
       هست. `#2b313e` روی بومِ تیره فقط ۱٫۵:۱ بود — یعنی همان اشتباهِ
       روشن، آینه‌شده. `#646e7d` روی کارت ۳٫۶:۱ می‌دهد. */
    --oui-border-input:  #646e7d;
    /* ⚠ پرده در تیره باید **تیره‌تر** شود، نه روشن‌تر. یک پرده‌ی ۴۵٪ روی
       بومِ #0b0d11 عملاً دیده نمی‌شود و مودال روی صفحه شناور نمی‌ماند. */
    --oui-scrim:         rgba(0,0,0,.62);

    /* ---------- متن ---------- */
    --oui-text:          #e8ecf2;
    --oui-muted:         #9aa3b0;
    --oui-faint:         #707986;
    --oui-label:         #b6bfcc;

    /* ---------- برند ---------- */
    --oui-primary:       #5c8dff;
    --oui-primary-2:     #7ba3ff;
    --oui-chip:          #1a2848;
    --oui-on-accent:     #ffffff;
    --oui-primary-ink:   #a8c4ff;   /* چیپِ تیره → متنِ روشن */
    --oui-ring:          rgba(92,141,255,.20);

    /* ---------- معنایی ---------- */
    --oui-danger:        #eb6e6e;
    --oui-danger-soft:   #2a1618;
    --oui-ok:            #4abe8a;
    --oui-ok-soft:       #12241c;
    --oui-ok-ink:        #7ee0ae;   /* ۱۰٫۶:۱ روی --oui-ok-soft */

    /* ---------- شش تُنِ روایتی ---------- */
    --oui-warn:          #e2b254;
    --oui-warn-soft:     #2a2113;
    --oui-info:          #4cc4d8;
    --oui-info-soft:     #10262b;
    --oui-accent:        #a78bfa;
    --oui-accent-soft:   #201a33;
    --oui-neutral:       #94a3b8;
    --oui-neutral-soft:  #1e242e;
    --oui-teal:          #4bc4b4;
    --oui-teal-soft:     #10262330;
    --oui-indigo:        #8b8dfb;
    --oui-indigo-soft:   #1b1e38;

    /* ⚠ سایه روی زمینه‌ی تیره دیده نمی‌شود. عمقِ تیره از **خطِ مو** می‌آید،
       نه از سایه — پس سایه‌ها تقریباً خاموش می‌شوند تا کارت کثیف نشود. */
    --oui-shadow:        0 1px 2px rgba(0,0,0,.40);
    --oui-shadow-lg:     0 16px 48px rgba(0,0,0,.55);
    --oui-shadow-hover:  0 4px 16px rgba(0,0,0,.45);
    --oui-shadow-pop:    0 12px 32px rgba(0,0,0,.50);
    --oui-shadow-accent: 0 2px 8px rgba(92,141,255,.28);

    color-scheme: dark;
}

/* ⚠ کفِ ۱۶px روی ورودیِ موبایل قابلِ مذاکره نیست: زیرِ آن iOS صفحه را زوم
   می‌کند و **برنمی‌گرداند**. این قاعده اینجا سراسری نوشته می‌شود تا هر
   ماژولی که این فایل را لود کند خودبه‌خود بگیردش. */
@media (max-width: 767px) {
    input, select, textarea { font-size: 16px !important; }
}
