/* ═══════════════════════════════════════════════════════════════
   ملاذ — تكييف العرض للجوال والآيباد
   قواعد عامة تُصلح أنماطاً متكررة في مئات الشاشات دفعة واحدة، بدل
   تعديل كل شاشة على حدة. البادئة #root ترفع الأولوية فوق Tailwind.
   ═══════════════════════════════════════════════════════════════ */

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overscroll-behavior-y: none; -webkit-tap-highlight-color: transparent; }
@supports (height: 100dvh) {
  #root .min-h-screen { min-height: 100dvh; }
}

/* نافذة Modal الصغيرة: ارتفاعها من الشاشة الظاهرة فعلاً */
.mlath-sheet { max-height: 88vh; }
@supports (height: 100dvh) { .mlath-sheet { max-height: 88dvh; } }
.mlath-pop { max-height: calc(100vh - 5rem); }
@supports (height: 100dvh) { .mlath-pop { max-height: calc(100dvh - 5rem); } }

/* عمود الوحدات في التقويم ثابت أثناء التمرير الأفقي — وإلا ضاع رقم
   الوحدة وبقيت الأيام بلا عنوان. */
#root table.mlath-sticky-first tr > :first-child:not([colspan]) {
  position: sticky; inset-inline-start: 0; z-index: 2;
  background: #FFFFFF; box-shadow: inset -1px 0 0 rgba(0,0,0,0.06);
}
#root table.mlath-sticky-first thead tr > :first-child { background: #F7F7F5; z-index: 3; }

/* ─── الجوال والأجهزة الصغيرة ─── */
@media (max-width: 767px) {
  /* خط الحقول ١٦ بكسل: أقل منه يجعل سفاري الآيفون يكبّر الصفحة عند
     الكتابة ولا يعيدها. */
  #root input:not([type=checkbox]):not([type=radio]):not([type=range]),
  #root select,
  #root textarea { font-size: 16px !important; }

  /* نماذج الأعمدة المتعددة: عمودان على الجوال بدل ثلاثة أو أربعة */
  #root .grid:has(> label) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #root .grid:has(> label) > label { min-width: 0; }

  /* صفوف الأزرار تلتفّ بدل أن تدفع الصفحة للجانب */
  #root .flex:not(.flex-col):not(.flex-nowrap):not(nav):has(> button + button) { flex-wrap: wrap; }

  /* الشريط العلوي تحت النتوء ومنطقة الكاميرا */
  #root .mlath-topbar { padding-top: max(0.75rem, env(safe-area-inset-top)); }

  /* الإشعارات العائمة فوق مؤشر الرجوع للرئيسية في الآيفون */
  #root .fixed.bottom-6, #root .fixed.bottom-5 { bottom: calc(1.25rem + env(safe-area-inset-bottom)) !important; }

  /* لا تمرير أفقي للصفحة كلها — الجداول تمرّر داخل حاويتها */
  #root main { overflow-x: clip; }

  /* «جداول» مبنية من شبكة ٧–٩ أعمدة (الملخص المالي، الوحدات، السندات):
     على الجوال تُسحق الأعمدة إلى ٣٥ بكسل. نُبقي عرضها ونمرّرها أفقياً. */
  #root .overflow-hidden:has(> .grid.grid-cols-7),
  #root .overflow-hidden:has(> .grid.grid-cols-8),
  #root .overflow-hidden:has(> .grid.grid-cols-9) { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  #root .overflow-hidden > .grid.grid-cols-7,
  #root .overflow-hidden > .grid.grid-cols-8,
  #root .overflow-hidden > .grid.grid-cols-9 { min-width: 640px; }

  /* الجداول: تمرير سلس بالإصبع داخل حاويتها */
  #root .overflow-x-auto { -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }

  /* أزرار صغيرة جداً للمس */
  #root button.w-6.h-6, #root button.w-7.h-7 { min-width: 36px; min-height: 36px; }
}

/* الشاشات الضيقة جداً (أغلب الجوالات عمودياً): عمود واحد للنماذج */
@media (max-width: 479px) {
  #root .grid:has(> label) { grid-template-columns: minmax(0, 1fr) !important; }
}

/* الأجهزة اللمسية (جوال وآيباد): أهداف لمس أكبر */
@media (pointer: coarse) {
  #root button.w-8.h-8 { min-width: 40px; min-height: 40px; }
}

/* الطباعة لا تتأثر بقواعد الجوال */
@media print {
  #root main { overflow: visible !important; }
}