/* ══════════════════════════════════════════════════════════════
   Flixiy Design System · نظام تصميم فليكسي
   Principles: flat colours, no gradients, high contrast, generous space.
   المبادئ: ألوان مسطّحة بلا تدرّجات · تباين عالٍ · مساحات واسعة.
   Fully RTL/LTR aware via CSS logical properties.
   يدعم الاتجاهين عبر خصائص CSS المنطقية.
   Hand-written: no Node, no build step — deployable anywhere.
   مكتوب يدويًا: بلا Node وبلا خطوة بناء — قابل للنشر في أي مكان.
   ══════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════
     `hidden` تُخفي مهما كان الصنف
   ══════════════════════════════════════════════════════════════
   قاعدةُ المتصفّح `[hidden]{display:none}` تسكن ورقتَه لا ورقتَنا، **وأيُّ
   صنفٍ لنا يُسنِد `display` يغلبها مهما كانت أوزانُ المُحدِّدات** — فـ
   `.al{display:flex}` تُظهر لافتةً كتب فيها HTML أنها مخفيّة.

       > **وإخفاءٌ يعتمد على ألّا يُسنِد أحدٌ `display` لصنفٍ فوقه إخفاءٌ
       > ينكشف يوم يُضاف صنف.**

   وقد كُتب لهذا `.fltbusy[hidden]` و`.bellp[hidden]` — ندبتان لجرحٍ واحد،
   ولا تُنتظر ثالثة. و`!important` هنا في موضعه: **`hidden` قولٌ من HTML
   لا اقتراحُ تنسيق**، ولا يُنقض بورقة أنماط.
   The UA rule lives in the UA sheet; any of our classes that sets `display`
   beats it. `hidden` is a statement, not a suggestion. */
[hidden]{display:none !important}


/* ══════════════════ نظام تصميم فليكسي ══════════════════
   مبادئ: ألوان مسطّحة بلا تدرّجات · تباين عالٍ · مساحات واسعة
   واجهة فاتحة · حدود رفيعة · ظلال خفيفة جدًا
   ═══════════════════════════════════════════════════════ */
:root{
  /* الحياد */
  --w:#FFFFFF; --c:#F7F9FB;            /* الخلفية العامة */
  --n25:#FBFCFD; --n50:#F4F7FA; --n100:#EDF1F6; --n200:#E1E7EF;
  --n300:#CBD5E1; --n400:#94A3B8; --n500:#64748B; --n600:#475569;
  --n700:#334155; --n800:#1E293B; --n900:#0F172A;

  /* كحلي فليكسي */
  --b900:#0A2A47; --b800:#0E3961; --b700:#12497C; --b600:#175C99;
  --b500:#1E73BC; --b400:#4592D4; --b300:#8FBEE6; --b200:#C4DDF2;
  --b100:#E3EFF9; --b50:#F1F7FC;

  /* دلالية */
  --ok:#0E7C4A; --ok-b:#D3F0E0; --ok-l:#EDFAF3;
  --wa:#9A6300; --wa-b:#FAE6BC; --wa-l:#FEF7E8;
  --da:#B02318; --da-b:#F8CFCB; --da-l:#FDF0EF;
  --in:#175C99; --in-b:#C4DDF2; --in-l:#EFF6FC;
  --pu:#6941C6; --pu-b:#E2D8F8; --pu-l:#F5F1FE;

  --line:#E4E9F0; --line2:#EFF3F7;
  --ink:#0B1524; --ink2:#2B3A4C; --mut:#4E5F73; --mut2:#7A8B9C;

  --r4:6px; --r6:8px; --r8:10px; --r10:12px; --r12:14px; --r16:18px; --r20:24px;
  --s1:0 1px 2px rgba(16,24,40,.05);
  --s2:0 1px 3px rgba(16,24,40,.07),0 1px 2px rgba(16,24,40,.04);
  --s3:0 4px 8px -2px rgba(16,24,40,.08),0 2px 4px -2px rgba(16,24,40,.04);
  --s4:0 12px 20px -6px rgba(16,24,40,.10),0 4px 8px -4px rgba(16,24,40,.05);
  --s5:0 24px 48px -12px rgba(16,24,40,.18);
  --f:"Almarai",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fn:"Inter",system-ui,sans-serif;
  --t:.16s cubic-bezier(.4,0,.2,1);
  --side:268px; --head:64px;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--f);background:var(--c);color:var(--ink);font-size:14px;line-height:1.75;-webkit-font-smoothing:antialiased}
body[data-font="readex"]{--f:"Readex Pro",sans-serif}
body[data-font="almarai"]{--f:"Almarai",sans-serif;line-height:1.85}
/* المراعي لا يملك أوزان 500 و600 — نعوّضها بـ700 كي لا يبدو النص باهتًا */
body[data-font="almarai"] h1{font-weight:800;letter-spacing:-.015em}
body[data-font="almarai"] h2,
body[data-font="almarai"] h3,
body[data-font="almarai"] h4,
body[data-font="almarai"] .b6,
body[data-font="almarai"] .b7,
body[data-font="almarai"] .btn,
body[data-font="almarai"] .tag,
body[data-font="almarai"] .chip.on,
body[data-font="almarai"] .nav.on,
body[data-font="almarai"] .bgrp button,
body[data-font="almarai"] table.tb th,
body[data-font="almarai"] .fl>label,
body[data-font="almarai"] .kpi__v,
body[data-font="almarai"] .opt__t,
body[data-font="almarai"] .stp.cur .stp__l,
body[data-font="almarai"] .total__v,
body[data-font="almarai"] .kv>span:last-child,
body[data-font="almarai"] .lk,
body[data-font="almarai"] .navg__h{font-weight:700}
body[data-font="almarai"] .b5,
body[data-font="almarai"] .nav,
body[data-font="almarai"] .chip{font-weight:400}
body[data-font="tajawal"]{--f:"Tajawal",sans-serif;line-height:1.8}
body[data-font="plex"]{--f:"IBM Plex Sans Arabic",sans-serif}
body[data-font="kufi"]{--f:"Noto Kufi Arabic",sans-serif;line-height:1.85}
h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.35;letter-spacing:-.011em;color:var(--ink)}
h1{font-size:1.5rem;font-weight:700;letter-spacing:-.022em}
h2{font-size:1.15rem}h3{font-size:1rem}h4{font-size:.9rem}
p{margin:0}a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
svg{flex-shrink:0;display:block}
.n{font-family:var(--fn);font-variant-numeric:tabular-nums;font-feature-settings:"tnum";direction:ltr;unicode-bidi:embed;display:inline-block;letter-spacing:-.01em}
/* `.n` was written for a <span>; on a <td> its `inline-block` cancels
   `display:table-cell`, and the cell stops belonging to any column.
   The text still looked right — it was standing in the wrong place.
   صنف `.n` كُتب لعنصر سطري؛ فإذا نزل على خلية ألغى كونها خلية جدول،
   فخرجت من عمودها. والنص يبقى صحيحًا وهو واقف في غير مكانه. */
td.n,th.n{display:table-cell}
.mut{color:var(--mut)}.mut2{color:var(--mut2)}
.xs{font-size:.75rem}.sm{font-size:.815rem}.md{font-size:.875rem}.lg{font-size:1rem}
.b5{font-weight:500}.b6{font-weight:600}.b7{font-weight:700}
.hide{display:none!important}.scr{display:none}
.el{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ── شريط التمرير ──────────────────────────────────────────────────────
   A thumb four pixels wide on a transparent track is a scrollbar only in the
   stylesheet. On a touch screen the platform hides it entirely, and the page
   then scrolls with no visible sign that it can — the reader has to discover
   by accident that there is more below.
   إبهامٌ عرضه أربع بكسلات على مسارٍ شفّاف شريطُ تمرير في ملف التنسيق وحده.
   وعلى شاشة اللمس يُخفيه النظام أصلًا، فتنزل الصفحة بلا علامة ظاهرة على أنها
   تنزل — ويُترك القارئ ليكتشف بالمصادفة أن تحتها مزيدًا. */
::-webkit-scrollbar{width:14px;height:14px}
::-webkit-scrollbar-track{background:var(--n50);border-radius:20px}
::-webkit-scrollbar-thumb{background:var(--n300);border-radius:20px;
  border:3px solid var(--n50);background-clip:padding-box;min-height:40px}
::-webkit-scrollbar-thumb:hover{background:var(--n400);background-clip:padding-box;
  border:3px solid var(--n50)}
::-webkit-scrollbar-thumb:active{background:var(--n500);background-clip:padding-box;
  border:3px solid var(--n50)}
::-webkit-scrollbar-corner{background:transparent}
/* فَيَرفُكس ومعيار CSS */
html{scrollbar-width:auto;scrollbar-color:var(--n300) var(--n50)}
/* المكان محجوزٌ دائمًا فلا يقفز المحتوى حين يظهر الشريط */
html{scrollbar-gutter:stable}
.side__nav,.cmb__pop,.cmb__opts,.pick2__wrap,.tbl-w,[data-scroll]{
  scrollbar-width:thin;scrollbar-color:var(--n300) var(--n50)}
::selection{background:var(--b200);color:var(--b900)}

/* ─── الهيكل ─── */
.shell{display:flex;min-height:100vh}
.side{width:var(--side);flex:0 0 var(--side);background:var(--w);border-inline-start:1px solid var(--line);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.side__top{padding:20px 22px 14px}
/* ── شريط تمرير القائمة الجانبية ───────────────────────────────────────
   In an RTL page every scrollbar sits on its element's left. For the sidebar —
   which is itself on the right — that puts its bar on the inner edge, hard
   against the content, where it reads as the page's bar. Two bars a centimetre
   apart, and the reader cannot tell which moves what.
   The scroller is flipped to LTR so its bar lands on the outer edge, and the
   content inside is flipped back. And the horizontal bar is closed off: a
   vertical menu has nothing to scroll sideways to.

   في صفحةٍ من اليمين يقف كل شريط تمرير على يسار عنصره. والقائمة الجانبية —
   وهي على اليمين — يقع شريطها بذلك على حافتها الداخلية ملاصقًا للمحتوى،
   فيُقرأ شريطًا للصفحة. شريطان بينهما سنتيمتر، ولا يدري القارئ أيّهما يحرّك ماذا.
   فيُقلب اتجاه الحاوية إلى اليسار ليقع شريطها على الحافة الخارجية، ويُعاد
   محتواها إلى اليمين. ويُغلق الشريط الأفقي: فالقائمة الرأسية لا شيء لها جانبًا. */
.side__nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:0 12px 12px;
  direction:ltr}
.side__nav>*{direction:rtl}
html[dir=ltr] .side__nav{direction:rtl}
html[dir=ltr] .side__nav>*{direction:ltr}
.nav{display:flex;align-items:center;gap:11px;width:100%;padding:9px 12px;margin-bottom:2px;border:none;
  background:none;border-radius:var(--r8);cursor:pointer;font-size:.865rem;font-weight:500;
  color:var(--ink2);transition:var(--t);text-align:start;position:relative}
.nav:hover{background:var(--n50);color:var(--ink)}
.nav svg{width:18px;height:18px;color:var(--mut);transition:var(--t)}
.nav.on{background:var(--b50);color:var(--b700);font-weight:600}
.nav.on svg{color:var(--b600)}
.nav.on::before{content:"";position:absolute;inset-inline-start:0;top:8px;bottom:8px;width:3px;
  background:var(--b600);border-radius:0 3px 3px 0}
html[dir=rtl] .nav.on::before{border-radius:3px 0 0 3px}
.nav__c{margin-inline-start:auto;background:var(--n100);color:var(--mut);font-family:var(--fn);
  font-size:.7rem;font-weight:600;padding:1px 7px;border-radius:20px;min-width:20px;text-align:center}
.nav.on .nav__c{background:var(--b100);color:var(--b700)}
.nav__c--a{background:var(--da-b);color:var(--da)}
.side__foot{border-top:1px solid var(--line2);padding:10px}
.uchip{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:var(--r8);cursor:pointer;transition:var(--t);width:100%;border:none;background:none;text-align:start}
.uchip:hover{background:var(--n50)}
.av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-family:var(--fn);
  font-size:.74rem;font-weight:600;flex-shrink:0;background:var(--b100);color:var(--b700)}
.av--s{width:26px;height:26px;font-size:.64rem}
.av--n{background:var(--n100);color:var(--n600)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.head{height:var(--head);background:rgba(255,255,255,.88);backdrop-filter:blur(14px) saturate(180%);
  border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 28px;position:sticky;top:0;z-index:40}
.head h2{font-size:1.02rem;font-weight:600}
.sp{flex:1}
.body{padding:26px 28px 48px;flex:1}
.wrap{max-width:1420px;margin:0 auto}

/* ─── الشعار ─── */
.brand{background-repeat:no-repeat;background-position:center;background-size:contain;flex-shrink:0}

/* ─── الأزرار ─── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 16px;
  border-radius:var(--r8);border:1px solid transparent;font-size:.855rem;font-weight:600;
  cursor:pointer;transition:var(--t);white-space:nowrap;line-height:1.45}
.btn svg{width:16px;height:16px}
.btn:active{transform:translateY(.5px)}
.b-p{background:var(--b700);color:#fff}
.b-p:hover{background:var(--b800)}
.b-dk{background:var(--b900);color:#fff}
.b-dk:hover{background:#061F35}
.b-o{background:var(--w);color:var(--ink2);border-color:var(--n300);box-shadow:var(--s1)}
.b-o:hover{background:var(--n50);border-color:var(--n400)}
.b-so{background:var(--b50);color:var(--b700);border-color:var(--b200)}
.b-so:hover{background:var(--b100)}
.b-gh{background:none;color:var(--mut)}
.b-gh:hover{background:var(--n100);color:var(--ink)}
.b-da{background:var(--da);color:#fff}
.b-s{padding:6px 12px;font-size:.79rem;border-radius:var(--r6);gap:5px}.b-s svg{width:14px;height:14px}
.b-l{padding:12px 22px;font-size:.92rem;border-radius:var(--r8)}
.b-ic{padding:0;width:34px;height:34px;border-radius:var(--r6)}
.b-ic svg{width:17px;height:17px}
.btn:disabled{opacity:.45;cursor:not-allowed}
/* والرابطُ المقفول يُرى مقفولًا — فزرٌّ يبدو حيًّا ولا يستجيب زرٌّ مكسور.
   A link locked by an ack gate must look locked; a live-looking dead button
   reads as a bug rather than a rule. */
.btn.is-off{opacity:.45;cursor:not-allowed;pointer-events:none}
.b-blk{width:100%}
.bgrp{display:inline-flex;background:var(--n100);padding:3px;border-radius:var(--r8);gap:2px}
.bgrp button{border:none;background:none;padding:6px 14px;border-radius:var(--r6);font-size:.8rem;
  font-weight:600;color:var(--mut);cursor:pointer;transition:var(--t)}
.bgrp button.on{background:var(--w);color:var(--ink);box-shadow:var(--s2)}

/* ─── البطاقات ─── */
.card{background:var(--w);border:1px solid var(--line);border-radius:var(--r12);box-shadow:var(--s2)}
.card--f{box-shadow:var(--s3)}
.ch{padding:16px 20px;border-bottom:1px solid var(--line2);display:flex;align-items:center;gap:12px}
.cb{padding:20px}
.cf{padding:14px 20px;border-top:1px solid var(--line2);background:var(--n25);border-radius:0 0 var(--r12) var(--r12)}
.g{display:grid;gap:16px}
.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(238px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(206px,1fr))}
.split{display:grid;gap:16px;grid-template-columns:1.6fr .95fr;align-items:start}
@media(max-width:1080px){.split{grid-template-columns:1fr}}
/* Grid children default to min-width:auto, so one wide table inside a column
   stretches the whole page and pushes the side column off-screen. Pinning them
   to zero makes the table scroll inside its own box instead.
   أبناء الشبكة عرضهم الأدنى تلقائيًا بحجم محتواهم، فجدول عريض داخل عمود
   يمطّ الصفحة كلها ويدفع العمود الجانبي خارج الشاشة. تثبيتهم على صفر يجعل
   الجدول يُمرَّر داخل صندوقه لا أن يجرّ الصفحة معه. */
.split>*,.g2>*,.g3>*,.g4>*,.frow>*{min-width:0}
.split>aside,.split>div:last-child{position:sticky;top:16px}
@media(max-width:1080px){.split>aside,.split>div:last-child{position:static}}

/* ─── المؤشرات ─── */
.kpi{background:var(--w);border:1px solid var(--line);border-radius:var(--r12);padding:18px 20px;box-shadow:var(--s1);transition:var(--t)}
.kpi:hover{box-shadow:var(--s3);border-color:var(--n300)}
.kpi__h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.kpi__l{font-size:.8rem;color:var(--ink2);font-weight:600}
.kpi__i{width:34px;height:34px;border-radius:var(--r8);display:grid;place-items:center;background:var(--b50);color:var(--b600)}
.kpi__i svg{width:17px;height:17px}
.kpi__i--ok{background:var(--ok-l);color:var(--ok)}.kpi__i--wa{background:var(--wa-l);color:var(--wa)}
.kpi__i--da{background:var(--da-l);color:var(--da)}.kpi__i--pu{background:var(--pu-l);color:var(--pu)}
.kpi__v{font-family:var(--fn);font-size:1.72rem;font-weight:700;letter-spacing:-.03em;line-height:1.1;color:var(--ink)}
.kpi__v small{font-family:var(--f);font-size:.8rem;font-weight:500;color:var(--mut);letter-spacing:0}
.kpi__d{display:flex;align-items:center;gap:5px;margin-top:8px;font-size:.775rem;font-weight:600}
.up{color:var(--ok)}.dn{color:var(--da)}.fl{color:var(--mut)}

/* ─── الوسوم ─── */
.tag{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:var(--r6);
  font-size:.745rem;font-weight:600;white-space:nowrap;line-height:1.65;border:1px solid}
