/* ============================================================================
   أملاك — نظام الجداول الموحّد
   ملف واحد مركزي يطبّق نفس الهوية على كل جداول البرنامج:
     • .dtbl         (الجداول الرئيسية في كل الأقسام — ومنها قسم التطوير العقاري dv-tbl)
     • .rpt-table    (جداول التقارير والتفاصيل داخل النوافذ)
     • .ctbl / .dirtbl (جداول العقود والمستأجرين المبنية بالشبكة Grid)
     • .amk-table + أي <table> بدون كلاس داخل الصفحات أو النوافذ ← أي جدول جديد يأخذ التنسيق تلقائيًا
   فواصل عمودية وأفقية رفيعة وهادئة، إطار خارجي، رأس كحلي ثابت أثناء التمرير، صفوف متبادلة،
   تمييز للصف عند المرور وللصف المحدد، وأزرار موحّدة داخل الخلايا.
   لا يغيّر أي وظيفة: يُحمَّل بعد كل التنسيقات الحالية ويعيد ضبط المظهر فقط.
   ============================================================================ */
:root{
  --tbl-head-bg:var(--ink);
  --tbl-head-fg:#fbf3e2;
  --tbl-head-sep:rgba(255,255,255,.17);   /* الفاصل العمودي داخل الرأس الكحلي */
  --tbl-vline:#dde2ea;                    /* الفاصل العمودي بين الأعمدة */
  --tbl-hline:#e4e8ee;                    /* الفاصل الأفقي بين الصفوف */
  --tbl-frame:#d3d9e2;                    /* الإطار الخارجي */
  --tbl-row:#ffffff;
  --tbl-zebra:#f7f8fa;                    /* الصفوف المتبادلة */
  --tbl-hover:#f6efe0;                    /* الصف تحت مؤشر الماوس */
  --tbl-selected:#e9eff9;                 /* الصف المحدد */
  --tbl-selected-edge:#a87f3f;
  --tbl-radius:10px;
  --tbl-pad-y:9px;
  --tbl-pad-x:12px;
  --tbl-btn-h:28px;
  --tbl-scroll-max:calc(100vh - 190px);   /* ارتفاع منطقة التمرير حتى يبقى الرأس ظاهرًا */
}

/* ═════════════ 1) هيكل الجدول والإطار ═════════════ */
.dtbl,.amk-table,.rpt-table,
:where(#contentArea,.overlay) table:not([class]){
  border-collapse:separate;border-spacing:0;
  border:1px solid var(--tbl-frame);border-radius:var(--tbl-radius);
  background:var(--tbl-row);
}
/* داخل بطاقة جدول أو منطقة تمرير: الإطار للحاوية نفسها (حتى يبقى متصلًا أثناء التمرير الأفقي) */
.tbl-scroll>.dtbl,.tbl-scroll>.amk-table,.tbl-scroll>.rpt-table,.tbl-scroll>table{border:0;border-radius:0}
.tbl-scroll{border:1px solid var(--tbl-frame);border-radius:var(--tbl-radius);background:var(--tbl-row)}
.tbl-card>.tbl-scroll,.tbl-card .tbl-scroll{border:0;border-radius:0}
.tbl-card{border-color:var(--tbl-frame)}

/* منطقة تمرير بارتفاع محدود ← الرأس يبقى ظاهرًا، وشريط التمرير الأفقي قريب دائمًا */
#contentArea .tbl-scroll,#contentArea .ctbl-scroll{max-height:var(--tbl-scroll-max);overflow:auto}
.overlay .tbl-scroll{max-height:62vh;overflow:auto}

