/* ============================================================================
   طبقة الهاتف — النظام كله، لكل مستخدم، في كل شاشة.

   المشكلة التي تحلّها: النظام مبني لشاشة مكتب ثم يُصغَّر على الهاتف. جداول
   بعشرة أعمدة تُمرَّر أفقيًا (‎.tablewrap > table{min-width:max-content}‎)،
   ونوافذ بعرض 880px، وأشرطة أدوات بأزرار صغيرة. من يعمل واقفًا أمام الفرن أو
   بين الرفوف يقضي وقته في التكبير بالإصبع بدل العمل.

   المبدأ: لا تصغير — إعادة ترتيب. تحت 700px يصير كل جدول بطاقات، وكل نافذة
   ملء الشاشة، وكل شريط أدوات عمودًا بأزرار كبيرة. الحاسوب لا يتأثر بحرف.

   لماذا هنا لا في كل شاشة: الجداول والنوافذ كلها تمرّ بنفس الأصناف
   (‎.tablewrap‎ · ‎table‎ · ‎.modal‎ · ‎.toolbar‎)، فقاعدة واحدة تصل لكل شاشة
   قائمة وكل شاشة تُضاف لاحقًا دون أن يتذكّر أحد هذا الملف.

   يرافقه assets/mobile.js الذي يضع data-label على كل خلية من رأس عمودها —
   بدونه تظهر البطاقات بلا مسمّيات. */

/* عناصر يحقنها mobile.js في DOM مشترك — لا تظهر إلا على الهاتف */
.m-only{display:none}
@media (max-width:700px){ .m-only{display:inline-flex} }
.view-cards .m-only{display:inline-flex}   /* بطاقات الحاسوب تحتاج «المزيد» أيضًا */

/* ── ١) الجداول تصير بطاقات ───────────────────────────────────────────
   يعمل في حالتين بقاعدة واحدة:
     html.m-phone   على الهاتف لكل الجداول (يضعها mobile.js من matchMedia)
     .view-cards    على الحاسوب حين يختار المستخدم «بطاقات» من مبدّل العرض
   فطريقة العرض «بطاقات» في النظام كله ليست شاشةً تُكتب لكل قسم، بل الطبقة
   نفسها التي يراها الهاتف — تُختبر مرة وتصل للجميع.
   أصل المشكلة: ‎.tablewrap > table {min-width:max-content}‎ يفرض عرض الجدول
   الطبيعي فيتجاوز الشاشة. والحل الأول (كل عمود سطرًا "مسمّى: قيمة") كان
   جدولًا مقلوبًا لا بطاقة: عميل واحد يأكل الشاشة. الآن:
     سطر الرأس   عنوان + كود + شارة (يضعها mobile.js بأدوار m-*)
     الحقول      قصيرة في عمودين، مسمّى صغير فوق القيمة
     النصوص      طويلة على سطرين، لمسة تفتحها
     الأفعال     زرّان ظاهران والباقي خلف «المزيد» */.tablewrap.view-cards { overflow-x: visible; }.view-cards .tablewrap > table, .view-cards table { min-width: 0 !important; width: 100%; display: block; }.view-cards table thead { display: none; }.view-cards table tbody { display: block; }.view-cards table tbody tr {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-flow: row dense;
  column-gap: 10px; row-gap: 6px;
  align-items: start;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 8px;
  box-shadow: var(--sh-sm);
}.view-cards table tbody tr:last-child { margin-bottom: 0; }.view-cards table tbody td {
  display: block; padding: 0 !important; border: 0 !important;
  text-align: start; font-size: 13.5px; min-width: 0; max-width: none !important;
  overflow-wrap: break-word;
}.view-cards table tbody td > * { max-width: none !important; }.view-cards table tbody td .cell-clamp { display: block !important; -webkit-line-clamp: unset; white-space: normal; }