.tag i{width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.t-ok{background:var(--ok-l);color:var(--ok);border-color:var(--ok-b)}
.t-wa{background:var(--wa-l);color:var(--wa);border-color:var(--wa-b)}
.t-da{background:var(--da-l);color:var(--da);border-color:var(--da-b)}
.t-in{background:var(--in-l);color:var(--in);border-color:var(--in-b)}
.t-pu{background:var(--pu-l);color:var(--pu);border-color:var(--pu-b)}
.t-n{background:var(--n50);color:var(--n600);border-color:var(--n200)}

/* ─── الجداول ───────────────────────────────────────────────────────────
   Lists never squeeze. Cells that must stay on one line say so; the wrapper
   scrolls instead of wrapping identifiers and dates into towers.
   القوائم لا تُعصر. الخلايا التي يجب أن تبقى في سطر واحد تُعلن ذلك،
   والحاوية تُمرَّر أفقيًا بدل أن تكسر الأرقام والتواريخ إلى أبراج. */
.tbl-w{overflow-x:auto;border-radius:0 0 var(--r12) var(--r12);
  scrollbar-width:thin;scrollbar-color:var(--n200) transparent}
.tbl-w::-webkit-scrollbar{height:11px}
.tbl-w::-webkit-scrollbar-thumb{background:var(--n300);border-radius:8px;
  border:2px solid var(--n50);background-clip:padding-box}
.tbl-w::-webkit-scrollbar-track{background:var(--n50);border-radius:8px}
/* ══════════════════════════════════════════════════════════════════
     وأدنى عرضٍ يُكتب في مكانين لا يُقرأ إلا من واحد
   ══════════════════════════════════════════════════════════════════
   عولج ٢٠٢٦-٠٨-١٢ شريطُ تمريرٍ في جدول المستندات بكتابة `--tmin` على
   الجدول، **و`table.tb` لم تكن تقرأ هذا المتغيّر أصلًا** — إنما تقرؤه
   `table.ltab` وحدها. فبقي ٨٢٠ بكسلًا مفروضًا، وبقي الشريط، وبقي في
   القالب تعليقٌ مسهبٌ يشرح كيف عولج.

   > **وتعليقٌ يقول إن العطل عولج فوق عطلٍ قائم أسوأ من العطل وحده** —
   > فمن قرأه بحث عن السبب في مكانٍ آخر.

   A fix written where nothing reads it, with a comment explaining how it
   works, is worse than no fix: the next reader looks elsewhere.
   ══════════════════════════════════════════════════════════════════ */
table.tb{width:100%;border-collapse:separate;border-spacing:0;font-size:.855rem;
  min-width:var(--tmin,820px)}
/* ── ولا يُعرَّف هنا صنفٌ له بيتٌ في الملفّ ──
   كُتب هنا تخطيطٌ ثابت للصنف `tb--fit` علاجًا لعرض أعمدة جدول
   المستندات، **و`tb--fit` صنفٌ قائمٌ منذ ١٦ أغسطس له كتلتُه في آخر الملفّ**
   تستعمله شاشاتُ العروض والعقود والمحفظة. فكان السطرُ يغيّر تخطيطَ جداول
   لم يُقصد إليها. والعلاجُ أن يُستعمل الصنفُ القائم لا أن يُعاد تعريفُه.
   A class already defined elsewhere was redefined here, silently changing
   every screen that used it. */
table.tb th{text-align:start;font-weight:600;font-size:.72rem;letter-spacing:.02em;
  color:var(--n500);padding:12px 18px;background:var(--n25);
  border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0;z-index:2}
table.tb td{padding:14px 18px;border-bottom:1px solid var(--line2);vertical-align:middle;
  color:var(--ink)}
table.tb tbody tr{transition:background .12s}
table.tb tbody tr:hover{background:var(--b50,#F2F7FC)}
table.tb tbody tr.clk{cursor:pointer}
table.tb tbody tr:last-child td{border-bottom:none}
table.tb .e{text-align:end}
/* عنوانٌ فوق عمودٍ موسَّط — فالعنوان يُحاذي محتواه لا حافة الخليّة */
table.tb .c{text-align:center}
table.tb .ctr{text-align:center}
.tb--d{min-width:0}table.tb--d td{padding:9px 14px}table.tb--d th{padding:9px 14px}

/* الأعمدة التي لا تُكسر: المعرّفات والأرقام والتواريخ والوسوم */
table.tb td.nw, table.tb td.id, table.tb td.dt, table.tb td.num,
table.tb td.tg{white-space:nowrap}

/* عمود المعرّف — المرساة البصرية للسطر */
table.tb td.id{font-family:Inter,ui-sans-serif,sans-serif;font-weight:600;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:var(--b800)}
table.tb tbody tr.clk:hover td.id{color:var(--b600)}

/* الأرقام — أعمدة مصطفّة رقميًا */
table.tb td.num{font-family:Inter,ui-sans-serif,sans-serif;
  font-variant-numeric:tabular-nums;text-align:end}
table.tb td.num b{font-weight:600}
/* وحدةُ القياس تتبع رقمها أينما كان — لا في `num` وحدها، فالكمية تُكتب في
   أعمدةٍ أخرى وتبقى وحدةً لا قيمةً ثانية.
   The unit follows its number wherever it is written, not in `num` alone. */
table.tb td .u{font-size:.72rem;color:var(--n400);margin-inline-start:3px;font-weight:400}

/* التاريخ — يوم بارز ووقت خافت تحته، بلا كسر */
.dt__d{font-family:Inter,ui-sans-serif,sans-serif;font-variant-numeric:tabular-nums;
  font-size:.83rem;color:var(--ink);display:block;line-height:1.35}
.dt__t{font-family:Inter,ui-sans-serif,sans-serif;font-size:.72rem;color:var(--n400);
  display:block;line-height:1.3}

/* خلية من سطرين — عنوان وتفصيل تحته */
.c2__a{display:block;line-height:1.4;font-weight:500}
.c2__b{display:block;font-size:.745rem;color:var(--n400);line-height:1.35;margin-top:1px}

/* شريط أدوات القائمة — عدّاد وبحث وتصدير */
.tbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:12px 18px;border-bottom:1px solid var(--line2)}
.tbar__c{font-size:.78rem;color:var(--n500)}
.tbar__c b{color:var(--ink);font-family:Inter,sans-serif;font-weight:600}
.tbar__s{margin-inline-start:auto;display:flex;gap:8px;align-items:center}
.lk{color:var(--b700);font-weight:600}.lk:hover{text-decoration:underline;cursor:pointer}

/* ─── النماذج ─── */
/* `position` هنا ليسكن عدّاد الخانات في زاوية الحقل — انظر `.lcount` */
.fl{margin-bottom:18px;position:relative}
.fl>label{display:block;font-size:.8rem;font-weight:600;color:var(--ink2);margin-bottom:7px;
  letter-spacing:-.005em}
.fl .hint{font-size:.755rem;color:var(--mut2);margin-top:7px;line-height:1.65}

/* حقول الإدخال — خلفية هادئة في السكون تصفو عند التركيز */
/* Arabic descenders — the tails of ي ج ل — fall below the baseline. A fixed
   height with no vertical padding clips them, because the input crops to its
   content box. Padding gives the letters the room the script needs, and the
   trigger of every dropdown is now an input too, so both still measure alike.
   ذيول الحروف العربية — ي ج ل — تنزل تحت خط الأساس. والارتفاع المقطوع بلا حشوة
   رأسية يقصّها، لأن الحقل يحُدّ محتواه بصندوقه. والحشوة تمنح الحروف ما يحتاجه
   الخط، ومُشغّل كل قائمة صار حقلًا أيضًا فيبقيان متساويين. */
.in{width:100%;min-height:42px;padding:10px 14px;border:1.5px solid var(--n200);
  border-radius:10px;background:var(--n25);color:var(--ink);
  transition:border-color .15s,background .15s,box-shadow .15s;
  font-size:.875rem;font-family:inherit;line-height:1.45;box-shadow:none;appearance:none}
.in::placeholder{color:var(--mut2);font-weight:400}
.in:hover:not(:disabled){border-color:var(--n300);background:var(--w)}
.in:focus{outline:none;border-color:var(--b500);background:var(--w);
  box-shadow:0 0 0 3.5px rgba(30,115,188,.13)}
.in:disabled{background:var(--n100);color:var(--mut2);cursor:not-allowed}
.in.err{border-color:var(--da);background:var(--da-l)}
.in.err:focus{box-shadow:0 0 0 3.5px rgba(176,35,24,.12)}
/* ── وخانةٌ تنتظر قرارًا تُوسَم ولا تُصرَخ ──
   `.err` للخطأ الواقع، وهذه لِما **لم يُقرَّر بعد**: صفراءُ الحدّ لا حمراء،
   **فتمييزُ ما لم يُملأ بلونِ الخطأ يجعل شاشةً نصفَ مملوءةٍ تُقرأ معطوبة.**
   Amber for undecided, red for wrong. */
.in.in--must{border-color:var(--wa-b);background:var(--wa-l)}
/* ── وخانةٌ تحمل ما لا وجودَ له تُقال حمراءَ لا صفراء ──
   فالأصفرُ «يُقرَّر» والأحمرُ «مرفوض»: **ولونٌ واحدٌ لمعنيين لونٌ لا يقول
   شيئًا.** A box holding what does not exist is refused, not pending. */
.in.in--bad{border-color:var(--da);background:var(--da-l,#FDF2F2)}
.in.in--must::placeholder{color:var(--wa);opacity:.85}

/* ── والحشوةُ تُكتب منطقيّةً فتُقرأ منطقيّة ──
   كانت `padding-inline-start:38px` و`padding-inline-end:14px` — وهي قراءةُ
   من يفكّر بالإنجليزية: «اترك مكانًا لسهمٍ على اليمين». لكنّ `inline-start`
   في العربية **هو اليمين**، فوقعت الحشوةُ حيث يبدأ النصّ لا حيث يجلس السهم.
   ثم صحّحها تجاوزٌ لـ`dir=ltr` فاستقامت الإنجليزيةُ وبقيت العربيةُ مقلوبة:
   ٣٨ بكسل مهدورة في أوّل السطر و١٤ فقط تحت السهم — فضاعت من عرض الحقل
   ٧٢ بكسل، وقُصّ «يتولّاها نظام المستودع» إلى «يتولّاها نظام المستود».

   `padding-inline-start` is the right edge in Arabic. Written as if the page
   were English, the space was left where the text begins instead of where the
   chevron sits, and an `ltr` override then fixed English and left Arabic
   inverted — costing 72px of field width and truncating every long option.

   والقيمُ المنطقية تكفي وحدها ولا تحتاج تجاوزًا؛ ويبقى موضعُ الصورة وحده
   ماديًّا لأن `background-position` لا يعرف المنطقيّ.
   Logical values need no override; only the image position stays physical. */
select.in{cursor:pointer;padding-inline-start:14px;padding-inline-end:38px;
  text-overflow:ellipsis;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%235B6B7F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='m3 5.5 4 4 4-4'/></svg>");
  background-repeat:no-repeat;background-position:left 14px center}
html[dir=ltr] select.in{background-position:right 14px center}
textarea.in{height:auto;min-height:88px;resize:vertical;line-height:1.7;padding:11px 14px}
input[type=date].in,input[type=datetime-local].in{font-family:var(--fn);
  font-variant-numeric:tabular-nums}
input[type=file].in{padding:9px 12px;background:var(--w);cursor:pointer}

/* حقل بأيقونة أمامية */
.fw-ic{position:relative}
.fw-ic>svg{position:absolute;inset-inline-start:13px;top:50%;transform:translateY(-50%);
  width:16px;height:16px;color:var(--mut2);pointer-events:none;z-index:1}
.fw-ic .in{padding-inline-start:40px}
.fw-ic .in:focus~svg{color:var(--b600)}

/* لاحقة نصية داخل الحقل */
.fw-suffix{position:relative}
.fw-suffix__t{position:absolute;inset-inline-end:14px;top:50%;transform:translateY(-50%);
  font-size:.78rem;color:var(--mut2);pointer-events:none}
.fw-suffix .in{padding-inline-end:56px}

/* مجموعة حقول مؤطّرة */
.fgroup{border:1px solid var(--line);border-radius:var(--r10);padding:18px 20px;background:var(--n25)}
.fgroup__t{font-size:.82rem;font-weight:700;color:var(--ink2);margin-bottom:14px;
  display:flex;align-items:center;gap:8px}
.fgroup__t svg{width:15px;height:15px;color:var(--b600)}
.req{color:var(--da);margin-inline-start:2px}
.frow{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(206px,1fr));
  align-items:start}
/* Controls start on one line; hints below are free to be as tall as they need.
   An earlier `margin-top:auto` here pushed a control down whenever its own hint
   wrapped to two lines — the field looked taller when nothing about it had
   changed but the sentence underneath it.
   تبدأ الحقول على سطر واحد، والشروح تحتها حرة في الطول. وقاعدة `margin-top:auto`
   السابقة كانت تدفع الحقل لأسفل كلما انكسر شرحه إلى سطرين — فيبدو الحقل أطول
   ولم يتغيّر فيه شيء إلا الجملة تحته. */
.frow>.fl{display:flex;flex-direction:column;min-width:0;align-self:start}
.frow>.fl>label{min-height:20px;display:block}
.pre{display:flex}
.pre .in{border-start-end-radius:0;border-end-end-radius:0}
.pre__a{display:flex;align-items:center;padding:0 13px;background:var(--n50);border:1px solid var(--n300);
  border-inline-start:none;border-radius:var(--r8) 0 0 var(--r8);font-family:var(--fn);font-size:.83rem;color:var(--mut)}
html[dir=rtl] .pre__a{border-radius:0 var(--r8) var(--r8) 0}
.cbx{display:flex;align-items:flex-start;gap:10px;cursor:pointer}
.cbx input{width:16px;height:16px;margin-top:3px;accent-color:var(--b600);cursor:pointer;flex-shrink:0}

/* ─── بطاقات الاختيار ─── */
.opts{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(172px,1fr))}
.opt{position:relative;padding:16px;border:1px solid var(--n300);border-radius:var(--r10);background:var(--w);
  cursor:pointer;transition:var(--t);display:flex;flex-direction:column;box-shadow:var(--s1)}
.opt:hover{border-color:var(--b400);box-shadow:var(--s3)}
.opt__i{width:38px;height:38px;border-radius:var(--r8);background:var(--n50);display:grid;place-items:center;
  color:var(--mut);margin-bottom:11px;transition:var(--t)}
.opt__i svg{width:19px;height:19px}
.opt__t{font-weight:600;font-size:.885rem;margin-bottom:3px}
.opt__d{font-size:.775rem;color:var(--mut);line-height:1.6}
.opt.on{border-color:var(--b600);background:var(--b50);box-shadow:0 0 0 1px var(--b600)}
.opt.on .opt__i{background:var(--b600);color:#fff}
.opt.on .opt__t{color:var(--b800)}
.opt__k{position:absolute;top:13px;inset-inline-end:13px;width:19px;height:19px;border-radius:50%;
  background:var(--b600);color:#fff;display:none;place-items:center}
.opt.on .opt__k{display:grid}.opt__k svg{width:11px;height:11px}

/* ─── الرقائق ─── */
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{padding:6px 14px;border-radius:20px;font-size:.805rem;font-weight:500;background:var(--w);
  border:1px solid var(--n300);color:var(--ink2);cursor:pointer;transition:var(--t);box-shadow:var(--s1)}
.chip:hover{border-color:var(--b400);background:var(--b50)}
.chip.on{background:var(--b700);border-color:var(--b700);color:#fff;font-weight:600}
.chip__n{font-family:var(--fn);opacity:.7;margin-inline-start:4px}

/* ─── الخطوات ─── */
.steps{display:flex;align-items:center;gap:0}
.stp{display:flex;align-items:center;gap:9px;flex-shrink:0}
.stp__n{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-family:var(--fn);
  font-size:.78rem;font-weight:600;background:var(--w);border:1.5px solid var(--n300);color:var(--mut2);transition:var(--t)}
.stp__l{font-size:.815rem;color:var(--mut);font-weight:500;white-space:nowrap}
.stp__c{flex:1;height:1.5px;background:var(--n200);margin:0 10px;min-width:12px}
.stp.dn .stp__n{background:var(--ok);border-color:var(--ok);color:#fff}
.stp.dn .stp__l{color:var(--ink2)}
.stp.cur .stp__n{background:var(--b700);border-color:var(--b700);color:#fff}
.stp.cur .stp__l{color:var(--b800);font-weight:600}
.stp__c.dn{background:var(--ok)}
@media(max-width:900px){.stp__l{display:none}}

/* ─── التنبيهات ─── */
.al{padding:13px 16px;border-radius:var(--r8);display:flex;gap:11px;font-size:.85rem;border:1px solid;line-height:1.6}
.al svg{width:17px;height:17px;flex-shrink:0;margin-top:2px}
/* ── ورسالةٌ تتجاوز مربّعها — بلاغ محمد ٢٠٢٦-٠٨-٢٦ ──
   «رسالة الخطأ عند إضافة مستخدم يتجاوز المستطيل الأحمر فيها عرض المستطيلات.»

   و`.al` صندوقٌ مرن، وابنُه النصّيّ يولد بـ`min-width:auto` — **فيرفض أن
   يضيق دون أطول كلمةٍ فيه**، ويخرج النصُّ من الحدّ الأحمر. ورسالةُ حدّ
   المقاعد تحمل اسمَ المنشأة كما كتبه صاحبُها، فقد يكون كلمةً واحدةً طويلة.

   > **وحدٌّ لا يُذكر يُقرأ «بلا حدّ» — و`auto` في المرن حدٌّ لا يُذكر.**

   Flex children default to min-width:auto and refuse to shrink below their
   longest unbreakable token. */
.al>:not(svg){min-width:0;overflow-wrap:anywhere}
.a-in{background:var(--in-l);border-color:var(--in-b);color:#0F4374}
.a-ok{background:var(--ok-l);border-color:var(--ok-b);color:#0A5D38}
.a-wa{background:var(--wa-l);border-color:var(--wa-b);color:#7A4E00}
.a-da{background:var(--da-l);border-color:var(--da-b);color:#8C1B12}

/* ─── الخط الزمني ─── */
.tml{list-style:none;margin:0;padding:0}
.tml li{position:relative;padding-inline-start:26px;padding-bottom:18px}
.tml li::before{content:"";position:absolute;inset-inline-start:5px;top:16px;bottom:-2px;width:1.5px;background:var(--n200)}
.tml li:last-child{padding-bottom:0}.tml li:last-child::before{display:none}
.tml__d{position:absolute;inset-inline-start:0;top:5px;width:11px;height:11px;border-radius:50%;
  background:var(--w);border:2px solid var(--n300)}
.tml li.dn .tml__d{background:var(--ok);border-color:var(--ok)}
/* ══════════════════════════════════════════════════════════════════
     و«dn» في الشريط «منجَز» لا «هابط» — بلاغ محمد ٢٠٢٦-٠٨-٢٧
   ══════════════════════════════════════════════════════════════════
   الصفُّ 264 يقول `.dn{color:var(--da)}` — وهو للأسهم الهابطة في المؤشّرات.
   والشريطُ الزمنيُّ يسمّي خطوتَه المنجَزة `dn` كذلك، **فيرث كلُّ سطرٍ
   منجَزٍ لونَ الخطر**: يُقرأ سجلُّ العرض كلُّه أحمرَ، ويُظنّ كلُّ سطرٍ فيه
   عطلًا. وهو قائمٌ في صفحة العميل منذ كُتبت.

       > **واسمٌ واحدٌ لمعنيين في ورقة أنماطٍ واحدة لونٌ يُورَث حيث لا
       > يُقصد** — ولا يُخفق شيء، فيبقى سنةً ولا يُبلَّغ عنه.

   A class name meaning two things inherits a colour nobody asked for. */
.tml li.dn{color:inherit}
.tml li.cur .tml__d{background:var(--b600);border-color:var(--b600);box-shadow:0 0 0 3px var(--b100)}
.tml__t{font-weight:600;font-size:.865rem}
.tml__m{font-size:.75rem;color:var(--mut2);margin-top:1px}

/* ─── أدوات ─── */
.fx{display:flex;align-items:center;gap:10px}.fw{flex-wrap:wrap}.fb{justify-content:space-between}
.hr{height:1px;background:var(--line2);margin:18px 0}
.box{background:var(--n25);border:1px solid var(--line);border-radius:var(--r10);padding:15px 17px}
.kv{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
  padding:8px 0;font-size:.86rem;border-bottom:1px solid var(--line2)}
/* ── والقيمةُ تلتفّ، والرقمُ وحده لا يُكسر ──
   كان `white-space:nowrap` على كلّ قيمةٍ في `.kv`، **وهو صحيحٌ للأرقام
   وحدها**: «١٬٢٥٠٫٠٠ ر.س» مكسورًا على سطرين رقمان لا رقم. أمّا الأسماء
   فتخرج من صندوقها — ورآه محمد ٢٠٢٦-٠٨-١٢: «مستودعات الشرق للخدمات
   اللوجستية · مستودع الدمام 2» خرج من مربّع «إجراءات فليكسي».

   > **قاعدةٌ صحيحةٌ لحالةٍ طُبِّقت على كلّ حالة تكسر أكثرَ ممّا تُصلح.**
   > A rule right for numbers, applied to names, pushes them off the card.

   فصار الالتفافُ هو الأصل، و`.kv--n` (أو خليّةٌ فيها رقمٌ صرف) تمنعه. */
.kv>span:last-child{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.kv--n>span:last-child,.kv>span.nw{white-space:nowrap}
.kv:last-child{border:none}.kv>span:first-child{color:var(--mut)}.kv>span:last-child{font-weight:600}
.total{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;margin-top:8px;border-top:2px solid var(--ink)}
.total__v{font-family:var(--fn);font-size:1.5rem;font-weight:700;letter-spacing:-.025em}
.bar{height:7px;background:var(--n100);border-radius:20px;overflow:hidden}
.bar>i{display:block;height:100%;background:var(--b600);border-radius:20px;transition:width .55s cubic-bezier(.4,0,.2,1)}
.bar>i.w{background:var(--wa)}.bar>i.d{background:var(--da)}.bar>i.o{background:var(--ok)}
.empty{padding:56px 26px;text-align:center}
.empty__i{width:64px;height:64px;border-radius:var(--r16);background:var(--b50);display:grid;place-items:center;
  margin:0 auto 16px;color:var(--b500)}
.empty__i svg{width:28px;height:28px}
.empty h4{margin-bottom:6px;font-size:1rem}
.empty p{color:var(--mut);font-size:.86rem;margin-bottom:18px;max-width:340px;margin-inline:auto}
.ph{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.ph__t{flex:1;min-width:230px}
.ph h1{margin-bottom:3px}
.ph p{color:var(--mut);font-size:.885rem}
.srch{position:relative;width:270px}
.srch .in{padding-inline-start:36px;background:var(--n25);box-shadow:none}
.srch svg{position:absolute;inset-inline-start:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--mut2)}
svg.dir{transition:transform .1s}
html[dir=rtl] svg.dir{transform:scaleX(-1)}
.fade{animation:fd .26s cubic-bezier(.4,0,.2,1)}
@keyframes fd{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.pop{animation:pp .3s cubic-bezier(.34,1.4,.64,1)}
@keyframes pp{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
/* ═══════════════════════════════════════════════════════════════════
     القائمة على الجوال — دُرجٌ يُفتح بزرّ · بلاغ محمد ٢٠٢٦-٠٨-٢١
   ═══════════════════════════════════════════════════════════════════
   > «دخلت المنصة من الجوال ولم أجد القائمة! لماذا لم تضف زرًّا للقائمة؟»

   وكان هذا السطر `\{.side\{display:none\}\}` وحدَه — **يُخفي الملاحةَ ولا يضع
   مكانها شيئًا**. فمن فتح المنصّة على هاتفه وقف عند الصفحة التي دخل منها:
   لا قائمة ولا شعار ولا طريقَ إلى غيرها.

     > **وإخفاءٌ بلا بديلٍ ليس تبسيطًا بل حبسٌ في الصفحة.**

   ── والدُّرجُ يخرج من جهة القائمة نفسِها ──
   فهي على اليمين في العربية وعلى اليسار في الإنجليزية، **ودُرجٌ يخرج من
   الجهة المقابلة لموضعه على الحاسوب دُرجٌ يُتعلَّم مرّتين**. و`translateX`
   فيزيائيّةٌ لا منطقيّة، فتُكتب لكلّ اتّجاهٍ قيمتُه.
   The drawer leaves from the same edge the sidebar lives on. */
.navbtn{display:none}
.navsc{display:none}
@media(max-width:900px){
  /* ── والدُّرجُ المغلق لا يمدّ الصفحة ──
     **ودُرجٌ يقف خارج الشاشة بـ`translateX` يمدّ عرضَ التمرير** — فتنزلق
     الصفحةُ جانبًا تحت الإصبع وتظهر فراغًا أبيض، ويظنّ القارئُ أن ثمّة
     محتوًى هناك. والجداولُ العريضة تُمرَّر داخل حاوياتها (`\.tbl-w`) فلا
     يُفقد شيء بإغلاق التمرير الأفقيّ للصفحة نفسها.
     An off-canvas drawer that extends the scroll width drags the whole page
     sideways under the thumb. */
  body{overflow-x:hidden}
  .body{padding:18px}
  .head{padding:0 14px;gap:4px}

  /* ── وترويسةُ الصفحة تنكسر ولا تفيض ──
     `\.ph` تلفّ أصلًا، **وصفُّ أدواتها `\.fx` لا يلفّ** — وفيه بحثٌ عرضُه
     ٢٧٠ بكسل وزرّان. فيمتدّ الصفُّ إلى ٥١٧ في شاشةٍ عرضُها ٣٥٤، **وتنزلق
     الصفحةُ كلُّها جانبًا لأجل شريط بحث**.
     وهي علّةٌ واحدة كانت تظهر في تسع شاشات: الأصناف · العروض · المساحات ·
     الإدخال · الصرف · المستخدمون · الاعتراضات · التسويات · معالج السعر.

       > **وعلّةٌ واحدة تظهر في تسع شاشات تُصلَح في الورقة لا في التسع.**

     One cause in nine screens is fixed in the stylesheet, not in the nine. */
  .ph{gap:12px}
  .ph .fx{flex-wrap:wrap;width:100%}
  .ph__t{min-width:0;flex:1 1 100%}
  .srch{width:100%}
  /* **وزرٌّ يُقصّ نصفُه زرٌّ لا يُقرأ فعلُه** — فيأخذ سطرَه إن ضاق. */
  .ph .btn{flex:1 1 auto;justify-content:center}

  /* ── وشريطُ معالج السعر ينكسر كذلك ──
     **و«دقيقتان» ليست ملاحةً** — فتغيب حين تضيق الشاشة، ويبقى الشعارُ
     والعنوانُ ومُبدِّلُ اللغة وزرُّ «لاحقًا».
     "Two minutes" is not navigation; it is the first thing to go. */
  .flowbar{padding:11px 16px;gap:10px;flex-wrap:wrap}
  .flowbar__t,.flowbar__d{display:none}
  .flowbar__s{padding:0 16px 12px}
  .flowbar .brand-full{width:104px}

  /* زرُّ القائمة في الشريط — أوّلَ ما تصله الإبهام */
  .navbtn{display:inline-flex;align-items:center;justify-content:center;
    width:40px;height:40px;flex:0 0 40px;border:1px solid var(--n300);
    border-radius:var(--r10);background:var(--w);color:var(--ink);
    cursor:pointer;padding:0}
  .navbtn svg{width:21px;height:21px}
  .navbtn:active{background:var(--n50)}
  /* **وعنوانٌ طويل يدفع الجرسَ خارج الشاشة** — فيُقصّ العنوان لا الأزرار. */
  .head h2{font-size:1rem;overflow:hidden;text-overflow:ellipsis;
    white-space:nowrap;min-width:0}

  /* الدُّرج */
  .side{display:flex;position:fixed;inset-block:0;inset-inline-start:0;
    width:min(302px,86vw);height:100dvh;z-index:71;
    border-inline-start:0;box-shadow:0 0 0 1px var(--line);
    transition:transform .24s cubic-bezier(.4,0,.2,1)}
  html[dir=rtl] .side{transform:translateX(102%)}
  html[dir=ltr] .side{transform:translateX(-102%)}
  html .shell.navopen .side{transform:none}

  /* الستار */
  .navsc{display:block;position:fixed;inset:0;z-index:70;
    background:rgba(11,43,77,.42);opacity:0;pointer-events:none;
    transition:opacity .24s}
  .shell.navopen .navsc{opacity:1;pointer-events:auto}

  /* ── وأدواتُ الحاسوب لا مكانَ لها في الدُّرج ──
     **وزرُّ «صغّر القائمة إلى أيقونات» في دُرجٍ يُغلق زرٌّ يُفقد الملاحةَ
     مرّتين** — يُصغّرها ثم يُغلق الدُّرج عليها. */
  .side__tools .stool:not(.navx){display:none}
  .navx{display:inline-flex}
  /* ولا وضعَ مصغَّرًا على الجوال مهما كان المحفوظ */
  .shell.mini .side{width:min(302px,86vw)}
}
/* وزرُّ الإغلاق للجوال وحدَه */
.navx{display:none}
/* **وصفحةٌ تُمرَّر تحت دُرجٍ مفتوح صفحةٌ يفقد القارئ موضعَه فيها.** */
body.navlock{overflow:hidden}
@media print{.navbtn,.navsc{display:none!important}}
@media print{.side,.head,.btn{display:none!important}body{background:#fff}}


.brand-full{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAoAAAACKCAYAAAA6yftsAABF7ElEQVR42u2deZxcVZn3v88591Z3EnYFxYUkgOA0jMvgvlAJgmaQF0GtKPoOuIz4UUBBNgG1UoqCEMIiLsM4LoOCphxXVBAkqYDKoNF5UdotJAQRhTDsSbrr3nOe949zq9NZgKSqq7rTfb6fT6W3yq27nPvc33nOs0AkEolEIpFIZEoh2/F+arx8HZ3HeP4ikUgkEomCYAKgKtTrhttvD/t1wAFKpeIR2bJYqVYNYEbee/vtSq2mUdyMvr4VQ/k+oTHHQ81v/OeKffy/RSKRSCQSiQKw24KvVsuf8L1B7G2g9gSCZYMw9E/4vsl8XctlS6OxpXNqoMoWBF8Qi9RdvC0ikUgkEokCcOw/c/HiIObmz99YbHzyP3ZP/CP/4CXZT7PsuUZ5pnq/B6q74rQf74Jnzyt4/yheH1Lv70VYJer/4HP+wLTH/sxFF63dRBAmU0cMVuyIiBuolMgfehXwGlQPQP1MVErgBeQR4A6QW8DfyB1Lbh81JgSIHsFIJBKJRKIA7BBVYcECu5Gn77zP7WoTXuadvEY8rxR1+6kxu2ESUAXnwTnwOTgF78PvvYavrUPwPryG1oPq3cCvcLrUKzdyxbm/3aCNKpaBAZ2kQnCDB29meRf6+t6L6DtAnovYcL60OH8oiIAWl9/nOao3I3oJdyz93mZCMhKJRCKRSBSA2yz86nUz4u2rVvvtrnsfSj78FlQPJU2fjhjIMmg20TxXvHq8Kl4BL3iVwus3SgB6RT14Rr/PYgyIDZ89tD5XWC5eFnuGvsMXL1pV7EPwQE4eIbjBa7f/YW9GzKcxdm+8A597VHxQeyohOrL4x4uCCoIdOWfqr2HYncLdjRVRBEYikUgkEgXgtm978eINwu+izz/TTN/x7eTuODFmAASGhyDPPd57vBqcE4UNYq/l6VPPZgKw9f1oj6D3iveKqha/t9gExMDw0Fr1+h01/nN8aeEvgOARrC/2ILp9X8OqQM3z3MMuxKSnBeHncwSDahC7LeG3QQCOSpVRRTWIYZNavLsf8mNZuezHUQRGIpFIJBIF4NaxeLEdEX6Xf/np0td3ksnceyn1PYXhIRhuepzTQpzIiNjzHh0t8LZdAG5ZEHr1iCQkKWRNNPffV3Gf5D8vvnWDENwuRY5A2UIj57nzvkCSvJd82AGCFtnROlrsPa4AHJ03nSOSoDjI57Ny2bejCIxEIpFIJArAJ95etRri/C69tM/0PfUDYsyp9JWextq1kOc5Xk14jRZwXROAo39W1HtULbaE5k2H54uaD32cb3z2HqpVQ22BblfewJZwHTjsXEz/OeTDGZAEAdgSedssAAknXARkGNyrWdn4FVRNLBUTiUQikUgUgBtTrZpWTF3yH4vLHhZJqfRPrF8PWTPHe4tu7O3rsQAc/XlOVS1pH2TNv0men+W/cdlXNxJV24v4+4fXHYq11+NcDhrO8UbCrx0BCKh3mMTi3R94TF/Mmsa64n/EGouRSCQSiWzn2DHZyuLFlhNP9FSriX3HCZ/AmC+Ktc9g3doc76X4nJCAoIXY0FE6YtPfjX7faIGy6d9H/XlzsbOFnze834BCnjuQnUiSo2TgxfvxDwcupf61dZTLCatXT2RvlzBYgZn0kabfxcjuqFdaRbHHBoPXnCTdA+syHl69JCwFD0YBGIlEIpHIdk7ngqFaTZg/3/Hlq2eZfZ5/PTNmnE2ewfCQQyRBZOK2mxOxuFzJhh1J6W1iZvycyvsOotHIKZeTCbvflUpYjt2h/yTS9B9wuduQ+jymMtPgc8XIiez7qt2LOEATb5tIJBKJRKayAFyyJKFWy5OvLn6V7Z9xk/T1zeHRR/MQPtYFQdIdESgglub6HGP3F5KGPfq9bw4isDoBRWDVUK97/nHes8Ccg8t9F0W2Qb3HJE/B2zeFX5WjAIxEIpFIZMoKwOqShLlzc/uf33qT9k+7HngWa9cGr99E6zG8dUIwIc8c6Ayfluoc9d730KhNPBFYGRRAUTkXm+zchaXfLaCKytHh+zkxESQSiUQike2c9oTakiD+zFXfPkbSvqvIMshyj47K7t0oacNvlOgx/kkgRdk7ZfPteB8Ejk2MDg+fzvf+bSHlcvI4fXV7LP6KxI8D/vmVGHMT3vkinlE2TvJgDJJARv1RRPD+PpT9Wd14qBg3MRYwEolEIpHtlG33HLXE39XfeYv0Tb8K5zzeeUQmx9KgiEFVyDInaelCjvzX90yQmEChDlA1iC4atewrXf9cVRCzO45nhV9VJd46kUgkEolMFQG4eLFl7tzcXv2d10j/tCvxzuMcodXGJEJEQA157iTpu4L/869voNHIqSwev7jGStHn98BfvQNbeklI/KBX+xO8gInZLfw4GAVgJBKJRCJTQgCqhrZui7+7v0yb/k1UU/KMSeP525IIVC9478WmV/L6dz6f+nw30ke4x3tDfUD5x9fviugnUKfIeMRZahR+kUgkEolMGQGoKiwA/vO6GTbt+yZJ+hSamUPM5M4IFTF4p4jsKCZdzKHH7wzQcxHYKvui/qPY9Bl458fF66q2GW+ZSCQSiUSmigCsY6iJtzPcxTJjx+ezbm2O2U7KvHQuAi15lpOW9pO+/PPUap7BXi6BFokfz3v9gVh7Ai5zPRZ/SujX3ESH7y0GREwAiUQikUhkUgvAxYst88XZb//4DTJjxnt49JG8KPUydRBJaA7npH3H8M/vfhv1uqNS6a0AVl2I2FKRndvLpVgt9OZqSjv8dZQojEQikUgkMikFoKpwe0W55qZdxZrPkueh5pxMxVAwNTjnxcglHH7c0xkY6H79vUrFQt3x/NcfTZK+Dpe5cSiw7RGjiP6CFdcOh3ZwUQBGIpFIJDJ5BWC9bqiJT926Kjvu9EyazSncCkwM6jxJuruo+SS1mqdS6aYSFgYGlIOOmI5yQSiQOC6JH6HOoNdvxNslEolEIpHJLgBVDZWKL/3ohgEtld7HurUOwU7t0yUJ+bDH2Hfw2ne/pKtLwZWKoVbz5HyIpLQv3rneZ1yrRxKDz3/NLLk+CNC6i7dNJBKJRCKTVQDW64KIeq8fpb+/hMthaq79bqKJUIwxIvlFdM8jF/r9vvCNMxE5A597GBfx3VrqrYZOKJXYBzgSiUQikUkrAEPNP5/+6IbnkZTezNq1ftIVe24XEUuWO9K+V/HadxzTFS9gWFpWtHk+Nt0R78dh+VcdJrX4/AesalwTYv+i9y8SiUQikckrAOt1AVTFfJDp05KiP270/m0QR4J3KqKfYt7bdyoSQsbm/LT6/T7/9XMwyVtwzfFI/AidP1w+jHJGMShi4kckEolEIpNWAFarhvnz3fQf/3hPjLyZdWsVpnrs3yaIGJzzpH0zcfZUajVPuTwW5ygkfpTLCcYsQpDxybdVj0kMopeyuvGHIvPXxwsfiUQikchkFYBz5hiApplWYcaOO+GcD71xxwlVBXUo+UYvcIxnORLBkGdejDmVw/51No2Ggw47hLQSPx7d8XiS0gtx+TiVfbEGl/8FST8VjqkexV8kEolEIpNaAC5d6gEUfQsu13HL+1B1KJ4kEUr9lmnTkpFXf39CWrKhX2/xvt4rQMF7xaYzhOHzAaXSUYcQQ72uHHTMU8EuGLd2b6giRkDPZuUND8OgEOv+RSKRSCQyqUg2efYbRHzp+mX7eXgRQ0Phd70VIB4w9E+zOA/D6+/VzP8ez0rUPYCq4PXpojwH1efTP62PZhOyzNHrpWoRS9Z0mGQ+h/7L56hf2RiJ4dtWKhWhXnf4tR8nLe1O1swRkt5KL3WYxOLzm1nVuComfkQikUgkMhUE4NKlBvAe9zpm7FTi4YeLtm89UiGqjlK/JWuizea3Vf1XsXYZ55720GZvBfjAx59jmkNvROX99E3bi/VrW8kqPXRbqoBBVC/SSuWloxJCtv6ktUTjQUf/E8J7yLNQc7G3fjcFAe8dKqcSYv5i7GckEolEIpNeAM6Z4wtN8xq0WIHUnjmAHNOmW5rDNxuXfThf8KGfjfylWjUccIBw++3CAQcodaA+33HZx/7s4dOcUv13yfzHpdR3As2mL/IVeiMCRQwuc6R9B/G/+k5qtS+27QUUvQhjE5xzSM/LvnhManH5Faxacmv0/kUikUgkMnnZIDJUBRFlyZL+JJc/kaTPZrjp8d7gPHgPXsNXVXT0z5t+r7rRezd/z6i/hb870j5Lc3iR+/WSM0Zq61UqML/iQbbsC6tWDWCo1XIA8/6PvQ+bfI48c3hv8F5G9kVHvbyi6oOPbqP92Px9G33P477PY0Rw/u867A7g5qseap3VJ70CLbH4oiPfii1dTdZ0IHbks5QNn8OWvi8+ZqOvbPyekT0Z9b6N9k49CKg+hPMHsLpxbzE2YvJHJBKJRCKTELOpGEz9tP2xyTPIMqUXfX9VHX391g8NfcKd9f5TGRhQFi8Oomj+fPe44g+gVvNB/KlQXZL4z3388+TNk0lLFu2d6xLB4L0jKe0pKR8BlMpWdc0Q6nXlFUfuCOZ8vOq4ZFyrKmINwgJWN/5edPyI4i8SiUQikUkvAEP8H47mANOm2Z5k1qqGZd+h9d/Qc074GNVqwoIFGoTfNikwpTbXcfzxqf/8uZfq8NBV9PUnhFIxvcKSNz1iT+CQtw9Qr7vCQ/n4BJHopWnPJCnNLFq+9TrpxmGtxWe3scsjX4hlXyKRSCQSmUoCsCWlvB5YVB/pdgqCJ0kMzeH7nO//QCGWPCLtfq6y556OatVoyZ9M1lyDsdLDEjGCqmKTPvH+0wAMPlFZmGro9/vSNz4HkQ+RZx4Zp3Z7KqB6KsuXZ7HsSyQSiUQiU0kArlmjACIyq0fPf09fn5DnX+Ccd68hxPJ1JtZqNc9SDJ85bw3e1UhLBtHeiRnBkjcdtnQEBx9z+BP2CQ41A1XUf5okmYaOZ7/f7L9Y1bghJn5EIpFIJDLVBGCl4gsRsyfO0eUsVEUkYf36ppP+rzGWCQeNmqNaNZ7/vYLhdbeRlGzI+OipsFIx8mkOrey8xT7BrcSPFx89D1s6mny8+v0awedrSUqnh30ciJ6/SCQSiUSmkAAMGcCqomp2KzJjuykAPWkJVf0d61bfAUrH3r/RwmZwULjiikyE0xHASC+FjcVlik0OJCu9kFrNb5IQItSBgUpJhIXoOGkuxSHWgC7kT9evCr2MazH2LxKJRCKRKSMAWyKkXk9F2BXf9Tp6irUI/I5azbO4Praxb8XSq7vi/J9oc/h7pH2W3iWEOJKSIc9vhLtvplrE+rUol8My6076ftK+A3B5Ufalp3iMsbhsJY8lF0LVhF7GkUgkEolEpo4AbLH77ga0rydeKRHwfjUAt98+9mKzWHpVMWeQN4eK8irdPrCim4bLVO1pNBp5kQhSfG4htF7x1meI6EdxuR+/si8iqDmDe69f24pHjLdDJBKJRCJTUQAGCdMzISDGNru28VrNU1ls+OL5f9LcXUapz3Q9FlDxpCWLc1ew7MrfbNYRpCW0fHYutrQb3vWm1uLGO+mwqcXlP2XVT/8L2uxaEolEIpFIZLslGddP726cISyueBZUjd750HkyLG/HJs8gz7pVa89jjJA31ygsoFo11EaJ6ZYYfOXRLxO1x4WagWJ63u9XRPC+ieHUOPw3zEWgKpPncGpF25rxnlxWOz2OcF9FJus5HYPj2ejYen1cY2g3JtxYnyxjbSyv0Tja1arpxhhLmMyIhI4c9fpDvOP0j5Em/1EIwG5IKyVJrbrhKo2r72ePjUqqhAFYxch19iISY/C5K5ot9/KMOEySkGdfYMWS/9d2z+LJhxY3d2QsJ0TB4ETiOZ2sxzPWdmMiheJMlrE2GWy7dGtyM7kFINDqyOHhK+bOtceTll5Kc9gBdgyHmCNJLc3hX+P3+fdCWG24YEGEOl755mNJS68gGx6HxA8NHkeX30sqHwcM9frUFj0tATxr7pFYcwZuPDqxjKmZCMv7PvsaKxtfGAeBHx5gzztsBo9mV4E8BVUNlca38eFjrcH533Dn0pMm2INxHIw/ykHHpzzw5zrIU0PN0DbPqfe/ZdXS943fOa0aqHn2PvgfUftvqOZhX9pdDRKPGAOt4yq23/1jUPZ/xZ5kfV8F+ote8W0cgyiIIjhMfix33PSXcRzv4XP3PnRnNLsKzM5t379iDeSDrFp2/DjdNyHxc9acKtYehs8d2s4zXxRRQc0QIm9n1Y33bRCWPbwms8uXQnIQOIdqe8dhBHDvYuWyP7fuk8kvACF05KjXnX/H6acb9Q1EGNtEl7A9tfIhltTyovizjvxxYEApH7eL5Os/hXeKID2/vRXFWIvJPsIfbvzfWPQZuO8+Ke6NZ2OSV4ZLth2vBKuCScDnt250fL3mMU2AuVi7Y3v3WXEcbrhEJPDwXQZ0LjbZqT2t1Bobw9PH90BqYZK1Un7PbP8oaf9rcVlICuzIBKevZHb5RlbV6t23bYOhbm0zPY+kdCg+A2vav2dtCfKhfw/ibwLYZTNUwtnXYG1f2/evJJD7ncZxdg/UwfhfIukCjO3AtiuYFLKh9wDnQjmBRt6jyZIy+5DnIXwg7L5t83qkkA/9hjtlFaM8ilNDALY6cnzlwpv02A9dLWn/2xhaNzZeOMWRppbm0NX89GuNzRM/KoZazfGK+eeQlp5Jc33xuT1UgKoOk1hcfisrbvxSb2bJ25NwkiY+d3g3tp7hnh8HOT5PQNaP7wMkUVz+MD6fHpLKtlmxhOsgPBYH58YyEJ/PaNMrM4HOaRWo5djyu8mbvwVmoL5DL6C3qCxk70N/wsqBRwme/C7YuEKgzXr1wYj9F/LhDNS0v99GyIf+wrr0lPBgngB92I1VHA/j86e0ff8KFtFxHGt1FyYay37E7HIDsa9C8zbtu3i0aRA5noHyJQw21tITL20x0VB/crCpWYa0uf+SWdSeAzfmoycZ2+9y17YyMKCgormcTdZ8DGNC795OXS4iQp49qiIfpuXtG63g63XHqyoDYsyJIfHDjNM5V4+XU4NRjGVfNr1DismADV+395dOhPvatn9OR/6viUNzjM+pToRzWvNQsaxo3I1352JsWtyGbY53UtQrNt0Lny8I2y+b7tgJ4KCDUjCXhBJeajq6T0US0DO59/q1UDETyC5Pgvu3Eq6X55Ki01Yn4wtM8mzW6dvCNSp321FgoO7Z+5V7IczHOxBJ29h3QWyC97ex+ik/2XSSMXUMbK3mqcw3XHXRapy7kLSv8xmi4klKRlXP54Yr7yq8faNi/wYlWA1ZiE36ixI7vV2W01bZF3cVK2+4OS79RiKR8aceRODqtZfhs98gNgHtwC6JwWcOY05kr7kHhSW6yhg/pCsG6o77Z5yETV9YJPK1+RlFH3aX/5BVjXq0y90aYwiruQaX34YkBtouBSch9lY+WCwBu+4+y8thMqDJ+zHJjOLeaC/2I0xUFoXxVR4dnjbFZtj1uqdaNV7MRQwPrcJ2MiDUYxNDPvRn+vsv2azjR2sp+OBj/g9J6Z/JM9ee+7YjgVr0+3UPI/lZxH6/kUhkYlDYoeUZ2A+GYLiOnqcSYp0kwfrPjE3ZjC14ZPYtPwsxH0OdD1Uc2j12Ebxbh+07Odrlbo6xsoVGjuHizppBiEGdxyYDzDRHhu1UuqWfBBqOZ712N1TehbZdLzgk47jsDvLhb41sd+NBPcUGxOABwtcuWisqZ2GshCysdrYkihFR0dO55op1G3f8KJaCK5Vpgi5sM2tvLHCYxICex4rG3WHAxti/SCQyIWbkDiqWVTfehM+/hElsh15Ai88dJn05M5ceP7L9MaES7HuuF2CTnYNNb1uxBrus/jzu+MmKaJe7SeGpW7/jYny+KmQnd7jyJ9qK1+ySaC+8dOnwcdhkd1Rd+wLQCMhnuPuW9Zt6/6aiAIT6fEelYv1VixaTDTVIS9tudFRD4kfevJbrrvze4yR+eHOvOYWktB/OeaTnHT+Kfr/NPzKcXRpmxPVoZCKRyEQyyMG7kfizcPm94YHVyQNaBHUeI59kr1fvObL9zsRfWJ7de+4hmOSYzpZ+cYhJ8NkgysJi29Eud/FBCGXL365ZB/7yzsaXWLzzGPMqZh/8qrDtsQ4zaHn/XjYNOLGYaLQp/sTi879jkq+wBe/f1BSAo2Wc6Ok4F+pQ6Vb/r7Cm7vJhhdM2f0OxFPzyt81UsWfiskL8yTgMfBGU01jdGIqJH5FIZALioSKsuHkN4s8OHpqOkvMM6hWT7IaRC0a239EDGRgYKOH1ks6TP1uOQz052OWRX0a6RuEFzPq/gsvXFAkhbZ5z1bDybz4UtjHWS/ct71/fmzDp3iHUoO3lXwG9gpU3PPx4CUZTUwC2ysJ8/bJfqs+/TKnfgOZbfWLTPoPPL+e6/7z98fr9SqrnkaQ74XUcEj98CDD2+Q9Z8dNrYoBxJBKZwAa5WApe9mV8tmzsloKTt7PX3EM6WwouEj/WP/UkbPKPeJd3nPjh86+zatn10S730hlSMdz9kwcQ/g1JpP3YfzH4XEGO4FnlA0OXkbGMN204qBpUT+5gHqSIWFz+MM5/gSdYrp66HsBQrkVQt4Bm80GMffIUfFWPsYZs6B7tl3NHvH0jtqIQg3OOKZMkbyVr9j7xgyLxQ916MKcRA4wjkcj28qDW/AN4nxVz5g7slgogWH8Z+87rK2zgtk7EQ9jMPq9+NmI+ine+A3veSsh7AJeeQVdjyCJbmGSE65+ZL6DZw2DaLbkjgMPYhEQ+GLYxOEYOnqKBxMylr8WmB6G5b2+yoYX3jyu566a/Fd4/HwXgaGo1T6Vi+MZn71HvPkla2prgUMVaUfgI3/vqQy1v38jAGBhQyuVEkEVFxtE4mFD1mMTg3GX86Sd/iAHGkUhkO3hABy/dnT/7f6CXYFKLaiexgAbvHKZ0AG7otKL24DY+74rEDyefRpKdoZPEDy3ao+nH+MsN9zzRQznSFcL1v/vGv+K5KiSAtj2+bNHR663s8+pnFzGcY6ClCkeN4ZQRvdHORCOM/fVYvfTJJhpTu9BqURaGR+Ryhof+QJKYxzU6iiMpWfLmz3nJXl993MQP84z3kPb907iUfYHgoXTZ3Tg5LyZ+jIMHIxiVcXypJ8YURbZPg+yhaig1P4HP7ixWZdq3XyIGn3mQs9n74Ods24O6lfgx5zWY9Bh81mHNv8Tis/9m1e5fiIkf40XLCyyX4txwUcanTS+gOky6A07eF7ZRHoNEo5oy+5CXIOZQvGvT+4fDJILqf3FHY8WTTTSmeqV9ZXBQuPYzw+r86cFrt8WyMIoIeKfqzKkbFXsOfxbqA8oRxzxVMQtwmY7LuVVVxApGz2blDQ9v4qGMdBsRQaxBzDi9pFSUOUjjxYhsnxOoQeGPP38U708NGZsdJYSE/2/sdLxZFLa/VQkhIWxmoFLCc/GG37V7TALeO/AfGBXzF+1yzym8wHcu+SPqv4tJwnJue9gQC2jezV6v2nWMCkMr6k/usFSNxTuHl0vYivCvZMqPiVZCSP2z11A54VpKpXkMD23cM1DVk/ZZhoe+zLVfvGVz7998Q73uZO3baqR9ezA85BCxaC/v8aLjR968iT/e8DXYZB8j3VZ/oPp38A+jnWSZdbQLDu9SlL8DsMce8SET2d4MclgKXl3/NrPL38ekR3bmfROLzxw2OYK9Dz6clfUfPXnyRcVAzbGufBw2/Udc5orM0XYm5T50Yso+y5033RoTP8abQhBZFuJdhfZ7vwt4h033wHAscGn717Yaxts+5X3xvDEIy3b2q9VdJruWuxrLi+36KAC38oKq2NPFZXMRSfGteA9VjBXy4Qc18R8J3r5RXsKWGHzNv7wQkePJhseh5l+r5IvzJPZUupKeHnniG89aXH4G09d8k/99ZsqONh+XXRl6yLBPX8aqYnITiWx/IjDYXpecAv4QMNMLT2C7HpbQ992bT7PvvJ+yYiDj8eu5hF6pex+6Mz6vol47iOcOITk+vwfvPro1D+RIt6mFMIOVtV8xu3w9Jn1d+xMMCe3hvJ7Es152BXfXh2irTtBgq2fxSZikD5/n7WkzEdSD6kUbbTcKwCezN4UXcPFlv9M3vf8LUur7IOvXBy+g4klTq8P5ufzgS/dQviOhQb6FM38RJk3IXbtVuzvQH+qxJUvevII/XPfLIEpr8eHf+zlEk8HBJlRy7h1HQ393vBKR7ZrQJ/iu+kpmlz+FKX0K3+zECxgSQmx6IH7de6F22eN7a4qyLy47hSR9Zoexf4oYg8tP566bH4Q9LTHxYwKwNCyxilyI6uugbYHfGlf7YPRo4KqiT3C+Tdug7pl9yNPAH1u0fWvT+5dYXP4zVi9bWmzXbcWHRwoRGBJCSv3n0hy+F2tCbcAktWTDt5Pf/VkqFUujMTrxI3j/Dvm/byHtm0s+HmVf1GOM4LP7MUk1lKZZHI3MeKBqwgzwGlvMBMfrFYls7wY5eGrstEVo9tuiNmCHCSHOo+Zj7P3yPR6nQ8iosi9yShGI3+YzsrUcl9/A6mVXxaXfiUQjBwwrl96Iul8U2dntXRuBwrt8SrjGjW0co+UiESV/NybZpWj71r4ND96/rU5KiQJw1Klj6VLD1YvuV3QBSUnQMFtT8ady7bXDI+9rXfr6gFJ+/w5izHl4N179frXoK/kJBn/0d8pLTdv9jSOdXwtQ2EE3fD8ur0hkEtxLg8KKa4fBtYridpgQ4hWTPgVfqrLFDiEjZV8+hk136qDsi4IB9UNo8oHwqxiSM7FoCS9d1NmUWSzqFGNexN73vZyW93qrx2TDse+8PtS8s5jftKHJ1CGJwbnf8dS11xTb3SovZBSAG00MGo5q1WDu/xLDQ79i+g4l8uy/+N4Xr9ss8aNctlDzkjz2YdK+WaHfr/T6fHpMYsmbtyG7hPICjUacZUYikUlA3UE5YeVNN6LuPzFppx1CQlkYMe9hZvkFG3cIKTx0s+Y+H7HHFeVj2rPnoRarRf2FrL7h90WJj7gqM7Ee9qEF7G6PfQ+X/x5JTAceZo8Yxcu7t+2/Fe3ZsnWHYOy+HbR9CxUoVC5m+fJsW+pdRgG46cxtcFCo15sqejZZc60azqRV5LlFtWpoNByHvuM5JOYU8uZ4JH6MmhGbDzFYb1Kh01lyJBKJTCDmeEAopWfh8wdCaZi2bVwrqS9FWLjx70ee5Z/C2LT9pBP1ISEs+zNDO5wfa7FOZComCCZzcZHo0+64sqgThKOY/dKnFUv9W68HjLwjhCGKb2u8iTX4/E6aj3yDVhJTFIDtTjrrYQ3+gT8s0ebaw/nuFXcAulHtv8Gi36/4C7DpdHQ8+v0WZV9c/i1+f+1PN/NQRiKRyHZPUbvtjzfcg9dzinitTjqEtMrCvIaZ5aOg7th3XgnqjtkHH4axhxfevw5avgl4TuFv16wrMjHjpHxiPuzD5GKn5Cp8trqDsSWod5hkF+gPbpgnj8ELSRrPOeSZIIfjXRCSbY03I8Bn+NvydVDephJkUQA+3kltNHK+/6Vlmwm7ltB67XHzKJWOGtd+v949RpIED2U9xphEIpHJ+qCuWFbPuQKf31IkhHQy2RVUwcj5PKsyjRVrPOVygsp5nfUgLhI/fF7nrqU/jIkf28FznrLltuvXovK5on9u+8/REKf6riIZ5EmueyEQM/9mTLIDaM62O5F8kWW+hmzoK+H/b1sSShSAT0S1ummrmLAUPG9enxhZ2NtCzxvhsInB+4X89ocrqcR+v5FIZDI/qAFqHtGTQleNToSaGNQ5TLI/6ZoPwfKMv/Av2PQgNG+37EuYlLv8YdSczlZ0YYhMBBrBCziUfxnf/F/EtNmFo0gGEfvCIhlEnzgZZGkRf6rHBR3RVgKpD6LVf5G7b3mgnf7SUQA+EZu2fCuXLbWaR552ImnfAeT5+JR9EWvJs5Ww/qJQ9iXGmEQikclMkbCxsvEr8J8tEkI6WQo2Rc2109i7fCDKmR2F8mgRiyVa484lq4tuItEuT3xCiMHfb14DfLHwArZ73RxiQJ8sGaRiQZS97n8pxr4wjMNtnnQoIhafP0Yin2t3whEF4NZSrRqWLnUc+a5nCMlHyLPxSfxQFCOC0Q8z2Hgs9vuNRCJTRASG2n2eKj6/u8N4QEFVgF1QuR5kP9RJe5m/RRFen/8Pu+1/ebH0G8Xf9jWuBEk/h8/XEmLx2nmmWtSB6pHsV35qsfz/+BMK648NgrGtfsQOsYL4K1nRuLvdCUcUgFvL4KAgopLpJ0nTXUKrOOl94keSWvL8Bn57bT0mfkQikSlEqN23uvEQ3p/eYebmhim1yNNpP4lPW8YZx4ksvyLb+PeR7WRcGVbecBfeX4VJpaNkEJvuRk4rGcRu9h7qjr1etSsqR6OeNlcRLd418fZSOgg3iAJwa2gJrSPe9XJsclxI/JDe9/sVEZzLkOTUMHGJMSaRSGQqUSwFr258A59f13ltwKJPcPtm2WNKFs2/yF1LfxYTP7ZXBoIXMPWX4PNm+x1gwlwAL+8MJYCWbjIWCkEo9g3YZA/UtdH5Qx0mEfDf4c4lf+wk3CAKwK0xEIUIFGURxkiR/NHjrh/qsalB9XP87ge3UYnFRSORyBR+WHtOxrv1xUpMh11C2sKDFVx2H9afE56n9Tgp3y4pyg2tuHkQ9T8IAou8jaFkUecx8iJmLnlp6Mo1OhmkEIRGjqPtLFKRUDRaL+r0qKMAfDIqFUO97hja+V8o9b+MPHOI9LrsS8j2cfnf8fnHgZj4EYlEpvDDumxZ3fgD3l+ASTqsDdjunFwVYwyqH2bFzWuKVnLRLm/vKAtRr23rIy2e12LetbneEuXZcw8AeVWo/betWkJd0fr1BlYt+yWteoJRAHYFw8CA8tp37yZqPoXLe1/wubA0GGtQ/RiDP3mASiUmfkxMJLwekw3fd/0ViUxBGg6qhuZjF+CyPyO206XgbbXJDptYfNZgdePLcel3MlB08FjduAV1N2KsaWtMSZEMIrxx42SQovaf1f+LSRJoK/mjWIG0RSebSkfPgCgAn4hy2VCrefrMOZRKe5KPQ79fLYqLuuyX/Hb6l6jGsi8TV/6pC8J8eVYI9F68IpGp6adhUEL3Azmpx3OhkADofRM1H4yXYjJRCCqVCwvr2s7AanUG2ZAMUi6H4tB7HjQd4a1BV+o2agl1SGLQ/L9ZdeMNdOj9A0jiBX8cqlVDrZbzpn89QJw9gWx4fMq+CKBeEXMK1B2DFUtcZpigjySZwf6v2JG1PqXf5939sN3A58Kzs7U0Gnk8+ZGpR5EQcmf9OmaXv4lJ34LPXAdt3LYWh0kS8uwSVjf+X/T+TbYxheHO8vXMWrock/xT+8XBFbwcC3xh5Bd9Ox6G2Flo7ttKNAlrfxfR6mKyjZ0/ogDcWkK/XySThSRJH5kLmb+97P6h6rAlSzb8NW774c9i2ZeJili8AyOLaKbnkorQ9au03iMmYbU5FvhJfAhFpugDO4TlGH863r0OzE5FcH23XIIeMRaf30l/di7BCxMn5JOKsoFajpYXInJ1e+ssYvFOEXkJsw95MY0bby0E3DsQARXPNq3AFoXGff57pq35XhjfjY7tfRSAW6IltN7wvqNI7TyGx7Hfr8sfppScDQj1zTLMWq3q4lLgxBCCuyCyS+8+LgFtTo/nPTKFCX2C76j/hVlzFmCTS/B53r1nmyoiBqen8MefPxqLPk9GGiFmL532Hdz6PyJ2v5B1u40eO8VhbYLP3g3cynNesze5e21I/qCNzh/G4PNLGBxsQjmBzld+YgzgFh6rDAwoRxw/XUQvCAWftffB9qq+6Pd7Pr/63l9Cv9+Nln5bGWdR/E0YVFH1qGoPXq4IDYgPn8gUpx5E4J27X47Lf4XYpDsJIUU8ts+/z+rGd6PXffIa8lAS5tphhEsR017SZSsZBKnAQSlNdxQ2nQ6as20e6uD9c/lf6MuvZoy8f1EAbolKJSR+WHMypb7nkOe9T/xAPSYx5Nkf2PXRS7aQ+BEG5P6v25995/URs0EnzuQh3FMxCzgS6ekDG6DusPLBsAQ85l2aFIzB52ux5kPh3os1/yb3pALBrP86PvsrYjZ1wGzd8yAkg+zKzB3ejehRobzMtiZ/4AsR+tnC62zGyvETBeBoqlVDfbHnje+fKVbOImuOg/gj9PsVETyn02gMFfGIOkpkCOVyP4n9MX0cDWgoDB2JRCJT8oEdEkLuWPJzNL881AZkLJOjHMYKqgtYseSOoqND9L5P6klF2bLi1kdAPo/YNms8isE7xch5iLwMv839pjXEE+YPkORfKiYeYzbuogAczeCggKjgzift2yEs/zI+/X5d9kNu+8E1myV+tJaC75/+IdLSbLx+jJnl/qItXPQIRSKRKY7sXBjTMbSHrW3JU8LXPaL3b9LTCF5Am1+Bzx8oGkBs63WXMHZkFyBte+KBfjEUGy+3sw9RAD4pLaH1phPmkJTeSnN4PDp+FJ4/NwT2dEA27vdbLAU//3WzMPJhsuGcpPQPTC+dBDVfiMNIJBKZagY8xOPNevVrMcmx+NyPbTkYMfhcMXImsw9+8YjHMTKZCR1nVty8BtWvIIlAu/Ud2iof0vL+rUPN54KYbIyp1zkKhpZKHxhQytVERBeFNG0/TokfqUH9Zfzmu78Pgm5Uv99KsRTs5HxMsiOqis89Ys9m/yOfUcQJxmsaiUSmlv1mQJlZ7kfMxcE/ol34DPVgBOQzo8RfXHWZ1BReQO8vx2frikmFtjd+tplW2MHV3LlkdRH7FwXg2E8ei8SPPda8h1L/C2lmrgj67O1sw1iDy+5G+j414u3bsI/BQ/n8w+dikreQNx1CinrFJrtg138iDMxKNEiRSGQqGfAwUbacjEkHisK9XbDfYtHcYdKXMuveEwsvYHyGTm48VAx33bQK9d8My7H0IvNbAYt3GdZcTJeSjuLgbSV+VE7aXcTUyDOPwfR+XqdarPWfw/L6wyPevtbsYWBAKZcTvC4CGTWfEIvLHNjj+IfDXxqXJiKRyBQiFGKeWZ6FmrPxzndH/I3YW4N3HmNqzJo7swjIj8/RSU0RX2+4GO9yQg2/bseAOkwi4H/AHUtu74b3LwpA2JD4IVoj7d8d57pRQuDJxJ/DphbXvJnl378StpD4Uat5Hpj+XmzpBZu1O1IFMRbNLqS1HBKJRCKTnkqYKAsLMXZH6HrinoBXJNkZ8RcTV12mALXgBVy57LfgfxiEWde9gAZ1itGFXZ49TWXbUQit+Sf8E8a+h+bQeJR9KRI/vEfl1M1nFlVDva4877A9EFMtZrgbGxwRi88dNn01z33dW4uEkOgFjEQik9mAh8SPvee8Hpu8qUd9gAmB+ZnDJEez98FHx1WXKYSwEPVd1k7qQts3v4Q7lv0CqqZbBcejBzDop4XYJCnEV6/LvnhsyaD+yyz/7q1BuI32/g2G+kOa1rDp7nj/eEsOEopM+k+x/5E7Fm3j4sy0txfThw4EvXgRvopEb29kaj6KqcOeB03H6yJUteefr6qoXMy+83Ya6UkcmaTUHVQNKxs3o/lSxJrudJsJiqRo9XBh+Hlp13Ta1BWALe/fW088hlJpLtmwg173+1WPMUKePYjKR9m0329rH//x9Qdh7L+SZ0/Qk7iITbGlWbD+VMBTLsdZaU8fCdZgUotJevCyKSa1iKbxxEemHmULOPp2OBWb7of6Hnn/RtlbdR6TziRb/3FayQKRSUwhxMQsDFK/G3q/8P65fDmr97g+aLRG3q0jSqbmhVRhYIHyrtN3lKHsU3g3PrM3VSUpWXXNGsu/87dNij7LqLnmRRiT4J17wv0UMbjcgzmN/Q77Ko3r7wzu41qsWN/lKwkiqP8N3v8VtAdBwuKRZoLqX8PPMe4zMlWoGqg59p27D07PRHPf+8l7a9KdO6w5kdkHf51V9V/G/sCTmUbo4btSr2O2+x/EPr/IOB/bsScCRheFcVROxrr2XxSAlbqhVnPy1pPPpL9vFuvXhaLPPV1FKBI/suZv0ad+LsT6ja75VzHU644XHH4MJi2Hsi9Puo8C3mPTGWTuPOCtVAYN9Xjrdvlaeoy15NknWL3sO+OzD1HkR6YKRViM8xdh0hlF7F873rdOM3ilqNZhUf9ZyuVX0BgJI4oTsklJ2QYhWL4I4cqxvcrqg/cv+xPT7/9WGEeNrk4mpp4ArFYNtfmeYz7wHKw9heZwSPzQ8blf1eip/PKKLHj/RtK8QweQ/Y/cEdXzQ0u6rc1MFoPLHIl9C8899PPU643N2slFusW04J0YTGAg781H1jQ+bCJTaPYePGyzy0cgyRs6SPxQxJgioL8TDdhKwHsxd2YnQv2SwmuTx2s1GWmEVTjPtyCvIXY2Omalh8KYFH8pg4PNXoyjqScABw8QwIsxF5Ak0xnOHb2OhVR1JCVL1vwO//2d67fY77dec/QfcRZJaa9tjE+UUZPTC6Hy8lEJIVEodBXxwRNX9mPZsDsSibSM2oDyrJdNQ+UiQv5TO6E7rcoLgwj7Fba1/RAgacUDSo29D/02K2/4Swy9mbQolBNWN4aYNfcSjLksCMCOCd4/n92DXf81euD9g6mWBFJZbKnPd/zfU+aRlo4an8QPFDGCy9eqTUO/34FR8VvVogPIi4/aD2NOxmXbXppGxOJyh0lfzHMefBcxQDkSiWz/BjyIqqR0OjbZD3XtLP16RMD7R3DJYaj+JNR16yijM1RgMMlO+GxREAmDMSN40lJ4AdVfic//FjKCOy7S7BErKJ9nxa2PFElOXXfYTCVRIAzcrlSqJSNy4Xgt+aJ4ktSgfhE//+YdlMuW2qiZ4mDRASRzF2KTaUV5A2njaIuyMLKAvV6/a5EkEEVgJBLZDqmGjh/7zt0HY85ov+OHKmIFWMhfbriHRD+Cd8OFie3goVDUBrTJm5g15w2xNuCkRqFsWd14CK9XhPHUkaBQRBJ89iBi/z087xs98R5PHUFQWWyo1bzpf/REStMOJM96XDaAouafNeTZKjX5hVA1NBqjl37DUvALjvhnkuTIkcSP9gySwXuHTZ5B3/qPFNXM46w0EolshxQT41wvRpIZ7XX8KILsfX4n07mYcjlhxbLf4N1lmNQyBgGBqCrCJez/ih1HWohFJiFzfLje/t/w2QOI6cRj5xALql9i1Y33dqvt2xQWgFVDveJ51+nPwNqPkA13uV/k40waEEWMiHdn8fPvP7pZv9/6gDJvXh/GXDjyu86w+Mwj9gT2PuzAOCuNRCLb4ew9JH7MLB+Ftf8n9D5vY2KsRfiN+iqDjcd47DEBDP35J/DZnUVx3w4evK0+wckshpNaEQ8c7e2kpGgPd9dNf0P5URBwbbWH0/Cczj0pRexf70p6TQ0BWDkg9PvN/SdI+3bFe0V63fEDR5JY3PCN/r+//c3NEj/KZQs1z319J5GUDsDlruO2dFLMSI3tw+iF8aaNRCLbGeGB+LTDZiByUeFha8N2q8MkFpf9mjuf9nWoGpYvz6Ei/PHnj4KejkjniXJS1AY0yUnMPvjFRRZnFIGTkfJ9Ep6ysq5DX00oa0Q6TI8TNSe/AKxUQuLHcWe8TJLkHQyvH49+v0GMeZ+pctoWr0Oj4Xjhkc9A5JxQzHmMBKqIxWUOY+exz2tibEokEtmeDHhI/JienYlN9m4/9q9lD+2Hgw1srb4U9nBV41t4d22xFNxZQkioC5+gcnko5VGBuBQ8WVHUj83zVH3Px8jU8ABWq0ZEF2ETg4xHv19ykpLB+yv4xX/9ZgtlX4IxEjkPm+wSPJRjKlJDkKpwPjPL/TE2JRKJbAdYqHtmv2Y/RE7DuzYn7+owqcXnP2TVjddv3q2jsIfefwj1Q0XN1Q4TQnKHTV/CLDmhEJkxAW/Ssv32Y5/cg7Ky2FKvO/OXtcdK37SX0xzufeIHeIwx5Nl9mtoFtGL9NuxkEIMvesMrsPZfcJlDxvi6SKtPcPpcUvsBqHkq0SBFIpEJbcDD9FnzixE7rb3Ej2AA8S5H3NmjBN8oiniu1ct+j88vxqSm84SQVm1AasyaO7OoCxptbiQKwN6goezLcdVdwJ6Ly8ap3y+KTYx4X6Vx9f1BeI1u+VaIQFgUApSVre/6sS32CIPmHjFnsf+hz6AeDVIkEpmw4i946fY++Ghscnj7HT/UYRKD6ldYdfNtYbtbKtBc2MO+/LwNCSEdZWKGMlyS7Ay+qA0YqzBEogDskf2oG2o1L3b9R+ib9kxc3vvYP1WPTSxZ89c+ve+LI0WeR/ax5f3LjiMpvTR4/7rloZSiWKndhdx9EtBi6TkSiUQmEiHx43mHzUDNwrZroYKCEVz+CJnWwjbq+vjvbSWEuNNCQkinxWKL2oAmeSMzy0fF+OtIFIC9oFo11Oc73lsdkCQ9kebQOJR9gRAboKpiT6HRyEeKPLeMXL3ueVllNxFzLt71IDO51SHEHstz5rw0xCFGgxSZ8DZqIrziZKl3s/ewSvJo9mFM2n7ih6rHWAO6kL827i5KsjyBV6+VEHLTf+GysUgICRNvVDFcwr7zdorx15EoALtNEFoYN7yQJOkLHTF6nfihjjS1OHc1N121bIv9fkHx+Tkk6Z441yORqoQm6OYi4hJwZEIjvnhgu+LreL5iH+2ePZPqjllz9wc5LdQxbcsuBvHn8rtIpl0aOolsTW/Vom+64QN4t7bzhBCK2oDpTPKh2ki8YSQyAUgm3+Qx9Pu17z37DWpL/0xzqIgd6an9DgVH8+wR7UvPYrPEj6qhXnO86o17S5MPkmfau+Xp1rJE+kr2PeRtrKh/bfOsuEhkAqA6g71ePRtNDGLGT4CVvLDOPMQ9P/3fYiIZxWD3DLhAHUQvwST9Rexfmy3fjMHkZ7Hi2kdgxyfx/o0SjlQsK+t/ZlZ5AbZ0Ia7ZWWiOFFnBIicx+9VXs6p+a7S5kSgAu6BuGLhdOeWiabrugQtQr6iOR+KHJ02tNtd/mhuuvCt4/2qjbvZaCDh+wN7HDu43WPsictfDDOUiHtDzKfad931W1B+LD7bIBLqNLd6ByIuwdjDUx/LjZVFyfJKSukuBMyiXLY1GHq9RV8RfEEWzDp6PsfM6TPywuOwm7lx29baLrWIp+M77LmF2883Y5KX4vEP7rBLa0NnPQPmV0dZGJgKTyxXd6ve77sGT6evfjzxz41D02ZMkhrz5J5r+4s0SP0b2tSIM1h9T5dQQ5Cy9ve6hLMyz8cNnhllvbFkUmYj2SfoR0zduL2QaYkoIabwcXZba1JV9X7ITyIWFTWzTKIrgvUf01PaF1oBCI8fY9+N9VtjnTmoDGtTl2OQlzOTEmBASiQJwLAmJH573njkLa86iOewZlxY8ooiIwhncUl+/SeLHqElm3VGpWH757WW4rE6SWlR7tyQQWhZ5RE5mn/K+RXxMjE2JTDBUx/eFK75Gj013Z++h7Iqbdg423SskfrRlj/JQ9sV/mVXLftn+UmvNQznhjht/jbqFRUJIp25oGybepso+r352rA0YiQJwrBg8QAAVW/oIad+OeD927dS2+lmFI0kteXYtS6/63maJH5uLQA2K0Z6Fy9chppfLsAJeMcl01JxPrFMVmZjIBHlFujd7D4kf+8w9AMwHi4lpO88mLSa2D6B8hCcu+7IVNBxUDXnzE/js94jtVAQGmyt2F5y5JNrcSBSAY2I/irIv7z9npiBvpTmk9N77p4gILh9WI6eyWeLHFgkdOX717ZV4dwk2Naj2MNhJLD73GHkjs1/z4rgsEYlExmH2HkSQ8xdjTF/hcd12YaTqQwFn/0lWN/4+4lXsxKYzKNx9y3q8P6GwmWNTG9Amb2TWnNibPRIF4FgdhxF7FH39M/DehUKePZV/nqRkVP3l3Pj1wc06fjwe9bqnWjXQdwGueRcmGYM2RNuER6wg7j3xdohEIr2llfgx5y3Y9LD2ky3UYxKDy25n2v2XF17FMbCjhUBbvWwJmn8Bk4xNbUBVRVq1AeuxNmAkCsCORAygqocWN1ZvUTzWGrLmPUzXTz5u4sfj/e+lSw3L6w+DfgRjBO1pvJFBPSjzeNbLphXxMtEYRSKRblMkfszbCeHTndVrlVBIX+3pDA42C6/iGNnRukLV4PzZuPwvY9AmrqgNmMwiX7cgbCvWBoxEAdieEanVPJVqSYQBXC5oz49LMVYUPYcfXvUgS5eabTI+jUYOFcuvXvB18uYvsD1NCDGhRZw8m3TGgcWsPBqjSCTSZYrOHG79OZhkJtpuMfxW2Zf8B6y+8cddqLHnYVC46+YHUf1AkZ3cmXcxxCo6JDmJvcsvikvBkSgA25Jehc7and1Qnob39HT5t5X40Rz+BTd+7T+pVDqoE1bzeDkNdb6ogKA9OwZJALdfsMv3RQ9gJBLpIhULjXyjxA/aTPxABHVDKGfQtdWL1lJw47to/k1MknS4FCzFrid4PjtK/EXbG4kCcKtZsCDcMHkyg6Bieio/Q2KX92rshzqbFRZlYf7nez9H/VWFF9D3eDQ8Pd4SkUikZ3h/Gca2n/gBLpR9cZ9hdeMPYfWiWx02BsJSsOdkvLu/qNrQgY0WG2oDpi9h1r0nFCIzrr5ExlEAjkfnjLFActfzUl2qoeOHd1/hhq/e8qRlX55UAxaNwsWfg8sfwZjedudQ4hJEJBLpMsUS7ew5b8ekh7Tf8QOPGIvP/4qXTxWJH120l7WwFLy68XdUTwuxgNrp5xnUeYz5OLPmzgyJK9UoAiM9FICtFdM1azI18ggiINJd4SGCFx4OP8zp4J5cEPZzl6EHEdYi0iPJpB5jhDx7EJKPggoDA9qxgSmXLcuvuQt1F4SZLb2JBQw9zx+Nt0QkEummpYEBZWZ5F+D8zhI/NPRc9/pRVjceKhI/urxqUg+9gu9c+lV8fm1RILoTGx1isCXZGfwiWqVnIpEe0FoyVVQNIk5+evOdpOlzGBrWrhoBl4PoveHHpZ1sKuxnf/+jPKarMXY3yLqfVq8oaWp1eP253PCVeyjfkVAbgx6hjaL4qFl+MXn2TqzZG5d3t2K8aMgExqwO+7DH1Op6IOJR8kJst3PsDkW7PmnavsiLc7p9l7gQ8jAi1E+QfWn3nBZjFDe+B1ExUHOYOedg7LNw+XDh/dvG86sOk5Tw+S2sbnw1eM1qvbhGGpaCEayciHO/ATMN1aztcS4CLhvG2KOZXT6CVfVrupDI0tuxFuyoYyogGp4fI7ZiW8cTgpAjpufPjw0xcyFz1av45WLtYXTXj2YZGlKv/vbi585u3Go1oVbL9f0f+6VY+4Jie6aLJiAkfmTDv8Pu8tmOl3433Xpl0FC/Zh0veP2HIamjXZ3VKhiDd0Ngf1fMcqeWkFGdRpImiCbt2XBNMCl43xd1H+BzAZ6KTZLOV8jGfXCEa+uyHcZ/V3gqNk3aczi1jiPfZRzFX6vmXxmTngYKNm3vnhGS4gl1WrD3g22IyHYp2sStWHIHM8tVSv2L8B2b/wQxkPuv86xDBri7fk8hvHp/A3knqH0qNrHt3b+aICm4fNep8fyQHUnSBOcTjLRvZxy9zmEY9YFr1mi4r7iWoeEPI5guDT1PmgpDQ3/msXv/FO6nWmefdMABCmDE/0C9O77wZvbAHvvTuPYzw1Qqdkxv1Faf4Hr9W7zgiCUk6VzyZrtxMk92FKF6vrr/YeUNdxVGx0+JG3fOHE+jAcb/Bpd9Hu8caBsTB/GoWizFhGaOh8bUFYAuG0bkEny+M95v50VuxUNmUfnpRmOm1zxzvWO1XIof3gWvbbS5LMaoyorxO5dFiIzqbLz/ArgMVdvWNRFJ8P6PrG78LJyLXnvLGqFe6uo5lzJr6VMwslt712WT4zKmD5vvB/y18Gr2XgCW7HrWyyJ8PqO9+1c8Ri3Kqinx/BB+iB9+GO/yNp4fxfkVj++7P/xqgUKtN9Zto+9VoX57muxy/22U+vZjaMjjvcV58B68hq+q6OifN/1edaP3bvKenP7pCY8+eoE7/fgzW967MTmO46p9Zrr/HcbuTTasKGZkX0b3d/caEmyVDfv4OO/b6HsUvA/ev+Hh7+p1Xzl6jL1/oybLxXafd+QLMfw33hnAoCojszLVQnZu+hU2ek9rmI1+34YvOcYm+OZJ3NG4HMoJjMFSdiQSifTmGRZDLyKRNkg2UqJLlybMn9uU65cu0r7Sv7F+/RjfWKoYY1i/fjjR0hWFahoLb5NSWWz56vwh3vfRhaTp52kOO8Z+GTj0+83zIc2TM4ExSPx4HDZ4AX/D817/ZWzpePJmvsk16/RwWll0f0fTK4MxbbgpeB/IhvIL7dRAbMVM1n18GI3MYGx753KiMXJtlXH3jLdqxXUyRmFcY8sCBioySY6lw+syUe1IJ/fvRLs+3aZqNiTudHLOen/dZRN9Fn5eurTPNlkuff0DrF3r8GrHxAPoNGP69JTHHlnoTnnP6SxebJk/343ZsVSrwt/+Zo3sfhNp30sZXp+jmoyZB1BdRtqfyvp1H/XXfeXcrnn/NhpYwIG/3h2jvwWegjpGOp107gHMMUmCz47njiX/Pu6Bx5FIJBKJRHo1ExstoUSp1w1z5w4JejzeOWwCOgaR3F4d/f2prlv7e9eUj1OtGiqVsZxRh3284orMG3knefYI1iadN+4e2XxGqT+lOXSj32nteYX467JHoOapDAq/+8G94E7CWIPK2MwSVDNsmuCya0aJPx9viUgkEolEppoABJg/37F4sc1fd8jPGFp/EtOmWYzxHZVBUM3p67O4/EGfZ2/hzH99dERwjqleqnmqavj8ub8Xn1VAhoqOGp3FtClB/GX5ber1rdTrnvri3rhrW0vBt/34m+TNc0lKCdDh9SDDpik++y359GOLAqpx+TISiUQikSkrAEdEoNr88MM+z8OPnEr/NEuSGtRvm5BSVdTnTJue4P0ayfLDOfW9v2XxYkutSzWbauIpVxN3xfk/kWz4SOA++vqDJ3DbWqspqqGeUV9/Sp7dpNnaeVz75TVQlZH6g72gJQJ/9+OPkg3XMIkNmbvk2yba1AGeJE3x7lZk3T9z1w8fLDKOoviLRCKRSGRKC0CA+eJQtfmRhy3yjz12DEbuZ8edkkLY5aj6YmlYNxJ84FF1qDqSRNhhx0Sz7GduaOjV+QffecsYx/1tmUYtp7LYuv+44Hqf569Ul19Lqc+SlkzYR82BliAsjkFDYKDiCuEnlPosIko2vEibqw/juq//jWrPCo5uKgI91arh9h8vIM/mo9xNUkoQkXC+yQuvoI56+SB8CcLdJBZjDHn+HzxqDuHPtxSlBohLv5FIJBKJTCGePGNlsVrmi+v7zndm5emONcndMfT1p9psQrMJeQ55HmrMK6GqeZKA89AcXq2Zu8T/7Y+XU6vlPRF/o6ksttTD55l3fvgYRD+A8jJMEpyZzoVXq8SLSth/VWgOD6H8UNVfwHf/7dawwXESfxsdU5F4cuAhT4O+U1GOQ8weIMHB5zfo2XB5i5fPFfXL8HIed9xw3agJQBR/kUgkEolEAbglEbhBuJW++6MBp3a+eneYZPlzcX5njLE4B7lbj8/XKOZWPN/3du0PeOc7HwraqWq6tuz7RITP3eCpfNdpLxfH4Xj/Epzuh/qd8Jqg2kR1DXC7qC7zOdfx3c/+aZTomkAxcqOydZ932B44mYeTw0APRHk66HSUDNFHQP6Iyi24/AfcceOvRwlZJS77RiKRSCQSBeCTCqkFC0Lf1BZf//5TU3V7Km4nxGT5kL+fPaf/lcMPH95EPI6/eBrlDdzwu2qJ/uEdGRrup5Q/SvPvazcq61ItyrDUan5CXrtKxWxWhuagI6azNtuZvqH1JI+tZfnybOPrXTGx1EskEolEIpFto6qGJUueuBjx4sWWxYvtSF3BiUSlYilXkxFxt61/n4hCsFxOinZ0W8JQLicjNQUjkUgkEolMeToTaKrCAoQD6mE7t9+u1BZoTzNkOz7+ojjyht7BOsmuZ1zmjUQikUgkEolEIpFIJBKZyvx/t7E/o2NbZWUAAAAASUVORK5CYII=);width:158px;height:34px}
.brand-full--w{background-image:url(data:image/png;base64,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)}
.brand-full--lg{width:200px;height:43px}
.brand-mark{background-image:url(data:image/png;base64,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);width:34px;height:33px}


.auth{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:var(--w)}
@media(max-width:1000px){.auth{grid-template-columns:1fr}.aside{display:none}}
.acol{display:flex;align-items:center;justify-content:center;padding:40px 28px}
.abox{width:100%;max-width:432px}
/* ── والعمودُ يبدأ من أعلى لا من الوسط ──
   كان `align-items:center` يُنزل العنوانَ إلى منتصف الشاشة، **فأوّلُ ما
   يقرؤه الزائرُ عند فتح الصفحة فراغ** — والجملةُ التي تشرح ما نبيعه تحت
   بصره لا في وسطه. A centred column puts the first sentence below the fold. */
.aside{background:var(--b100);border-inline-start:1px solid var(--b200);display:flex;align-items:flex-start;
  justify-content:center;padding:64px 44px;position:relative;overflow:hidden}
.aside__in{position:relative;max-width:410px;width:100%}
.feat{display:flex;gap:13px;padding:15px 17px;background:var(--w);border:1px solid var(--b200);
  border-radius:var(--r10);box-shadow:var(--s2)}
.feat__i{width:38px;height:38px;border-radius:var(--r8);background:var(--b700);color:#fff;
  display:grid;place-items:center;flex-shrink:0}
.feat__i svg{width:18px;height:18px}
/* ── ومُبدِّلُ اللغة في الصفحات العامّة ──
   لا شريطَ علويًّا في التسجيل والدخول، **فالزائرُ الإنجليزيّ كان يقف على
   أوّل شاشةٍ بلا مخرج**. ويُثبَّت في الزاوية العليا المقابلة للكتابة: مع
   العربية يسارًا ومع الإنجليزية يمينًا، بـ`inset-inline-end` لا `right` —
   **فقاعدةٌ تُكتب بالاتجاه تنقلب يوم ينقلب**.
   Anchored by writing direction, not by side, so it follows the flip. */
.langsw{position:fixed;top:16px;inset-inline-end:18px;z-index:40;margin:0}
@media(max-width:640px){.langsw{top:10px;inset-inline-end:10px}}
/* ومن له شريطُه يضعه فيه — فلا يعلو المثبَّتُ زرَّ الشريط ويبتلع نقره */
.langsw--in{position:static;inset:auto}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 17px;
  background:var(--b50);border:1px solid var(--b200);border-radius:var(--r10);margin-bottom:26px}
.divx{display:flex;align-items:center;gap:14px;margin:24px 0;color:var(--mut2);font-size:.78rem}
.divx::before,.divx::after{content:"";flex:1;height:1px;background:var(--line)}
.alt{display:flex;align-items:center;gap:13px;width:100%;padding:15px 17px;border:1px solid var(--n300);
  border-radius:var(--r10);background:var(--w);cursor:pointer;transition:var(--t);text-align:start;box-shadow:var(--s1)}
.alt:hover{border-color:var(--b500);background:var(--b50);box-shadow:var(--s3)}
.alt__i{width:42px;height:42px;border-radius:var(--r8);background:var(--b700);color:#fff;
  display:grid;place-items:center;flex-shrink:0}
.alt__i svg{width:20px;height:20px}


.flow{min-height:100vh;background:var(--c)}
.flow__h{background:var(--w);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.flow__hi{max-width:1000px;margin:0 auto;padding:13px 26px;display:flex;align-items:center;gap:14px}
.flowbar{padding:13px 26px;display:flex;align-items:center;gap:14px}
.flowbar__d{width:1px;height:22px;background:var(--line)}
.flowbar__s{padding:0 26px 16px}
.flow__b{max-width:1000px;margin:0 auto;padding:26px 26px 60px}
.flow--wide .flow__hi,.flow--wide .flow__b{max-width:960px}

/* ══════════════════════════════════════════════════════════════
   Line editors, type-ahead and uploads
   محرّرات الأسطر والبحث الفوري والمرفقات
   ══════════════════════════════════════════════════════════════ */

/* ── معالج داخل نموذج ── */
/* ── ويُمرَّر أفقيًّا حين تكثر الخطوات ──
   فمعالجُ عرض السعر أربعُ خطوات ومعالجُ المستودع سبع، وسبعةٌ في شريطٍ لا
   يُمرَّر تنضغط حتى تختفي عناوينها على شاشةٍ ضيّقة. والإصلاحُ في المكوّن
   نفسه لا في نسخةٍ ثانية منه.
   Seven steps in a strip that cannot scroll squeeze until their labels
   vanish; the fix belongs in the component, not in a second copy of it. */
/* ── والشريطُ يلتفّ ولا يُمرَّر — بلاغ محمد ٢٠٢٦-٠٨-١٦ ──
   ثماني خطواتٍ في سطرٍ واحدٍ لا يتّسع لها، **فيُدفع الشريطُ إلى تمريرٍ أفقيّ
   داخل بطاقةٍ عرضُها شبرٌ** — ويُقرأ نصفُ الطريق ويُخمَّن نصفُه.

       > **وخريطةُ طريقٍ لا تُرى كاملةً خريطةٌ لا تُطمئن.**

   والالتفافُ يُظهر الثمانيَ كلَّها في سطرين، **ولا يخفي شيئًا ليتّسع** —
   وهو الفرقُ بينه وبين تصغير الخطّ أو حذف الخطوات البعيدة.
   A road map that cannot be seen whole is a map that does not reassure. */
.wiz{display:flex;align-items:center;gap:0;padding:18px 22px;background:var(--w);
  border:1px solid var(--line);border-radius:var(--r12);box-shadow:var(--s2);
  margin-bottom:18px;overflow-x:auto;scrollbar-width:thin;
  flex-wrap:wrap;row-gap:14px}
.wstep{display:flex;align-items:center;gap:10px;flex-shrink:0;cursor:pointer;
  text-decoration:none}
.wstep__n{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--fn);font-size:.8rem;font-weight:600;background:var(--n50);
  border:1.5px solid var(--n300);color:var(--mut2);transition:var(--t)}
/* ── وعمودُ النصّ محدودُ العرض ──
   ملاحظة محمد ٢٠٢٦-٠٨-١٥: «لماذا نقطة التشغيل بعيدة عن التي تليها، أليس
   الأفضل لو جعلت الوصف في سطرين؟» — كانت لقطةُ خطوة التشغيل «بلا مواقع —
   يتولّاها نظام المستودع»: تسعُ كلماتٍ في سطرٍ لا يلتفّ، فتمطّ الخطوةَ حتى
   تُبعد جارتَها ويُدفع الشريطُ إلى التمرير.

   > **ونصٌّ بلا حدٍّ في مكوّنٍ ضيّق نصٌّ يكسر المكوّن أوّلَ قيمةٍ طويلة.**

   وقُصر النصُّ في `wh_wizard._short_mode` أيضًا؛ **وحدٌّ في مكانٍ واحدٍ حدٌّ
   يُنسى في القيمة التالية** — فهنا يُقصّ ما لم يُقصَّ هناك، مهما جاء.
   Unbounded text in a narrow component breaks it at the first long value. */
.wstep>span:last-child{min-width:0;max-width:148px}
.wstep__t{font-size:.85rem;font-weight:500;color:var(--mut);white-space:nowrap;
  display:block;overflow:hidden;text-overflow:ellipsis}
.wstep__s{font-size:.72rem;color:var(--mut2);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden}
.wline{flex:1 1 14px;height:2px;background:var(--n200);margin:0 9px;min-width:12px;border-radius:2px}
.wstep.done .wstep__n{background:var(--ok);border-color:var(--ok);color:#fff}
.wstep.done .wstep__t{color:var(--ink2)}
.wstep.cur .wstep__n{background:var(--b700);border-color:var(--b700);color:#fff;
  box-shadow:0 0 0 4px var(--b100)}
.wstep.cur .wstep__t{color:var(--b800);font-weight:600}
.wline.done{background:var(--ok)}
/* ══════════════════════════════════════════════════════════════
     شريطٌ طويل — ثماني خطواتٍ أو أكثر
   ══════════════════════════════════════════════════════════════
   «بعد الحفظ» مكتوبةٌ سبعَ مرّاتٍ تحت سبع خطوات.

       > **وجملةٌ تتكرّر سبعًا في شريطٍ واحد جملةٌ لا تُقرأ، ثم تدفع الشريطَ
       > إلى التمرير — فتُكلّف عرضًا ولا تعطي خبرًا.**

   فالوصفُ يبقى حيث يفيد: **الحالية** تقول «الآن»، و**المنجَزة** تقول ماذا
   أُنجز («٣ مناطق»)، **والقادمةُ يكفيها رقمُها واسمُها** — فحالها مقروءٌ من
   شكل دائرتها. ولا يُخفى شيءٌ يخصّ خطوةً بلغها المستخدم.
   The repeated caption costs width and carries no news. */
.wiz--long .wstep.off .wstep__s{display:none}
.wiz--long .wstep>span:last-child{max-width:124px}

/* ── والشاشةُ الضيقة تُبقي عنوانَ الخطوة الحالية ──
   كان يُخفى العنوانُ والوصفُ معًا فتبقى دوائرُ مرقَّمة، **وشريطٌ من أرقامٍ
   بلا أسماء شريطٌ يُعدّ ولا يُقرأ**.
   Numbered circles alone can be counted but not read. */
@media(max-width:860px){
  .wstep__t,.wstep__s{display:none}
  .wstep.cur .wstep__t{display:block}
  .wstep.cur>span:last-child{max-width:150px}
}

/* ── جدول تحرير الأسطر ── */
/* Declared column widths are only hints until the table is allowed the room to
   honour them. Without a minimum, the unit buttons win and the SKU column is
   crushed until the product name stacks one word per line.
   عروض الأعمدة المُعلَنة مجرد تلميحات ما لم يُمنح الجدول المتسع لاحترامها. وبلا
   حدٍّ أدنى تكسب أزرار الوحدات وتُسحق خانة الصنف حتى يتراكم اسم المنتج كلمةً في
   كل سطر. */
.ltab{width:100%;border-collapse:separate;border-spacing:0;font-size:.86rem;
  min-width:var(--tmin,900px);table-layout:fixed}
table.ltab th{background:var(--n25);font-size:.74rem;font-weight:600;color:var(--mut);
  padding:10px 12px;text-align:start;border-bottom:1px solid var(--line);white-space:nowrap}
table.ltab td{padding:10px;border-bottom:1px solid var(--line2);vertical-align:top}
table.ltab tbody tr:hover{background:var(--n25)}
table.ltab tbody tr:last-child td{border-bottom:none}
.ltab .in{padding:7px 10px;font-size:.85rem;box-shadow:none}
.ltab__no{width:34px;color:var(--mut2);font-family:var(--fn);font-size:.78rem;text-align:center}
.ltab__del{width:38px;text-align:center}
.ltab__del button{border:none;background:none;color:var(--mut2);cursor:pointer;padding:5px;
  border-radius:6px;line-height:0;transition:var(--t)}
.ltab__del button:hover{background:var(--da-l);color:var(--da)}
table.ltab tfoot td{padding:12px;background:var(--n25);border-top:1px solid var(--line)}
.lrow--new{animation:slideIn .22s cubic-bezier(.4,0,.2,1)}
@keyframes slideIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.lmeta{font-size:.72rem;color:var(--mut2);margin-top:2px;display:block}
.lerr{font-size:.72rem;color:var(--da);margin-top:2px;display:block}

/* ── بحث فوري ── */
.ta{position:relative}
.ta__in{width:100%;padding:8px 11px;border:1px solid var(--n300);border-radius:var(--r6);
  font-family:var(--fn);font-size:.86rem;background:var(--w);transition:var(--t)}
.ta__in:focus{outline:none;border-color:var(--b500);box-shadow:0 0 0 3px var(--b100)}
.ta__in.ok{border-color:var(--ok);background:var(--ok-l)}
.ta__list{position:absolute;z-index:60;inset-inline-start:0;top:calc(100% + 4px);
  min-width:340px;max-width:460px;background:var(--w);border:1px solid var(--line);
  border-radius:var(--r10);box-shadow:var(--s4);max-height:290px;overflow-y:auto;display:none}
.ta__list.on{display:block}
.ta__item{padding:9px 13px;cursor:pointer;border-bottom:1px solid var(--line2);
  display:flex;gap:11px;align-items:center;transition:background .1s}
.ta__item:last-child{border-bottom:none}
.ta__item:hover,.ta__item.sel{background:var(--b50)}
.ta__sku{font-family:var(--fn);font-weight:600;font-size:.82rem;color:var(--b700);
  min-width:104px;flex-shrink:0}
.ta__nm{flex:1;font-size:.83rem;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ta__ty{font-size:.72rem;color:var(--mut2);flex-shrink:0}
.ta__none{padding:16px;text-align:center;color:var(--mut2);font-size:.83rem}

/* ── مجموعة وحدات الصنف نفسه ── */
.ug{display:inline-flex;background:var(--n100);padding:2px;border-radius:var(--r6);gap:2px}
.ug button{border:none;background:none;padding:4px 10px;border-radius:5px;font-size:.76rem;
  font-weight:600;color:var(--mut);cursor:pointer;transition:var(--t);white-space:nowrap}
.ug button.on{background:var(--w);color:var(--b700);box-shadow:var(--s1)}
.ustatic{font-size:.78rem;color:var(--mut);padding:0 4px}

/* ── منطقة الرفع ── */
.drop{display:block;width:100%;box-sizing:border-box;
  border:1.5px dashed var(--n300);border-radius:var(--r10);background:var(--n25);
  padding:22px;text-align:center;transition:var(--t);cursor:pointer}
.drop:hover,.drop.over{border-color:var(--b500);background:var(--b50)}
.drop input[type=file]{display:none}
.drop__i{width:38px;height:38px;border-radius:var(--r8);background:var(--b100);color:var(--b700);
  display:grid;place-items:center;margin:0 auto 10px}
.drop__i svg{width:19px;height:19px}

/* ── قائمة المرفقات ── */
.att{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1px solid var(--line);
  border-radius:var(--r8);background:var(--w);transition:var(--t)}
.att:hover{border-color:var(--n300);box-shadow:var(--s2)}
.att__ic{width:38px;height:38px;border-radius:var(--r6);background:var(--b50);color:var(--b700);
  display:grid;place-items:center;font-family:var(--fn);font-size:.66rem;font-weight:700;flex-shrink:0}
.att__t{flex:1;min-width:0}
/* ── و`text-overflow` على صندوقٍ سطريّ لا يفعل شيئًا ──
   بلاغ محمد ٢٠٢٦-٠٨-١٥: «انظر للصورة التي بها اسم الملف يخرج».
   كانت الثلاثةُ مكتوبةً هنا — `overflow` و`text-overflow` و`white-space` —
   وكلُّها **صحيحةٌ ولا أثر لها**: `.att__n` وسمُ `<a>`، وهو `display:inline`،
   والقصُّ لا يقع إلا على صندوقٍ كتليّ. فكان الاسمُ الطويل يخرج من البطاقة
   ولا يشتكي شيء.

   > **وقاعدةٌ مكتوبةٌ ولا تعمل أسوأ من قاعدةٍ ناقصة: الناقصةُ تُكتب،
   > والمكتوبةُ تُقرأ فيُظنّ الأمرُ محلولًا.**

   Three correct declarations with no effect: ellipsis needs a block box. */
.att__n{font-size:.85rem;font-weight:500;display:block;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att__m{font-size:.73rem;color:var(--mut2);display:block;
  overflow-wrap:anywhere}

/* ── بطاقات خيار مضغوطة ── */
/* ── و`auto-fit` وحده لا يكفي داخل عمودٍ ضيّق ──
   فالشبكةُ تأخذ عرضَ حاويتها، وحاويتُها `.fl` داخل `.frow` قد تكون ثلث
   السطر — فتصير ٢١٠ بكسل عمودًا واحدًا، وتنزل ثلاثةَ عشرَ نوعَ منتجٍ في
   عمودٍ واحدٍ طويل يُمرَّر ولا يُقرأ. فالحاويةُ تُفرَد على السطر كلِّه
   (`_picks.html` يضع `grid-column:1/-1` — **و`flex` وحدَها كانت لا تقول شيئًا
   لأبٍ شبكةٍ، فبقيت البطاقاتُ في ثلث السطر وبجانبها بياضٌ يُقرأ تصميمًا**)
   والبطاقةُ تُصغَّر إلى ما يسع اسمًا.
   The grid takes its container's width, and a third-of-a-row container turns
   210px into a single column — thirteen product types down one long column
   that is scrolled rather than read. */
.pick{display:grid;gap:9px;
  grid-template-columns:repeat(auto-fill,minmax(168px,1fr))}
.pick label{position:relative;display:flex;gap:10px;align-items:flex-start;padding:10px 13px;
  border:1.5px solid var(--n300);border-radius:var(--r10);background:var(--w);cursor:pointer;
  transition:var(--t);box-shadow:var(--s1)}
.pick label:hover{border-color:var(--b400);box-shadow:var(--s3)}
.pick input{position:absolute;opacity:0;pointer-events:none}
.pick__i{width:36px;height:36px;border-radius:var(--r8);background:var(--n50);color:var(--mut);
  display:grid;place-items:center;flex-shrink:0;transition:var(--t)}
.pick__i svg{width:18px;height:18px}
/* ── والعنوانُ فوق وصفه لا بجانبه ──
   كانا `span` بلا `display`، فيسيلان سطرًا واحدًا: «النقل عن طريق العميل
   يتولّى العميل إيصال البضاعة» — و`margin-top` على سطريٍّ لا يفعل شيئًا.
   والإصلاحُ في المكوّن يصلح كل شاشةٍ تستعمله دفعةً.
   Both were plain inline spans, so the title and its description ran into one
   line and the margin did nothing. Fixed in the component, so every screen
   that uses it is fixed at once. */
.pick__t{display:block;font-weight:600;font-size:.88rem;line-height:1.5}
.pick__d{display:block;font-size:.76rem;color:var(--mut);line-height:1.6;margin-top:2px}
.pick label:has(input:checked){border-color:var(--b600);background:var(--b50);
  box-shadow:0 0 0 1px var(--b600)}
.pick label:has(input:checked) .pick__i{background:var(--b600);color:#fff}

/* ── لوحة تُكشف شرطيًا ── */
/* ── مربّعٌ ونصُّه سطرٌ واحد يُنقر كلُّه ──
   طلب محمد ٢٠٢٦-٠٨-١٥: أكثرُ من مهمّةٍ للشخص الواحد. وستّةُ مربّعاتٍ بلا
   `<label>` يلفّ نصَّها **تُنقر على المربّع وحده** — وهو ثلاثةَ عشرَ بكسلًا
   في شاشةٍ تُملأ بالإبهام. ووسمُ `label` يجعل النصَّ جزءًا من الهدف.

   > **وهدفُ نقرٍ أصغرُ من الإصبع هدفٌ يُخطأ، والخطأُ هنا يُلغي اختيارًا
   > صحيحًا بلا أن يُقال شيء.**

   A checkbox with no label wrapping its text is a thirteen-pixel target. */
.ckl{display:inline-flex;align-items:center;gap:7px;cursor:pointer;
  font-size:.83rem;color:var(--ink2);padding:4px 0}
.ckl input{width:16px;height:16px;flex-shrink:0;cursor:pointer;accent-color:var(--b700)}

.reveal{overflow:hidden;max-height:0;opacity:0;transition:max-height .28s cubic-bezier(.4,0,.2,1),
  opacity .2s,margin .28s}
.reveal.on{max-height:700px;opacity:1;margin-top:16px}

/* ══════════════════════════════════════════════════════════════════
     فتراتُ اليوم — «من» و«إلى» في سطر، وما شئت من الأسطر
   ══════════════════════════════════════════════════════════════════
   ── ولماذا سطرٌ لكل فترة لا سطرُ نصٍّ واحد ──
   كان اليومُ يحمل «٠٨:٠٠-١٢:٠٠، ١٣:٠٠-١٧:٠٠» في خانةٍ واحدة. **وخانةٌ نصّية
   لا يحرسها المتصفّح**: يُكتب فيها «٨-١٢» فلا يُعلم أنها خطأ حتى يُضغط حفظ.
   و`type=time` يُرفض فيه ما ليس ساعةً قبل أن يُرسَل شيء.
   A text box is not guarded by the browser; `type=time` refuses before send.

   ── وعرضُ الخانة يُثبَّت ──
   فخانتا وقتٍ تنموان بعرض الخليّة تصيران حقلين ضخمين لأربعة أرقام، وتختلف
   عرضًا بين متصفّحٍ يرسم أيقونة ساعةٍ وآخر لا يرسمها. Fixed width, so two
   browsers draw one row. */
.slots{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.slot{display:flex;align-items:center;gap:6px}
.slot__t{width:112px;min-height:36px;padding:6px 8px;text-align:center;
  font-variant-numeric:tabular-nums;direction:ltr}
/* ── و«من» و«إلى» تُقرآن بالعين ──
   كانتا `aria-label` فحسب، فبدت الخانتان متطابقتين بينهما شرطة ولم يُعرف
   أيُّهما البداية. **وتسميةٌ لا يقرؤها إلا قارئُ الشاشة ليست تسمية.**
   A label only a screen reader can read is not a label.
   وعرضٌ ثابت يجعل الخانات تصطفّ عموديًّا بين الأسطر — فسطران يزيغ أحدهما
   عن الآخر يُقرآن حقلين مختلفين. Fixed width so the boxes line up. */
.slot__l{flex:none;width:26px;text-align:center;color:var(--mut);
  font-size:.76rem;user-select:none}

/* ══════════════════════════════════════════════════════════════════
     منتقي الوقت — ثلاثُ قوائم تُقرأ خانةً واحدة
   ══════════════════════════════════════════════════════════════════
   قرار محمد ٢٠٢٦-٠٨-١٧: «اجعل اختيار الساعة والدقيقة وكذلك AM أو PM كلّها
   في قوائم منسدلة بدلًا من الإدخال اليدوي.»

   ── وثلاثةٌ تُرسم واحدةً ──
   **وثلاثُ قوائمَ متباعدةٍ تُقرأ ثلاثةَ أسئلة**، والسؤالُ واحد: متى؟ فتُجمع
   في إطارٍ واحد بحدٍّ واحد، وبينها نقطتان كما تُكتب الساعةُ على الورق.
   Three controls, one question, one frame.

   واتّجاهُ الإطار `ltr` لأن «٠٨:٣٠ ص» تُقرأ هكذا في كل واجهةٍ عربية —
   والوقتُ لا يُقلب بقلب الصفحة. Time reads left-to-right in Arabic too. */
.tpick{position:relative;display:inline-flex;align-items:center;gap:0;
  direction:ltr;border:1.5px solid var(--n200);border-radius:10px;
  background:var(--n25);padding:1px;padding-inline-end:22px;min-height:38px;
  transition:border-color .15s,background .15s,box-shadow .15s}
/* ── وسهمٌ واحدٌ للإطار لا ثلاثة ──
   **وثلاثةُ أسهمٍ متجاورة تقول ثلاثةَ حقول**، والحقلُ واحد: متى؟ فيُرسم
   سهمٌ واحدٌ يقول «هذا يُفتح»، وكلُّ قائمةٍ تُفتح بنقرتها.
   وبلا سهمٍ أصلًا **يُقرأ الإطارُ نصًّا لا منتقيًا** فلا يُنقر.
   One arrow for one question; three would read as three fields. */
.tpick::after{content:"";position:absolute;inset-inline-end:8px;top:50%;
  width:12px;height:12px;margin-top:-6px;pointer-events:none;opacity:.75;
  background:no-repeat center/12px url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%235B6B7F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='m3 5.5 4 4 4-4'/></svg>")}
.tpick:hover{border-color:var(--n300);background:var(--w)}
.tpick:focus-within{border-color:var(--b500);background:var(--w);
  box-shadow:0 0 0 3.5px rgba(30,115,188,.13)}
/* ══ والمحدِّدُ `select.tpick__s` لا `.tpick__s` ══
   ── وقاعدةٌ تخسر بالأولوية قاعدةٌ غير موجودة ──
   كُتبت أوّلَ مرّة `.tpick__s` — وزنُها صنفٌ واحد، و`select.in` أعلاه عنصرٌ
   وصنف فتغلبها. فبقيت على القوائم حشوةُ `padding-inline-end:38px` وصورةُ
   السهم من `select.in`، **فانضغط النصُّ في ستّة بكسلات فاختفى**: ثلاثةُ
   أسهمٍ على الشاشة بلا رقمٍ ولا كلمة — وهو بعينه ما رآه محمد.

       > **وقاعدةٌ تخسر بالأولوية قاعدةٌ تفشل بأهدأ صورة: بصمت، وحيث
       > تهمّ وحدها.**

   وهو الدرسُ المكتوبُ فوق `table.fgrid` في هذا الملفّ نفسِه — كُتب مرّةً
   ونُسي مرّة. A rule that loses on specificity is a rule that does not exist.

   ── والقائمةُ داخل الإطار بلا إطارٍ لها ولا سهم ──
   **وحدٌّ داخل حدٍّ يُقرأ حقلين في حقل**، وثلاثةُ أسهمٍ في إطارٍ واحد تقول
   ثلاثةَ حقول. */
select.tpick__s{width:auto;min-width:0;border:none;background:none;
  background-image:none;box-shadow:none;min-height:32px;
  padding:4px 2px;padding-inline-start:2px;padding-inline-end:2px;
  padding-block:4px;text-align:center;text-align-last:center;
  text-overflow:clip;font-variant-numeric:tabular-nums;cursor:pointer;
  appearance:none;-webkit-appearance:none;-moz-appearance:none}
select.tpick__s:hover:not(:disabled),select.tpick__s:focus{border:none;
  background:none;background-image:none;box-shadow:none;outline:none}
select.tpick__s--h,select.tpick__s--m{width:42px}
select.tpick__s--p{width:52px;color:var(--mut)}
/* ── والنقطتان تقولان إنّ الرقمين وقتٌ واحد ──
   **ورقمان متجاوران بلا فاصلٍ يُقرآن رقمًا واحدًا** — «٠٨٣٠». */
.tpick__c{flex:none;color:var(--mut2);user-select:none;
  font-size:.82rem;margin:0 -1px}

/* ══════════════════════════════════════════════════════════════════
     شروطُ كلمة المرور — تتلوّن عند تحقّقها
   ══════════════════════════════════════════════════════════════════
   ── والفارغُ ليس خطأً ──
   فخانةٌ حمراء قبل أن يُكتب فيها حرف تستقبل صاحبها باتّهام. **ومن لم يبدأ لم
   يُخطئ بعد** — فتحمرّ بعد أول حرفٍ لا قبله.
   An empty field painted red greets its user with an accusation. */
.pw__l{list-style:none;margin:8px 0 0;padding:0;display:flex;
  flex-wrap:wrap;gap:4px 16px}
.pw__l li{display:flex;align-items:center;gap:6px;font-size:.78rem;
  color:var(--mut);transition:color .15s}
.pw__i{width:14px;height:14px;flex:none;border-radius:50%;
  border:1.5px solid var(--n300);position:relative;transition:.15s}
/* ── وعلامةٌ لا لونٌ وحده ──
   فنحوَ رجلٍ من اثني عشر لا يفرّق الأخضر من الرمادي. **وشرطٌ يُقرأ باللون
   وحده شرطٌ لا يقرؤه بعضُ الناس.**
   One man in twelve does not separate green from grey. */
.pw__l li.ok{color:var(--ok)}
.pw__l li.ok .pw__i{background:var(--ok);border-color:var(--ok)}
.pw__l li.ok .pw__i::after{content:"";position:absolute;inset-inline-start:4px;
  top:1px;width:4px;height:7px;border:solid #fff;border-width:0 1.5px 1.5px 0;
  transform:rotate(45deg)}
/* ══════════════════════════════════════════════════════════════════
     قائمةُ تأشيرٍ بخيار «تحديد الكل»
   ══════════════════════════════════════════════════════════════════
   ── وشبكةٌ لا سطرٌ واحد ──
   نصُّ محمد: «لا ينبغي أن يكون بهذا الشكل — أي أكثر من عنصر في سطر واحد».
   فعناصرُ متلاصقةٌ في سطرٍ واحد تُقرأ عنصرًا واحدًا طويلًا، **ولا يُعرف أين
   ينتهي الخيارُ ويبدأ الذي يليه**. فكلٌّ في صفٍّ يملأ عرضه.
   Items packed into one line read as one long item. */
.chk{border:1.5px solid var(--n200);border-radius:10px;background:var(--n25);
  overflow:hidden}
.chk__all{display:flex;align-items:center;gap:9px;padding:9px 13px;
  border-bottom:1px solid var(--line);background:var(--w);
  font-weight:600;font-size:.84rem;cursor:pointer}
/* ── ولا يُقصّ اسمُ نطاقٍ يُؤشَّر عليه ──
   كانت القائمةُ تمدّ نفسَها بأطول سطرٍ فيها فيظهر شريطُ تمريرٍ أفقيّ،
   **ويُقرأ «الأمور التعاقدية والتعديلا…»** — فيُؤشَّر على ما لم يُقرأ.
   A clipped label is a permission ticked without being read. */
.chk__l{display:flex;flex-direction:column;max-height:250px;
  overflow-y:auto;overflow-x:hidden}
.chk__i{display:flex;align-items:center;gap:9px;padding:8px 13px;
  font-size:.86rem;cursor:pointer;transition:background .12s}
.chk__i:hover{background:var(--w)}
.chk__i + .chk__i{border-top:1px solid var(--line)}
.chk input{flex:none;margin:0}
.chk__i span{overflow-wrap:anywhere;line-height:1.45}

.pw__m{color:var(--da)}
.pw__m.ok{color:var(--ok)}
/* ── وزرُّ الحذف يُرى ولا يُزاحم ──
   فزرٌّ بلون الخطر دائمًا يجعل صفَّ سبعة أيامٍ أربعةَ عشرَ نداءً أحمر. يبقى
   رماديًّا حتى يُقصد. Red only when reached for. */
.slot__x{width:28px;height:28px;flex:none;display:grid;place-items:center;
  border:none;background:none;border-radius:8px;cursor:pointer;
  color:var(--mut2);transition:background .15s,color .15s}
.slot__x svg{width:14px;height:14px}
.slot__x:hover{background:var(--da-l);color:var(--da)}
.slot__add{margin-top:7px}

/* سطر مفتاح/قيمة — بشرح تحت المفتاح عند الحاجة */
.kv__h{display:block;font-style:normal;font-size:.7rem;color:var(--n400);
  line-height:1.35;margin-top:2px;font-weight:400}
.kv--tot{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  margin:6px 0;background:var(--n25);padding-inline:8px;
  border-radius:8px}

/* One action bar, not two.
/* One action bar, not two. It sits inside the card's own border — the old
   negative margins bled it edge-to-edge into a floating white slab.
   شريط إجراءات واحد لا اثنان. يقع داخل حدّ البطاقة نفسه — والهوامش السالبة
   القديمة كانت تُسيله من طرف الشاشة إلى طرفها كلوح أبيض سابح. */
.sticky-bar{position:sticky;bottom:0;z-index:20;
  background:rgba(255,255,255,.92);backdrop-filter:blur(14px);
  border:1px solid var(--line);border-radius:var(--r12);
  box-shadow:0 -2px 14px rgba(15,32,52,.05);
  padding:13px 18px;margin-top:16px;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sticky-bar .kpi{display:flex;flex-direction:column;line-height:1.25}
.sticky-bar .kpi span{font-size:.7rem;color:var(--n500)}
.sticky-bar .kpi b{font-size:1.12rem;font-family:Inter,sans-serif;font-weight:700;
  font-variant-numeric:tabular-nums;color:var(--ink)}
.sticky-bar .kpi--m b{color:var(--b600)}
.sticky-bar .div{width:1px;align-self:stretch;background:var(--line2);margin:0 4px}
@media(max-width:720px){.sticky-bar{padding:12px}.sticky-bar .btn{flex:1}}


/* ══════════════════════════════════════════════════════════════
   Searchable select · fixes
   قائمة قابلة للبحث · إصلاحات
   ══════════════════════════════════════════════════════════════ */
.cmb{position:relative}
/* ══════════════════════════════════════════════════════════════
     والحقلُ المخفيُّ لا يُخفى بـ display:none — بلاغ محمد ٢٠٢٦-٠٨-٢٩
   ══════════════════════════════════════════════════════════════
   > «اخترت مجموعة ولكن زر الحفظ لم يعمل.»

   كان المنتقي يضع القائمةَ الأصليّة داخل `display:none`. **وعنصرٌ إلزاميٌّ
   فارغٌ لا يستطيع المتصفّحُ أن يُركّز عليه عنصرٌ يمنع الإرسالَ صامتًا**:
   يقول كروم في سجلّ المطوّر «not focusable» ولا يقول للإنسان شيئًا. فيُضغط
   «حفظ» فلا يقع شيء — لا حفظٌ ولا رسالةٌ ولا حتى وميض.

       > **وزرٌّ لا يفعل شيئًا ولا يقول لماذا أسوأُ من زرٍّ يردّ** — فالردُّ
       > يُقرأ ويُصلَح، والصمتُ يُقرأ عطلًا في المنصّة كلِّها.

   فتبقى القائمةُ في التدفّق شفّافةً بلا التقاطِ نقرة: يراها المتصفّحُ
   ويُركّز عليها ويعرض فقاعتَه فوق المُشغّل، ولا يراها الإنسان.
   A required control inside display:none blocks submission in silence. */
.cmb__native,.cmb__hold{position:absolute;inset-inline-start:0;top:0;
  width:100%;height:100%;opacity:0;pointer-events:none;
  border:0;padding:0;margin:0;background:transparent}
/* والمُضمَّنُ يُخفى في القالب لا بعد أن تعمل الجافاسكربت، **ووميضُ حقلٍ
   يظهر ثم يختفي وميضٌ يُقرأ ارتجافًا في الشاشة**. */
.cmb__hold>select{width:100%;height:100%;opacity:0}
/* The body line-height is 1.85 for Almarai; .in overrides it to 1.45 and the
   combo did not, so a searchable list stood six pixels taller than the input
   beside it. Every control in a row must be measured the same way.
   ارتفاع سطر الجسم ١٫٨٥ لخط المراعي، والحقل يضبطه على ١٫٤٥ والقائمة لا تضبطه —
   فكانت القائمة القابلة للبحث أطول بستة بكسلات من الحقل المجاور. وكل عنصر في
   السطر يجب أن يُقاس بالمسطرة نفسها. */
/* The trigger IS an input, so vertical centring is the browser's problem and it
   solves it with the font's metrics. Nothing here computes a line height.
   المُشغّل حقل إدخال، فالتوسيط العمودي شأن المتصفح وهو يحلّه بمقاييس الخط. ولا
   شيء هنا يحسب ارتفاع سطر. */
.cmb__in{cursor:pointer;padding-inline-end:36px;text-overflow:ellipsis}
.cmb__in:read-only{background:var(--n25)}
.cmb__in:hover{border-color:var(--n300);background:var(--w)}
.cmb__in.on{border-color:var(--b500);background:var(--w);
  box-shadow:0 0 0 3.5px rgba(30,115,188,.13);outline:none}
.cmb__ar{position:absolute;inset-inline-end:14px;top:50%;transform:translateY(-50%);
  width:14px;height:14px;color:var(--mut);pointer-events:none}
/* ── تُوضع على الشاشة لا داخل خليّتها ──
   Fixed, so `.tbl-w{overflow:auto}` cannot clip it and answer the overflow
   with a scrollbar inside the table. The trigger's rectangle is measured at
   open time and on every scroll while it is open (see base.html · `place`).
   ثابتةٌ على الشاشة، فلا يقصّها `.tbl-w{overflow:auto}` ولا يردّ المتصفّح على
   الفائض بشريط تمريرٍ داخل الجدول. */
.cmb__pop{position:fixed;z-index:120;inset-inline:auto;top:0;
  background:var(--w);border:1px solid var(--line);border-radius:var(--r10);
  box-shadow:var(--s4);display:none;overflow:hidden}
.cmb__pop.on{display:block}
.cmb__search{padding:10px;border-bottom:1px solid var(--line2);background:var(--n25)}
.cmb__search input{width:100%;padding:8px 12px;border:1.5px solid var(--n200);border-radius:8px;
  font-size:.85rem;background:var(--w)}
.cmb__search input:focus{outline:none;border-color:var(--b500)}
.cmb__opts{max-height:250px;overflow-y:auto}
/* ══════════════════════════════════════════════════════════════
     وعَلَمُ الدولة صورةٌ لا محرف — بلاغ محمد ٢٠٢٦-٠٨-٢٩
   ══════════════════════════════════════════════════════════════
   > «حذفتَ الأعلام وأضفتَ مكانها رمز الدولة! من طلب منك ذلك؟»

   ولم يُحذف عَلَم: **وويندوز لا يرسم أعلامَ الدول** — فخطُّ
   `Segoe UI Emoji` لا يحملها، فيسقط المتصفّحُ إلى الحرفين اللذين بُني
   منهما العَلَم فيُقرآن رمزًا لاتينيًّا في وسط العربية.

       > **ومكوّنٌ بصريٌّ يُتحقَّق منه على جهازٍ غيرِ جهاز صاحبه مكوّنٌ
       > تُحُقِّق منه لغير من يستعمله.**

   فصارت صورًا مقتطَعةً من خطّ Noto الرسميّ في `img/flags/` — ٨٧ كيلوبايت
   للاثنتين والثلاثين، ولا يُحمَّل إلا ما يُعرَض. */
.flg{display:inline-block;width:22px;height:16px;vertical-align:-3px;
  margin-inline-end:9px;background-size:contain;background-repeat:no-repeat;
  background-position:center;border-radius:2px}
.cmb__in--flg{background-repeat:no-repeat}
.cmb__opt{padding:10px 14px;cursor:pointer;font-size:.86rem;border-bottom:1px solid var(--line2);
  transition:background .1s}
.cmb__opt:last-child{border-bottom:none}
.cmb__opt:hover,.cmb__opt.sel{background:var(--b50);color:var(--b800)}
.cmb__opt.act{background:var(--b100);font-weight:600}
/* ── والمتعدّدُ يُؤشَّر في قائمته ──
   وحقلٌ يقبل التعدّد ولا يُظهر أنه يقبله حقلٌ يُملأ بواحد. */
.cmb__tick{display:inline-block;width:16px;color:var(--b600,#2563EB);
  font-weight:700;margin-inline-end:6px}
.cmb__bulk{display:flex;gap:8px;margin-top:8px}
.cmb__bulk button{flex:1;padding:5px 8px;font-size:.78rem;cursor:pointer;
  border:1px solid var(--n200);border-radius:7px;background:#fff;
  color:var(--mut);font-family:inherit}
.cmb__bulk button:hover{background:var(--b50);color:var(--b800);
  border-color:var(--b500)}
.cmb__none{padding:18px;text-align:center;color:var(--mut2);font-size:.84rem}

/* خلية الصنف: المحتوى من الأعلى دائمًا حتى لا يرتفع الحقل عن السطر */
/* Every control starts on one line at the top; the description hangs below it
   without dragging its neighbours down. Centring cells in a row that one
   description made tall pushes every other field below the line it belongs to.
   كل حقل يبدأ على سطر واحد في الأعلى، والوصف يتدلّى تحته بلا أن يجرّ جيرانه.
   فتوسيط الخلايا في سطر أطاله وصفٌ واحد يدفع بقية الحقول تحت السطر الذي تنتمي
   إليه. */
table.ltab td.mid{line-height:38px}
.ltab .ta__in{min-height:38px}
.ltab .in{min-height:38px;padding:7px 11px}
.ltab .ug button{padding:7px 10px}

/* منطقة الرفع — والتخطيط أعلاه مع بقية تعريفها، لا هنا:
   تعريفان لصنفٍ واحد بينهما مئةُ سطر يعني أن من يُعدّل أحدَهما لا يرى الآخر.
   Two definitions of one class, a hundred lines apart, means whoever edits
   one does not see the other. */
.drop *{pointer-events:none}
.drop input[type=file]{display:none!important}
.uphint{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;
  margin-top:6px;font-size:.75rem;color:var(--mut2)}
.uphint b{color:var(--ink2);font-weight:600}


/* ── فرق الاستلام ── */
.dlt{font-family:Inter,sans-serif;font-variant-numeric:tabular-nums;font-weight:600;
  font-size:.86rem;color:var(--n300)}
.dlt.up{color:var(--ok)}
.dlt.dn{color:var(--da)}
.in.off,select.in:disabled,input.in:disabled{background:var(--n50);color:var(--n400);
  cursor:not-allowed;border-color:var(--line2);box-shadow:none}


/* ── مؤشّر التصفية الحيّة ── */
.fltbusy{position:fixed;bottom:26px;inset-inline-end:26px;z-index:40;
  display:flex;align-items:center;gap:9px;padding:9px 15px;
  background:var(--b900);color:#fff;border-radius:999px;font-size:.78rem;
  box-shadow:var(--s5)}
.fltbusy[hidden]{display:none}
.spin{width:13px;height:13px;border:2px solid rgba(255,255,255,.3);
  border-top-color:#fff;border-radius:50%;animation:sp .6s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.nores{padding:34px 20px}


/* ── قائمة الحساب ── */
.umenu{position:relative}
.umenu__pop{position:absolute;bottom:calc(100% + 8px);inset-inline-start:0;
  min-width:236px;background:var(--w);border:1px solid var(--line);
  border-radius:var(--r12);box-shadow:var(--s5);padding:6px;z-index:60;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .15s,transform .15s,visibility .15s}
.umenu__pop.on{opacity:1;visibility:visible;transform:none}
.umenu__head{padding:10px 11px 11px;border-bottom:1px solid var(--line2);margin-bottom:5px}
.umenu__i{display:flex;align-items:center;gap:9px;width:100%;
  padding:9px 11px;border-radius:9px;border:none;background:none;
  font:inherit;font-size:.84rem;color:var(--ink);cursor:pointer;text-align:start;
  transition:background .12s}
.umenu__i svg{width:16px;height:16px;color:var(--mut2);flex-shrink:0}
.umenu__i:hover{background:var(--n50)}
.umenu__i--da{color:var(--da)}
.umenu__i--da svg{color:var(--da)}
.umenu__i--da:hover{background:var(--da-l)}
.umenu__sep{height:1px;background:var(--line2);margin:5px 0}


/* ── فلاتر التقارير · اختيار متعدد للمساحات ── */
.rfl .fl label{font-size:.76rem;color:var(--n500);margin-bottom:5px}
.msel__top{display:flex;align-items:center;gap:9px;margin-bottom:8px}
.msel__n{font-size:.72rem;color:var(--b700);background:var(--b50);
  padding:2px 9px;border-radius:999px;font-family:Inter,sans-serif;font-weight:600}
.msel__n:empty{display:none}
.msel__box{display:grid;gap:6px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  max-height:212px;overflow-y:auto;padding:9px;background:var(--n25);
  border:1px solid var(--line);border-radius:10px}
.msel__i{display:flex;align-items:flex-start;gap:9px;padding:8px 10px;
  background:var(--w);border:1px solid var(--line2);border-radius:9px;
  cursor:pointer;transition:border-color .12s,background .12s}
.msel__i:hover{border-color:var(--b300,#9CC5E8)}
.msel__i:has(input:checked){border-color:var(--b500);background:var(--b50)}
.msel__i input{margin-top:2px;accent-color:var(--b600);width:15px;height:15px;flex-shrink:0}
.msel__t{min-width:0;line-height:1.35}
.msel__t b{font-size:.82rem;display:block}
.msel__s{font-size:.71rem;color:var(--n400);display:block;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


/* ── مسطرة واحدة لكل عناصر الإدخال ──
   Anything that looks like a field must measure like one, whatever tag it is.
   كل ما يبدو حقلًا يجب أن يُقاس كحقل، أيًّا كان وسمه. */
.in,select.in,textarea.in,.ltab .in{box-sizing:border-box}
/* ── ولا تعريفَ ثانٍ لـ`select.in` ──
   كان هنا تعريفٌ ثانٍ بحشوةٍ وسهمٍ آخرين، فغلب بعضُه بعضًا: الحشوةُ من هذا
   والسهمُ من ذاك. وصنفٌ يُعرَّف مرّتين في ورقةٍ واحدة ليس تهذيبًا بل تصادمًا
   — يُصلحه من يقرأ الأوّل فلا يتغيّر شيء.
   A second definition of the same class is not a refinement, it is a
   collision: whoever fixes the first sees nothing change. */
select.in{line-height:1.45;background-size:15px}


/* الحقول متعددة الأسطر وحدها تنمو */
select.in[multiple]{height:auto}
select.in{min-height:42px;height:auto}
.ltab .in,.ltab .ta__in{min-height:38px;padding:7px 11px}
.ltab textarea.in{height:auto}


/* ── لوحة الخدمات المنجَزة ── */
.svc{display:grid;gap:11px;grid-template-columns:repeat(auto-fill,minmax(268px,1fr))}
.svc__i{border:1.5px solid var(--line);border-radius:var(--r10);padding:13px 14px;
  background:var(--w);transition:border-color .15s,box-shadow .15s}
.svc__i:has(input:not(:placeholder-shown)){border-color:var(--b400,#66A6DA);
  box-shadow:0 0 0 3px rgba(30,115,188,.08)}
.svc__i--m{background:var(--b50)}
.svc__h{margin-bottom:9px}
.svc__n{font-weight:600;font-size:.855rem;display:block;line-height:1.4}
.svc__d{font-size:.72rem;color:var(--n400);display:block;margin-top:2px;line-height:1.4}
.svc__b{display:flex;align-items:center;gap:9px}
.svc__b .in{flex:1}
.svc__u{font-size:.78rem;color:var(--n500);white-space:nowrap;min-width:52px}
.svc__f{display:flex;align-items:center;gap:4px;margin-top:8px;
  padding-top:8px;border-top:1px solid var(--line2)}
.svc__t{font-family:Inter,sans-serif;font-weight:600;color:var(--b700);
  font-variant-numeric:tabular-nums}
.svc__sum{display:flex;align-items:center;gap:9px;margin-top:16px;padding:13px 16px;
  background:var(--n25);border:1px solid var(--line);border-radius:var(--r10)}
.svc__sum b{font-size:1.15rem;font-family:Inter,sans-serif;font-weight:700;
  font-variant-numeric:tabular-nums;color:var(--b800)}


/* ── سطر الوصف تحت رقم الصنف ──
   One line, truncated, with the full text on hover. A name that wraps turns a
   38px row into a 120px one and knocks every other cell out of alignment.
   سطر واحد مقطوع بنقاط، والنص الكامل عند المرور. فالاسم الذي ينكسر يحوّل سطرًا
   ارتفاعه ٣٨ إلى ١٢٠، ويُخرج بقية الخلايا عن محاذاتها. */
.lmeta{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.ltab .ta{min-width:0}
.ltab td>*{min-width:0}
.ltab .ug{display:inline-flex;flex-shrink:0}
.ltab .ug button{white-space:nowrap}
.ustatic{white-space:nowrap;color:var(--n500);font-size:.78rem}


/* كل عناصر السطر بارتفاع واحد، فتتحاذى قممها */
.ltab .in,.ltab .ta__in,.ltab select.in{height:auto;min-height:38px;padding:7px 11px}
.ltab .ustatic{min-height:38px;display:inline-flex;align-items:center}
.ltab td>.fx{align-items:flex-start}
.ltab .lmeta,.ltab .lerr{margin-top:4px}

/* ── عمود الوحدة ──
   The unit selector fills its own column and shares the width evenly between
   its options, so no label is ever clipped by the field next door.
   مُنتقي الوحدة يملأ عموده ويقسّم العرض بالتساوي بين خياراته، فلا يُقتطع اسم
   وحدة بحقلٍ مجاور أبدًا. */
.ltab .ug{display:flex;width:100%;min-height:38px;box-sizing:border-box}
.ltab .ug button{flex:1;min-width:0;min-height:34px;padding:5px 6px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


/* ── ملخّص أخطاء النموذج ── */
.ferr__l{margin:7px 0 0;padding-inline-start:18px;font-size:.84rem;line-height:1.75;
  overflow-wrap:anywhere}
.ferr__l li{margin-bottom:2px}
.ferr__f{font-weight:600}


/* قائمة مقفولة — تبدو كما هي: غير قابلة للتغيير */
.cmb--off .cmb__in{background:var(--n50);color:var(--n500);cursor:not-allowed;
  border-color:var(--line2)}
.cmb--off .cmb__ar{opacity:.35}


/* ── صفوف الحقول في الجداول ───────────────────────────────────────────
   ONE RULE, everywhere: in a row of form controls, every control starts at the
   same top edge. Notes, hints and errors hang BELOW their control and never
   push it — a field is not taller because someone wrote a word under it.

   Cells that hold plain text instead of a control get a line-height equal to
   the control height, so their text sits level with the text inside the
   fields beside them rather than clinging to the top of the cell.

   قاعدة واحدة في كل مكان: في صفٍّ من الحقول، تبدأ كل الحقول من الحافة العليا
   نفسها. والملاحظات والتلميحات والأخطاء تتدلّى تحت حقلها ولا تدفعه — فالحقل لا
   يعلو لأن أحدًا كتب كلمة تحته.

   والخلايا التي تحمل نصًّا لا حقلًا تأخذ ارتفاع سطر مساويًا لارتفاع الحقل،
   فيستوي نصّها مع النص داخل الحقول المجاورة بدل أن يتعلّق بأعلى الخلية.
   ------------------------------------------------------------------------ */
/* `table.fgrid`, not `.fgrid` — the base rule is `table.tb td`, which outranks
   a bare class selector. A correct rule that loses on specificity is a rule
   that does not exist, and it fails in the quietest possible way: silently,
   and only where it matters.
   `table.fgrid` لا `.fgrid` — فالقاعدة الأساس `table.tb td` وهي أقوى من محدِّد
   صنفٍ مجرَّد. والقاعدة الصحيحة التي تخسر بالأولوية قاعدةٌ غير موجودة، وتفشل
   بأهدأ صورة ممكنة: بصمت، وحيث تهمّ وحدها. */
table.fgrid td{vertical-align:top;padding:10px}
table.fgrid td>.in,table.fgrid td>select.in,table.fgrid td>textarea.in{
  width:100%;min-width:0}
table.fgrid .lmeta,table.fgrid .lerr,table.fgrid .hint{
  display:block;margin-top:5px;line-height:1.4}

/* نصٌّ بجوار حقول — يُوسَّط على ارتفاع الحقل لا على أعلى الخلية */
table.fgrid td.mid,table.fgrid td.num,table.fgrid td.e{line-height:42px}
table.fgrid td.mid>*,table.fgrid td.num>*,table.fgrid td.e>*{
  line-height:42px;vertical-align:middle}
table.fgrid td.num .u{line-height:42px}
/* ── والمكوّن المعلَّب يحتفظ بارتفاع سطره ──
   A tag is a box with its own padding: stretching its line-height to the
   control height turns a small badge into a bar the width of the column.
   فالوسم صندوقٌ بحشوته: ومطُّ ارتفاع سطره إلى ارتفاع الحقل يحوّل شارةً صغيرة
   إلى شريطٍ بعرض العمود. ويبقى توسيطُه على الخليّة كما هو. */
table.fgrid td.mid>.tag,table.fgrid td.num>.tag,table.fgrid td.e>.tag,
table.fgrid td.mid>.chip,table.fgrid td.num>.chip,table.fgrid td.e>.chip{
  line-height:1.65}
/* حقول جدول الأسطر أقصر (38) — فيتبعها النص المجاور */
table.ltab.fgrid td.mid,table.ltab.fgrid td.num,table.ltab.fgrid td.e{line-height:38px}
table.ltab.fgrid td.mid>*,table.ltab.fgrid td.num>*,table.ltab.fgrid td.e>*{
  line-height:38px}

/* ــ جدول تأكيد الاستلام ــ
   ══════════════════════════════════════════════════════════════════════
     سبعةُ أعمدةٍ تتّسع بلا تمرير — قرار محمد ٢٠٢٦-٠٨-٢٩
   ══════════════════════════════════════════════════════════════════════
   «إذا كانت الأعمدة التي تضعها جانبًا تجبرنا على إضافة سكرول في الجدول، فلا
   تستخدم فكرة الأعمدة الجانبية، أزلها ووسّع الجدول وأضف محتوى الأعمدة
   الجانبية بطريقة أخرى في الأسفل — وهذا بالنسبة لكل الشاشات.»

   كان `min-width:1360px` يفرض التمرير على كل شاشةٍ أضيقَ منه، **فيقع خطأُ
   الصفّ في عمودٍ خارج الشاشة**. والحدُّ سقط، والستّةُ التي كانت تفرضه نزلت
   إلى درجٍ تحت صفّها.
   A minimum width is a horizontal scrollbar promised in advance. */
.rcpt{table-layout:fixed;width:100%;--tmin:600px}
.rcpt input[type=number].in{text-align:start;font-variant-numeric:tabular-nums;
  font-family:Inter,ui-sans-serif,sans-serif}
.rcpt .el{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  max-width:100%}
table.rcpt td.ctr{text-align:center;line-height:42px}
table.rcpt td.ctr>*{line-height:normal;vertical-align:middle}

/* ── الدرجُ تحت الصفّ ──
   شبكةٌ تتّسع بعدد ما فيها، فلا يُفرض على الشاشة الضيّقة صفٌّ من ستّة. */
table.rcpt tr.xr>td{background:var(--n25);border-top:0;padding:4px 14px 14px}
.xgrid{display:grid;gap:12px 16px;
  grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}
.xgrid .fl{margin:0}
.xgrid .fl>label{font-size:.72rem}
.xsum:empty{display:none}
.xsum{margin-top:5px;font-variant-numeric:tabular-nums}

/* ── وسطرُ العميل يُقرأ ولا يُكتب فيه ──
   **وصفٌّ مقفولٌ يشبه إخوتَه صفٌّ يُنقر فيه بحثًا عن خانةٍ لا وجود لها** —
   فأرضيّتُه تقول حالَه قبل أن تُقرأ وسومُه. */
table.rcpt tr.rcl.lok>td{background:var(--n25)}
.lockv{color:var(--n400);font-variant-numeric:tabular-nums}
/* وزرّا البابين يملآن عمودَهما فلا ينكسر نصُّهما على حرف */
table.rcpt td.ctr>.btn{display:flex;width:100%;justify-content:center}
table.rcpt td.ctr>.btn+.btn{margin-top:5px}


/* ══════════════════════════════════════════════════════════════════════
   التلميح التوضيحي — «؟» تشرح المصطلح عند المرور
   Tooltip. The bubble is fixed-positioned and lives on <body>, never inside
   the cell that owns it: a bubble nested in `.tbl-w{overflow:auto}` gets
   clipped by its own table, and an explanation you cannot finish reading is
   worse than none.
   الفقاعة مثبَّتة وتسكن جسم الصفحة لا الخلية التي أطلقتها: فالفقاعة داخل جدول
   ذي تمرير يقصّها جدولها، وشرحٌ لا يُقرأ تمامه أسوأ من لا شرح.
   ══════════════════════════════════════════════════════════════════════ */
.tip{display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;min-width:16px;padding:0;margin-inline-start:5px;
  border:1px solid var(--line);border-radius:50%;background:var(--n50);
  color:var(--n400);font:600 10px/1 var(--f);cursor:help;
  vertical-align:middle;transition:.14s;flex:none}
.tip:hover,.tip:focus-visible{background:var(--b600);border-color:var(--b600);
  color:#fff;outline:none}
.tip:focus-visible{box-shadow:0 0 0 3px rgba(30,115,188,.22)}

.tipbub{position:fixed;z-index:9999;max-width:320px;
  padding:11px 14px;border-radius:var(--r8);
  background:var(--n800);color:#fff;
  font:400 .78rem/1.65 var(--f);text-align:start;
  box-shadow:0 10px 30px rgba(15,23,42,.24);
  pointer-events:none;opacity:0;transform:translateY(4px);
  transition:opacity .13s,transform .13s}
.tipbub.on{opacity:1;transform:translateY(0)}
.tipbub::after{content:"";position:absolute;width:9px;height:9px;
  background:var(--n800);transform:rotate(45deg)}
.tipbub[data-side="top"]::after{bottom:-4px;inset-inline-start:var(--ax,50%)}
.tipbub[data-side="bottom"]::after{top:-4px;inset-inline-start:var(--ax,50%)}

/* تلميح داخل عنوان عمود — لا يرث ثِقل العنوان */
th .tip{font-weight:600}

/* لا يُكسر السطر — لشارة ومعها تلميحها */
.nw{white-space:nowrap}

/* ── شبكة «مفتاح ← قيمة» ───────────────────────────────────────────────
   `.kv` pushes label and value to opposite edges, which reads correctly in a
   narrow sidebar. Widen it into grid columns and the rule turns on itself: the
   value drifts so far from its own label that it ends up nearer the NEXT
   label than to the one it belongs to. Proximity then says one thing and the
   markup another, and the eye believes proximity — «طبليات» starts looking
   like part of «التشغيلة».
   So in a grid the pair stacks: label above, value below. Nothing can drift,
   and the reading holds at any column width and in either direction.

   `.kv` تدفع المفتاح والقيمة إلى طرفين متقابلين، وهو صحيح في عمود ضيّق. فإذا
   وُسّعت إلى أعمدة شبكة انقلبت القاعدة على نفسها: تبتعد القيمة عن مفتاحها حتى
   تصير أقرب إلى المفتاح التالي منها إلى صاحبها. فيقول القُربُ شيئًا ويقول
   الترميزُ غيره — والعينُ تُصدّق القُرب، فتبدو «طبليات» جزءًا من «التشغيلة».
   ولذلك يُرصَف الزوج في الشبكة: المفتاح فوق والقيمة تحته. فلا شيء يهيم، ويثبت
   المعنى على أي عرضٍ للعمود وفي كلا الاتجاهين. */
.kvg{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));
  gap:0 26px}
.kvg .kv{display:block;padding:11px 0;border-bottom:1px dashed var(--line2);
  justify-content:flex-start}
.kvg .kv>span:first-child{display:flex;align-items:center;gap:2px;
  color:var(--mut);font-size:.76rem;line-height:1.5;margin-bottom:2px}
.kvg .kv>:not(:first-child){font-size:.94rem;line-height:1.6}
.kvg .kv>b,.kvg .kv>.n,.kvg .kv>a{font-weight:600}
.kvg .kv .u{font-size:.76rem;color:var(--n400);margin-inline-start:4px;
  font-weight:400}
.apr{border-top:1px solid var(--line2);margin-top:16px;padding-top:4px}


/* ══════════════════════════════════════════════════════════════════════
   لوحة اختيار المخزون المتاح
   The list is long by nature — a customer may hold forty batches of one item.
   So the header sticks, the body scrolls inside the card, and the page itself
   does not grow: the filters must stay reachable while the eye is deep in the
   rows, or the user scrolls up to search and loses their place.
   القائمة طويلة بطبعها — فقد يملك العميل أربعين تشغيلة لصنف واحد. فيثبت
   العنوان، ويُمرَّر الجسم داخل البطاقة، ولا تطول الصفحة نفسها: إذ يجب أن تبقى
   خانات البحث في المتناول والعينُ غائصة في الأسطر، وإلا صعد المستخدم ليبحث
   فأضاع موضعه.
   ══════════════════════════════════════════════════════════════════════ */
.pick2__f{background:var(--n25);border-bottom:1px solid var(--line2)}
.pick2__wrap{max-height:420px;overflow-y:auto}
.pick2__wrap .tbl-w{overflow-x:auto}
table.pick2__t thead th{position:sticky;top:0;z-index:2;background:var(--n50);
  box-shadow:inset 0 -1px 0 var(--line)}
table.pick2__t td{padding:9px 14px;vertical-align:top}
table.pick2__t td.mid{text-align:center;vertical-align:middle}

/* حدٌّ أعلى عند أول سطر لكل صنف — تُقرأ المجموعة دفعةً واحدة */
tr.pk__r--top td{border-top:2px solid var(--line)}
tr.pk__r{transition:background .12s}
tr.pk__r:hover{background:var(--b50)}
tr.pk__r--on{background:var(--b100)}
tr.pk__r--on:hover{background:var(--b100)}
tr.pk__r--off{background:var(--n25)}
tr.pk__r--off .n,tr.pk__r--off .num{opacity:.6}

.pk__c{width:17px;height:17px;accent-color:var(--b600);cursor:pointer}
.pk__n{display:inline-flex;align-items:center;justify-content:center;
  width:23px;height:23px;border-radius:50%;background:var(--n100);
  color:var(--mut);font:600 .72rem/1 var(--fn)}
.pk__locs{display:flex;flex-wrap:wrap;gap:4px;align-items:center;cursor:help}
.pk__loc{display:inline-block;padding:2px 8px;border-radius:var(--r4);
  background:var(--n100);color:var(--n600);font:500 .72rem/1.7 var(--fn);
  white-space:nowrap}
.pk__more{font:600 .72rem/1.7 var(--fn);color:var(--b600)}
/* حقل الكمية لا يُقصّ رقمه — الرقم المقصوص أسوأ من غيابه */
/* ── ولا `min-width:0` هنا أيضًا ── **وقاعدتان تتنازعان الحقلَ نفسَه
   تنتصر أخراهما**، فتُصلَح واحدةٌ ويبقى الضررُ في الأخرى. */
.pk__q{height:36px;padding:0 8px;text-align:center;width:100%}

/* سبب الاستبعاد يسكن سطرًا تحت صاحبه، فلا يزاحم عموده ولا يختفي */
tr.pk__why td{padding:0 14px 10px;border-top:0;font-size:.76rem;color:var(--wa)}
tr.pk__why svg{width:13px;height:13px;vertical-align:-2px}
/* ── سطرُ السبب: يُطلب ولا يُفرض الاختيارُ معه ──
   ولونُه لون التنبيه لا لون الخطأ: **الاختيار مقبول**، والمطلوب كلمةٌ
   تُكتب. A prompt, not a rejection. */
tr.pk__rsn td{padding:0 14px 11px;border-top:0;color:var(--wa)}
tr.pk__rsn .in{height:30px;padding:0 9px;font-size:.78rem}
tr.pk__rsn svg{color:var(--wa)}
/* ── وحقلُ السبب في الجدول يتبع تشغيلتَه ──
   يظهر تحتها حين يُطلب وحدَه، بحدٍّ بلون التنبيه: **الاختيار مقبول**
   والمطلوب كلمةٌ تُكتب. Shown only when asked; a prompt, not a rejection. */
.lrsn{margin-top:5px;height:28px;font-size:.75rem;border-color:var(--wa)}

/* ── «لم يشغل موقعًا جديدًا» ──
   يظهر وحدَه حين تكون خانةُ الطبليات فارغةً أو صفرًا. **وما لا يُمنع يجب
   أن يُرى** — وإلا قرأ من مرّ على الخانة بـTab سهوَه قرارًا.
   والحيلةُ في CSS لا في JS: `:placeholder-shown` تصف الخانةَ الفارغة،
   و`[value="0"]` تصف الصفرَ المكتوب. فلا سطرَ برمجيّ يُصان.
   Shown only when the box is blank or zero — CSS, so nothing to maintain. */
/* ── والوسمُ نزل مع خانته إلى الدرج ──
   كان مقيَّدًا بـ`td.ctr`، **فلمّا نزلت الخانةُ تحت الصفّ سقط القيدُ
   وبقيت قاعدةُ `table.fgrid .lmeta{display:block}` أقوى** — فظهر الوسمُ
   على كلّ سطرٍ يقول «لم يشغل موقعًا» وفيه واحد.
   A selector tied to a cell stops selecting when the cell moves.
   والوزنُ يُرفع ليعلو قاعدةَ `\.lmeta` أينما وقع الوسم. */
table.fgrid .pal0,.pal0{display:none;color:var(--wa)}
.fl:has(input[name$="pallet_count"]:placeholder-shown) > .pal0,
.fl:has(input[name$="pallet_count"][value="0"]) > .pal0,
td.ctr:has(input:placeholder-shown) > .pal0,
td.ctr:has(input[value="0"]) > .pal0{display:block}

@media (max-width:900px){.pick2__wrap{max-height:none}}

/* المستوى الثاني في التنقّل — تابعٌ لا قرين.
   The rail on the inline-start edge is the whole signal: indentation alone
   reads as an accident, a line reads as a hierarchy.
   الخيط على الحافة هو الإشارة كلها: فالإزاحة وحدها تُقرأ صدفةً، والخيط يُقرأ
   تراتبًا. */
.nav--sub{margin-inline-start:18px;padding-inline-start:12px;font-size:.82rem;
  position:relative}
.nav--sub::before{content:"";position:absolute;inset-block:6px;
  inset-inline-start:0;width:2px;border-radius:2px;background:var(--line)}
.nav--sub:hover::before{background:var(--n300)}
.nav--sub.on::before{background:var(--b500)}
.nav--sub svg{width:15px;height:15px}

/* منحنى مصغّر داخل خلية — شكل الشهر في لمحة، لا بديلًا عن أرقامه */
.spark{display:flex;align-items:flex-end;gap:1px;height:26px;min-width:110px}
.spark i{flex:1;min-width:2px;background:var(--b300);border-radius:1px;
  min-height:2px;display:block}
.spark i:last-child{background:var(--b500)}

/* سلّم التضييق — يُظهر أين يقف المستخدم من الطريق لا أين انتهى */
.drill{list-style:none;margin:22px 0 0;padding:0;text-align:start;counter-reset:d}
.drill li{counter-increment:d;position:relative;padding:11px 0 11px 0;
  padding-inline-start:38px;border-bottom:1px dashed var(--line2)}
.drill li::before{content:counter(d);position:absolute;inset-inline-start:0;top:11px;
  width:24px;height:24px;border-radius:50%;background:var(--n100);color:var(--mut);
  display:flex;align-items:center;justify-content:center;
  font:600 .74rem/1 var(--fn)}
.drill li.on::before{background:var(--b500);color:#fff}
.drill li.on b{color:var(--b700)}
.drill b{display:block;font-size:.9rem;font-weight:600}
.drill span{display:block;font-size:.78rem;color:var(--mut);line-height:1.6}

/* ── شبكة المحفظة ──────────────────────────────────────────────────────
   Two stacked grids with different column ratios and different gaps do not
   line up, and the eye reads the misalignment as sloppiness before it reads
   anything else. One column definition governs both rows: the tiles take one
   column each, and below them the tall form takes one while everything else
   takes the remaining two.
   شبكتان متتاليتان بنسبتَي أعمدة مختلفتين وفجوتين مختلفتين لا تتحاذيان، والعين
   تقرأ الاختلال إهمالًا قبل أن تقرأ سواه. فتعريف أعمدةٍ واحد يحكم الصفّين:
   لكل مربّع عمود، وتحتها يأخذ النموذجُ الطويل عمودًا ويأخذ الباقي العمودين. */
.wgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;margin-bottom:14px;align-items:start}
.wgrid--rows{align-items:stretch}
.wspan2{grid-column:span 2;display:flex;flex-direction:column;gap:14px;min-width:0}
@media(max-width:1080px){
  .wgrid{grid-template-columns:1fr}
  .wspan2{grid-column:auto}
}

.tile{background:var(--w);border:1px solid var(--line);border-radius:var(--r12);
  padding:16px 18px}
.tile__l{font-size:.78rem;color:var(--mut);display:flex;align-items:center;
  gap:4px;margin-bottom:6px}
.tile__v{font:700 1.6rem/1.2 var(--fn);color:var(--ink);letter-spacing:-.02em}
.tile__v .u{font:400 .8rem/1 var(--f);color:var(--n400);margin-inline-start:5px}
.tile__s{font-size:.74rem;color:var(--mut2);margin-top:5px}
.tile--ok{border-color:var(--ok-b);background:var(--ok-l)}
.tile--wa{border-color:var(--wa-b);background:var(--wa-l)}
.tile--da{border-color:var(--da-b);background:var(--da-l)}
.tile--ok .tile__v{color:#0A5D38}
.tile--wa .tile__v{color:#7A4E00}
.tile--da .tile__v{color:#8C1B12}


/* حقول متتابعة في عمود ضيّق — حقلان في سطرٍ عرضُه ثلثُ الصفحة يتزاحمان */
.fcol{display:flex;flex-direction:column;gap:10px}
.fcol>.fl{margin:0}

/* زرٌّ يظلّ ظاهرًا ويُعلن أن شرطه لم يتحقّق بعد — لا يُخفى ولا يُعطَّل بصمت.
   A button that stays visible and says its precondition is unmet. Hiding it
   makes the path invisible; disabling it silently makes it look broken. */
.b-off{opacity:.45}
/* ── وصفٌّ لا يُقدَّم اليومَ صفٌّ يُملأ اليوم — بلاغ محمد ٢٠٢٦-٠٨-٢٤ ──
   `b-off` تُعتّم الصفَّ كلَّه، وهو صحيحٌ لصفٍّ يُقرأ ولا يُكتب. **وجدولُ
   أسعار الخدمات يولد كلُّه غيرَ مؤشَّر** — فأوّلُ فتحةٍ للشاشة تعرضه باهتًا
   وهو مطلوبٌ منك أن تملأه.

     > **وحقلٌ يُرسم باهتًا حقلٌ يُقرأ معطَّلًا.**

   فـ`r-off` تقول «هذا الصفّ ليس مفعَّلًا» بخلفيّةٍ وحدَها.

   ── والعتمةُ رُفعت عن الاسم أيضًا — بلاغ محمد ٢٠٢٦-٠٨-٢٥ ──
   «لون الخط والصفوف باهته عند تحديد الخدمات الإضافية في المستودع.» وكانت
   `opacity:.62` باقيةً على خانة الاسم. **واسمُ الخدمة هو ما يُقرأ ليُقرَّر
   أتُؤشَّر أم لا** — فتعتيمُه يجعل القرارَ يُتّخذ على نصٍّ باهت.

     > **ونصٌّ يُعتَّم ليقول «مطفأ» يُقرأ أوّلًا «لا يُقرأ».**

   فتبقى الخلفيّةُ وحدَها تفرّق، وهي تفرّق بلا أن تُنقص وضوحًا. Dimming the
   one word the decision is made on makes the decision harder, not clearer. */
tr.r-off > td{background:var(--n25)}
tr.r-off .in{opacity:1}

/* ── وصفٌّ مفروضٌ لا يُطفأ — بلاغ محمد ٢٠٢٦-٠٨-٢٥ ──
   الخدمةُ الافتراضية تدخل كلَّ تسعيرة. **وخانةُ تأشيرٍ تُعرض على أمرٍ لا
   خيارَ فيه خانةٌ تُضغط ثم تُردّ**. فتُقفل وتُعلَّم، ولا تُخفى: إخفاؤها
   يجعل الصفَّ يُقرأ «غيرَ مؤشَّر». */
tr.r-must > td{background:var(--pu-l)}
tr.r-must input[type=checkbox]{cursor:not-allowed}


/* ══════════════════════════════════════════════════════════════════════
   ذيول الحروف · Arabic descenders must not be clipped
   ----------------------------------------------------------------------
   A field's content box was 19px tall while its own line box was 20.3px:
   min-height 42, minus 3 of border, minus 20 of vertical padding. The
   browser clips an input to its content box without a word of complaint,
   so the tails of ج ح خ ع غ م ه ي were shaved off — and only in Arabic,
   which is why it read as a font problem and not a box problem.
   The height stays 42. The padding shrinks and the room appears.

   صندوق محتوى الحقل كان ١٩ بكسل وسطرُه ٢٠٫٣: ارتفاعٌ أدنى ٤٢، ناقص ٣ للحدّ،
   وناقص ٢٠ للحشوة الرأسية. والمتصفح يقصّ الحقل عند صندوق محتواه بلا كلمة
   اعتراض، فحُلقت ذيول ج ح خ ع غ م ه ي — وفي العربية وحدها، فقُرئ عيبًا في
   الخط لا في الصندوق.
   والارتفاع باقٍ ٤٢. تنكمش الحشوة فيتّسع الموضع.
   ══════════════════════════════════════════════════════════════════════ */
.in,select.in,.cmb__in{line-height:1.6;padding-block:7px}
.ltab .in,.ltab .ta__in,.ltab select.in,
table.fgrid td>.in,table.fgrid td>select.in{padding-block:5px}
textarea.in{padding-block:10px}
.cmb__search input{line-height:1.6;padding-block:7px}
.cmb__opt{line-height:1.65}

/* والنصّ المقصوص بالنقاط يقصّه `overflow:hidden` رأسيًا كما يقصّه أفقيًا —
   فسطرٌ ضيّق فوق حرفٍ ذي ذيل يقطع الذيل.
   Ellipsised text is clipped vertically by the same `overflow:hidden` that
   gives it the ellipsis; a tight line-height over a descender cuts it. */
.msel__t{line-height:1.55}
.msel__s,.ta__nm,.att__n,.lmeta{line-height:1.7}


/* ══════════════════════════════════════════════════════════════════════
   المساحات لا تُسرد قبل التضييق
   ══════════════════════════════════════════════════════════════════════ */
.msel__wait{display:flex;align-items:flex-start;gap:11px;padding:16px 18px;
  background:var(--n25);border:1px dashed var(--n200);border-radius:10px}
.msel__wait svg{width:19px;height:19px;color:var(--b500);flex-shrink:0;margin-top:2px}
.msel__wait b{display:block;font-size:.85rem;font-weight:600;color:var(--ink2)}
.msel__wait span{display:block;font-size:.78rem;color:var(--mut);
  line-height:1.75;margin-top:2px}


/* ══════════════════════════════════════════════════════════════════════
   القائمة الجانبية · مجموعات تُطوى، ووضعٌ مصغَّر
   ----------------------------------------------------------------------
   A menu of five groups and eighteen entries is a menu you scroll. Folding a
   group you are not working in today is the reader's own act of narrowing —
   the same instinct the reports serve, applied to the navigation itself.
   The group holding the current page never folds: hiding where you are is
   not tidiness, it is disorientation.

   قائمةٌ بخمس مجموعات وثمانية عشر عنصرًا قائمةٌ تُمرَّر. وطيُّ مجموعة لا تعمل
   فيها اليوم تضييقٌ يفعله القارئ بنفسه — وهو الحسّ ذاته الذي تخدمه التقارير،
   مصروفًا إلى التنقّل نفسه.
   والمجموعة التي فيها صفحتك الحالية لا تُطوى: فإخفاء موضعك ليس ترتيبًا بل تيه.
   ══════════════════════════════════════════════════════════════════════ */
.side__tools{display:flex;align-items:center;gap:5px;padding:0 6px 6px}
.stool{width:30px;height:30px;display:grid;place-items:center;border:none;
  background:none;border-radius:8px;cursor:pointer;color:var(--mut);
  transition:var(--t);flex-shrink:0}
.stool:hover{background:var(--n50);color:var(--ink)}
.stool svg{width:16px;height:16px}

.navg{margin-bottom:1px}
/* ── ومجموعةٌ بلا عنوان بلا فراغٍ فوقها ──
   «لوحة الإدارة» تجلس بلا رأس (قرار محمد ٢٠٢٦-٠٨-١٧). والفراغُ الذي كان
   يصنعه الرأسُ يبقى بعده فتُقرأ فجوةً بلا سبب. */
.navg--bare{margin-bottom:6px}
.navg__h{display:flex;align-items:center;gap:8px;width:100%;padding:14px 12px 6px;
  line-height:1.8;
  border:none;background:none;cursor:pointer;font-size:.68rem;font-weight:600;
  color:var(--mut2);letter-spacing:.07em;text-align:start;border-radius:var(--r8);
  transition:color .13s}
.navg__h:hover{color:var(--ink2)}
.navg__h>span:first-child{flex:1;min-width:0}
.navg__x{width:13px;height:13px;flex-shrink:0;transition:transform .18s}
.navg.off .navg__x{transform:rotate(90deg)}
html[dir=ltr] .navg.off .navg__x{transform:rotate(-90deg)}
.navg.off .navg__b{display:none}
/* المطوية تُعلن ما خُبّئ فيها — والعدد ينبّه إلى ما ينتظر تحتها */
.navg__n{font-family:var(--fn);font-size:.65rem;font-weight:700;padding:1px 6px;
  border-radius:20px;background:var(--n100);color:var(--mut);display:none}
.navg.off .navg__n{display:inline-block}
.navg__n--a{background:var(--da-b);color:var(--da)}

/* ── الوضع المصغَّر ──
   Icons only. The label does not disappear — it moves into the tooltip, so
   nothing is lost, only deferred until asked for.
   أيقونات وحدها. والعنوان لا يختفي — ينتقل إلى التلميح، فلا يضيع شيء وإنما
   يُؤجَّل حتى يُطلب. */
.shell.mini{--side:74px}
.shell.mini .side__top{padding:20px 0 14px;display:grid;place-items:center}
.shell.mini .side__top .mut{display:none}
.shell.mini .brand-full{display:none}
.side__mark{display:none}
.shell.mini .side__mark{display:block}
.shell.mini .side__nav{padding:0 10px 12px}
.shell.mini .side__tools{justify-content:center;flex-wrap:wrap}
.shell.mini .navg__h{display:none}
/* وزرُّ الطيّ لا معنى له حيث لا عناوين تُطوى */
.shell.mini #navFold{display:none}
.shell.mini .navg{border-top:1px solid var(--line2);margin-top:8px;padding-top:8px}
.shell.mini .navg:first-of-type{border-top:none;margin-top:0;padding-top:0}
.shell.mini .nav{justify-content:center;padding:11px 0;gap:0}
.shell.mini .nav>span:not(.nav__c){display:none}
.shell.mini .nav--sub{margin-inline-start:0;padding-inline-start:0}
.shell.mini .nav--sub::before{display:none}
.shell.mini .nav__c{position:absolute;top:3px;inset-inline-end:6px;min-width:0;
  padding:0;width:7px;height:7px;border-radius:50%;font-size:0;overflow:hidden}
.shell.mini .uchip{justify-content:center;padding:9px 0}
.shell.mini .uchip>span:not(.av),.shell.mini .uchip>svg{display:none}
.shell.mini .umenu__pop{inset-inline-start:auto;inset-inline-end:0;min-width:230px}


/* ══════════════════════════════════════════════════════════════════════
   لوحة التحكم · بطاقات تقول ما تفعله لا ما اسمها
   ----------------------------------------------------------------------
   A settings hub of bare links is a list of table names. Each card carries a
   sentence about the work and a count, because «١٤ درجة حرارة» tells the
   reader whether the table has been set up; «درجات الحرارة» tells them
   nothing they did not already know.
   لوحةُ إعدادات من روابط مجرّدة قائمةُ أسماء جداول. فتحمل كل بطاقة جملةً عن
   العمل وعددًا، لأن «١٤ درجة حرارة» تقول للقارئ هل ضُبط الجدول، و«درجات
   الحرارة» لا تقول له ما لا يعرفه.
   ══════════════════════════════════════════════════════════════════════ */
.adm{display:grid;gap:13px;grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.adm--s{grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.adm__c{display:grid;grid-template-columns:42px 1fr auto;grid-template-rows:auto auto;
  gap:3px 13px;background:var(--w);border:1px solid var(--line);border-radius:var(--r12);
  padding:16px 17px;text-decoration:none;color:inherit;
  transition:border-color .14s,box-shadow .14s,transform .14s}
.adm__c:hover{border-color:var(--b400,#66A6DA);box-shadow:var(--s3);transform:translateY(-1px)}
.adm__i{grid-row:1/3;width:42px;height:42px;border-radius:11px;display:grid;
  place-items:center;background:var(--b50);color:var(--b600);align-self:start}
.adm__i svg{width:20px;height:20px}
.adm__t{font-size:.93rem;font-weight:600;color:var(--ink);line-height:1.5}
.adm__d{grid-column:2/4;font-size:.775rem;color:var(--mut);line-height:1.7}
.adm__n{font-family:var(--fn);font-size:.82rem;font-weight:700;color:var(--b700);
  background:var(--b50);border-radius:20px;padding:2px 10px;align-self:start;height:fit-content}
@media(max-width:640px){.adm{grid-template-columns:1fr}}

/* ── منتقي الأيقونات — يُختار ما يُرى ─────────────────────────────────
   بلاغ محمد ٢٠٢٦-٠٨-١٥: «نتمكن من تحديد أيقونة».

   **وقائمةٌ منسدلة تقول «ic-g-food» تصف شكلًا بالكلام** — فيُحفظ ثم تُفتح
   شاشةٌ أخرى ليُرى ما اختير، ثم يُعاد. وما يُقرَّر بالنظر يُختار بالنظر.

   والأصلُ `input[type=radio]` مخفيٌّ لا محذوف: **فحقلٌ يُحذف من الشجرة
   حقلٌ لا تبلغه لوحةُ المفاتيح** — ويبقى `:focus-visible` يرسم حلقتَه. */
.icp{display:flex;flex-wrap:wrap;gap:9px;align-items:flex-start}
.icp__h{flex:1 0 100%;font-size:.72rem;font-weight:700;color:var(--mut);
  margin:6px 0 0}
.icp__o{width:78px;display:flex;flex-direction:column;align-items:center;
  gap:5px;padding:11px 5px 8px;border:1px solid var(--line);
  border-radius:var(--r10);background:var(--w);cursor:pointer;
  transition:border-color .14s,background .14s,box-shadow .14s}
.icp__o:hover{border-color:var(--b400,#66A6DA);background:var(--b50)}
.icp__o input{position:absolute;opacity:0;width:0;height:0}
.icp__o svg{width:22px;height:22px;color:var(--n700,#3F4A57)}
.icp__l{font-size:.63rem;line-height:1.35;color:var(--mut);text-align:center;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden}
.icp__o.on{border-color:var(--b600);background:var(--b50);
  box-shadow:0 0 0 2px var(--b100,#E3EFF9)}
.icp__o.on svg{color:var(--b700)}
.icp__o.on .icp__l{color:var(--b800,#12395F);font-weight:600}
.icp__o:focus-within{border-color:var(--b600);box-shadow:0 0 0 3px var(--b100,#E3EFF9)}

/* ── والعائدُ يُردّ إلى موضعه لا إلى رأس الصفحة ──
   بلاغ محمد ٢٠٢٦-٠٨-١٥: «أدخل على أحد الخيارات ثم أتوجّه للعودة، يعيدني
   لأعلى القائمة».

   ولا يكفي التمرير وحدَه: **الصفحةُ تعود إلى موضعها فتُقرأ صفحةً جديدة**،
   ويبحث القارئ بعينه عن البطاقة التي خرج منها بين ثلاثين. فتُعلَّم ثانيتين
   ثم تُترك — **وعلامةٌ دائمة تصير جزءًا من الشكل فتكفّ عن أن تقول شيئًا**.
   Scrolling alone is not enough: the page looks new and the reader hunts for
   the card they left. The mark fades, because a permanent one stops meaning. */
.adm__c.came{border-color:var(--b600)}
@media(prefers-reduced-motion:no-preference){
  .adm__c.came{animation:admcame 2.2s ease-out}
  @keyframes admcame{
    0%,55%{box-shadow:0 0 0 3px var(--b100,#D6E7F5)}
    100%{box-shadow:0 0 0 3px rgba(0,0,0,0)}}
}


/* ── اختيار العائلة قبل التفاصيل ──
   Three cards, not a dropdown: the choice reshapes the two lists under it, so
   it must look like a decision and not like another field.
   ثلاث بطاقات لا قائمة منسدلة: فالاختيار يُعيد تشكيل القائمتين تحته، فينبغي أن
   يبدو قرارًا لا حقلًا آخر. */
.kchoice{display:grid;gap:11px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.kchoice__i{display:block;padding:14px 16px;border:1.5px solid var(--line);
  border-radius:var(--r10);background:var(--w);text-decoration:none;color:inherit;
  transition:border-color .14s,background .14s}
.kchoice__i:hover{border-color:var(--b400,#66A6DA)}
.kchoice__i.on{border-color:var(--b500);background:var(--b50);
  box-shadow:0 0 0 3px rgba(30,115,188,.09)}
.kchoice__t{display:block;font-weight:600;font-size:.93rem;color:var(--ink);line-height:1.6}
.kchoice__d{display:block;font-size:.76rem;color:var(--mut);line-height:1.7;margin-top:3px}


/* ══════════════════════════════════════════════════════════════════
     خانة الكمية ووحدتها في لوحة الاختيار
   ══════════════════════════════════════════════════════════════════
   كانت `min-width:0` تسمح للحقل أن ينكمش إلى لا شيء حين تضيق الوحدةُ
   بالعمود — فيظهر من عبارة «الكمية» حرفان، ولا يُقرأ رقمٌ من خانتين.

       > **وحقلُ إدخالٍ ينكمش إلى صفرٍ ليتّسع جارُه حقلٌ يُقرأ زخرفة.**

   والمستودعُ يعدّ بالآلاف: عشرةُ آلاف كرتون رقمٌ عاديّ لا استثناء. فصار
   للحقل حدٌّ أدنى **يفيض الجدولُ أفقيًّا دونه ولا ينكمش هو** — والفيضُ
   يُمرَّر بشريطٍ، أما الانكماشُ فيُخفي البيانات بلا شريط.
   An input that shrinks to nothing so its neighbour fits is decoration. */
.pk__ask{display:flex;gap:6px;align-items:stretch;flex-wrap:wrap}
.pk__ask .pk__q{flex:1 1 118px;min-width:118px;
  /* أرقامٌ متساوية العرض — فلا يرقص الرقم وهو يُكتب */
  font-variant-numeric:tabular-nums}
/* ── والوحدةُ أزرارٌ لا قائمة — بلاغ محمد ٢٠٢٦-٠٨-٢٩ ──
   «طريقة الاختيار بين الوحدات في الإخراج… لماذا لم تستخدم نفس طريقة
   الاختيار الجميلة في طلب الإدخال؟!» — و`.ug` هي تلك الطريقة، قائمةٌ في
   نظام التصميم منذ بُني. **ومكوّنان لسؤالٍ واحد مكوّنان يفترقان.** */
.pk__ask .pk__ug{width:100%;flex:1 1 100%;box-sizing:border-box}
.pk__ask .pk__ug button{flex:1 1 0;min-width:0;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.pk__u{display:inline-flex;align-items:center;flex-shrink:0;padding:0 9px;
  font-size:.78rem;color:var(--mut);background:var(--n50);border-radius:8px;
  white-space:nowrap}

/* ── وما نزل من الأعمدة يُقرأ تحت الاسم ──
   الترتيبُ والانتهاءُ والطبليةُ والتشغيلة سطرٌ من وسومٍ صغيرةٍ لا أربعةُ
   أعمدة. **وعمودٌ لا يُكتب فيه شيءٌ عمودٌ يأخذ عرضًا ولا يردّه.** */
.pk__meta{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;
  margin-top:5px}
.pk__meta .n{font-variant-numeric:tabular-nums}
/* وسطرٌ حُدِّد بلا كميةٍ مكتوبة يُرى أنّه ينتظرها */
tr.pk__r--mute .pk__q{border-color:var(--da)}


/* ── مركبات الرحلة ──
   A numbered badge on each card, because «المركبة ٢» in prose is easy to lose
   between two long tables; a number in a circle is not.
   شارةٌ مرقّمة على كل بطاقة، فـ«المركبة ٢» في نصٍّ تضيع بين جدولين طويلين،
   ورقمٌ في دائرة لا يضيع. */
.veh__b{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:var(--b600);color:#fff;font:700 .78rem/1 var(--fn);flex-shrink:0;
  margin-inline-end:9px}
.veh{border-color:var(--b200,#CFE3F4)}
.dlt.dn{color:var(--wa);font-weight:700}
.dall{color:var(--b700)}


/* ══════════════════════════════════════════════════════════════════════
   سلّم خطوات المساحة · Space step ladder
   ----------------------------------------------------------------------
   `slad` وليس `steps`. فـ`steps` اسمٌ يملكه معالج طلب عرض السعر منذ البداية،
   ولمّا أعدتُ استعماله هنا لم يحجبه بل سحقه: قاعدتي جاءت بعده في الملف
   فورثت أعمدته الست ثلاثة أعمدة، وتبعثر المعالج كله وأنا أظنّني أضفتُ شيئًا
   جديدًا. والاسم العامّ في ورقة أنماطٍ مشتركة ليس اسمًا بل حجزٌ للاسم — ومن
   أخذه بعد صاحبه أخذ معه شاشةً لم ينظر إليها.

   `slad`, not `steps`. The quote wizard has owned `.steps` from the start;
   reusing the name here did not scope it, it crushed it — my rule came later
   in the file, so the wizard's six steps inherited a three-column grid and
   scattered while I believed I had only added something new. A generic class
   name in a shared stylesheet is not a name, it is a claim on one — and
   whoever takes it second takes a screen they never looked at with it.
   ══════════════════════════════════════════════════════════════════════ */
.slad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}
.slad__i{display:grid;grid-template-columns:32px 1fr;grid-template-rows:auto auto;
  gap:1px 11px;padding:13px 15px;background:var(--w);border:1.5px solid var(--line);
  border-radius:var(--r10);text-decoration:none;color:inherit;
  transition:border-color .14s,background .14s}
a.slad__i:hover{border-color:var(--b400,#66A6DA)}
.slad__n{grid-row:1/3;width:32px;height:32px;border-radius:50%;display:grid;
  place-items:center;background:var(--n100);color:var(--mut);
  font:700 .84rem/1 var(--fn);align-self:center}
.slad__n svg{width:15px;height:15px}
.slad__t{font-size:.9rem;font-weight:600;color:var(--ink2);line-height:1.55}
.slad__s{font-size:.74rem;color:var(--mut2);line-height:1.6;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.slad__i.on{border-color:var(--b500);background:var(--b50)}
.slad__i.on .slad__n{background:var(--b600);color:#fff}
.slad__i.on .slad__t{color:var(--b800)}
.slad__i.done .slad__n{background:var(--ok-l);color:var(--ok)}
@media(max-width:860px){.slad{grid-template-columns:1fr}}


/* ── بطاقة مستودع في نتائج البحث ──
   The card answers the three questions asked in the same breath as «which
   warehouse»: whose is it, where is it, and does it have room.
   البطاقة تجيب الأسئلة الثلاثة التي تُسأل مع «أي مستودع» في نفَسٍ واحد: لمن،
   وأين، وهل فيه متّسع. */
.whg{display:grid;gap:13px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.whc{display:block;padding:15px 17px;background:var(--w);border:1.5px solid var(--line);
  border-radius:var(--r12);text-decoration:none;color:inherit;
  transition:border-color .14s,box-shadow .14s,transform .14s}
.whc:hover{border-color:var(--b500);box-shadow:var(--s3);transform:translateY(-1px)}
.whc__h{display:flex;align-items:center;gap:9px;margin-bottom:8px}
.whc__c{font-size:.78rem;font-weight:700;color:var(--b700);background:var(--b50);
  padding:2px 9px;border-radius:7px}
.whc__t{font-size:.96rem;font-weight:600;color:var(--ink);line-height:1.6}
.whc__d{font-size:.78rem;color:var(--mut);line-height:1.7;margin-top:1px}
.whc__m{display:flex;gap:14px;flex-wrap:wrap;margin-top:9px}
.whc__m span{display:inline-flex;align-items:center;gap:5px;font-size:.76rem;color:var(--mut2)}
.whc__m svg{width:13px;height:13px;flex-shrink:0}
.whc__f{display:flex;align-items:center;gap:8px;margin-top:11px;padding-top:10px;
  border-top:1px solid var(--line2);font-size:.78rem;color:var(--ink2)}
@media(max-width:640px){.whg{grid-template-columns:1fr}}


/* ══════════════════════════════════════════════════════════════════════
   شبكة حقول تليق بما فيها
   ----------------------------------------------------------------------
   Every field the same width is not order, it is indifference: a date and a
   paragraph are not the same question. Three columns for the short ones, the
   whole row for anything that expects a sentence.
   تساوي كل الحقول في العرض ليس ترتيبًا بل لا مبالاة: فالتاريخ والفقرة ليسا
   سؤالًا واحدًا. ثلاثةُ أعمدة للقصير، والسطرُ كلّه لما يتوقّع جملة.
   ══════════════════════════════════════════════════════════════════════ */
.f3{display:grid;gap:16px 18px;grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:start}
.f3>.fl{margin:0;min-width:0}
.f3--all{grid-column:1/-1}
.f3--all textarea.in{min-height:110px;width:100%}
@media(max-width:1000px){.f3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.f3{grid-template-columns:1fr}}

/* ── وعمودان حيث يكون العمودُ ثلثًا ضيّقًا ──
   بلاغ محمد ٢٠٢٦-٠٨-١٩: «تعديل المفوَّضين … تظهر العناصر مضغوطة وسيئة».
   واستمارةُ المفوَّض تسكن العمودَ الجانبيّ لا عرضَ الصفحة، **وثلاثةُ
   أعمدةٍ في عمودٍ جانبيّ ثلاثةُ حقولٍ لا يُقرأ أيٌّ منها**.
   Three columns inside a side column is three unreadable fields. */
.f2{display:grid;gap:14px 18px;grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start}
.f2>.fl{margin:0;min-width:0}
.f2--all{grid-column:1/-1}
@media(max-width:680px){.f2{grid-template-columns:1fr}}



/* ── مناطق المستودع: بطاقات تُقرأ لا قائمةٌ تُسحَب ──
   A raw multiple-select truncates the names and hides everything you must
   drag to reach — and a zone chosen without seeing its temperature is a
   contract pointing at the wrong cold room.
   القائمة المتعددة الخام تقصّ الأسماء وتُخفي ما لا يُبلَغ إلا بالسحب — ومنطقةٌ
   تُختار بلا رؤية حرارتها عقدٌ يشير إلى غرفة تبريد أخرى. */
.zgrid{display:grid;gap:9px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  padding:11px;background:var(--n25);border:1px solid var(--line);border-radius:10px;
  max-height:290px;overflow-y:auto}
.zcard{display:flex;align-items:flex-start;gap:10px;padding:11px 12px;background:var(--w);
  border:1.5px solid var(--line2);border-radius:10px;cursor:pointer;
  transition:border-color .13s,background .13s}
.zcard:hover{border-color:var(--b300,#9CC5E8)}
.zcard:has(input:checked){border-color:var(--b500);background:var(--b50)}
.zcard input{margin-top:3px;accent-color:var(--b600);width:16px;height:16px;flex-shrink:0}
.zcard__b{min-width:0;flex:1}
.zcard__t{display:block;font-size:.86rem;font-weight:600;color:var(--ink);line-height:1.65}
.zcard__m{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.zt{display:inline-flex;align-items:center;gap:4px;font-size:.71rem;color:var(--mut);
  background:var(--n50);border-radius:6px;padding:2px 7px;line-height:1.7}
.zt svg{width:11px;height:11px;flex-shrink:0}
@media(max-width:640px){.zgrid{grid-template-columns:1fr}}


/* ── العمود الجانبي في معالج عرض السعر ──
   `.split` تجعل آخر عمودٍ لاصقًا عند ١٦ بكسل، وهو صحيح في صفحة بلا رأس
   لاصق. وهذه الصفحة لها رأسٌ لاصق، فيلتصق العمود تحته لا خلفه — والارتفاع
   يُقاس عند العرض ويُكتب في `--rfq-head`.
   `.split` sticks the last column at 16px, which is right on a page with no
   sticky header. This page has one, so the column sticks below it rather than
   behind it, and the height is measured at render into `--rfq-head`. */
.rfq-split > div:last-child{top:var(--rfq-head, 128px)}


/* ══════════════════════════════════════════════════════════════════════
   جدول الاستلام · عمودان يثبتان
   ----------------------------------------------------------------------
   The receipt table is 1,400 pixels wide and the split button sits in its
   last column — so on any normal screen the one action the screen exists to
   offer is off-frame, and the banner above cheerfully says «press it».
   A control you must go looking for is a control that will not be used, and
   the operator will instead do the thing the platform was built to replace:
   write it on paper and tell someone later.

   So the item column and the action column stay put while the middle
   scrolls: you always know which row you are on, and you can always act on it.

   جدول الاستلام عرضه ألفٌ وأربعمئة بكسل، وزرّ شطر الطبلية في آخر عموده — فعلى
   أي شاشة عادية يقع الفعلُ الذي وُجدت الشاشة لأجله خارج الإطار، والشريط فوقه
   يقول بثقة «اضغطه».
   والأداة التي يُبحث عنها أداةٌ لن تُستعمل، وسيفعل المشغّل ما بُنيت المنصة
   لتُغني عنه: يكتبها في ورقة ويخبر أحدًا لاحقًا.

   فيثبت عمود الصنف وعمود الفعل ويتحرّك ما بينهما: تعرف أين أنت دائمًا،
   وتستطيع أن تفعل دائمًا.
   ══════════════════════════════════════════════════════════════════════ */
table.rcpt th:first-child, table.rcpt td:first-child,
table.rcpt th:last-child,  table.rcpt td:last-child{
  position:sticky; z-index:3; background:var(--w)}
table.rcpt thead th:first-child, table.rcpt thead th:last-child{
  z-index:4; background:var(--n25)}
table.rcpt tbody tr:hover td:first-child,
table.rcpt tbody tr:hover td:last-child{background:var(--b50,#F2F7FC)}

/* في العربية الأول يمينًا والآخِر يسارًا، وينعكسان بانعكاس الاتجاه */
html[dir=rtl] table.rcpt th:first-child, html[dir=rtl] table.rcpt td:first-child{right:0}
html[dir=rtl] table.rcpt th:last-child,  html[dir=rtl] table.rcpt td:last-child{left:0}
html[dir=ltr] table.rcpt th:first-child, html[dir=ltr] table.rcpt td:first-child{left:0}
html[dir=ltr] table.rcpt th:last-child,  html[dir=ltr] table.rcpt td:last-child{right:0}

/* حدٌّ يقول «هنا انتهى الثابت وبدأ المتحرّك» — وإلا بدا العمودان طافيَين */
html[dir=rtl] table.rcpt th:first-child, html[dir=rtl] table.rcpt td:first-child{
  border-inline-start:1px solid var(--line)}
html[dir=rtl] table.rcpt th:last-child, html[dir=rtl] table.rcpt td:last-child{
  border-inline-end:1px solid var(--line)}
/* ── ولا حدٌّ أدنى يفرض التمرير ──
   **وعمودٌ حدُّه ١٠٤ في جدولٍ نسبيٍّ حدٌّ يزيد على مجموع النسب** — فيفيض
   الجدولُ عن حاويته بمقدارِ ما زاد، ويعود الشريطُ الذي أُزيل.
   A pixel floor inside a percentage table is the scrollbar coming back. */
table.rcpt td:last-child{min-width:0}

/* ══════════════════════════════════════════════════════════════════════
   حافّةٌ تقول إنّ هناك المزيد — `tbl-edge`
   ----------------------------------------------------------------------
   > «ما الحلّ الذي يمكن أن نجريه للسكرول في مثل هذه المواضع؟» — محمد
   > ٢٠٢٦-٠٨-١٧

   الجدولُ يمرّر أفقيًّا، **ولا شيء يقول إنّ خلفه شيئًا** إلا شريطُ تمريرٍ
   بأحدَ عشرَ بكسلًا في أسفله. فيُقرأ الجدولُ ناقصًا ويُظنّ تامًّا — **وعمودٌ
   لا يُعلم بوجوده عمودٌ لا يُقرأ، ولا يُشتكى منه**.

       > **وما لا يُرى لا يُبحث عنه: غيابُ العمود يُقرأ «ليس هنا» لا «مرّر
       > يمينًا».**

   ── ولماذا ظلٌّ لا رسالة ──
   الرسالةُ تُقرأ مرّةً ثم تصير خلفيّة، **والظلُّ يظهر ويختفي مع الحال** —
   فيقول «بقيت أعمدة» وهي باقية، ويسكت عند آخرها. ومعه زرٌّ يُنقر فيدفع
   الجدولَ ثمانين بالمئة من عرضه: **وحافّةٌ تخبر ولا تُعين حافّةٌ تُحبط**.

   ── ولا يُلمس قالبٌ واحد ──
   الغلافُ يُبنى من `base.html` حول كلّ `.tbl-w` — **وعلاجٌ ثمنُه سطرٌ في كلّ
   قالبٍ علاجٌ لا يبلغ الشاشةَ العاشرة**، وهي خمسةٌ وثلاثون هنا.
   A remedy priced per template never reaches the tenth screen.
   ══════════════════════════════════════════════════════════════════════ */
.tbl-edge{position:relative}
/* الظلُّ خارج الحاوية المُمرَّرة — **وظلٌّ داخلها يمرّ معها فيغادر الحافّة** */
.tbl-edge::before,.tbl-edge::after{content:"";position:absolute;top:0;bottom:0;
  width:46px;pointer-events:none;opacity:0;transition:opacity .18s;z-index:6}
.tbl-edge::after{inset-inline-end:0;
  background:linear-gradient(to var(--edge-to,left),
    rgba(16,24,40,.13),rgba(16,24,40,0))}
.tbl-edge::before{inset-inline-start:0;
  background:linear-gradient(to var(--edge-from,right),
    rgba(16,24,40,.10),rgba(16,24,40,0))}
html[dir=rtl] .tbl-edge{--edge-to:right;--edge-from:left}
html[dir=ltr] .tbl-edge{--edge-to:left;--edge-from:right}
.tbl-edge.is-end::after{opacity:1}
.tbl-edge.is-start::before{opacity:1}

/* الزرُّ الذي يدفع — يظهر مع ظلِّه ويُخفى عند الحافّة */
/* ── ويختفي بـ`hidden` لا بقاعدةِ نمط ──
   **وعنصرٌ يعتمد اختفاؤه على ورقة أنماط عنصرٌ يظهر يوم لا تصل** — وقد ظهر:
   زرٌّ خامٌ بحجم الكرت في وسط الشاشة يوم لم تبلغ الورقةُ المتصفّح. و`[hidden]`
   مكتوبةٌ في أعلى هذا الملفّ بـ`!important` لأن صنفًا يضبط `display` يغلبها. */
.tbl-edge__go{position:absolute;top:50%;transform:translateY(-50%);
  inset-inline-end:9px;z-index:7;width:31px;height:31px;border-radius:50%;
  display:grid;place-items:center;cursor:pointer;padding:0;
  background:var(--w);border:1px solid var(--line);
  box-shadow:0 3px 10px rgba(16,24,40,.14);color:var(--n600,#475467)}
.tbl-edge__go:hover{background:var(--n25);color:var(--ink)}
.tbl-edge__go svg{width:15px;height:15px}
/* والسهمُ يشير إلى جهة المزيد — و`ic-r` يشير يسارًا، وهي جهةُ العربية */
html[dir=ltr] .tbl-edge__go svg{transform:scaleX(-1)}

/* ── ولا ظلَّ على الورق ──
   **وظلٌّ يُطبع بقعةٌ رماديّة على حافّة صفحة** — والورقُ لا يُمرَّر أصلًا. */
@media print{
  .tbl-edge::before,.tbl-edge::after{display:none}
  .tbl-edge__go{display:none !important}
}

/* ══════════════════════════════════════════════════════════════════════
   عمودان يثبتان — التاريخ والحركة · `stick2`
   ----------------------------------------------------------------------
   > «ولأن الأعمدة ستكون كثيرة وسنحتاج لسكرول، من الأفضل أن تثبت أول
   > عمودين وهما عمودا التاريخ والحركة.» — محمد ٢٠٢٦-٠٨-١٧

   تقريرُ مقدّم الخدمة يحمل عمودًا لكلّ خدمة، فيطول بلا سقف. ومن مرّر يمينًا
   ليقرأ كميةَ خدمةٍ فقد التاريخَ الذي يقرأ له — **ورقمٌ لا يُعرف يومُه رقمٌ
   يُنسَخ إلى الصفّ الخطأ**.

   ── وعرضُ العمود الأوّل يُقاس ولا يُخمَّن ──
   الثاني يلتصق **بعد** الأوّل، فيحتاج مقاسَه بالضبط. وكُتب هنا أوّلَ مرّة
   رقمًا مقدَّرًا (١٠٤ بكسل)، **فبان في المتصفّح أنّ الحقيقيّ ١٢٨** — فانزاح
   العمودُ الثاني أربعةً وعشرين بكسلًا عند التمرير وظهر تحته ما قبله.

     > **ومقاسٌ يُخمَّن في تخطيطٍ يقيسه المتصفّح مقاسٌ يصحّ على شاشةٍ ويكذب
     > على أخرى** — ويتغيّر بتغيّر الخطّ وصيغة التاريخ واللغة.

   فيُقاس عند العرض ويُكتب في `--c1` (انظر `base.html`)، وتبقى القيمة هنا
   تقديرًا يعمل قبل أن يصل النصّ — فلا يقع الجدولُ فوق نفسه إن تأخّر.
   Guessed at first, measured after the browser disagreed by 24 pixels.
   ══════════════════════════════════════════════════════════════════════ */
table.stick2{--c1:128px}
table.stick2 th:nth-child(1), table.stick2 td:nth-child(1),
table.stick2 th:nth-child(2), table.stick2 td:nth-child(2){
  position:sticky; z-index:3; background:var(--w)}
/* ── ولا يُفرض عرضٌ على العمود الأوّل ──
   فُرض أوّلَ مرّة `width:var(--c1)` ليُعرف مقاسُه، **فصار المقاسُ يتغذّى على
   نفسه**: يُقاس فيُكتب في المتغيّر، فيتّسع العمود به، فيُقاس أوسع… ودار
   ١٢٨ ← ١٨٤ ← ٢١٢ في ثلاث لفّات.

     > **ومقياسٌ يغيّر ما يقيسه مقياسٌ لا يستقرّ على رقم.**

   فالعرضُ طبيعيٌّ يقرّره المتصفّح، و`--c1` تُقرأ منه ولا تُملي عليه. */
table.stick2 thead th:nth-child(1), table.stick2 thead th:nth-child(2){
  z-index:4; background:var(--n25)}
table.stick2 tfoot td:nth-child(1), table.stick2 tfoot td:nth-child(2){
  background:var(--n25)}
table.stick2 tbody tr:hover td:nth-child(1),
table.stick2 tbody tr:hover td:nth-child(2){background:var(--b50,#F2F7FC)}

/* ── وطبقتان في جدولٍ واحد: يومٌ ثم عملياتُه ──
   > «التقرير التفصيلي أصبح لا يعرض إلا ملخصًا!» — محمد ٢٠٢٦-٠٨-١٧

   صفُّ اليوم يحمل مجاميعه وكمياتِ خدماته، وتحته صفُّ كلّ عملية بمرجعها.
   **وطبقتان بلا فرقٍ في اللون طبقتان تُقرآن طبقةً واحدة** — فيُجمع صفُّ
   اليوم مع عملياته بالعين ويُضاعَف الرقم.
   وخلفيةُ الخانتين الثابتتين تُكتب هنا أيضًا: **لولاها لبقيتا بيضاوين وسط
   صفٍّ ملوَّن، فبدتا صفًّا آخر.** */
table.stick2 tbody tr.dayr > td{background:var(--n25);
  border-top:1px solid var(--line)}
table.stick2 tbody tr.opr > td{padding-top:5px;padding-bottom:5px}
table.stick2 tbody tr.opr > td:nth-child(2){padding-inline-start:22px}
table.stick2 tbody tr.dayr:hover > td,
table.stick2 tbody tr.opr:hover > td{background:var(--b50,#F2F7FC)}

/* في العربية يبدأ من اليمين، وينعكس بانعكاس الاتجاه */
html[dir=rtl] table.stick2 th:nth-child(1), html[dir=rtl] table.stick2 td:nth-child(1){right:0}
html[dir=rtl] table.stick2 th:nth-child(2), html[dir=rtl] table.stick2 td:nth-child(2){right:var(--c1)}
html[dir=ltr] table.stick2 th:nth-child(1), html[dir=ltr] table.stick2 td:nth-child(1){left:0}
html[dir=ltr] table.stick2 th:nth-child(2), html[dir=ltr] table.stick2 td:nth-child(2){left:var(--c1)}

/* حدٌّ يقول «هنا انتهى الثابت وبدأ المتحرّك» — وإلا بدا العمودان طافيَين */
table.stick2 th:nth-child(2), table.stick2 td:nth-child(2){
  border-inline-end:1px solid var(--line)}

@media(max-width:640px){
  /* وعلى شاشةٍ ضيّقة يبتلع الثابتُ الشاشةَ كلَّها — فيُترك التمرير حرًّا */
  table.stick2 th:nth-child(1), table.stick2 td:nth-child(1),
  table.stick2 th:nth-child(2), table.stick2 td:nth-child(2){position:static}
}

/* ═══════════════════════════════════════════════════════════════════
   شريط المسار — أين وصلنا، وما التالي، ومن يفعله
   The journey band: where we are, what is next, and whose turn it is.
   يُستعمل في الإدخال والصرف معًا — أسماء `flw` محجوزة له وحده.
   ═══════════════════════════════════════════════════════════════════ */
.flw{background:var(--w);border:1px solid var(--line);border-radius:var(--r12);
     box-shadow:var(--s2);margin-bottom:16px;overflow:hidden}
.flw--done{border-color:var(--ok-b)}
.flw--stop{border-color:var(--wa-b)}

/* ── المحطّات ── */
.flw__s{display:flex;list-style:none;margin:0;padding:16px 18px 14px;gap:0;
        border-bottom:1px solid var(--line2);overflow-x:auto}
.flw__i{display:flex;align-items:flex-start;gap:9px;flex:1;min-width:150px;position:relative;
        padding-inline-end:14px}
/* الخيط بين المحطّتين — يتبع اتجاه الصفحة، فيمتدّ يسارًا في العربية */
.flw__i::after{content:"";position:absolute;top:13px;inset-inline-start:100%;
               width:14px;height:2px;background:var(--n200);transform:translateX(0)}
.flw__i:last-child{flex:0 0 auto;padding-inline-end:0}
.flw__i:last-child::after{display:none}
.flw__b{flex:0 0 auto;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
        font:600 .74rem/1 var(--fn);background:var(--n100);color:var(--mut2);
        border:2px solid var(--n200)}
.flw__b svg{width:13px;height:13px}
.flw__x{display:flex;flex-direction:column;gap:2px;min-width:0}
.flw__x b{font-size:.82rem;font-weight:600;color:var(--ink2);line-height:1.5}
.flw__x i{font-style:normal;font-size:.7rem;color:var(--mut2);font-family:var(--fn);
          direction:ltr;text-align:start}

.flw__i.is-done .flw__b{background:var(--ok-l);border-color:var(--ok-b);color:var(--ok)}
.flw__i.is-done .flw__x b{color:var(--ink)}
.flw__i.is-done::after{background:var(--ok-b)}
/* المحطّة الحالية تُميَّز بحلقة لا بلون وحده — فاللون وحده لا يُقرأ لمن لا يميّزه */
.flw__i.is-now .flw__b{background:var(--b500);border-color:var(--b500);color:#fff;
        box-shadow:0 0 0 4px var(--b100)}
.flw__i.is-now .flw__x b{color:var(--b700);font-weight:700}
.flw__i.is-skip{opacity:.45}
.flw__i.is-skip .flw__x b{text-decoration:line-through}

/* ── الخطوة التالية ── */
.flw__n{display:flex;align-items:center;gap:16px;padding:14px 18px;flex-wrap:wrap}
.flw__t{flex:1;min-width:260px}
.flw__k{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.02em;
        color:var(--mut2);text-transform:uppercase;margin-bottom:4px}
.flw__t p{margin:0;font-size:.86rem;line-height:1.75;color:var(--ink2)}
.flw__stop{margin-top:6px !important;color:#7A4E00;background:var(--wa-l);
           border:1px solid var(--wa-b);border-radius:var(--r6);padding:8px 11px}
.flw__a{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.flw--done .flw__k{color:var(--ok)}
.flw--stop .flw__k{color:var(--wa)}

/* ── الأرقام: «مشحون جزئيًا» بلا رقمٍ سؤالٌ لا حالة ── */
.flw__q{display:flex;gap:0;border-top:1px solid var(--line2);background:var(--n25);
        flex-wrap:wrap}
.flw__q > span{flex:1;min-width:110px;padding:10px 14px;display:flex;flex-direction:column;
        gap:2px;border-inline-start:1px solid var(--line2)}
.flw__q > span:first-child{border-inline-start:0}
.flw__q i{font-style:normal;font-size:.7rem;color:var(--mut2)}
.flw__q b{font-size:.95rem;color:var(--ink)}
.flw__q .is-warn b{color:var(--wa)}

@media (max-width:820px){
  .flw__s{flex-direction:column;gap:12px}
  .flw__i{min-width:0;padding-inline-end:0}
  .flw__i::after{display:none}
}

/* ═══════════════════════════════════════════════════════════════════
   تفصيل سلّم الوحدات تحت الكمية
   The unit breakdown under a quantity: the card's estimate, offered for
   correction at the moment the quantity is typed — because a number to be
   verified later is a number nobody verifies.
   ═══════════════════════════════════════════════════════════════════ */
.udx{margin-top:6px;padding:7px 9px;border:1px dashed var(--wa-b);
     border-radius:var(--r6);background:var(--wa-l)}
.udx.is-ok{border-style:solid;border-color:var(--ok-b);background:var(--ok-l)}
.udx__h{font-size:.68rem;line-height:1.5;color:#7A4E00;margin-bottom:5px}
.udx.is-ok .udx__h{color:var(--ok)}
.udx__r{display:flex;align-items:center;gap:6px;margin-top:4px}
.udx__r > span{font-size:.72rem;color:var(--mut);flex:1;min-width:0;
               white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* الحقل الصغير يحتاج ارتفاع سطرٍ كافيًا وإلا قُصّت ذيول الحروف العربية */
.udx__r input{width:88px;flex:0 0 auto;padding:3px 7px;font-size:.76rem;
              line-height:1.9;height:auto}

/* ═══════════════════════════════════════════════════════════════════
   الجرس وصندوق التنبيهات
   The bell and the inbox. A count with no way to open the list teaches
   people to ignore the count.
   ═══════════════════════════════════════════════════════════════════ */
.bell{position:relative;display:grid;place-items:center;width:34px;height:34px;
      border:1px solid var(--line);border-radius:var(--r8);background:var(--w);
      color:var(--mut);transition:var(--t)}
.bell:hover{color:var(--b600);border-color:var(--b200);background:var(--b50)}
.bell svg{width:17px;height:17px}
.bell--on{color:var(--b600);border-color:var(--b200)}
/* العدّاد يتبع اتجاه الصفحة فيقف في الزاوية العليا الخارجية */
.bell__n{position:absolute;top:-6px;inset-inline-end:-6px;min-width:17px;height:17px;
         padding:0 4px;border-radius:9px;background:var(--da);color:#fff;
         font:600 .62rem/17px var(--fn);text-align:center;
         box-shadow:0 0 0 2px var(--w)}

.ntf{display:flex;align-items:flex-start;gap:11px;padding:13px 16px;
     border-bottom:1px solid var(--line2);border-inline-start:3px solid transparent}
.ntf:last-child{border-bottom:0}
/* غير المقروء يُميَّز بحافّة لا بخلفيّة — فالخلفيّات الملوّنة تُقرأ تحذيرًا */
.ntf--new{border-inline-start-color:var(--b500);background:var(--b50)}
.ntf__i{flex:0 0 auto;width:28px;height:28px;border-radius:50%;display:grid;
        place-items:center;background:var(--n100);color:var(--mut)}
.ntf__i svg{width:14px;height:14px}
.ntf--action .ntf__i{background:var(--wa-l);color:var(--wa)}
.ntf--alert .ntf__i{background:var(--da-l);color:var(--da)}
.ntf__b{flex:1;min-width:0}
.ntf__t{font-size:.86rem;font-weight:600;color:var(--ink);line-height:1.7;
        display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.ntf__x{font-size:.8rem;color:var(--ink2);line-height:1.85;margin-top:3px}
.ntf__m{font-size:.7rem;color:var(--mut2);margin-top:5px;font-family:var(--fn);
        direction:ltr;text-align:start}

/* ═══════════════════════════════════════════════════════════════════
   خطوات الانضمام — قائمةٌ مرقّمة يفتح كلٌّ منها صفحته

   ── والاسمُ `onbs` لا `stp` ──
   `.stp` was already taken: it is the step bar of the quote wizard, which
   has lived in this stylesheet since the first week. Naming these the same
   did not fail loudly — it silently repainted a screen nobody was looking
   at, which is the worse failure of the two.
   `.stp` كان مأخوذًا: فهو شريط خطوات معالج التسعير، ساكنٌ في هذه الورقة منذ
   الأسبوع الأول. وتسميةُ هذه باسمه لم تُخفق بصوتٍ عالٍ — بل أعادت طلاء شاشةٍ
   لا ينظر إليها أحد بصمت، وذلك أسوأ الإخفاقين.
   Onboarding steps: a numbered list, each opening its own page. Showing
   all three at once is what turned a five-minute task into a page nobody
   knew where to start on.
   ═══════════════════════════════════════════════════════════════════ */
.onbs{display:flex;align-items:center;gap:13px;padding:15px 18px;
     border-bottom:1px solid var(--line2);transition:var(--t)}
.onbs:last-child{border-bottom:0}
.onbs:hover{background:var(--n25)}
.onbs__n{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:grid;
        place-items:center;font:600 .8rem/1 var(--fn);
        background:var(--n100);color:var(--mut2);border:2px solid var(--n200)}
.onbs__n svg{width:14px;height:14px}
.onbs--ok .onbs__n{background:var(--ok-l);border-color:var(--ok-b);color:var(--ok)}
.onbs--now .onbs__n{background:var(--b500);border-color:var(--b500);color:#fff;
                  box-shadow:0 0 0 4px var(--b100)}
.onbs__b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.onbs__b b{font-size:.88rem;color:var(--ink);line-height:1.6}
.onbs--now .onbs__b b{color:var(--b700)}
.onbs__b i{font-style:normal;font-size:.74rem;color:var(--mut2);line-height:1.7}
/* ══ بطاقات المستندات ═══════════════════════════════════════════════
   لكل مستندٍ بطاقةٌ فيها اسمُه وحاله وزرُّ رفعه — لا صفٌّ في جدولٍ يُمرَّر
   أفقيًّا. والجدولُ يفترض أعمدةً متساوية الأهمية، وهذه ليست كذلك: الاسم
   يُقرأ، والحال يُلمح، والزرّ يُنقر.

   A card per document: its name, its state and its own upload. A table
   assumes columns of equal weight, and these are not — the name is read,
   the state is glanced at, and the button is pressed. The table also
   scrolled sideways on a narrow screen, which hid the very button the row
   existed for.
   ═════════════════════════════════════════════════════════════════════ */
.docs{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.doc{display:flex;align-items:flex-start;gap:13px;padding:15px 17px;
     border:1px solid var(--bd);border-radius:var(--r3);background:var(--sf);
     transition:var(--t)}
.doc:hover{border-color:var(--b300)}
.doc__i{flex:0 0 auto;width:34px;height:34px;border-radius:var(--r2);
        display:grid;place-items:center;background:var(--n50);
        border:1px solid var(--bd);color:var(--mut2)}
.doc__i svg{width:16px;height:16px}
.doc--ok{border-color:var(--ok-b);background:var(--ok-l)}
.doc--ok .doc__i{background:#fff;border-color:var(--ok-b);color:var(--ok)}
.doc--no{border-color:var(--wa-b);background:var(--wa-l)}
.doc--no .doc__i{background:#fff;border-color:var(--wa-b);color:var(--wa)}
/* غير المطلوب يُرى ولا يُلحّ — فإخفاؤه يجعل العميل يسأل عمّا لم يُطلب منه */
.doc--off{opacity:.66}
.doc__b{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.doc__b b{font-size:.88rem;color:var(--ink);line-height:1.6}
.doc__b i{font-style:normal;font-size:.74rem;color:var(--mut2);line-height:1.7}
.doc__f{display:flex;align-items:center;gap:6px;margin-top:4px;
        font-size:.74rem;flex-wrap:wrap}
.doc__f a{display:inline-flex;align-items:center;gap:4px;font-weight:600}
.doc__why{margin-top:5px;font-size:.74rem;color:var(--wa);line-height:1.7}
.doc__a{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;
        gap:7px}
/* الزرّ نفسه هو خانة الملفّ — فالخانة الأصلية تُعرض بالإنجليزية ولا تُنسَّق */
.doc__a label.btn{cursor:pointer;margin:0}
@media (max-width:640px){
  .doc{flex-wrap:wrap}
  .doc__a{width:100%;align-items:stretch;flex-direction:row;
          justify-content:space-between}
}

/* شريط الخطوات: المقفول يُرى ولا يُنقر — كما في القائمة تمامًا */
.stpb__i--off{cursor:default;opacity:.5}
.stpb__i--off:hover{background:transparent}
.onbs__a{flex:0 0 auto;text-align:end}
/* ── الخطوة المقفولة: تُرى ولا تُنقر ─────────────────────────────────
   A locked step still has to be legible: knowing what remains is what
   makes a person willing to start. What it must not do is invite a click
   the server will refuse — so it loses the pointer and the hover, not the
   text.
   والخطوة المقفولة يجب أن تبقى مقروءة: فمعرفةُ ما بقي هي ما يجعل المرء
   يقبل أن يبدأ. وما لا يجوز أن تفعله دعوةٌ إلى نقرةٍ يرفضها الخادم —
   فتفقد المؤشّر والتظليل لا النصّ. */
.onbs--off{cursor:default;opacity:.62}
.onbs--off:hover{background:transparent}
.onbs--off .onbs__n{background:var(--n50);border-color:var(--bd);color:var(--mut2)}
/* السهم يتحرّك عند التظليل — إشارةٌ إلى أن الصفّ نفسه هو الرابط */
.onbs__go{width:15px;height:15px;color:var(--b500);transition:var(--t)}
.onbs:hover .onbs__go{transform:translateX(3px)}
[dir=rtl] .onbs:hover .onbs__go{transform:translateX(-3px)}

/* شريط الخطوات داخل الصفحة الواحدة */
.stpb{display:flex;gap:0;margin-bottom:16px;background:var(--w);
      border:1px solid var(--line);border-radius:var(--r10);overflow:hidden}
.stpb__i{flex:1;display:flex;align-items:center;gap:8px;padding:12px 14px;
         font-size:.8rem;color:var(--mut2);
         border-inline-end:1px solid var(--line2)}
.stpb__i:last-child{border-inline-end:0}
.stpb__i:hover{background:var(--n25)}
.stpb__n{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
         font:600 .7rem/1 var(--fn);background:var(--n100);color:var(--mut2)}
.stpb__n svg{width:11px;height:11px}
.stpb__i.is-ok{color:var(--ink2)}
.stpb__i.is-ok .stpb__n{background:var(--ok-l);color:var(--ok)}
.stpb__i.is-now{color:var(--b700);font-weight:600;background:var(--b50)}
.stpb__i.is-now .stpb__n{background:var(--b500);color:#fff}
@media (max-width:700px){ .stpb{flex-direction:column} }

/* ═══════════════════════════════════════════════════════════════════
   عرضُ الصفحة — ثلاثة مقاسات مسمّاة، لا تسعةٌ مكتوبةٌ في الأنماط

   Page width: three named sizes, not nine written inline.

   Nine different widths — 760, 820, 880, 900, 920, 960, 1000 — had
   accumulated across nineteen templates, each written by hand at the moment
   it was needed. Nothing was wrong with any one of them; what was wrong was
   that two panels on the SAME screen could disagree, and the reader sees
   the disagreement long before they read the content: the page looks
   unfinished, and an unfinished-looking page is not trusted with money.

   تراكمت تسعةُ عروضٍ — ٧٦٠ و٨٢٠ و٨٨٠ و٩٠٠ و٩٢٠ و٩٦٠ و١٠٠٠ — في تسعة عشر
   قالبًا، كلٌّ كُتب بيدٍ ساعةَ الحاجة إليه. ولا عيب في واحدٍ منها بذاته؛
   العيبُ أن لوحتين في **الشاشة الواحدة** قد تختلفان، والقارئ يرى الاختلاف
   قبل أن يقرأ المحتوى بكثير: تبدو الصفحة غير منتهية، والصفحةُ التي تبدو
   غير منتهية لا يُؤتمن عليها مال.

   `--pgw` is a variable so a container sets it once and everything inside
   inherits it — which is what makes a journey band and the card beneath it
   line up without either of them naming a number.
   و`--pgw` متغيّرٌ ليضبطه الحاوي مرة فيرثه ما بداخله — وهذا ما يجعل شريط
   المسار والبطاقة تحته يتحاذيان دون أن يسمّي أحدهما رقمًا.
   ═══════════════════════════════════════════════════════════════════ */
.pgw{max-width:var(--pgw,960px)}
.pgw > *{max-width:var(--pgw,960px)}
.pgw--s{--pgw:780px}    /* نموذجٌ بعمودٍ واحد · معالجُ خطوات */
.pgw--m{--pgw:960px}    /* نموذجٌ بعمودين · إعدادات */
.pgw--l{--pgw:1000px}   /* صفحاتُ الزوّار: طلب التسعير ونتيجته */
/* حاويةٌ موسَّطة — تُغني عن `margin:0 auto` مكرّرًا في ستّة مواضع */
.pgc{max-width:var(--pgw,960px);margin-inline:auto}

/* ═══════════════════════════════════════════════════════════════════
   لوحةُ التنبيهات — الجرس يُجيب في مكانه

   The notification panel: the bell answers where it stands.

   A bell that navigates makes every notice a trip: the person leaves what
   they were doing to find out whether it mattered, and after the third
   time that it did not, they stop pressing it. Answering in place is what
   keeps the badge worth looking at.

   والجرسُ الذي ينقُل يجعل كل تنبيهٍ رحلة: يترك المرء ما بيده ليعرف أكان
   يعني شيئًا، وبعد ثالث مرةٍ لم يعنِ فيها شيئًا يكفّ عن ضغطه. والإجابةُ في
   المكان هي ما يُبقي العدّاد جديرًا بالنظر.
   ═══════════════════════════════════════════════════════════════════ */
.bellw{position:relative}
.bellp{position:absolute;inset-inline-end:0;top:calc(100% + 9px);width:340px;
       background:var(--w);border:1px solid var(--line);border-radius:var(--r12);
       box-shadow:var(--sh3);z-index:60;overflow:hidden;
       animation:pp .13s ease}
.bellp[hidden]{display:none}
.bellp__h{display:flex;align-items:center;justify-content:space-between;
          padding:12px 15px;border-bottom:1px solid var(--line2);
          font-size:.86rem;background:var(--n25)}
.bellp__b{max-height:340px;overflow-y:auto}
.bellp__e{padding:26px 15px;text-align:center}
.bellp__f{display:block;padding:11px;text-align:center;font-size:.8rem;
          color:var(--b700);border-top:1px solid var(--line2);
          background:var(--n25);font-weight:600}
.bellp__f:hover{background:var(--b50)}

.bnt{display:flex;gap:10px;padding:12px 15px;border-bottom:1px solid var(--line2);
     transition:var(--t)}
.bnt:last-child{border-bottom:0}
.bnt:hover{background:var(--n25)}
/* النقطة تُميّز غير المقروء — واللونُ وحده لا يكفي من لا يميّزه */
.bnt__d{flex:0 0 auto;width:7px;height:7px;border-radius:50%;margin-top:6px;
        background:transparent}
.bnt--new .bnt__d{background:var(--b500)}
.bnt--new{background:var(--b50)}
.bnt--new:hover{background:var(--b100)}
.bnt__b{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.bnt__b b{font-size:.83rem;color:var(--ink);line-height:1.6}
.bnt__b i{font-style:normal;font-size:.75rem;color:var(--mut2);line-height:1.7}
.bnt__b time{font-size:.7rem;color:var(--mut2)}
@media (max-width:520px){ .bellp{width:min(340px,calc(100vw - 28px))} }

/* ═══════════════════════════════════════════════════════════════════
   مجموعاتُ الحقول — الحقولُ المتصلة تُقرأ سؤالًا واحدًا

   Field groups: related inputs read as one question.

   Thirteen inputs in one grid are thirteen unrelated questions, and the
   national address alone is six of them. The person filling the form holds
   one certificate in their hand; the screen should hold it the same way.

   وثلاثة عشر حقلًا في شبكةٍ واحدة ثلاثةَ عشر سؤالًا لا رابط بينها، والعنوانُ
   الوطني وحده ستّة منها. ومن يملأ النموذج يمسك شهادةً واحدة بيده؛ فحقٌّ على
   الشاشة أن تمسكها كما يمسكها.
   ═══════════════════════════════════════════════════════════════════ */
.fgrp{padding-bottom:6px;margin-bottom:16px;border-bottom:1px solid var(--line2)}
.fgrp:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.fgrp__t{font-size:.78rem;font-weight:600;color:var(--mut);letter-spacing:.02em;
         margin-bottom:11px}

/* ═══════════════════════════════════════════════════════════════════
   عدّادُ الخانات — «٩ / ١٠» في زاوية الحقل

   The digit counter, in the corner of its own field.

   It sits inside the field's own box rather than under the form, because a
   message under the form makes the person hunt for which of eleven inputs
   it means. A rule shown where it is broken needs no hunting.

   ويسكن داخل صندوق الحقل نفسه لا تحت النموذج، لأن رسالةً تحت النموذج تجعل
   المرء يفتّش أيَّ الأحد عشر حقلًا تعني. والقاعدةُ التي تُعرض حيث تُخالَف
   لا تحتاج تفتيشًا.
   ═══════════════════════════════════════════════════════════════════ */
/* ── تحت الحقل، لا فوقه ────────────────────────────────────────
   Absolute positioning put the counter over the field's own text: in a
   right-to-left page the value starts at the right edge and so did the
   counter. A counter that hides what is being counted is worse than none.
   So it is not positioned at all — it is a line of its own between the
   input and its hint, and nothing can ever overlap it.

   والتموضعُ المطلق وضع العدّاد فوق نصّ الحقل: ففي صفحةٍ من اليمين تبدأ
   القيمة من الحافّة اليمنى، وكذلك بدأ العدّاد. وعدّادٌ يُخفي ما يَعدّه أسوأ
   من لا عدّاد. فلم يُموضَع أصلًا — بل صار سطرًا بين الحقل وإرشاده، ولا
   يمكن أن يتراكب مع شيء. */
.inw{display:block}
.lcount{display:block;text-align:end;margin-top:5px;
        font:500 .68rem/1 var(--fn);color:var(--mut2);transition:var(--t)}
.lcount--ok{color:var(--ok)}
.lcount--no{color:var(--wa)}
/* الحقل الناقص يُعلَّم بحدّه — واللون وحده لا يكفي من لا يميّزه */
.in--no{border-color:var(--wa-b);background:var(--wa-l)}
.in--no:focus{border-color:var(--wa);box-shadow:0 0 0 3px var(--wa-l)}
/* الحقل الرقميّ يُقرأ يسارًا حتى في الصفحة العربية — فالأرقام لاتينية */
input[data-len]{direction:ltr;text-align:start}

/* ══════════════════════════════════════════════════════════════════
   نصّ العقد — يُقرأ كما يُطبع لا كما يُخزَّن
   Contract text: read as it prints, not as it is stored.

   البنودُ متتابعة، والعنوانُ فوق بنوده، والمشروطُ مُعلَّمٌ بشرطه. وجدولُ
   صفوفٍ إداريّ يعرض الحقول ولا يعرض المستند — والفرق بينهما هو الفرق
   بين مراجعةٍ ونظرة.
   ══════════════════════════════════════════════════════════════════ */
.clz{position:relative;padding:16px 22px;border-bottom:1px solid var(--ln)}
.clz:last-child{border-bottom:0}
.clz:hover{background:var(--b50)}
.clz__a{position:absolute;inset-inline-end:16px;top:14px;display:flex;gap:6px;
  opacity:0;transition:opacity .12s}
.clz:hover .clz__a,.clz__a:focus-within{opacity:1}
.clz__h{margin:6px 0 2px;font-size:1.06rem;font-weight:700;color:var(--b800)}
.clz__h--2{font-size:.96rem;color:var(--b600);padding-inline-start:14px}
.clz__n{font-family:var(--fn);font-size:.8rem;color:var(--mut);margin-bottom:4px}
.clz__t{line-height:1.85;margin-bottom:6px}

/* ══════════════════════════════════════════════════════════════════
   العقد على الشاشة — بالشكل الذي يخرج به على الورق
   ══════════════════════════════════════════════════════════════════
   والشاشةُ التي تعرض العقد بشكلٍ آخر تجعل العميل يوقّع على ما لم يقرأه
   مرتاحًا: يقرأ سطورًا متتابعة ويوقّع عمودين متقابلين، فيشكّ أنهما مستندان.
   A screen that shows the contract in another shape makes the customer sign
   something they did not comfortably read. */
.cdoc{line-height:1.9}
.cdoc__ph{margin:26px 0 12px;padding-bottom:6px;border-bottom:2px solid var(--ink)}
.cdoc__part:first-child .cdoc__ph{margin-top:0}
.cdoc__ph h2{font-size:1.06rem;margin:0}
.cdoc__ph h2[lang=en]{font-size:.92rem;color:var(--mut);font-weight:600}
.cdoc__no{font-family:var(--fn);font-size:.78rem;color:var(--mut)}
/* العمودان متقابلان صفًّا بصفّ — لا كتلتين متتاليتين */
.cdoc__c{display:flex;gap:18px;padding:9px 0;border-bottom:1px solid var(--line2)}
.cdoc__c:last-child{border-bottom:none}
.cdoc__ar,.cdoc__en{flex:1 1 50%;min-width:0}
.cdoc__en{color:var(--n600);font-size:.94em}
.cdoc__c--note{font-size:.86rem;color:var(--mut);background:var(--n50,#F7F9FB);
  padding-inline:10px;border-radius:8px}
/* ــ وبندٌ شكت خانةٌ فيه يُرى قبل أن يُقرأ ــ
   **ورسالةٌ تقول «في بندٍ ما» في شاشةٍ فيها ثلاثون بندًا رسالةٌ تُرسل قارئَها
   يبحث.** فيُحاط البندُ كلُّه، وتُحمَّر خانتُه، ويُكتب السببُ تحتها.
   The clause that refused is seen before it is read. */
.rw--bad{border-inline-start:3px solid var(--da);padding-inline-start:10px;
  background:var(--da-l);border-radius:var(--r10)}
/* ما صُحِّح بيدٍ قبل الاعتماد — يُعلَّم في الشاشة ولا يدخل الورق أبدًا */
.cdoc__hand{font-size:.72rem;font-weight:700;color:var(--wa);margin:8px 0 -4px}
.cdoc__c--hand{border-inline-start:3px solid var(--wa-b);
  padding-inline-start:9px;background:var(--wa-l)}
.cdoc__h{display:flex;gap:18px;font-weight:700;margin:16px 0 4px}
.cdoc__h>*{flex:1 1 50%;min-width:0}
.cdoc__h--1{font-size:1rem;color:var(--b800);border-bottom:1px solid var(--line);
  padding-bottom:4px}
.cdoc__h--2{font-size:.94rem;color:var(--b600)}
.cdoc__t{width:100%;border-collapse:collapse;margin:10px 0;font-size:.86rem}
.cdoc__t th,.cdoc__t td{border:1px solid var(--line);padding:7px 9px;
  text-align:start;vertical-align:top}
.cdoc__t th{background:var(--n50,#F2F5F8);font-weight:700}
.cdoc__sign{display:flex;gap:18px;margin-top:28px}
.cdoc__sign>div{flex:1 1 50%;border:1px solid var(--line);border-radius:12px;
  padding:14px}
.cdoc__sl{font-size:.78rem;color:var(--mut);margin-bottom:5px}
.cdoc__sv{font-weight:700}
.cdoc__sm{font-size:.86rem;color:var(--n600)}
.cdoc__sline{margin-top:84px;border-top:1px dashed var(--n400,#8A94A2);
  padding-top:5px;font-size:.78rem;color:var(--mut)}
.cdoc__empty{color:var(--mut)}
/* ── وقيمةٌ لم تُدخَل تُقال ولا تُطبع بقوسين ──
   فقوسان في مستندٍ قانونيّ يُقرآن نصًّا نُسي لا خانةً تنتظر. */
.cdoc__gap{background:var(--wa50,#FFF6E5);color:var(--wa,#9A6B00);
  border-bottom:1px dashed currentColor;padding:0 3px;border-radius:3px;
  font-size:.94em;white-space:nowrap}
@media(max-width:820px){.cdoc__c,.cdoc__h,.cdoc__sign{flex-direction:column;gap:6px}}

/* ══════════════════════════════════════════════════════════════════
   قسمٌ يُطوى داخل استمارة — والمطويّ يُقرأ مطويًّا
   ══════════════════════════════════════════════════════════════════
   The default marker is a black triangle in the corner of an otherwise
   designed card: one browser widget shouting in a room of quiet ones. So it
   is replaced by the chevron the rest of the interface already uses.
   والمؤشّر الافتراضيّ مثلثٌ أسود في ركن بطاقةٍ مصمَّمة — عنصرُ متصفّحٍ واحد
   يصرخ في غرفةٍ هادئة. فيُستبدل بالسهم الذي تستعمله الواجهة أصلًا. */
details.card>summary{display:flex;align-items:center;gap:10px;
  user-select:none;transition:background .12s}
details.card>summary::-webkit-details-marker{display:none}
details.card>summary::marker{content:""}
details.card>summary::after{content:"";width:9px;height:9px;flex:0 0 auto;
  border-inline-end:2px solid var(--mut2);border-block-end:2px solid var(--mut2);
  transform:rotate(45deg);margin-inline-start:2px;transition:transform .18s}
details.card[open]>summary::after{transform:rotate(-135deg)}
details.card>summary:hover{background:var(--n50,#F7F9FB)}
details.card[open]>summary{border-block-end:1px solid var(--line2)}

/* ══════════════════════════════════════════════════════════════════
   ألوانٌ أخرى للوسوم — إحدى عشرة مرحلةً لا تسعها ستّة ألوان
   ══════════════════════════════════════════════════════════════════
   Six tones for eleven stages meant three of them shared one blue, and a
   colour shared by three states says nothing: the eye stops using it and
   goes back to reading the words — which is the wall the colour existed to
   remove. So the palette is widened until every state a person must tell
   apart has its own.
   وستّةُ ألوانٍ لإحدى عشرة مرحلةً تعني أن ثلاثًا تشترك في أزرقٍ واحد، واللونُ
   الذي تشترك فيه ثلاثُ حالات لا يقول شيئًا: تكفّ العينُ عن استعماله وتعود
   إلى قراءة الكلمات — وهو الجدارُ الذي وُجد اللون ليزيله. */
:root{
  --cy:#0B6E77; --cy-b:#BFE7EA; --cy-l:#E9F7F8;   /* فيروزي */
  --tl:#1D6F55; --tl-b:#C6E7DA; --tl-l:#EAF6F1;   /* أخضر مزرقّ */
  --or:#9A4E12; --or-b:#F6D8BE; --or-l:#FDF1E7;   /* برتقالي */
  --rs:#9B2C57; --rs-b:#F4CBDC; --rs-l:#FDEDF3;   /* وردي */
  --sl:#41536B; --sl-b:#D3DBE5; --sl-l:#EFF2F6;   /* رمادي أزرق */
}
.t-cy{background:var(--cy-l);color:var(--cy);border-color:var(--cy-b)}
.t-tl{background:var(--tl-l);color:var(--tl);border-color:var(--tl-b)}
.t-or{background:var(--or-l);color:var(--or);border-color:var(--or-b)}
.t-rs{background:var(--rs-l);color:var(--rs);border-color:var(--rs-b)}
.t-sl{background:var(--sl-l);color:var(--sl);border-color:var(--sl-b)}

/* ══════════════════════════════════════════════════════════════════
   شريطُ الفلاتر — الحقولُ في سطر، والتلميحاتُ تحتها كلِّها
   ══════════════════════════════════════════════════════════════════
   A hint under one field pushes that field up and leaves its neighbours
   hanging: one line of text and the whole row stops being a row. So the
   hints come out from between the fields and sit under all of them.
   وتلميحٌ تحت حقلٍ واحد يرفعه ويترك جيرانه معلَّقين: سطرُ نصٍّ واحد ويكفّ
   الصفُّ عن أن يكون صفًّا. فتخرج التلميحات من بين الحقول وتستقرّ تحتها كلِّها. */
.fbar{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.fbar>.fl{margin:0;display:flex;flex-direction:column;justify-content:flex-end}
.fbar>.fl>label{min-height:20px}
.fbar>.fl>.hint{display:none}          /* التلميح لا يسكن بين الحقول */
.fbar__go{flex:0 0 auto}
.fbar__hint{margin-top:9px;padding-top:9px;border-top:1px solid var(--line2);
  font-size:.79rem;color:var(--mut);line-height:1.8}

/* ══════════════════════════════════════════════════════════════════
   المنتقي: نصٌّ لا يُقصّ، وخيارٌ يُقرأ كاملًا
   ══════════════════════════════════════════════════════════════════
   A name cut mid-word in a picker is a name the reader completes by guessing.
   واسمٌ مقصوصٌ في منتصف كلمةٍ اسمٌ يُكمله القارئ تخمينًا. */
.cmb__in{text-overflow:ellipsis}
.cmb__opt{white-space:normal;line-height:1.7;padding-block:8px}
.cmb__pop{max-height:min(60vh,380px)}

/* عددٌ يقول «ينقصك شيء» لا مجرّد صفر — والصفرُ هنا مانعُ تفعيل */
.adm__n--wa{background:var(--wa-l);color:var(--wa);border-color:var(--wa-b)}

/* ══════════════════════════════════════════════════════════════════
   لمسةُ الأزرق في الاستمارات الطويلة — لتكسر الجمود
   ══════════════════════════════════════════════════════════════════
   Six identical white cards stacked down a page read as one long page, and a
   page with no landmark is a page you scroll rather than navigate. A hairline
   of brand colour on each section head is enough to make them countable
   without adding a single word.
   وستُّ بطاقاتٍ بيضاء متطابقة تُقرأ صفحةً واحدةً طويلة، والصفحةُ بلا معلَمٍ
   تُمرَّر ولا تُتصفَّح. وشعرةٌ من لون الهويّة على رأس كل قسم تكفي لتصير
   معدودةً بلا كلمةٍ واحدة تُضاف. */
.card--f>.ch,details.card>summary{position:relative}
.card--f>.ch::before,details.card>summary::before{content:"";position:absolute;
  inset-block:14px auto;height:18px;width:3px;border-radius:2px;
  inset-inline-start:0;background:var(--b400)}
.card--f>.ch,details.card>summary{padding-inline-start:20px}
.card--f>.ch h3,details.card>summary h3{color:var(--b800)}

/* ══════════════════════════════════════════════════════════════════
   معالج المستودع — ما هو جديدٌ فعلًا وحده
   ══════════════════════════════════════════════════════════════════
   ── والاسمُ المأخوذ ليس اسمًا ──
   كتبتُ أوّلَ الأمر `.wstep` و`.pick` لهذه الشاشة، وكلاهما مملوكٌ منذ بُني
   النظام: الأولى لشريط معالج عرض السعر، والثانية لبطاقات الخيار المضغوطة.
   ولا استيراد في الـCSS ولا نطاق ولا خطأ — تغلب القاعدة المتأخّرة فتتبعثر
   شاشةٌ لم يفتحها كاتبها. فحُذفتا، واستُعمل المكوّنان القائمان كما هما.

   I first wrote `.wstep` and `.pick` for this screen; the design system has
   owned both since it was built — the quote wizard's step strip and the
   compact option cards. CSS has no import, no namespace and no error: the
   later rule simply wins, and a screen the author never opened scatters. So
   they were deleted and the existing components used unchanged.

   ولم يبقَ هنا إلا ما ليس له مالك. */

/* رأسُ الخطوة — الرقمُ والعنوان والسؤال الذي تجيبه */
.wh__hd{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}
.wh__k{flex:none;width:44px;height:44px;border-radius:12px;display:grid;
  place-items:center;background:var(--b50);color:var(--b700);border:1px solid var(--b200);
  font-family:var(--fn);font-size:1.02rem;font-weight:800}
.wh__hd h2{font-size:1.06rem;font-weight:700;color:var(--ink);margin:0 0 3px}
.wh__hd p{font-size:.82rem;color:var(--mut);line-height:1.75;margin:0}

/* شريطُ التنقّل أسفل الخطوة — «السابق» في أوّل السطر وأزرارُ الحفظ في آخره */
.wnav{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.wnav>.sp{flex:1 1 auto;min-width:12px}
.wnav>button,.wnav>.btn:last-child{flex:none}

/* الخطوةُ التي لم تُبلغ بعد — تُرى ولا تُنقر */
.wstep.off{opacity:.5;pointer-events:none;cursor:default}

/* بطاقةُ نقصٍ في شاشة المراجعة — و`.gap` اسمٌ عامّ لا يُحجَز في ورقةٍ مشتركة */
.wgap{display:flex;gap:11px;align-items:flex-start;padding:12px 14px;
  border:1px solid var(--line);border-radius:var(--r8);background:var(--w)}
.wgap+.wgap{margin-top:9px}
.wgap--b{border-color:var(--da-b);background:var(--da-l)}
.wgap--s{border-color:var(--wa-b);background:var(--wa-l)}
.wgap__i{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center}
.wgap__i svg{width:13px;height:13px}
.wgap--b .wgap__i{background:var(--da-b);color:var(--da)}
.wgap--s .wgap__i{background:var(--wa-b);color:var(--wa)}
.wgap__t{font-size:.83rem;color:var(--ink2);line-height:1.8}

/* ══════════════════════════════════════════════════════════════
     خانةُ التاريخ اليوميّة — نصٌّ نملك شكلَه ومنتقٍ بجانبه
   ══════════════════════════════════════════════════════════════
   الصندوقُ الأصليّ لا يُخفى بـ`display:none` — فالمتصفّح يرفض
   `showPicker()` على ما لا يُعرض. فيُصغَّر ويُوضع تحت الزرّ.
   A hidden control cannot open its own picker. */
.dtf{position:relative;display:block;width:100%}
.dtf .in{padding-inline-end:40px}
.dtf__pick{position:absolute;inset-inline-end:10px;top:50%;width:1px;height:1px;
  opacity:0;pointer-events:none;border:0;padding:0;margin:0}
.dtf__btn{position:absolute;inset-inline-end:4px;top:50%;transform:translateY(-50%);
  display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;
  border:0;border-radius:8px;background:transparent;color:var(--n500);cursor:pointer}
.dtf__btn:hover{background:var(--n100);color:var(--n700)}
.dtf__btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}

/* ══════════════════════════════════════════════════════════════
     جدولٌ يتّسع — `tbl-w--fit` + `tb--fit`
   ══════════════════════════════════════════════════════════════
   بلاغ محمد ٢٠٢٦-٠٨-١٦: «شيء كريه ومتعب متعلق بالسكرول الجانبي… لا تكون
   الأعمدة ظاهرة كلها ونحتاج للتحريك يسارًا».

   ── وأربعةُ حلولٍ تجتمع ──
   ١ · حشوٌ أضيق · ٢ · وسطران حيث لا يشوّه · ٣ · العمودُ الأوّل مثبَّت ·
   ٤ · منتقي أعمدةٍ يُخفي ما لا يُقرأ اليوم.

   ── ولا صنفَ على خليّةٍ واحدة ──
   الأصنافُ التي تقرؤها هذه القواعد (`nw` و`tg` و`num`) مكتوبةٌ في القوالب
   منذ بُنيت. **وحلٌّ يقتضي وسمَ كلِّ خليّةٍ حلٌّ يُطبَّق في شاشتين ثم
   يُملّ** — فلا يحتاج القالبُ إلا صنفين على حاويته وجدوله.

       > **وعلاجٌ ثمنُه لمسةٌ في كلّ خليّة علاجٌ لا يبلغ الشاشةَ العاشرة.**

   A remedy priced per cell never reaches the tenth screen. */
table.tb--fit{min-width:0}
table.tb--fit th,table.tb--fit td{padding:11px 12px}

/* ١ · وسطران حيث لا يشوّه — **والاسمُ الطويل لا يفرض عرضَه على الجدول كلِّه**
   ── ويُكسر عند المسافات لا داخل الكلمة ──
   فلا `overflow-wrap:anywhere` هنا: **ورمزٌ يُقصّ نصفين رمزٌ يُقرأ خطأً**،
   و`SP260001` بلا مسافةٍ فيه فيبقى كما هو، والاسمُ ذو الكلمات يلتفّ.
   ── وللكسر حدٌّ أدنى ──
   بلا `min-width` يواصل العمودُ الضيقَ حتى يصير الوسمُ برجًا من أربعة
   أسطر: **فيختفي التمريرُ ويحلّ محلَّه تشويهٌ أسوأ منه**. */
table.tb--fit td.nw{white-space:normal;min-width:126px;max-width:210px;
  line-height:1.5}
table.tb--fit td.tg{white-space:normal;min-width:132px}
table.tb--fit td.tg .tag{white-space:normal;text-align:start}
/* والملاحظةُ تحت الرقم كانت تفرض على عموده عرضَ جملةٍ كاملة */
table.tb--fit td.num{white-space:normal}
table.tb--fit td.num>b,table.tb--fit td.num>.n{white-space:nowrap}
table.tb--fit td.num>div{min-width:104px;max-width:150px;
  margin-inline-start:auto;white-space:normal;line-height:1.45}

/* ٢ · والعمودُ الأوّل لا يغادر الشاشة ──
   **وصفٌّ يُقرأ وقد غاب مُعرِّفُه صفٌّ يُقرأ بالتخمين** — وهو المتعب لا
   التمرير. والحافّةُ منطقيّة (`inline-end`) فتصحّ في الاتجاهين.
   The row keeps its name while the rest of it scrolls. */
.tbl-w--fit table.tb--fit>thead>tr>th:first-child,
.tbl-w--fit table.tb--fit>tbody>tr>td:first-child{position:sticky;
  inset-inline-start:0;z-index:3;background:#fff;
  border-inline-end:1px solid var(--line2)}
.tbl-w--fit table.tb--fit>thead>tr>th:first-child{top:0;z-index:5;
  background:var(--n25)}
.tbl-w--fit table.tb--fit>tbody>tr:hover>td:first-child{
  background:var(--b50,#F2F7FC)}
/* ── وخليّةُ «لا نتائج» تمتدّ على الجدول كلِّه فلا تُثبَّت ──
   **وخليّةٌ عريضةٌ تُثبَّت تُسمَّر فوق ما يُمرَّر تحتها.** */
.tbl-w--fit table.tb--fit td[colspan]{position:static}

/* ٢-ب · وأكثرُ من عمودٍ يثبت حيث يلزم أكثرُ من عمودٍ ليُعرف الصفّ ──
   بلاغ محمد ٢٠٢٦-٠٨-٢٤: «ينبغي تثبيت عمودي الاسم بالعربية والانجليزية عند
   الانتقال يسارا».

   في الجداول المرجعية يتصدّر الصفَّ عمودُ سهمَي الترتيب — سبعون بكسلًا لا
   تقول شيئًا عن الصفّ. **وتثبيتُ الأوّل وحدَه هناك يثبّت سهمَين ويترك
   الاسمَ يمرّ**، فيبقى القارئ بلا مرساة وقد دُفع ثمنُ التثبيت.

   فالعددُ يُعلَن في الحاوية: `data-freeze="3"` = الأسهمُ والاسمان.
   والإزاحاتُ تُقاس ولا تُخمَّن — انظر `--c1`/`--c2` في `base.html`؛
   والقيمُ هنا تقديرٌ يعمل قبل أن يصل السكربت. */
.tbl-w--fit[data-freeze] table.tb--fit{--c1:74px;--c2:164px}
.tbl-w--fit[data-freeze="2"] table.tb--fit>thead>tr>th:nth-child(2),
.tbl-w--fit[data-freeze="2"] table.tb--fit>tbody>tr>td:nth-child(2),
.tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:nth-child(2),
.tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr>td:nth-child(2){
  position:sticky;inset-inline-start:var(--c1,74px);z-index:3;background:#fff}
.tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:nth-child(3),
.tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr>td:nth-child(3){
  position:sticky;inset-inline-start:var(--c2,164px);z-index:3;background:#fff}
.tbl-w--fit[data-freeze="2"] table.tb--fit>thead>tr>th:nth-child(2),
.tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:nth-child(2),
.tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:nth-child(3){
  top:0;z-index:5;background:var(--n25)}
.tbl-w--fit[data-freeze="2"] table.tb--fit>tbody>tr:hover>td:nth-child(2),
.tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr:hover>td:nth-child(2),
.tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr:hover>td:nth-child(3){
  background:var(--b50,#F2F7FC)}
/* والحدُّ يقول «هنا انتهى الثابت» — فيقف عند آخر عمودٍ مثبَّت وحدَه */
.tbl-w--fit[data-freeze="2"] table.tb--fit>thead>tr>th:first-child,
.tbl-w--fit[data-freeze="2"] table.tb--fit>tbody>tr>td:first-child,
.tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:first-child,
.tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr>td:first-child,
.tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:nth-child(2),
.tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr>td:nth-child(2){
  border-inline-end:0}
.tbl-w--fit[data-freeze="2"] table.tb--fit>thead>tr>th:nth-child(2),
.tbl-w--fit[data-freeze="2"] table.tb--fit>tbody>tr>td:nth-child(2),
.tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:nth-child(3),
.tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr>td:nth-child(3){
  border-inline-end:1px solid var(--line2)}
/* ── والمثبَّتُ لا يبتلع الشاشة ──
   **وثلاثةُ أعمدةٍ مثبَّتة في تسعمئة بكسل ثلاثةُ أعمدةٍ لا يبقى بعدها ما
   يُمرَّر** — فيُفكّ الثالثُ ثم الثاني كلّما ضاقت. */
@media(max-width:900px){
  .tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:nth-child(3),
  .tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr>td:nth-child(3){
    position:static;border-inline-end:0}
  .tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:nth-child(2),
  .tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr>td:nth-child(2){
    border-inline-end:1px solid var(--line2)}
}
@media(max-width:640px){
  .tbl-w--fit[data-freeze="2"] table.tb--fit>thead>tr>th:nth-child(2),
  .tbl-w--fit[data-freeze="2"] table.tb--fit>tbody>tr>td:nth-child(2),
  .tbl-w--fit[data-freeze="3"] table.tb--fit>thead>tr>th:nth-child(2),
  .tbl-w--fit[data-freeze="3"] table.tb--fit>tbody>tr>td:nth-child(2){
    position:static;border-inline-end:0}
}

/* ٣ · منتقي الأعمدة — **وعمودٌ يُعرض لأنه موجود لا لأنه يُقرأ عمودٌ يدفع
   ثمنَه غيرُه.** ويُبنى من `base.html` لكلّ حاويةٍ تحمل `data-cols`. */
.cols__bar{position:relative;display:flex;gap:9px;align-items:center;
  padding:10px 14px;border-bottom:1px solid var(--line2)}
.cols__pop{position:absolute;inset-inline-start:14px;top:calc(100% + 6px);
  z-index:40;min-width:200px;max-height:60vh;overflow:auto;padding:7px;
  background:#fff;border:1px solid var(--line);border-radius:var(--r12);
  box-shadow:0 12px 28px rgba(16,24,40,.12)}
.cols__i{display:flex;align-items:center;gap:9px;padding:7px 9px;
  border-radius:8px;font-size:.83rem;color:var(--ink);cursor:pointer}
.cols__i:hover{background:var(--n50)}
.cols__i input{width:15px;height:15px;accent-color:var(--b600);cursor:pointer}

/* ══════════════════════════════════════════════════════════════
     نافذةٌ فوق الشاشة — .modal-scrim / .modal
   ══════════════════════════════════════════════════════════════
   لم يكن في النظام نافذةٌ مركزية: كلُّ سؤالٍ يُطرح كان يُطرح بصفحةٍ ثانية
   أو بـ`confirm()` من المتصفّح — **و`confirm()` يوقف المتصفّحَ ويقطع
   الجلسةَ عن الإضافة**، ولذلك مُنع في هذا المستودع.

   وتجزئةُ سطرٍ إلى عشر طبليات سؤالٌ لا يُجاب بنعم/لا ولا يستحقّ صفحةً:
   **جدولٌ يُولَّد ويُحرَّر ويُرى قبل أن يُطبَّق.**

   ــ ويُكتب في النظام لا في القالب ــ
   **ونمطٌ يُكتب داخل شاشةٍ نمطٌ يُنسخ إلى الثانية ثم يفترقان.**
   A pattern written inside one screen is copied into the next, then drifts.
   ══════════════════════════════════════════════════════════════ */
.modal-scrim{position:fixed;inset:0;z-index:200;background:rgba(10,22,36,.44);
  display:grid;place-items:center;padding:26px 14px;overflow:auto}
.modal-scrim[hidden]{display:none !important}
/* ــ والنافذةُ تعلو ولا تطول ــ
   بلاغ محمد ٢٠٢٦-٠٨-٢٩: «عند إضافة العدد واختيار املأ لا يمكن الصعود
   للأعلى ويختفي خيار العدد مع زر املأ!»

   وكانت النافذةُ تطول بطول جدولها، فيطول الظرفُ (`.modal-scrim`) ويُمرَّر
   هو — **فيخرج شريطُ الملء من أعلاها والأزرارُ من أسفلها، ويبقى في الرؤية
   وسطٌ لا يُفعل فيه شيء**. وأربعون طبليةً أربعون صفًّا.

       > **ونافذةٌ تطول بمحتواها نافذةٌ يخرج منها ما يُفعل ويبقى ما يُقرأ.**

   فصارت عمودًا مرنًا: رأسٌ ثابت، وشريطُ ملءٍ ثابت، **وجدولٌ وحدَه يُمرَّر**،
   وذيلٌ ثابتٌ فيه المجموعُ والأزرار.
   The dialog grows in place: only its table scrolls. */
.modal{width:100%;max-width:760px;background:var(--w);border-radius:var(--r16);
  box-shadow:var(--s5);overflow:hidden;animation:pp .22s cubic-bezier(.34,1.4,.64,1);
  max-height:calc(100vh - 52px);display:flex;flex-direction:column}
.modal>.ch{padding:16px 20px;flex:none}
/* ══════════════════════════════════════════════════════════════
     ونافذةُ الجدول أوسعُ من نافذة السؤال — بلاغ محمد ٢٠٢٦-٠٩-٠٤
   ══════════════════════════════════════════════════════════════
   > «خانة الموقع في صفحة التجزئة صغيرة، هل يمكن أن نجعل النافذة المنبثقة
   >  نفسها أعرض قليلًا؟»

   و٧٦٠ بكسل عرضٌ يكفي سؤالًا بزرّين، **وسبعةُ أعمدةٍ فيه سبعُ خاناتٍ لا
   يُقرأ في إحداها إلّا ثلاثةُ أحرف** — والموقعُ أطولُها نصًّا وأضيقُها
   مكانًا.

       > **وعرضٌ واحدٌ لكلّ النوافذ عرضٌ يُفصَّل على أضيقها فيضيق بأوسعها.**

   فصار للجدول عرضُه: `.modal--wide`، ويبقى ٧٦٠ لما دونه. والنسبةُ تحكم
   دونه فينكمش على الشاشات الضيّقة بلا تمرير أفقيّ.
   A dialog that holds a seven-column table is not a two-button question. */
.modal--wide{max-width:1060px}
/* ══════════════════════════════════════════════════════════════
     وجسمُ النافذة يُمرَّر متى ضاق — بلاغ محمد ٢٠٢٦-٠٩-٠٤
   ══════════════════════════════════════════════════════════════
   > «انظر كيف ترتيب العناصر في جدول التجزئة وزر إضافة سطر، كلها فوق
   >  بعضها!»

   كان `overflow:hidden`، ولوعاء الجدول أرضيّةٌ لا ينزل عنها (`min-height`).
   **فحين يضيق ارتفاعُ الشاشة عن مجموع ما في الجسم لا ينكمش أحدُهم ولا
   يُمرَّر شيء** — فيفيض الذيلُ فوق الجدول، ويُقرأ كأنّ العناصر ركبت بعضَها.

       > **ووعاءٌ لا ينكمش ولا يُمرَّر وعاءٌ يدفع محتواه فوق بعضه** — ولا
       > يظهر ذلك إلّا على شاشةٍ قصيرة، وهي شاشةُ من يعمل على حاسب محمول.

   فيُمرَّر الجسمُ متى فاض. والجدولُ يبقى له تمريرُه، فيُقرأ فيه سطرٌ وسطر.
   A box that neither shrinks nor scrolls stacks its children on each other. */
.modal>.cb{padding:18px 20px;display:flex;flex-direction:column;
  min-height:0;flex:1 1 auto;overflow-x:hidden;overflow-y:auto}
.modal>.cf{border-radius:0;flex:none}
/* وما يُمرَّر هو الجدولُ وحدَه */
.modal .fillbar,.modal__foot{flex:none}
/* ــ وجدولُ النافذة لا يفرض عرضًا أوسع من ظرفه ــ
   **وحدٌّ أدنى ٨٢٠ في صندوقٍ عرضُه ٧٦٠ حدٌّ يُنتج تمريرًا أفقيًّا في
   نافذة** — وهي أضيقُ ما تُقرأ فيه. */
.modal .tbl-w table{min-width:0}
/* ══════════════════════════════════════════════════════════════
     وحقولُ نافذة التجزئة تملأ خلاياها — بلاغ محمد ٢٠٢٦-٠٨-٣٠
   ══════════════════════════════════════════════════════════════
   > «علامة الحذف في النهاية لا تظهر الا اذا انتقل للخانات عن طريق tab…
   >  حاول أن تضبط الاعمدة واضف سكرول للاحتياط.»

   كانت الحقولُ بعرضٍ ثابتٍ بالبكسل داخل خلايا بالنسبة، **فمجموعُها يتجاوز
   ظرفَه ويخرج آخرُ عمودٍ من الحافة** — وهو عمودُ الحذف.

       > **وحقلٌ لا ينكمش بانكماش خليّته حقلٌ يدفع جارَه خارج الشاشة.**

   ── والتمريرُ احتياطٌ لا قاعدة ──
   `overflow:auto` تُظهر الشريطَ متى لزم وتُخفيه متى لم يلزم؛ و`min-width`
   صغيرٌ يمنع انسحاقَ الخلايا إلى ما لا يُقرأ. Fluid fields; a bar only
   when one is truly needed. */
.sp__t td .in{width:100%;min-width:0}
.sp__t{min-width:520px}
/* ── والمرنُ يأخذ ما بقي، لا ما يحتاجه محتواه ──
   `flex:1 1 auto` تجعل أساسَه ارتفاعَ محتواه، **فأربعون صفًّا تجعل الوعاءَ
   أربعين صفًّا** ثم يُقصّ عند حدّ النافذة بلا شريط — فيختفي نصفُ الجدول
   ولا يُعرف أنه هناك. و`0%` تجعله يأخذ الباقي من النافذة فيُمرَّر فيه.

       > **ووعاءٌ يتّسع لمحتواه وعاءٌ لا يُمرَّر، وإنما يُقصّ عند حافة
       > ظرفه** — والمقصوصُ لا شريطَ يدلّ عليه.
   A flex item sized to its content never scrolls; it is simply clipped. */
/* ــ وجدولٌ لا يُرى منه سطرٌ جدولٌ لا يُراجَع ــ
   بلاغ محمد ٢٠٢٦-٠٩-٠٣: «يظهر لي الجدول الذي توزع فيه الطبليات صغيرًا وغير
   قابل للقراءة (لا يظهر إلا سطر أو أصغر من سطر في الشاشة)».

   ووعاءُ التمرير `flex:1 1 0%` يأخذ ما بقي بعد الشريط، **فشريطٌ يطول يبتلع
   الجدولَ الذي وُجدت النافذةُ لأجله** — والنافذةُ كلُّها مبنيّةٌ على أن
   يُراجَع فيها ما بُني قبل أن يُطبَّق.

       > **ونافذةٌ تعرض جدولًا لا يُرى منه سطرٌ نافذةٌ تُطبَّق على غير
       > مقروء.**

   فله أرضيّةٌ لا ينزل عنها — نحو خمسة أسطر — ويبقى ما فوقها للشريط.
   A scroll box with no floor is a table nobody reads. */
.modal__scroll{flex:1 1 0%;min-height:214px;overflow-x:auto;overflow-y:auto}
@media(max-height:700px){.modal__scroll{min-height:150px}}
/* ── والغلافُ الذي يُدسّ بينهما يرث ما وُضع لهما ──
   يلفّ سكربتُ الحوافّ (`tbl-edge`) كلَّ جدولٍ يُمرَّر ليرسم ظلَّ الحافة،
   **فيقع بين وعاء النافذة ووعاء التمرير** بـ`display:block` و`flex:0 1
   auto` — فيتّسع لمحتواه ويُبطل ما وُضع لابنه.

       > **وغلافٌ يُدسّ بين والدٍ وابنه غلافٌ يقطع كلَّ قاعدةٍ تربطهما** —
       > ولا يُرى في المصدر لأنه لم يُكتب فيه.

   A wrapper injected between the flex parent and its item severs the rule
   that binds them — and it is not in the source, so it is not suspected. */
.modal .tbl-edge{flex:1 1 0%;min-height:0;display:flex;flex-direction:column}
/* ــ وزرٌّ يسع اسمَه ــ
   **وزرٌّ لا يسع اسمَه زرٌّ يُقرأ نصفُه** — والنصفُ يقول غير ما يقوله الكلّ.
   فيلفّ النصُّ داخله بدل أن يخرج منه. A button must contain its own name. */
.btn--wrap{white-space:normal;text-align:center;line-height:1.35;
  width:100%;justify-content:center}
/* ــ وشريطُ الملء يُقرأ سطرًا واحدًا ــ
   حقلان وزرّان و«أو» بينهما: **ولو نزلوا أسطرًا لقُرئوا خطواتٍ متتابعة**
   وهما طريقان بديلان لا خطوتان. */
.fillbar{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;
  padding:13px 15px;background:var(--b50);border:1px solid var(--b200);
  border-radius:var(--r10);margin-bottom:16px}
.fillbar .fl>label{font-size:.75rem;margin-bottom:5px}
/* ــ والطبليةُ الناقصة تُرى بلونها ــ
   **وتوزيعٌ بالتساوي يُخفي أنّ طبليةً ناقصة**، فتُقرأ العشرُ متساويةً
   وهي ليست. A pallet that is not like its sisters says so. */
tr.pal-rem>td{background:var(--wa-l)}
tr.pal-mix>td{background:var(--pu-l)}
.pmix{color:var(--pu)}
/* ــ ولكلّ تشغيلةٍ شريطُ لونٍ على حافّتها ــ
   **ورؤيةُ ٢٥ و٢٥ بنظرةٍ خيرٌ من قراءة خمسين سطرًا للتأكّد** — والسطرُ
   الشاذّ يظهر لونُه وسط جيرانه قبل أن يصير رصيدًا في الدفتر.
   A colour band per batch: the odd row shows itself among its neighbours. */
tr.sp-lot>td:first-child{border-inline-start:3px solid transparent}
tr.sp-lot0>td:first-child{border-inline-start-color:var(--b500,#2F6FEB)}
tr.sp-lot1>td:first-child{border-inline-start-color:var(--ok,#1E7F4F)}
tr.sp-lot2>td:first-child{border-inline-start-color:var(--wa,#9A6300)}
tr.sp-lot3>td:first-child{border-inline-start-color:var(--pu,#6B4FBB)}
tr.sp-lot4>td:first-child{border-inline-start-color:var(--da,#B3261E)}
tr.sp-lot5>td:first-child{border-inline-start-color:var(--mut,#6B7683)}

/* ══════════════════════════════════════════════════════════════
     سطرُ العميل أبٌ، وطبلياتُه أبناءٌ تُطوى تحته
   ══════════════════════════════════════════════════════════════
   قرار محمد ٢٠٢٦-٠٨-٢٧: سطرٌ = طبلية. **وعشرُ طبلياتٍ عشرةُ أسطرٍ متجاورة
   لا يُعرف من أيّها سطرُ العميل** — فتُقرأ الشاشةُ عشرةَ أصنافٍ وهي صنفٌ
   واحد.

       > **وشاشةٌ تعرض التوزيعَ كما تعرض الأصلَ شاشةٌ تُخفي أنّ أحدَهما
       > قسمةُ الآخر.**

   والرأسُ رماديٌّ لا يُحرَّر، والأبناءُ مزاحون بسكّةٍ تصلهم به.
   ══════════════════════════════════════════════════════════════ */
tr.fam > td{background:var(--n50);border-bottom:1px solid var(--n200);
  padding:11px 18px;font-size:.87rem}
tr.fam .b6{font-weight:700}
tr.rcl.kid > td:first-child{position:relative;padding-inline-start:38px}
/* ــ والسكّةُ تصل الابنَ بأبيه ــ
   **وإزاحةٌ بلا خطٍّ إزاحةٌ تُقرأ خللًا في المحاذاة** لا انتماءً. */
tr.rcl.kid > td:first-child::before{content:"";position:absolute;
  inset-block:0;inset-inline-start:19px;width:2px;background:var(--b200)}
tr.rcl.kid > td{background:var(--b50)}
tr.rcl.kid:hover > td{background:var(--b100)}
/* ــ والسهمُ يُقلب لا يُبدَّل ــ
   **وأيقونتان لحالتين أيقونةٌ تُنسى إحداهما يومَ تُبدَّل الأخرى.** */
.chev{display:inline-grid;place-items:center;width:24px;height:24px;
  border-radius:var(--r6);border:1px solid var(--n300);background:var(--w);
  cursor:pointer;vertical-align:-6px;margin-inline-end:9px;transition:var(--t)}
.chev:hover{border-color:var(--b400);background:var(--b50)}
.chev svg{width:13px;height:13px;transition:transform .18s}
.chev.on svg{transform:rotate(-90deg)}
html[dir=ltr] .chev.on svg{transform:rotate(90deg)}

/* ══════════════════════════════════════════════════════════════
     عينٌ تُظهر كلمةَ المرور — قرار محمد ٢٠٢٦-٠٨-٢٧
   ══════════════════════════════════════════════════════════════
   **وكلمةُ مرورٍ تُكتب مخفيّةً ولا تُرى كلمةٌ تُكتب مرّتين ثم يُشكّ فيها.**
   والزرُّ خارجُ ترتيبِ التنقّل (`tabindex="-1"`): **وزرٌّ يقع بين الخانة
   وأختها زرٌّ يُضغط بـTab سهوًا فتنكشف الكلمةُ ولا يدري صاحبُها.**
   ══════════════════════════════════════════════════════════════ */
.pw__box{position:relative;display:block}
.pw__box>.in{padding-inline-end:44px}
.pw__eye{position:absolute;inset-inline-end:6px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;display:grid;place-items:center;border:0;background:none;
  border-radius:var(--r6);color:var(--mut2);cursor:pointer;transition:var(--t)}
.pw__eye:hover{background:var(--n100);color:var(--ink2)}
.pw__eye:focus-visible{outline:2px solid var(--b500);outline-offset:1px}
.pw__eye svg{width:17px;height:17px}
/* ــ وحين تُكشف تُقال إنها مكشوفة ــ
   **وزرٌّ لا يتغيّر حين يُضغط زرٌّ يُظنّ أنه لم يعمل.** */
.pw__eye.on{color:var(--b600);background:var(--b50)}

/* ══════════════════════════════════════════════════════════════════
     بطاقةُ المفوَّض — بلاغ محمد ٢٠٢٦-٠٨-٢٨
   ══════════════════════════════════════════════════════════════════
   > «خيار التعديل على الممثلين غير واضح أبدًا بعد الإضافة وكأنه أسطر
   >  مكتوبة بشكل عادي. حسّن المظهر في عرض المفوضين بعد الإضافة واجعل زر
   >  التعديل واضحًا.»

   كان الصفُّ `.kv` — سطرَ «مفتاح: قيمة» بلا إطار — وزرُّه `b-gh` شبحيٌّ بلا
   حدٍّ ولا أيقونة. **وزرٌّ بلا إطارٍ في سطرٍ بلا إطارٍ زرٌّ يُقرأ كلمةً في
   جملة** — فلا يُنقر، ويُحذف الصفُّ ويُكتب من جديد لتصحيح حرف.

       > **وما لا يُرى أنه يُنقَر لا يُنقَر.**

   A ghost button on a borderless row reads as a word in a sentence. */
.dcard { display: flex; gap: 12px; align-items: flex-start;
         border: 1px solid var(--line2); border-radius: var(--r10);
         padding: 12px 14px; margin-bottom: 10px; background: #fff; }
.dcard__b { flex: 1 1 auto; min-width: 0; }
.dcard__a { flex: 0 0 auto; display: flex; gap: 6px; align-items: center; }
/* وبطاقةُ الممثّل تُعرَف من طرفها — فهي التي لا تُحذف. */
.dcard--sig { border-inline-start: 3px solid var(--ok); background: var(--ok-l); }

/* ── وزرُّ الرفع يقول إنه يعمل، وإخوتُه يُقفلون — ٢٠٢٦-٠٨-٢٨ ──
   **وفعلان يتنافسان على انتقالٍ واحد فعلٌ يفوز وآخرُ يختفي بلا رسالة.** */
.btn.up.is-busy { opacity: .75; pointer-events: none; }
.btn.up.is-off { opacity: .38; pointer-events: none; filter: grayscale(1); }

/* ══════════════════════════════════════════════════════════════
     خانةُ الجوال — كودٌ يُختار ورقمٌ يُكتب
   ══════════════════════════════════════════════════════════════
   قرار محمد ٢٠٢٦-٠٨-٢٨. والصندوقان في سطرٍ واحد: **وكودٌ ينزل تحت رقمه
   كودٌ يُقرأ حقلًا آخر** فيُملأ مرّتين أو يُترك.

   والكودُ لا يتمدّد (`flex:0 0`) والرقمُ يأخذ ما بقي — فالكودُ ثابتُ الطول
   والرقمُ هو الذي يُقرأ.
   The code is fixed-width; the number takes the rest, because the number is
   what anyone reads back. */
/* ══════════════════════════════════════════════════════════════
     خانةُ الجوال — صندوقٌ واحدٌ فيه كودٌ ورقم
   ══════════════════════════════════════════════════════════════
   قرار محمد ٢٠٢٦-٠٨-٢٨: «ينبغي دائمًا أن يكون فتح الخط يسارًا حتى في
   الصفحة العربية! أيضًا هل يمكن أن تكون الخانتين مدمجة بدلًا من فصلهما؟»

   ── ١ · والاسمُ `fone` لا `ph` ──
   `.ph` مأخوذٌ منذ السطر ٥٧٣ لرأس الصفحة، وفيه `flex-wrap:wrap`. فلمّا
   سُمِّيت الخانةُ باسمه ورثت اللفَّ الذي لم يُكتب لها — و`.in{width:100%}`
   تجعل أساسَ الرقم مئةً في المئة، **فانفصل الصندوقان سطرين على شاشةٍ
   عرضُها ألفٌ ومئتان**.

       > **واسمٌ يُختار وقد أُخذ اسمٌ يرث أنماطًا لم تُكتب له.**

   ── ٢ · والاتّجاهُ لاتينيٌّ ولو كانت الصفحة عربية ──
   `+966 50 123 4567` رقمٌ دوليٌّ يُقرأ ويُملى من يساره في كلّ لغة — هكذا
   يُطبع على البطاقات والمستندات وفي كلّ تطبيقٍ يعرفه الناس. **ورقمٌ يُقلب
   ليوافق اتجاهَ الصفحة رقمٌ يُقرأ بالعكس ويُملى بالعكس**، فيُراجَع بالعين
   خانةً خانةً في كلّ مرّة.

   فـ`direction:ltr` على الحاوية وحدَها: الكودُ يسارًا والرقمُ إلى يمينه،
   والصفحةُ من حولها عربيةٌ كما هي — واللصاقةُ فوقها والتلميحُ تحتها يبقيان
   على اتجاه الصفحة. The number reads left-to-right in every language.

   ── ٣ · وصندوقٌ واحدٌ لا صندوقان ──
   **وصندوقان متجاوران لشيءٍ واحد صندوقان يُقرآن حقلين** — فيُملأ أحدهما
   ويُترك الآخر على افتراضه بلا نظرٍ إليه. فالحدُّ على الحاوية، والداخلان
   بلا حدٍّ ولا خلفية، وبينهما فاصلٌ رفيعٌ يقول «هذان جزءان لقيمةٍ واحدة».
   والتركيزُ يُضيء الصندوقَ كلَّه (`:focus-within`) لا نصفَه.
   One value, one box; the hairline says these are two parts of it. */
.fone{display:flex;flex-wrap:nowrap;align-items:stretch;direction:ltr;
  width:100%;min-height:42px;border:1.5px solid var(--n200);border-radius:10px;
  background:var(--n25);overflow:hidden;
  transition:border-color .15s,background .15s,box-shadow .15s}
.fone:hover{border-color:var(--n300);background:var(--w)}
.fone:focus-within{border-color:var(--b500);background:var(--w);
  box-shadow:0 0 0 3.5px rgba(30,115,188,.13)}

/* ── والداخلان يتجرّدان مما تلبسه الحاوية ──
   **وحدٌّ داخل حدٍّ خطّان متوازيان يُقرآن صندوقًا مكسورًا.** */
/* و`background-color` لا `background`: **والاختصارُ يمحو الصورةَ مع اللون**
   — فيسقط سهمُ القائمة ويبقى مكانُه محجوزًا بثلاثين بكسلًا فارغة، وتُقرأ
   الخانةُ نصًّا لا قائمةً تُفتح.
   The shorthand wipes the image with the colour; the chevron vanishes. */
.fone .fone__c,.fone .fone__n{border:0;border-radius:0;
  background-color:transparent;box-shadow:none;min-height:0;height:auto}
.fone .fone__c:hover,.fone .fone__n:hover,
.fone .fone__c:focus,.fone .fone__n:focus{border:0;
  background-color:transparent;box-shadow:none;outline:none}

/* الكودُ يسارًا، ثابتُ العرض، وسهمُه إلى يمينه لأنه لاتينيُّ الاتجاه */
/* ── والعلمُ يحتاج مكانَه ──
   دخل العلمُ في ٢٠٢٦-٠٨-٢٨ ومعه اسمُ الدولة كاملًا، **وخانةٌ لا تتّسع
   لخيارها المختار خانةٌ يُقصّ فيها ما يُقرأ منها** — و«المملكة المتحدة»
   أطولُ من «السعودية» بخمسة أحرف. */
/* ══════════════════════════════════════════════════════════════
     وخانةُ الدولة شارةٌ لا سطر — بلاغ محمد ٢٠٢٦-٠٨-٢٩
   ══════════════════════════════════════════════════════════════
   > «خانة الدولة مساوية في الحجم لخانة الرقم… تكون صغيرة جدًّا عبارة عن
   >  صورة العلم بدون اسم الدولة، وعند فتح القائمة تظهر الأسماء.»

   صارت القائمةُ تُبنى منتقيَ المنصّة (`.cmb`) بـ`data-short`، فيعرض
   المُشغَّلُ العلمَ وفتحَ الخطّ وحدَهما. **وعرضٌ يُقاس بأطول ما قد يُعرض
   عرضٌ يُهدَر في كلّ مرّةٍ لا يُعرض فيها** — والرقمُ هو المكتوب.
   والقائمةُ المفتوحة تبقى على اتّساعها، فالأسماءُ إنّما تُقرأ عند الاختيار.
   The flag is the badge; the name belongs to the list, not to the box. */
.fone .fone__cmb{flex:0 0 auto;width:auto}
.fone .fone__cmb .cmb__in{width:104px;min-width:104px;padding-inline:11px 24px;
  text-align:start;letter-spacing:.02em}
.fone .fone__cmb .cmb__ar{inset-inline-end:6px;width:12px;height:12px}
.fone .fone__cmb .cmb__pop{min-width:288px}
/* ولا يرث المنتقي حدَّ الخانة ولا أرضيّتها — فهو داخل الإطار الواحد */
/* ── ولا تُكتب `background` مختصرةً على حقلٍ يحمل صورة ──
   **والمختصرةُ تكتب الأرضيّةَ وتمحو معها مقاسَ الصورة وموضعَها** — وقد
   وقعت مرّةً فمحت سهمَ القائمة، ووقعت الآن فملأ العَلَمُ الصندوق.
   The shorthand writes the colour and erases the image's size with it. */
.fone .fone__cmb .cmb__in{border:0;border-radius:0;
  background-color:transparent;border-inline-end:1px solid var(--n200)}
.fone .fone__cmb .cmb__in:hover,
.fone .fone__cmb .cmb__in:focus{border:0;background-color:transparent;
  box-shadow:none;outline:none;
  border-inline-end:1px solid var(--n200)}
@media (max-width:520px){
  .fone .fone__cmb .cmb__in{width:92px;min-width:92px}
  .fone .fone__cmb .cmb__pop{min-width:240px}
}
/* ══════════════════════════════════════════════════════════════
     وعَلَمُ المُشغَّل يُكتب بعد كلّ ما يمسّ أرضيّته
   ══════════════════════════════════════════════════════════════
   **و`background` المختصرةُ تمحو مقاسَ الصورة**: القاعدةُ فوق تكتب
   `background:transparent` بالمختصرة، فتُسقط `background-size` مهما
   بلغت أولويّةُ من كتبها قبلها. **وقاعدتان متساويتان في الأولويّة
   تفصل بينهما الرتبةُ في الملفّ لا نيّةُ كاتبهما.**
   والصورةُ ٢١×١٥ لا تملأ الصندوق: **وعَلَمٌ يملأ خانتَه عَلَمٌ يُقرأ
   خلفيّةً لا شارة**. */
.fone .fone__cmb .cmb__in--flg{
  background-repeat:no-repeat;background-size:21px 15px;
  padding-inline-start:37px;padding-inline-end:22px}
[dir="rtl"] .fone .fone__cmb .cmb__in--flg{
  background-position:right 11px center}
[dir="ltr"] .fone .fone__cmb .cmb__in--flg{
  background-position:left 11px center}
.fone .fone__c{flex:0 0 auto;width:auto;min-width:172px;max-width:216px;
  padding:10px 30px 10px 12px;font-size:.86rem;
  text-overflow:ellipsis;
  background-position:right 10px center;
  border-inline-end:1.5px solid var(--n200)}
.fone:focus-within .fone__c{border-inline-end-color:var(--n200)}

/* والرقمُ يأخذ ما بقي */
.fone .fone__n{flex:1 1 auto;width:auto;min-width:0;padding:10px 14px;
  font-family:Inter,ui-monospace,sans-serif;letter-spacing:.02em;
  text-align:left}

/* ── والخطأُ يُلوَّن على الحاوية لا على أحد نصفيها ──
   السكربتُ يضع `in--no` على خانة الرقم، **ونصفُ صندوقٍ يحمرّ نصفٌ يُقرأ
   عطلًا في الرسم لا خطأً في القيمة**. */
.fone:has(.in--no),.fone:has(.err){border-color:var(--wa-b);background:var(--wa-l)}
.fone .fone__n.in--no,.fone .fone__n.err{background:transparent}

@media(max-width:520px){
  .fone .fone__c{min-width:132px;max-width:150px;padding-inline-start:9px;
    font-size:.8rem}
}}

/* ── قائمةٌ نصُّها طويل داخل جدول — `sel--m` ──
   بلاغ محمد ٢٠٢٦-٠٨-٢٧: «القائمة المنسدلة التي بها طريقة احتساب المساحة…
   تعتبر صغيرة في العرض وشكلها غير جيد».

   **وقائمةٌ عرضُها عرضُ خليّتها قائمةٌ يُقصّ خيارُها المختار** — والخيارُ
   المختار هو كلُّ ما يُقرأ منها في تسعٍ وتسعين مرّةً من مئة. فلها حدٌّ
   أدنى يسع أطولَ خيارٍ فيها، وسطرٌ واحد لا ينكسر.
   The chosen option is the only thing read; give it room to be read. */
select.in.sel--m{min-width:208px;max-width:100%;
  white-space:nowrap;text-overflow:ellipsis;font-size:.86rem}
@media(max-width:900px){select.in.sel--m{min-width:168px}}

/* ══════════════════════════════════════════════════════════════
     وخانةُ الجوال تقف بجانب جارها — بلاغ محمد ٢٠٢٦-٠٨-٢٩
   ══════════════════════════════════════════════════════════════
   > «لماذا خانة جوال ممثل المنشأة في سطر لوحدها مع وجود مساحة بالأعلى؟
   >  نفس الأمر بالنسبة لهاتف المنشأة.»

   كانت هنا `grid-column:1/-1` تُفرد للجوال السطرَ كلَّه، وكُتبت يوم دخل
   اسمُ الدولة في الصندوق (٢٨ أغسطس) فصار نصفُه للكود ولم يبقَ للرقم إلا
   ستّون بكسلًا في شبكةٍ من ثلاثة أعمدة.

   وقد ضاق صندوقُ الدولة أمس إلى شارةٍ في مئةِ بكسل، **فزال سببُ القاعدة
   وبقيت القاعدة** — فيُفرد للجوال سطرٌ ويبقى ثلثاه بياضًا.

       > **وقاعدةٌ تبقى بعد سببها قاعدةٌ تُقرأ تصميمًا** — فيُظنّ أنّ
       > الفراغَ مقصودٌ ولا يُسأل عنه.

   فيقف الجوّالُ في خانته كأيّ حقل. The rule outlived its reason. */

/* ══════════════════════════════════════════════════════════════
     وخانةٌ يقرؤها العميلُ تُؤطَّر بلونها — قرار محمد ٢٠٢٦-٠٨-٢٩
   ══════════════════════════════════════════════════════════════
   **وتأشيرةٌ تُنسى أخطرُ من خانةٍ تُخطئ**: لصاقةُ الخانة تُقرأ قبل
   الكتابة، والتأشيرةُ لا تُقرأ بعد أن يُكتب النصّ. فتُفرَّق الخانتان
   بالإطار واللون لا بجملةٍ تحتهما. */
.qnote-out{padding:11px 12px;border:1.5px solid var(--ok-b,#9ad3b0);
  border-radius:10px;background:var(--ok-l,#f2fbf6)}
.qnote-out textarea{background:var(--w)}


/* ══════════════════════════════════════════════════════════════════════
   تاباتُ العرض — قرار محمد ٢٠٢٦-٠٨-٢٩
   «لماذا لا تكون لدينا Tabs بالأعلى وكل واحدة لشيء… مع ضرورة مراعاة
    طريقة عرضها في الجوال.»
   شريطٌ يُسحب أفقيًّا على الضيّق ولا يلتفّ سطرين — **وشريطٌ يلتفّ سطرين
   شريطٌ يقفز محتوى الصفحة تحته**. والخطّ السفليّ يقول المفتوح.
   ══════════════════════════════════════════════════════════════════════ */
.qtabs{display:flex;gap:2px;margin:0 0 18px;border-bottom:1px solid var(--line);
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.qtabs::-webkit-scrollbar{display:none}
.qtabs__t{display:inline-flex;align-items:center;gap:7px;flex:none;
  padding:11px 15px;border-bottom:2px solid transparent;margin-bottom:-1px;
  color:var(--mut);font:600 .82rem/1 var(--f);white-space:nowrap;
  text-decoration:none;transition:.14s;position:relative}
.qtabs__t svg{width:15px;height:15px;flex:none}
.qtabs__t:hover{color:var(--ink);background:var(--n25)}
.qtabs__t.on{color:var(--b700);border-bottom-color:var(--b600)}
/* ونقطةٌ تقول «هنا شيءٌ ينتظرك» — لا عددًا، فالعددُ في هذه الشاشة واحدٌ دائمًا */
.qtabs__d{width:7px;height:7px;border-radius:50%;flex:none}
.qtabs__d--wa{background:var(--wa)}
.qtabs__d--ok{background:var(--ok)}
.qtabs__d--da{background:var(--da)}


/* ── المستوى الثاني في شريط المسار — قرار محمد ٢٠٢٦-٠٨-٢٩ ──
   خطواتُ المحطّة الحاليّة وحدَها. **ومحطّةٌ لا تتحرّك أسبوعًا محطّةٌ
   يُظنّ أنّ الملفَّ نائمٌ تحتها.** */
.flw__sub{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:9px 18px;background:var(--n25);border-top:1px solid var(--line2)}
.flw__subt{font-size:.75rem;color:var(--mut);white-space:nowrap}
.flw__subt b{color:var(--ink);font-variant-numeric:tabular-nums;
  margin-inline-start:4px}
.flw__sub ol{display:flex;gap:6px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.flw__sub li{display:inline-flex;align-items:center;gap:5px;
  padding:3px 10px;border-radius:999px;font-size:.74rem;
  background:var(--w);border:1px solid var(--line);color:var(--n500)}
.flw__sub li svg{width:11px;height:11px}
.flw__sub li.is-done{color:var(--ok);border-color:var(--ok-l);background:var(--ok-l)}
.flw__sub li.is-now{color:var(--b700);border-color:var(--b300,#9CC5E8);
  background:var(--b50,#F2F7FC);font-weight:600}

/* ══════════════════════════════════════════════════════════════════════
     شاشة التسعير — والسطرُ يقول إلى أيّ مجموعةٍ يتبع
   ══════════════════════════════════════════════════════════════════════
   > «أضف سطرًا لمجموعة تسعير، فلم تميز عن الأسطر التي لم تضاف لمجموعة!»
   > — محمد، ٣٠ أغسطس ٢٠٢٦

   **والفرقُ الذي لا يُرى إلّا بعدّ الصفوف إلى رأسها فرقٌ لا يُرى**: يُؤشَّر
   سطرٌ ويُوضع في مجموعة، فيبقى في الشاشة كما كان — فيُظنّ أن شيئًا لم يقع.

   والشريطُ على أوّل خلية لا على الصفّ: **وحدٌّ يُرسم على `tr` حدٌّ لا ترسمه
   المتصفّحاتُ في `border-collapse`**.
   A border on a <tr> is not painted under border-collapse.
   ── ولا يُعتمد على اللون وحدَه ──
   فغيرُ المجمَّع يحمل أرضًا منبِّهة، والمجمَّعُ شريطًا وإزاحةً — فيفترقان
   في الشكل كما يفترقان في اللون. Shape as well as colour. */
.pl.qr__in{border-inline-start:3px solid var(--b300)}
.pl.qr__out{border-inline-start:3px solid var(--wa-b)}

/* ══════════════════════════════════════════════════════════════════════
     والمجموعةُ مربّعٌ قائمٌ بذاته — قرار محمد ٢٠٢٦-٠٨-٣٠
   ══════════════════════════════════════════════════════════════════════
   > «تكون المجموعات على شكل مربع آخر به الأسفل تكون فيه أسطر التخزين
   >  وتضاف إليه أسطر الخدمات الإضافية.»

   والمربّعُ يحمل حدَّه بلونه: **وحدٌّ رماديٌّ واحدٌ لمربّعين معناهما مختلف
   حدٌّ لا يقول شيئًا**. فالمجموعةُ بحدٍّ هادئ، وما لم يُجمَّع بحدٍّ منبِّه —
   وهو الذي يمنع خروجَ العرض، فيُقرأ ناقصًا قبل أن يُقرأ الزرُّ المعطَّل.
   The box that blocks the quote is the box that looks unfinished. */
.card.grp{border-color:var(--b200)}
.card.grp--out{border-color:var(--wa-b);background:var(--wa-l)}
.card.grp--out > .cb,.card.grp--out .tbl-w{background:transparent}
.card.grp > .ch h4{margin:0}

/* ══════════════════════════════════════════════════════════════════════
     التبديلُ الحيّ — علامةُ انتظارٍ مؤجَّلة
   ══════════════════════════════════════════════════════════════════════
   **وانتظارٌ بلا علامةٍ انتظارٌ يُضغط فيه الزرُّ ثانيةً** فيُنشأ سطران.
   والتأجيلُ ربعُ ثانية: الطلبُ السريع لا يُظهر شيئًا، **وومضةٌ تظهر وتذهب
   في مئة مللي ومضةٌ تُقرأ عطلًا** لا انتظارًا.
   A flicker on a fast swap reads as a fault, not as progress. */
body[data-swapping]{cursor:progress}
.is-swapping{pointer-events:none;opacity:.55;transition:opacity .15s .25s}

/* ══════════════════════════════════════════════════════════════════════
     سطرُ التسعير سطران — قرار محمد ٢٠٢٦-٠٨-٣٠
   ══════════════════════════════════════════════════════════════════════
   > «ألم أقل لك لنجعل أسطر الطلب موزعة في سطرين بطريقة جميلة حتى تكون
   >  أوضح؟ … هذا سيلغي السكرول السيء وسيعطينا مساحة أكثر رحابة للاعمدة.»

   **وثلاثةَ عشرَ عمودًا في عرضِ شاشةٍ ثلاثةَ عشرَ عمودًا مقصوصة** — والقسمةُ
   لا تصنع مساحةً، إنما توزّع ضيقًا. فانقسم السطرُ سطرين: ما يُقرأ فوق، وما
   يُكتب تحت، ولكلّ حقلٍ ضِعفُ عرضه.

   ── ولا عرضَ ثابتًا بالبكسل ──
   **وعرضٌ بالبكسل عرضٌ يصف شاشةَ كاتبه** — فالحقولُ `flex` بأساسٍ أدنى،
   تنكمش على الضيّق وتنفرد على الواسع، وتلتفّ ولا تُمرَّر.

   ── والحدُّ بين السطرين مقطَّع، وبين الأسطر متّصل ──
   **وحدٌّ واحدٌ لفصلين مختلفين حدٌّ يخلط الداخلَ بالخارج**: يُقرأ نصفُ سطرٍ
   سطرًا كاملًا. Two separators for two kinds of boundary. */
.plist{display:flex;flex-direction:column}
.pl{padding:13px 16px;border-top:1px solid var(--line)}
.pl:first-child{border-top:0}
.pl:hover{background:var(--n25)}
.pl__top,.pl__bot{display:flex;flex-wrap:wrap;gap:11px 20px;align-items:flex-end}
.pl__bot{margin-top:11px;padding-top:11px;border-top:1px dashed var(--line2)}
.pl__f{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1 1 130px}
.pl__f>i{font-style:normal;font-size:.72rem;font-weight:600;color:var(--mut2);
  letter-spacing:-.005em;white-space:nowrap}
.pl__f>b{font-weight:600;font-size:.87rem;min-height:22px;display:block}
.pl__f .in{width:100%;min-width:0}
.pl__f--zn{flex:2 1 210px}
.pl__f--wh{flex:2.4 1 240px}
/* ــ وخبرُ السطر يأخذ عرضَه كاملًا ــ بلاغ محمد ٢٠٢٦-٠٩-٠٤
   **وتنبيهٌ يُحشر في عمودٍ ضيّقٍ تنبيهٌ ينكسر إلى ستّة أسطرٍ فيُقرأ زخرفة**
   — وهو جملةٌ تُقرأ مرّةً وتُقرَّر عليها. فينزل سطرًا تحت حقول السطر. */
.pl__f--wide{flex:1 1 100%;min-width:0}
/* ــ وملاحظاتُ الخدمة سطرٌ تحت سطرها ــ بلاغ محمد ٢٠٢٦-٠٩-٠٤
   **وتسعةُ أعمدةٍ في عرضٍ واحد اسمٌ ينكسر ثلاثةَ أسطر ومنتقٍ يُقرأ منه
   حرفان** — فنزل أطولُ ما يُكتب وأقلُّ ما يُقرأ، واتّسع ما بقي.
   والصفُّ الثاني بلا حدٍّ علويّ فيُقرأ امتدادًا لأخيه لا صفًّا جديدًا. */
.tb tr.svcrem>td{border-top:0;padding-top:0;padding-bottom:10px}
.pl__f--wide .hint{margin-top:2px}
.pl__f--m{flex:1.6 1 190px}
/* والمحسوبُ لا يُكتب فيه، فلا يأخذ عرضَ خانةٍ تُكتب */
.pl__f--calc{flex:0 1 110px}
.pl__f--calc>b{min-height:38px;line-height:38px}
/* ── والمربّعُ أوّلَ السطر لا آخرَه ──
   **ومربّعٌ في آخر ثلاثةَ عشرَ عمودًا مربّعٌ لا يُرى** — وهو أوّلُ ما تُمَدّ
   إليه اليد حين يُراد تجميعُ أسطرٍ أو الاعتذارُ عنها. */
.pl__pick{flex:0 0 auto;display:flex;align-items:center;min-height:38px;
  padding-inline-end:2px}
.pl__note{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-top:9px}
.pl__note>span{min-width:120px}
.pl__note .in{flex:1 1 200px;min-width:0;padding:6px}
.pl__off{margin-top:10px;padding:9px 11px;background:var(--n25);
  border-radius:var(--r6)}
.pl--off{background:var(--n25)}
.pl--off:hover{background:var(--n25)}