/* ==========================================================================
   طبقة التصميم الموحّد (ui2) — تعلو style.css: بطاقات، جداول، أزرار، قائمة جانبية، جوال
   ========================================================================== */
:root{--ui-r:12px;--ui-sh:0 1px 2px rgba(14,27,44,.05),0 8px 22px rgba(14,27,44,.06);--ui-focus:0 0 0 3px rgba(180,135,74,.25)}
body{-webkit-font-smoothing:antialiased;line-height:1.6}

/* ---------- القائمة الجانبية ---------- */
.sidebar{padding:14px 10px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent;gap:2px}
.sidebar .brand{padding:6px 8px 14px;margin-bottom:8px;border-bottom:1px solid rgba(233,237,243,.1)}
.nav-search{padding:2px 2px 10px;position:sticky;top:0;z-index:2;background:linear-gradient(180deg,var(--ink-900),rgba(14,27,44,.92))}
.nav-group{margin:1px 0;border-radius:10px;transition:background .15s}
.nav-group.open{background:rgba(255,255,255,.04)}
.nav-group-label{margin:0;padding:9px 10px;font-size:13px;font-weight:800;letter-spacing:0;color:#B9C6D8;gap:8px}
.nav-group-label span:first-child::before{content:var(--gi,'•');display:inline-block;width:22px;margin-inline-end:6px;text-align:center;opacity:.9}
.nav-group[data-g=home]{--gi:'🏠'}.nav-group[data-g=sales]{--gi:'🧾'}.nav-group[data-g=pos]{--gi:'🛒'}.nav-group[data-g=purchases]{--gi:'📥'}
.nav-group[data-g=inventory]{--gi:'📦'}.nav-group[data-g=production]{--gi:'🏭'}.nav-group[data-g=cash]{--gi:'🏦'}.nav-group[data-g=ar]{--gi:'⏳'}
.nav-group[data-g=accounting]{--gi:'📒'}.nav-group[data-g=reports]{--gi:'📊'}.nav-group[data-g=taxes]{--gi:'٪'}.nav-group[data-g=hr]{--gi:'👥'}
.nav-group[data-g=tools]{--gi:'⚙️'}.nav-group[data-g=security]{--gi:'🔐'}.nav-group[data-g=integrations]{--gi:'🔌'}.nav-group[data-g=scripts]{--gi:'🧪'}.nav-group[data-g=platform]{--gi:'🛰'}
.nav-group.open .nav-group-label{color:#fff}
.nav-group .nav-items{padding:0 6px 6px}
.nav-link{padding:8px 10px;font-size:13.5px;border-radius:8px;margin:1px 0}
.nav-link .ic{width:20px;font-size:14px}

/* ---------- الشريط العلوي والمحتوى ---------- */
.topbar{padding:10px 24px;min-height:62px;box-shadow:0 1px 0 var(--line),0 6px 18px rgba(14,27,44,.03)}
.topbar h1{font-size:18px;letter-spacing:-.005em}
.topbar-right{gap:10px}
.content{width:100%;max-width:1680px;margin-inline:auto;padding:20px 24px 70px}

/* ---------- البطاقات ---------- */
.card{border-radius:var(--ui-r);box-shadow:var(--ui-sh);border-color:#ebe5d4;padding:18px 20px}
.card-title{font-size:15.5px;font-weight:800;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.card-title small{font-weight:500;color:var(--text-muted)}
.kpi-card{border-radius:var(--ui-r);box-shadow:var(--ui-sh)}

/* ---------- الجداول ---------- */
.table-wrap{border-radius:10px;overflow:auto;-webkit-overflow-scrolling:touch}
table.ledger{border-collapse:separate;border-spacing:0;width:100%}
table.ledger thead th{background:#faf7ef;color:var(--text-muted);font-size:12px;font-weight:800;padding:10px 12px;border-bottom:2px solid var(--line);white-space:nowrap;position:sticky;top:0;z-index:1}
table.ledger tbody td{padding:11px 12px;vertical-align:middle;border-bottom:1px solid #f0ebdc}
table.ledger tbody tr:hover td{background:#fcfaf4}
table.ledger td .btn{min-height:30px;padding:4px 10px;font-size:12.5px;border-radius:8px}
table.ledger td .btn+.btn,table.ledger td .btn+a.btn,table.ledger td a.btn+.btn{margin-inline-start:2px}
table.ledger td:last-child{white-space:nowrap}

/* ---------- الأزرار والحقول ---------- */
.btn{border-radius:10px;font-weight:700;min-height:36px;transition:background .12s,box-shadow .12s,transform .06s}
.btn:active{transform:translateY(1px)}
.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:0;box-shadow:var(--ui-focus)}
input:not([type=checkbox]):not([type=radio]),select,textarea{border-radius:10px}
.field label{font-size:12.5px;font-weight:700;color:var(--text-muted)}
input[type=checkbox],input[type=radio]{accent-color:var(--brass);width:16px;height:16px}

/* ---------- النوافذ ---------- */
.modal{border-radius:16px;box-shadow:0 24px 70px rgba(14,27,44,.35)}
.modal-header{padding-bottom:10px;border-bottom:1px solid var(--line);margin-bottom:12px}
.modal-header h3{font-size:17px}

/* ---------- شريط التنقل السفلي للجوال ---------- */
#mnav{display:none}
@media (max-width:900px){
  .topbar{padding:8px 12px;gap:8px;flex-wrap:nowrap;min-height:54px}
  .topbar>div:first-child{display:flex;align-items:center;gap:8px;min-width:0;flex:1}
  .topbar h1{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #menu-toggle{margin:0!important;padding:6px 10px;border:1px solid var(--line)}
  .topbar-right{gap:6px;flex:none}
  .topbar-right>*:not(#gs-slot):not(#bell-slot):not(#hd-tab){display:none!important}
  #hd-tab{padding:6px 8px;font-size:12px}
  #gs-slot{display:none!important}
  .topbar>div:first-child{padding-inline-start:2px}
  .content{padding:12px 10px 92px}
  .card{padding:12px;border-radius:12px}
  #mnav{display:flex;position:fixed;inset-inline:0;bottom:0;z-index:55;background:#fff;border-top:1px solid var(--line);box-shadow:0 -6px 22px rgba(14,27,44,.1);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  #mnav a,#mnav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;border:0;background:none;color:var(--text-muted);font:inherit;font-size:11px;font-weight:700;text-decoration:none;border-radius:10px;cursor:pointer;min-width:0}
  #mnav a b,#mnav button b{font-size:19px;line-height:1;font-weight:400}
  #mnav a.on{color:var(--brass-dark);background:rgba(180,135,74,.12)}
  .toast-stack{bottom:78px}
  .cs-actions{bottom:calc(66px + env(safe-area-inset-bottom))!important;z-index:5} /* فوق شريط الجوال السفلي */
}
/* ---------- الجداول كبطاقات على الجوال ---------- */
@media (max-width:700px){
  .content table.ledger.u-cards{display:block;overflow:visible;white-space:normal}
  .u-cards thead{display:none}
  .u-cards tbody{display:grid;gap:10px}
  .u-cards tbody tr{display:block;border:1px solid var(--line);border-radius:12px;padding:6px 12px;background:#fff;box-shadow:0 1px 2px rgba(14,27,44,.04)}
  .u-cards tbody td{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:7px 0;border:0;border-bottom:1px dashed #f0ebdc;text-align:end;white-space:normal}
  .u-cards tbody td:last-child{border-bottom:0}
  .u-cards tbody td::before{content:attr(data-l);color:var(--text-muted);font-size:12px;font-weight:700;flex:none;text-align:start}
  .u-cards tbody td[data-l=""]::before{display:none}
  .u-cards tbody td.u-act{justify-content:flex-start;flex-wrap:wrap;gap:6px;padding-top:10px}
  .u-cards tbody td.u-act .btn{flex:1 1 auto;min-width:72px;justify-content:center}
  .u-cards tbody td.u-chk{padding:2px 0;border:0}
  .u-cards tbody tr:hover td{background:none}
}

/* ---------- جداول عريضة وتجاوب (يغلّف tablewrap.js كل جدول بحاوية تمرير) ---------- */
.content .card,.content .grid-2>*,.content .grid-3>*,.content .grid-4>*{min-width:0}
.table-wrap{max-width:100%;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;border-radius:10px}
.table-wrap>table.ledger{min-width:100%;width:max-content}
table.ledger td.num,table.ledger td.mono,table.ledger td .badge,table.ledger td .chip{white-space:nowrap}
/* أزرار الإجراءات: تلتف على أسطر بدل أن تمدّ الجدول */
table.ledger td:last-child:has(.btn){white-space:normal;min-width:150px;max-width:340px;line-height:2.1}
table.ledger td:last-child:has(.btn) .btn{margin:1px}
/* أشرطة الفلاتر والأدوات تلتف */
.rp-bar,.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.rp-bar>*{min-width:0;max-width:100%}
.card-title{flex-wrap:wrap}
@media (max-width:900px){
  .table-wrap>table.ledger{font-size:13px}
  table.ledger thead th,table.ledger tbody td{padding-inline:8px}
  .rp-bar input,.rp-bar select{flex:1 1 150px}
}
@media (max-width:700px){
  .table-wrap{overflow:visible}
  .table-wrap>table.ledger.u-cards{width:100%;min-width:0}
  table.ledger.u-cards td:last-child:has(.btn){max-width:none;min-width:0}
}

/* ===== تنسيق خانات الفورمات: الصنف كبير، الكمية والسعر صغيرة ===== */
table.ledger td:has(> .cmb),table.ledger td:has(> select.ln-item),table.ledger td:has(> select.cl-i){min-width:230px;width:44%}
table.ledger td>.cmb,table.ledger td>select.ln-item,table.ledger td>select.cl-i{width:100%;min-width:0}
table.ledger td:has(> input[type=number]){width:1%;white-space:nowrap}
table.ledger td>input[type=number]{width:92px!important;min-width:70px;max-width:110px;padding:6px 8px!important;text-align:center;box-sizing:border-box}
table.ledger td>input[type=text]:not(.cmb-in){min-width:140px}
table.ledger td .tax-sel,table.ledger td select.io-unit{min-width:0;width:auto;max-width:130px}
table.ledger td>input:not([type=checkbox]):not([type=radio]),table.ledger td select,table.ledger td>.cmb>input.cmb-in{border:1px solid var(--line,#E3DCCB);border-radius:6px;background-color:#FFFDF9;box-shadow:none}
table.ledger td>input:focus,table.ledger td select:focus{border-color:var(--brass,#B4874A);box-shadow:0 0 0 3px rgba(180,135,74,.15);outline:0}
.modal .table-wrap{overflow-x:auto;max-width:100%}
.modal .table-wrap>table.ledger{width:100%;min-width:640px}
.modal table.ledger thead th{position:static}
@media(max-width:700px){table.ledger td>input[type=number]{width:100%!important;max-width:none}}

/* أرقام القطع والأكواد: إنجليزية ومحاذاة لليسار في كل الخانات */
input[name="sku"],input[name="a_oemNumber"],input[name="a_altParts"],input[name="barcodes"],input[name="supplierCodes"],input[name="a_partPosition"],
#scan-input,#nc-code,#pf-q,#pf-search,.pn-in{direction:ltr!important;text-align:left!important}
input[name="sku"]::placeholder,input[name="a_oemNumber"]::placeholder,input[name="a_altParts"]::placeholder,#scan-input::placeholder,#pf-q::placeholder{direction:rtl;text-align:right}
.pn,.pf-meta code,td.pn{direction:ltr;unicode-bidi:isolate;text-align:left}
.pf-meta code{display:inline-block;margin:0 2px}

/* تبويبات الصفحات المجمّعة */
.hub-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px;border-bottom:1px solid var(--line,#e5dfd3)}
.hub-tab{padding:9px 16px;border-radius:10px 10px 0 0;text-decoration:none;color:var(--text-muted,#6b6459);font-weight:700;font-size:13px;border:1px solid transparent;border-bottom:0;margin-bottom:-1px}
.hub-tab:hover{background:rgba(180,135,74,.08)}
.hub-tab.active{color:var(--text,#1c1a17);background:var(--surface,#fff);border-color:var(--line,#e5dfd3)}

/* توحيد الجداول: table.tbl بنفس مظهر table.ledger */
table.tbl{border-collapse:separate;border-spacing:0;width:100%;font-size:13.5px}
table.tbl thead th{background:#faf7ef;color:var(--text-muted);font-size:12px;font-weight:800;padding:10px 12px;border-bottom:2px solid var(--line);white-space:nowrap}
table.tbl tbody td{padding:11px 12px;vertical-align:middle;border-bottom:1px solid #f0ebdc}
table.tbl tbody tr:hover td{background:#fcfaf4}
table.tbl td .btn{min-height:30px;padding:4px 10px;font-size:12.5px;border-radius:8px}
table.tbl td:last-child{white-space:nowrap}
.modal table.tbl thead th{position:static}
/* توحيد المسافات: عناوين الصفحات وأشرطة الأزرار في النوافذ */
.content>h2:first-child,.content>.page-title{margin:0 0 14px}
.modal .modal-body>.card:first-child{margin-top:0}
.modal .btn-row,.modal .modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px;flex-wrap:wrap}
.card+.card{margin-top:14px}

/* جداول البنود داخل النماذج: القواعد العامة للجداول تضخّم الكمية والسعر وعمود الحذف وتضغط الخصم */
.modal-body form table.ledger td > input:not(.cmb-in){min-width:0;width:100%}
.modal-body form table.ledger td:last-child:has(> .remove-line,> .remove-poline,> .rm-pline,> .rm-pexp,> .rm-jl,> .rm-vl,> .rm-comp,> .rm){min-width:36px;width:36px;white-space:nowrap}
.modal-body form table.ledger td > input.num-in{min-width:84px}
.modal-body form table.ledger .io-row input{min-width:64px}