/* سطر الرأس */.view-cards table tbody td.m-title { grid-column: span var(--m-span, 6); order: 0; font-size: 15px; font-weight: 800; color: var(--ink-900); line-height: 1.3; }.view-cards table tbody td.m-title .cell-mini { display: block; font-size: 12px; font-weight: 500; color: var(--ink-500); margin-top: 2px; }.view-cards table tbody td.m-title.cell-code { background: transparent; border: 0; }.view-cards table tbody td.m-code, .view-cards table tbody td.m-badge, .view-cards table tbody td.m-media { grid-column: span 2; order: 1; justify-self: end; white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.view-cards table tbody td.m-btn { grid-column: span 2; order: 9; }
.view-cards table tbody td.m-btn::before { content: none; }
.view-cards table tbody td.m-btn .btn { width: 100%; min-height: 34px; justify-content: center; font-size: 13px; }.view-cards table tbody td.m-code .cell-code, .view-cards table tbody td.m-badge .badge { display: inline-block; }.view-cards table tbody td.m-media img { width: 44px; height: 44px; object-fit: cover; border-radius: 8px; }

/* الحقول القصيرة: عمودان، المسمّى فوق القيمة */.view-cards table tbody td.m-short { grid-column: span 3; order: 2; }.view-cards table tbody td.m-short::before, .view-cards table tbody td.m-long::before {
  content: attr(data-label); display: block;
  font-size: 11px; font-weight: 600; color: var(--ink-400); line-height: 1.3; margin-bottom: 1px;
}.view-cards table tbody td[data-label=""]::before { content: none; }

/* النصوص الطويلة: سطران ثم لمسة تفتح */.view-cards table tbody td.m-long { grid-column: 1 / -1; order: 3; cursor: pointer; }.view-cards table tbody td.m-long > *:not(.btn) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }.view-cards table tbody td.m-long.open > * { -webkit-line-clamp: unset; display: block; }.view-cards table tbody td.m-long .btn { display: inline-flex; margin-top: 4px; min-height: 32px; padding: 4px 10px; font-size: 12.5px; }

/* الأفعال: زرّان + «المزيد» */.view-cards table tbody td.m-actions { grid-column: 1 / -1; order: 9; padding-top: 8px !important; margin-top: 2px; border-top: 1px dashed var(--line) !important; }.view-cards table tbody td.m-actions::before { content: none; }
/* ‎!important‎ لأن بعض الشاشات تجعل ‎.t-actions‎ شبكة ثلاثية بعرض أدنى 220px (‎.lead-acts‎) */.view-cards table tbody td.m-actions .t-actions, .view-cards table tbody td.m-actions > div { display: flex !important; flex-wrap: wrap; gap: 6px; min-width: 0 !important; grid-template-columns: none !important; }.view-cards table tbody td.m-actions .btn { flex: 0 1 auto; width: auto !important; min-width: 0 !important; min-height: 34px; padding: 6px 12px; justify-content: center; font-size: 13px; white-space: nowrap; }.view-cards table tbody td.m-actions .btn.m-extra { display: none; }.view-cards table tbody td.m-actions.open .btn.m-extra { display: inline-flex; }.view-cards table tbody td.m-actions .m-more-btn { color: var(--ink-500); }
/* الرقائق داخل خلية واحدة (كود + جديد) تصطف أفقيًا */.view-cards table tbody td.m-code > *, .view-cards table tbody td.m-badge > * { display: inline-block; vertical-align: middle; margin-inline-start: 4px; }.view-cards table tbody td.m-empty { display: none; }.view-cards table tbody tr.m-empty-row { display: block; text-align: center; color: var(--ink-400); }.view-cards table tbody tr.m-empty-row td { display: block; }.view-cards table tbody tr.m-empty-row td::before { content: none; }

.view-cards .cell-code, .view-cards .badge { white-space: nowrap; }