/* ═════════════ 2) رأس الجدول ═════════════ */
.dtbl thead th,.amk-table thead th,.rpt-table thead th,
:where(#contentArea,.overlay) table:not([class]) thead th{
  background:var(--tbl-head-bg);color:var(--tbl-head-fg);
  padding:11px var(--tbl-pad-x);font-size:13px;font-weight:800;line-height:1.35;
  text-align:center;vertical-align:middle;white-space:nowrap;
  border-bottom:1px solid var(--ink-2);border-inline-end:1px solid var(--tbl-head-sep);
}
.dtbl thead th:last-child,.amk-table thead th:last-child,.rpt-table thead th:last-child,
:where(#contentArea,.overlay) table:not([class]) thead th:last-child{border-inline-end:0}
/* رأس ثابت أثناء التمرير الرأسي (الجداول ذات صف رأس واحد) */
.dtbl thead th,.amk-table thead th,:where(#contentArea,.overlay) table:not([class]) thead th{position:sticky;top:0;z-index:3}
.th-with-icon{color:#e8eef8}
.rpt-table thead th{padding:8px 10px;font-size:12.5px}
/* زوايا الرأس مستديرة مع الإطار */
.dtbl thead tr:first-child th:first-child,.amk-table thead tr:first-child th:first-child,.rpt-table thead tr:first-child th:first-child{border-start-start-radius:calc(var(--tbl-radius) - 1px)}
.dtbl thead tr:first-child th:last-child,.amk-table thead tr:first-child th:last-child,.rpt-table thead tr:first-child th:last-child{border-start-end-radius:calc(var(--tbl-radius) - 1px)}
/* زوايا الصف الأخير (tbody أو tfoot) مستديرة مع الإطار */
.dtbl>:last-child>tr:last-child>td:first-child,.amk-table>:last-child>tr:last-child>td:first-child,.rpt-table>:last-child>tr:last-child>td:first-child{border-end-start-radius:calc(var(--tbl-radius) - 1px)}
.dtbl>:last-child>tr:last-child>td:last-child,.amk-table>:last-child>tr:last-child>td:last-child,.rpt-table>:last-child>tr:last-child>td:last-child{border-end-end-radius:calc(var(--tbl-radius) - 1px)}
.tbl-scroll>table thead th,.tbl-scroll>table>:last-child>tr:last-child>td{border-radius:0!important}

/* ═════════════ 3) الخلايا والفواصل ═════════════ */
.dtbl tbody td,.dtbl tfoot td,.amk-table tbody td,.amk-table tfoot td,.rpt-table tbody td,.rpt-table tfoot td,
:where(#contentArea,.overlay) table:not([class]) td{
  padding:var(--tbl-pad-y) var(--tbl-pad-x);vertical-align:middle;
  border-bottom:1px solid var(--tbl-hline);border-inline-end:1px solid var(--tbl-vline);
}
.dtbl td:last-child,.amk-table td:last-child,.rpt-table td:last-child,
:where(#contentArea,.overlay) table:not([class]) td:last-child{border-inline-end:0}
/* لا خط مزدوج أسفل آخر صف (الإطار يكفي) */
.dtbl>tbody:last-child>tr:last-child>td,.amk-table>tbody:last-child>tr:last-child>td,.rpt-table>tbody:last-child>tr:last-child>td{border-bottom:0}
.dtbl tfoot td,.rpt-table tfoot td{border-bottom:0;border-top:2px solid var(--tbl-frame)}
.dtbl .dv-tfoot td{border-top:2px solid var(--ink)}
.rpt-table tbody td{padding:8px 10px}
.dtbl tbody td{font-size:13px}

/* ═════════════ 4) ألوان الصفوف: أبيض + متبادل + مرور + محدد ═════════════ */
.dtbl tbody tr>td,.amk-table tbody tr>td,.rpt-table tbody tr>td{background-color:var(--tbl-row)}
.dtbl tbody tr:nth-child(even)>td,.amk-table tbody tr:nth-child(even)>td,.rpt-table tbody tr:nth-child(even)>td,
:where(#contentArea,.overlay) table:not([class]) tbody tr:nth-child(even)>td{background-color:var(--tbl-zebra)}
.dtbl tbody tr.dv-row-converted>td{background-color:#eef7f2}
.dtbl tbody tr:hover>td,.amk-table tbody tr:hover>td,.rpt-table tbody tr:hover>td,
:where(#contentArea,.overlay) table:not([class]) tbody tr:hover>td{background-color:var(--tbl-hover)}
.dtbl tbody tr.is-selected>td,.amk-table tbody tr.is-selected>td,.rpt-table tbody tr.is-selected>td{
  background-color:var(--tbl-selected);
  box-shadow:inset 0 1px 0 var(--tbl-selected-edge),inset 0 -1px 0 var(--tbl-selected-edge);
}
.dtbl tbody tr.is-selected>td:first-child,.amk-table tbody tr.is-selected>td:first-child,.rpt-table tbody tr.is-selected>td:first-child{
  box-shadow:inset -3px 0 0 var(--tbl-selected-edge),inset 0 1px 0 var(--tbl-selected-edge),inset 0 -1px 0 var(--tbl-selected-edge);
}
.dtbl tbody tr.is-selected:hover>td{background-color:#dfe8f6}
/* صفوف الحالات الخاصة (شاغرة / محجوزة) تحتفظ بلونها الحالي — تُعرَّف بـ !important في البرنامج */

/* ═════════════ 5) عرض الأعمدة والمحاذاة ═════════════ */
/* العمود الرئيسي (الاسم): يلتف على سطرين بدل أن يُقص أو يتمدد بلا حد */
.dtbl td.tname{white-space:normal;min-width:190px;max-width:340px;overflow-wrap:break-word;line-height:1.45;text-overflow:clip}
.dtbl td.tname .dv-sub{overflow-wrap:anywhere}
/* أسماء المستأجرين في جدول الشبكة: تلتف على سطرين بدل أن تُقص */
.dirtbl-tenant{white-space:normal!important;line-height:1.4}
.dtbl-units td.unitnumcell{min-width:96px}
/* الأرقام والتواريخ: أرقام بعرض ثابت لتسهيل المقارنة */
.dtbl td.num,.rpt-table td.num,.dtbl td .num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.dtbl td.num{white-space:nowrap}
/* الخلايا الطويلة الوصفية تبقى بسطر واحد مع تلميح عند المرور (amlak-tables.js) */
.dtbl td .dv-desc{max-width:240px}

/* ═════════════ 6) الأزرار داخل الجداول ═════════════ */
.dtbl td .btn-icon,.amk-table td .btn-icon,.rpt-table td .btn-icon{
  width:var(--tbl-btn-h);height:var(--tbl-btn-h);padding:0;display:inline-flex;align-items:center;justify-content:center;
  vertical-align:middle;border-radius:7px;line-height:1;
}
.dtbl td .btn-sm,.amk-table td .btn-sm,.rpt-table td .btn-sm{
  height:var(--tbl-btn-h);padding:0 10px!important;font-size:12.5px!important;line-height:1;border-radius:7px;
  display:inline-flex;align-items:center;justify-content:center;gap:4px;vertical-align:middle;white-space:nowrap;
}
.dtbl td .btn-icon+.btn-icon,.dtbl td .btn+.btn,.dtbl td .btn-icon+.btn,.dtbl td .btn+.btn-icon,
.rpt-table td .btn+.btn,.rpt-table td .btn-icon+.btn-icon{margin-inline-start:4px}
.dtbl td .dv-doc-actions{display:inline-flex;gap:4px;justify-content:center;vertical-align:middle}
.dtbl td .dv-doc-actions .btn-sm{width:var(--tbl-btn-h);padding:0!important;font-size:13px!important}
.dtbl td .dvs-fact{display:inline-flex;gap:4px;vertical-align:middle}
.dtbl td .dvs-ibtn{height:var(--tbl-btn-h);padding:0 8px;font-size:12px}
.dtbl td .badge{vertical-align:middle}

/* ═════════════ 7) جداول الشبكة (العقود + المستأجرين) ═════════════ */
.ctbl-head,.dirtbl-head{position:sticky;top:0;z-index:4}
.ctbl-hcell,.dirtbl-hcell{border-inline-end:1px solid var(--tbl-head-sep);color:#e8eef8}
.ctbl-head>.ctbl-hcell:last-child,.dirtbl-head>.dirtbl-hcell:last-child{border-inline-end:0}
.ctbl-row,.dirtbl-row{align-items:stretch;border-bottom-color:var(--tbl-hline)}
.ctbl-cell,.dirtbl-cell{display:flex;flex-direction:column;justify-content:center;align-items:center;border-inline-end:1px solid var(--tbl-vline);min-width:0}
.ctbl-cell>*,.dirtbl-cell>*{max-width:100%}
.ctbl-row>.ctbl-cell:last-child,.dirtbl-row>.dirtbl-cell:last-child{border-inline-end:0}
.ctbl-cell.ctbl-name,.dirtbl-cell.dirtbl-name{align-items:flex-start}
.ctbl-cell.ctbl-chevron,.dirtbl-cell.dirtbl-actions{flex-direction:row;align-items:center;justify-content:center}
:where(.ctbl-row:nth-child(even of .ctbl-row)),:where(.dirtbl-row:nth-child(even of .dirtbl-row)){background:var(--tbl-zebra)}
.ctbl-row:hover,.dirtbl-row:hover{background:var(--tbl-hover)}
.ctbl-row.ctbl-row-vacant:hover{background:#f6cdc0}
.ctbl-row.ctbl-row-booked:hover{background:#f3d99a}
.ctbl-row.open,.ctbl-row.is-selected,.dirtbl-row.is-selected{background:var(--tbl-selected);box-shadow:inset -3px 0 0 var(--tbl-selected-edge)}
.ctbl-detail{border-bottom-color:var(--tbl-frame)}
.dirtbl-actions .btn-icon,.ctbl-chevron .btn-icon{width:var(--tbl-btn-h);height:var(--tbl-btn-h);padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:7px}

/* ═════════════ 8) الطباعة من الشاشة ═════════════ */
@media print{
  #contentArea .tbl-scroll,#contentArea .ctbl-scroll,.overlay .tbl-scroll{max-height:none!important;overflow:visible!important}
  .dtbl thead th,.amk-table thead th,.ctbl-head,.dirtbl-head{position:static!important}
  .dtbl thead th:last-child{border-inline-end:0}
}
