/* ============================================================
   سبزحساب — توکن‌های طراحی
   منبع: docs/BRAND.md  ·  رنگ‌ها از لوگو استخراج شده‌اند
   قاعده ج-۱: هیچ ارجاع خارجی. قلم‌ها روی سرور خودمان.
   ============================================================ */

/* ---------- قلم‌ها — خودمیزبان، بدون Google Fonts ----------
   ایران‌سنس نسخه FaNum (ارقام فارسی). وزن‌های موجود: 300 / 400 / 500 / 700 / 900
   ⚠ ایران‌سنس وزن 600 و 800 ندارد — در طراحی از 500 و 700 و 900 استفاده کن.  */
@font-face {
    font-family: 'IRANSansX';
    src: url('/fonts/IRANSansX-Light.woff2') format('woff2');
    font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'IRANSansX';
    src: url('/fonts/IRANSansX-Regular.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'IRANSansX';
    src: url('/fonts/IRANSansX-Medium.woff2') format('woff2');
    font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'IRANSansX';
    src: url('/fonts/IRANSansX-Bold.woff2') format('woff2');
    font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'IRANSansX';
    src: url('/fonts/IRANSansX-Black.woff2') format('woff2');
    font-weight: 900; font-style: normal; font-display: swap;
}
/* ---------- قلم عددی — از خود ایران‌سنس ----------
   ایران‌سنس ویژگی `tnum` ندارد و عرض ارقامش متغیر است، پس در ستون
   مبلغ رقم‌ها زیر هم نمی‌افتند. این خانواده با
   `python tools/build-tabular-font.py` از همان ایران‌سنس ساخته می‌شود:
   فقط ارقام و جداکننده‌ها، همه با عرض یکسان و وسط‌چین.

   🔴 اینجا قبلا «IBM Plex Mono» بود که دو ایراد داشت: ارقام فارسی
   ندارد، و فایلش اصلا به پروژه اضافه نشده بود (۴۰۴). نتیجه‌اش این
   بود که هر عدد فارسی به قلم پیش‌فرض ویندوز می‌افتاد و وسط رابط
   فارسی می‌زد بیرون.

   `unicode-range` عمدا فقط ارقام و نشانه‌های عدد را می‌گیرد تا
   حرف‌ها همچنان از خود ایران‌سنس بیایند.                             */
@font-face {
    font-family: 'IRANSansXNum';
    src: url('/fonts/IRANSansXNum-Regular.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0030-0039, U+0660-066C, U+06F0-06F9,
                   U+0025, U+0028-0029, U+002C-002F;
}
@font-face {
    font-family: 'IRANSansXNum';
    src: url('/fonts/IRANSansXNum-Medium.woff2') format('woff2');
    font-weight: 500; font-style: normal; font-display: swap;
    unicode-range: U+0030-0039, U+0660-066C, U+06F0-06F9,
                   U+0025, U+0028-0029, U+002C-002F;
}
@font-face {
    font-family: 'IRANSansXNum';
    src: url('/fonts/IRANSansXNum-Bold.woff2') format('woff2');
    font-weight: 700; font-style: normal; font-display: swap;
    unicode-range: U+0030-0039, U+0660-066C, U+06F0-06F9,
                   U+0025, U+0028-0029, U+002C-002F;
}

/* ---------- ارقام لاتین برای حالت انگلیسی ----------
   🔴 هر دو ایران‌سنس (X و XNum) ارقام ASCII را به شکل فارسی می‌کشند.
   برای صفحه‌های انگلیسی، فقط بازه ارقام (U+0030-0039) از یک قلم
   سیستمی لاتین (local، بدون فایل خارجی — قاعده ج-۱ حفظ) می‌آید و
   حرف‌ها همچنان ایران‌سنس می‌مانند. این خانواده فقط روی lang=en به کار
   می‌رود، پس فارسی دست‌نخورده و همچنان ارقام فارسی دارد. */
@font-face {
    font-family: 'BrandLatinNum';
    src: local('Segoe UI'), local('Roboto'), local('Helvetica Neue'),
         local('Arial'), local('Tahoma'), local('DejaVu Sans'), local('Liberation Sans');
    unicode-range: U+0030-0039;
    font-display: swap;
}

:root {
    /* ---------- نشانه‌ها ----------
       🔴 SVG درون‌خطی به‌صورت data URI، طبق قاعده ج-۱: هیچ ارجاع
       خارجی و هیچ فایل جدا. با `mask` استفاده می‌شود تا رنگش از
       `currentColor` بیاید و در هر دو تم درست بماند. */
    --icon-lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='10.5' width='16' height='10' rx='2'/%3E%3Cpath d='M8 10.5V7a4 4 0 0 1 8 0v3.5'/%3E%3C/svg%3E");

    /* ---------- طیف برند ---------- */
    --brand-950: #04211D;
    --brand-900: #024240;
    --brand-800: #035349;
    --brand-700: #04604A;
    --brand-600: #037347;   /* رنگ اصلی حالت روشن */
    --brand-500: #0E9268;
    --brand-400: #11AD85;   /* رنگ اصلی حالت تاریک */
    --brand-300: #57D362;
    --brand-200: #98E766;   /* تزئینی — هرگز متن روی زمینه روشن */
    --brand-100: #D6F4C9;
    --brand-50:  #F0FAE8;

    --brand-primary: var(--brand-600);   /* در حالت تاریک به brand-400 می‌رود */

    /* گرادیان امضا — فقط یک بار در هر صفحه */
    --brand-sweep: linear-gradient(105deg,
        #024240 0%, #035349 18%, #037347 38%,
        #048773 55%, #11AD85 72%, #57D362 88%, #98E766 100%);

    /* ---------- خنثی‌ها (حالت روشن) ---------- */
    --ground:         #F6FAF8;
    --surface:        #FFFFFF;
    --surface-sunken: #EFF5F2;
    --surface-raised: #FFFFFF;
    --border:         #DCE7E2;
    --border-strong:  #BACCC4;
    --scroll-thumb:        #C3D6CE;
    --scroll-thumb-strong: #9DBBAF;
    --ink:            #0D1F1B;
    --ink-muted:      #5A6E68;
    --ink-faint:      #647871;   /* ۴٫۶:۱ روی سفید — قبلا ۳٫۱:۱ بود و رد می‌شد */
    --ink-on-brand:   #FFFFFF;

    /* ---------- معنایی ---------- */
    --positive:    #037347;
    --positive-bg: #EAF7EF;
    --negative:    #B32318;
    --negative-bg: #FEF0EE;
    --warning:     #B54708;
    --warning-bg:  #FEF6E7;
    --info:        #175CD3;
    --info-bg:     #EEF4FF;
    --neutral:     #5A6E68;
    --neutral-bg:  #F0F3F2;

    /* ---------- تایپوگرافی ---------- */
    --font-ui:  'IRANSansX', 'IRANSans', 'Segoe UI', Tahoma, system-ui, sans-serif;
    /* ارقام جدولی؛ هر چه خارج از دامنه‌اش باشد به ایران‌سنس می‌افتد */
    --font-num: 'IRANSansXNum', 'IRANSansX', 'IRANSans', Tahoma, sans-serif;

    --text-display: 2.5rem;   /* 40px */
    --text-title:   1.5rem;   /* 24px */
    --text-section: 1.125rem; /* 18px */
    --text-card:    0.9375rem;/* 15px */
    --text-body:    0.875rem; /* 14px  ← پایه */
    --text-sub:     0.8125rem;/* 13px */
    --text-label:   0.75rem;  /* 12px */
    --text-tiny:    0.6875rem;/* 11px */

    /* ---------- فاصله (مضارب ۴) ---------- */
    --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
    --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
    --sp-12: 48px; --sp-16: 64px;

    /* ---------- هندسه ---------- */
    --r-field: 6px;
    --r-card:  10px;
    --r-modal: 14px;
    --r-pill:  999px;

    --h-control-sm: 36px;
    --h-control:    40px;
    --h-control-touch: 44px;   /* حداقل هدف لمس */
    --h-row:        40px;

    --measure: 68ch;

    /* ---------- سایه — کم و کم‌رنگ ---------- */
    --shadow-pop:   0 4px 12px -2px rgb(2 66 64 / 0.10), 0 2px 4px -2px rgb(2 66 64 / 0.06);
    --shadow-modal: 0 20px 40px -8px rgb(2 66 64 / 0.18), 0 4px 12px -4px rgb(2 66 64 / 0.10);

    /* ---------- حرکت ---------- */
    --ease: cubic-bezier(0.2, 0, 0, 1);
    --t-fast:  120ms;
    --t-base:  200ms;
    --t-enter: 240ms;
}

/* ---------- حالت تاریک: پیش‌فرض سیستم ---------- */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --ground:         #0B1512;
        --surface:        #121F1B;
        --surface-sunken: #0E1A16;
        --surface-raised: #172823;
        --border:         #233A33;
        --border-strong:  #2F4A42;
        --scroll-thumb:        #2B443B;
        --scroll-thumb-strong: #3E5D52;
        --ink:            #EAF3EF;
        --ink-muted:      #93A8A1;
        --ink-faint:      #7B918A;
        --ink-on-brand:   #062018;   /* متن تیره روی سبز روشن */
        --brand-primary:  var(--brand-400);


        /*
         * 🔴 طیف روشن برند در حالت تاریک باید **تیره** شود.
         *
         * `--brand-50` معنایش «کم‌رنگ‌ترین سطح برنددار» است، نه «سبز
         * روشن». اگر در حالت تاریک همان #F0FAE8 بماند، هر جایی که آن را
         * زمینه گذاشته (hover ردیف جدول، آیتم پالت، سربرگ سال جاری،
         * کارت طرح، دکمه افزودن ویترین) یک لکه روشن با متن سفید
         * ناخوانا می‌شود. یک بار دیده شد و دوازده جا را با هم خراب کرده بود.
         */
        --brand-50:  #0C2A22;
        --brand-100: #123A2F;

        --positive:    #11AD85;
        --positive-bg: #0C2A22;
        --negative:    #F97066;
        --negative-bg: #2C1512;
        --warning:     #FDB022;
        --warning-bg:  #2B1D0A;
        --info:        #6BA5F5;
        --info-bg:     #10203A;
        --neutral:     #93A8A1;
        --neutral-bg:  #1A2622;

        --shadow-pop:   0 4px 12px -2px rgb(0 0 0 / 0.40);
        --shadow-modal: 0 20px 40px -8px rgb(0 0 0 / 0.55);
    }
}

/* ---------- حالت تاریک: انتخاب صریح کاربر ---------- */
:root[data-theme="dark"] {
    --ground:         #0B1512;
    --surface:        #121F1B;
    --surface-sunken: #0E1A16;
    --surface-raised: #172823;
    --border:         #233A33;
    --border-strong:  #2F4A42;
    --scroll-thumb:        #2B443B;
    --scroll-thumb-strong: #3E5D52;
    --ink:            #EAF3EF;
    --ink-muted:      #93A8A1;
    --ink-faint:      #7B918A;
    --ink-on-brand:   #062018;
    --brand-primary:  var(--brand-400);

    --brand-50:  #0C2A22;
    --brand-100: #123A2F;

    --positive:    #11AD85;
    --positive-bg: #0C2A22;
    --negative:    #F97066;
    --negative-bg: #2C1512;
    --warning:     #FDB022;
    --warning-bg:  #2B1D0A;
    --info:        #6BA5F5;
    --info-bg:     #10203A;
    --neutral:     #93A8A1;
    --neutral-bg:  #1A2622;

    --shadow-pop:   0 4px 12px -2px rgb(0 0 0 / 0.40);
    --shadow-modal: 0 20px 40px -8px rgb(0 0 0 / 0.55);
}

/* ============================================================
   پایه
   ============================================================ */
html { color-scheme: light dark; }

body {
    margin: 0;
    background: var(--ground);          /* هرگز شفاف */
    color: var(--ink);
    font-family: var(--font-ui);
    font-size: var(--text-body);
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
}

/*
   🔴 لینک باید رنگ داشته باشد — وگرنه مرورگر آبی #0000EE می‌گذارد.

   `color-scheme: light dark` فقط وقتی رنگ پیش‌فرض لینک را تیره‌پسند
   می‌کند که حالت تاریک از **سیستم‌عامل** بیاید. تم دستی سبزحساب با
   `data-theme="dark"` عوض می‌شود و مرورگر همچنان فکر می‌کند صفحه روشن
   است — پس هر لینک بی‌کلاس، آبی سیر روی زمینه‌ای تقریبا سیاه
   می‌ماند. نسبت کنتراستش حدود ۱٫۶:۱ است، یعنی عملا نامرئی.

   همه کلاس‌های لینک‌دار (`.btn`, `.side-link`, `.row-link`, `.drill`,
   `.menu-item`, …) رنگ خودشان را می‌گذارند، پس این قاعده فقط لینک
   متنی داخل جمله را می‌گیرد — که دقیقا همان‌جایی است که خراب بود.
*/
a {
    color: var(--brand-primary);
    text-decoration-color: color-mix(in oklab, var(--brand-primary) 45%, transparent);
    text-underline-offset: 3px;
}
a:hover { text-decoration-color: currentColor; }

/*
   🔴 `hidden` روی <svg> کار نمی‌کند.
   قاعده `[hidden]{display:none}` در شیوه‌نامه مرورگر فقط عناصر HTML را
   می‌گیرد و `<svg>` در فضای‌نام دیگری است. نتیجه‌اش این بود که آیکون
   خورشید/ماه و تمام‌صفحه هرگز عوض نمی‌شدند — کد درست بود، CSS نبود.
*/
[hidden] { display: none !important; }

/*
   🔴 عناصر فرم قلم را ارث نمی‌برند.
   مرورگر برای button/input/select/textarea قلم پیش‌فرض سیستم را
   می‌گذارد، نه قلم بدنه. بدون این قاعده، هر دکمه‌ای که یادمان برود
   font-family بدهد با Segoe UI رندر می‌شود و وسط رابط فارسی می‌زند
   بیرون. یک قاعده سراسری، همان اشتباه را برای همیشه می‌بندد.
*/
button, input, select, textarea, optgroup {
    font-family: inherit;
    font-size: inherit;
    color: inherit;
}

/* هر جا عدد هست، ارقام جدولی */
.num, table, input[type="number"], .amount, td, th {
    font-variant-numeric: tabular-nums;
}

/* مبلغ همیشه راست‌چین، حتی در RTL */
.amount { text-align: right; direction: ltr; unicode-bidi: isolate; }
.amount--negative { color: var(--negative); }
.amount--positive { color: var(--positive); }

/* کد حساب، شماره فاکتور، بارکد */
.code { font-family: var(--font-num); direction: ltr; unicode-bidi: isolate; letter-spacing: 0.01em; }

/* فوکوس — هرگز حذف نمی‌شود */
:focus-visible {
    outline: 2px solid var(--brand-primary);
    outline-offset: 2px;
    border-radius: var(--r-field);
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}