/* بطاقات على الحاسوب: شبكة عدة أعمدة بدل عمود واحد */
@media (min-width: 701px) {
  .tablewrap.view-cards table tbody { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
  .tablewrap.view-cards table tbody tr { margin-bottom: 0; }
  .tablewrap.view-cards table tbody tr.m-empty-row { grid-column: 1 / -1; }
}

/* ── طريقة العرض «مضغوط»: نفس الجدول بكثافة أعلى — للمراجعة السريعة لقوائم طويلة */
.tablewrap.view-compact table th, .tablewrap.view-compact table td { padding: 5px 8px !important; font-size: 12.5px; line-height: 1.35; }
.tablewrap.view-compact .btn.sm { padding: 3px 7px; font-size: 11.5px; min-height: 0; }
.tablewrap.view-compact .cell-mini { font-size: 11px; }
.tablewrap.view-compact .badge { padding: 1px 7px; font-size: 11px; }

/* ── مبدّل العرض العام (يحقنه mobile.js في كل شاشة فيها جدول ولا مبدّل خاص بها) */
.viewtoggle3 { display: inline-flex; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; margin-inline-start: auto; flex: 0 0 auto; }
.viewtoggle3 button { border: 0; background: transparent; padding: 7px 10px; cursor: pointer; color: var(--ink-400); display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; }
.viewtoggle3 button svg { width: 15px; height: 15px; }
.viewtoggle3 button.on { background: var(--ink-900, #111); color: #fff; }
.viewbar { display: flex; justify-content: flex-end; margin-bottom: 8px; }

/* حدّ الهاتف: 700px. فوقه سلوك الحاسوب كما هو تمامًا. */
@media (max-width: 700px) {

  /* ── ٢) النوافذ ملء الشاشة ─────────────────────────────────────────────
     قاعدة 880px للنوافذ تبقى للحاسوب. على الهاتف تُلغى لصالح ورقة كاملة،
     وإلا فلا معنى لبقية الطبقة. */
  .modal-root .modal,
  .modal-root .modal.lg, .modal-root .modal.md, .modal-root .modal.sm,
  .modal-root .modal.selection, .modal-root .modal.confirm, .modal-root .modal.drawer {
    width: 100vw !important; max-width: 100vw !important;
    inset-block: auto 0; inset-inline: 0;
    max-height: 96dvh; border-radius: 18px 18px 0 0;
  }
  /* فحص 2026-10-03: بين 641 و700px كانت إزاحة الحاسوب translate(50%,-50%) تبقى على الورقة
     السفلية (لا تُلغى إلا تحت 640px) فتظهر النافذة مزاحة ويُقصّ رأسها وزر الإغلاق */
  .modal-root .modal, [dir="ltr"] .modal-root .modal { transform: translateY(100%); }
  .modal-root.open .modal, [dir="ltr"] .modal-root.open .modal { transform: translateY(0); }
  /* مساحة لمس لا تقل عن 40px للأزرار الصغيرة وأرقام الصفحات وزر الإغلاق */
  .btn.sm, .pager .pg, .modal__head .x { min-height: 40px; min-width: 40px; }
  .modal__body { max-height: none; }
  /* الحقول عمودًا واحدًا وبمساحة لمس مريحة */
  .modal .form-grid, .form-grid { grid-template-columns: 1fr !important; gap: 12px; }
  .form-grid .wide, .form-grid .full { grid-column: 1 / -1; }
  /* LM-09: لا تكبير لخانات الاختيار/الملفات، وكل أنواع النص تأخذ 16px (يمنع تكبير iOS) */
  .fld input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .fld select, .fld textarea,
  input[type="text"], input[type="number"], input[type="date"], input[type="tel"], input[type="email"],
  input[type="search"], input[type="password"], select, textarea {
    min-height: 48px; font-size: 16px;      /* 16px يمنع تكبير iOS التلقائي */
  }
  /* LM-06: زر حذف صورة التسليم كان مقصوصًا (overflow:hidden) و18px — مستحيل اللمس */
  .dlvimgs .q-thumb { width: 56px; height: 56px; }
  .dlvimgs .q-thumb__x { width: 30px; height: 30px; font-size: 18px; inset-block-start: -10px; inset-inline-end: -10px; }
  /* LM-07: تلميح اللصق (Ctrl+V) بلا معنى على الهاتف */
  .dlvimgs .paste-hint, .dlvimgs__bar .cell-mini { display: none; }
  /* LM-08: مرفقات تفاصيل التسليم بعرض كامل والاسم يتمدد */
  .dd-att { width: 100%; }
  .dd-att .dd-att__name { flex: 1; max-width: none !important; }

  /* ── ٣) أشرطة الأدوات ورؤوس الصفحات ──────────────────────────────────── */
  .toolbar { flex-direction: row; flex-wrap: wrap; align-items: stretch; gap: 8px; }
  .toolbar .search { flex: 1 1 100%; width: 100%; max-width: 100%; }
  .toolbar > *:not(.search):not(.viewtoggle3) { flex: 1 1 calc(50% - 4px); width: auto; max-width: 100%; }
  .toolbar > .viewtoggle3 { flex: 0 0 auto; }
  .toolbar .btn, .head-actions .btn { min-height: 44px; justify-content: center; font-size: 14px; }

  .page-head { flex-direction: column; align-items: stretch; gap: 10px; }
  .head-actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .head-actions .btn { flex: 1 1 45%; }

  /* أزرار الأيقونات داخل الصفحات تكبر لمساحة إبهام (٤٤px) — لا في الشريط العلوي */
  .page .ib, .page .icon-btn { min-width: 44px; min-height: 44px; }

  /* الشريط العلوي: كان يفيض يمينًا فيخرج زر الخروج وحساب المستخدم خارج الشاشة
     (٥ أزرار × 42px + EN + الاسم + فجوات 12px > 360px). العنوان سطر واحد يُقصّ،
     الأزرار 36px بفجوة 6px، وسجل التنبيهات يُخفى (له صفحته من القائمة). */
  .topbar { gap: 6px; padding-inline: 8px 10px; }
  .topbar > * { flex: 0 0 auto; }
  .topbar__title { flex: 1 1 auto; min-width: 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .topbar__title small { display: none; }
  .topbar .icon-btn { width: 36px; height: 36px; min-width: 36px; min-height: 36px; border-radius: 10px; }
  .topbar .lang-btn { padding: 0 8px; font-size: 12px; }
  .topbar #toastLogBtn { display: none; }
  /* شريحة الحساب تُخفى: بعرض الهاتف تظهر بيضاوية فارغة، والملف الشخصي يُفتح من القائمة الجانبية */
  .topbar .user-chip { display: none; }

  /* ── ٤) البطاقات والشبكات ────────────────────────────────────────────── */
  .two-col, .three-col, .dash-split, .reports-grid, .kpi-grid-6 { grid-template-columns: 1fr !important; }
  .card__body { padding: 14px; }
  /* overflow-x:clip لا hidden: الأخير يجعل overflow-y محسوبًا auto، ومع
     html,body{height:100%} القائمة يصير الجسم حاوية تمرير بارتفاع ثابت
     فتتوقف الصفحة عن التمرير رأسيًا على الهاتف تمامًا (حدث فعلًا). clip
     يقصّ أفقيًا بلا إنشاء حاوية تمرير ولا مساس بالتمرير الرأسي. */
  .main, .page { overflow-x: clip; }
}

/* ============================================================================
   لوحة الأرقام — كل إدخال كمية في النظام.

   تُستعمل في تسجيل الصب والختم والتشطيب وإدخال المخزن والتسليم وحركة النموذج.
   السبب: حقل رقم صغير وسط نموذج طويل يعني تكبيرًا ولوحة مفاتيح تغطي نصف
   الشاشة. هنا الرقم كبير وأزراره تحت الإبهام مباشرة.
   تعمل على كل المقاسات (يستعملها الحاسوب أيضًا بلا ضرر) لكن قيمتها على الهاتف. */
.numpad { display: flex; flex-direction: column; gap: 14px; }
.numpad__val {
  font-size: 46px; font-weight: 800; text-align: center; letter-spacing: -1px;
  font-variant-numeric: tabular-nums; color: var(--ink-900);
  background: var(--surface-2); border: 2px solid var(--line-strong); border-radius: 16px;
  padding: 14px 10px; min-height: 84px; display: grid; place-items: center;
}
.numpad__val.over { color: var(--danger); border-color: var(--danger); }
.numpad__hint { text-align: center; font-size: 13px; color: var(--ink-500); margin-top: -6px; }
.numpad__keys { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.numpad__keys button {
  min-height: 62px; font-size: 26px; font-weight: 700;
  background: var(--surface); color: var(--ink-900);
  border: 1.5px solid var(--line-strong); border-radius: 14px; cursor: pointer;
  font-variant-numeric: tabular-nums; transition: .12s;
}
.numpad__keys button:active { background: var(--surface-2); transform: scale(.97); }
.numpad__keys button.act { background: var(--surface-2); font-size: 19px; color: var(--ink-500); }
.numpad__keys button:focus-visible { outline: 3px solid var(--brand); outline-offset: 2px; }
@media (max-width: 700px) { .numpad__val { font-size: 54px; } .numpad__keys button { min-height: 66px; } }

/* ============================================================================
   شريط الاتصال والمزامنة — يظهر فقط حين يوجد ما يقال.
   صامت وأنت متصل ولا شيء معلّق؛ يظهر عند الانقطاع أو وجود تسجيل لم يُرسل. */
.offbar {
  position: sticky; top: 0; z-index: 30;
  display: flex; align-items: center; gap: 10px;
  padding: 9px 14px; font-size: 13.5px; font-weight: 600;
  border-bottom: 1px solid;
}
.offbar[hidden] { display: none !important; }
.offbar.off { background: var(--warn-bg, #fef6e7); color: #7a4b06; border-color: #e0a94a; }
.offbar.pend { background: var(--info-bg, #eaf2fd); color: #14457f; border-color: #7fa9e0; }
/* ألوان صريحة لا currentColor: الشارة كانت تُرسم بلون النص على أرضية بلونه
   نفسه فيختفي الرقم. الشريط أصلًا بألوان ثابتة لا تتبع السمة. */
.offbar.off .n { background: #7a4b06; color: #fff; }
.offbar.pend .n { background: #14457f; color: #fff; }
.offbar .n {
  border-radius: 999px;
  min-width: 22px; height: 22px; display: grid; place-items: center;
  font-size: 12px; font-weight: 800; padding: 0 6px;
}
.offbar button {
  margin-inline-start: auto; background: transparent; border: 1.5px solid currentColor;
  color: inherit; border-radius: 9px; padding: 5px 12px; font-size: 12.5px;
  font-weight: 700; cursor: pointer; min-height: 34px;
}
/* السطر داخل قائمة يبيّن أنه لم يُرسل بعد */
.pending-row { opacity: .72; border-inline-start: 3px solid #e0a94a !important; }

@media (prefers-reduced-motion: reduce) {
  .numpad__keys button { transition: none; }
  .numpad__keys button:active { transform: none; }
}

/* شارة «جديد» على زر القائمة — القائمة الجانبية مطوية على الهاتف فلا تُرى شاراتها */
.menu-btn { position: relative; }
.menu-badge { position: absolute; top: -5px; inset-inline-end: -5px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--danger); color: #fff; font-size: 11px; font-weight: 800; display: grid; place-items: center; line-height: 1; border: 2px solid #fff; }

/* ── الكثافة المضغوطة هي أساس كل جدول في النظام (قرار المستخدم 2026-09-07) ──
   «الجدول» الواسع أُزيل من المبدّل؛ ما يُعرض على الحاسوب هو المضغوط نفسه. */
@media (min-width: 701px) {
  .tablewrap:not(.view-cards) table th, .tablewrap:not(.view-cards) table td { padding: 6px 9px; font-size: 12.5px; line-height: 1.4; }
  .tablewrap:not(.view-cards) .btn.sm { padding: 3px 8px; font-size: 11.5px; min-height: 0; }
  .tablewrap:not(.view-cards) .cell-mini { font-size: 11px; }
  .tablewrap:not(.view-cards) .badge { padding: 1px 8px; font-size: 11px; }
}

/* ── الهاتف · مضغوط (قرار المستخدم 2026-09-16): أكبر عدد من الصفوف في الشاشة ──
   جدول حقيقي بخط صغير وحشوة ضيقة، يُمرَّر أفقيًا داخل إطاره إن زاد عرضه، وأزرار
   الإجراءات بأيقونة فقط بلا نص. البطاقات تبقى اختيارًا من المبدّل. */
html.m-phone .tablewrap.view-compact { overflow-x: auto; -webkit-overflow-scrolling: touch; }
html.m-phone .tablewrap.view-compact table { min-width: 100%; width: max-content; }
html.m-phone .tablewrap.view-compact table th,
html.m-phone .tablewrap.view-compact table td { padding: 4px 6px !important; font-size: 11.5px; line-height: 1.3; white-space: nowrap; }
html.m-phone .tablewrap.view-compact table th { position: sticky; top: 0; z-index: 1; }
html.m-phone .tablewrap.view-compact .cell-mini { font-size: 10.5px; }
html.m-phone .tablewrap.view-compact .badge { padding: 0 5px; font-size: 10px; }
html.m-phone .tablewrap.view-compact .btn.sm { padding: 3px 5px; min-height: 26px; font-size: 10.5px; gap: 0; }
/* فحص 2026-10-03: إخفاء النص لأزرار الأيقونات فقط — زر نصّي بلا أيقونة (عكس الإدخال في المخزن)
   كان يصير مربعًا فارغًا لا يُعرف ما يفعله */
html.m-phone .tablewrap.view-compact .btn.sm:has(svg) { font-size: 0; }
html.m-phone .tablewrap.view-compact .btn.sm svg { width: 14px; height: 14px; margin: 0; }
html.m-phone .tablewrap.view-compact .q-acts,
html.m-phone .tablewrap.view-compact .t-actions { display: flex !important; flex-wrap: nowrap; gap: 3px; min-width: 0 !important; }
html.m-phone .tablewrap.view-compact .m-more-btn { display: none !important; }
html.m-phone .tablewrap.view-compact .btn.m-extra { display: inline-flex !important; }
html.m-phone .tablewrap.view-compact img { max-width: 32px; max-height: 32px; }
html.m-phone .viewtoggle3 span { display: none; }

/* تطبيق الأندرويد: المحتوى لا يمتد تحت شريط أزرار النظام */
html.is-native-app body { padding-bottom: var(--safe-b); }
html.is-native-app .content, html.is-native-app main { padding-bottom: calc(24px + var(--safe-b)); }

/* داخل التطبيق نفسه لا معنى لدعوة «ثبّت التطبيق» */
html.is-native-app #installCard { display: none !important; }

/* ── وضع العرض بلا اتصال (assets/offline.js) ── */
.offline-info { font-size: 11.5px; font-weight: 700; color: #92400e; background: #fef3c7; border: 1px solid #f59e0b; border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
.offline-info[hidden] { display: none !important; }
.offline-bar { position: sticky; top: calc(var(--topbar-h) + var(--safe-t)); z-index: 25; margin: 0 0 10px; padding: 8px 14px; font-size: 12.5px; font-weight: 700; background: #fef3c7; color: #92400e; border-bottom: 1px solid #f59e0b; text-align: center; }
.offline-bar.empty { background: #fee2e2; color: #991b1b; border-color: #ef4444; }
.offline-bar[hidden] { display: none !important; }
html.is-offline #content button.primary:not(.nav-safe), html.is-offline #content .btn.primary { opacity: .55; }
@media (max-width: 700px) { .offline-info { display: none; } }

/* ── فحص 2026-10-15 (UI2-10/UIP-02/UIP-09/UIP-11) ───────────────────────────────── */
/* عمود الإجراءات (آخر عمود فيه أزرار) مثبَّت على حافة الجدول في «مضغوط» — كان خارج الشاشة بلا دلالة تمرير */
html.m-phone .tablewrap.view-compact table td:last-child:has(.btn),
html.m-phone .tablewrap.view-compact table th:last-child {
  position: sticky; inset-inline-end: 0; z-index: 2;
  background: var(--surface, #fff); box-shadow: 6px 0 8px -6px rgba(0,0,0,.18);
}
html[dir="rtl"].m-phone .tablewrap.view-compact table td:last-child:has(.btn),
html[dir="rtl"].m-phone .tablewrap.view-compact table th:last-child { box-shadow: -6px 0 8px -6px rgba(0,0,0,.18); }
html.m-phone .tablewrap.view-compact table th:last-child { z-index: 3; }
/* الاسم الطويل يُقصّ بـ«…» لا بقطع صامت */
html.m-phone .tablewrap.view-compact td { text-overflow: ellipsis; }
/* أهداف لمس ≥40px على الهاتف (كانت 26px) */
html.m-phone .tablewrap .btn.sm,
html.m-phone .card .btn.sm { min-height: 40px; min-width: 40px; }
html.m-phone .viewtoggle3 button { min-height: 40px; min-width: 44px; }
html.m-phone .tablewrap input[type="checkbox"] { width: 20px; height: 20px; }
html.m-phone .card__head a, html.m-phone a.see-all { display: inline-flex; align-items: center; min-height: 40px; }
/* الفلاتر مطويّة خلف زرّ «الفلاتر» */
.m-ftoggle { display: none; }
html.m-phone .toolbar > .m-ftoggle { display: inline-flex; flex: 1 1 100%; min-height: 44px; justify-content: center; }
html.m-phone .toolbar.m-fcoll > *:not(.search):not(.viewtoggle3):not(.m-ftoggle) { display: none !important; }

/* بوابة العميل: شريط التبويبات يتمرّر أفقيًا على الهاتف */
@media (max-width: 768px){
  .cp-tabs{flex-wrap:nowrap;overflow-x:auto;margin-inline:-4px;padding-inline:4px}
  .cp-tab{padding:9px 11px;font-size:12.5px}
  .cp-sum-grid{grid-template-columns:repeat(2,1fr)}
}