/* ============================================================
   DD STORE — ثيم ذهبي فاخر / فاتح، RTL، متجاوب  (v2 UI/UX)
   ============================================================ */
:root{
  --bg:#f6f4ef; --bg2:#f0ece3; --card:#ffffff; --ink:#1b1a18; --muted:#6f6a61; --muted2:#938c80;
  --line:#e8e3d9; --line2:#f0ede6;
  --gold:#b8893b; --gold-d:#8a6526; --gold-l:#cfa45a; --gold-soft:#f5ecd9;
  --sidebar:#211e1b; --sidebar2:#2c2723; --sidebar-ink:#efe7d7; --sidebar-mut:#b1a692;
  --ok:#2e7d5b; --ok-bg:#e6f4ec;
  --err:#c0392b; --err-bg:#fdecea;
  --warn:#9a6b00; --warn-bg:#fdf3da;
  --info:#2c5d86; --info-bg:#e8f1f9;
  --radius:14px; --radius-sm:10px;
  --shadow:0 1px 2px rgba(28,27,25,.04),0 4px 14px rgba(28,27,25,.05);
  --shadow-lg:0 10px 34px rgba(28,27,25,.13);
  --ring:0 0 0 3px rgba(184,137,59,.20);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{overflow-x:clip}
body{
  /* Cairo أولاً، وبعدها خطوط عربية أصلية لكل نظام عشان الواجهة تفضل مظبوطة حتى لو الخط ما اتحمّلش */
  font-family:'Cairo','Noto Sans Arabic','Noto Kufi Arabic','SF Arabic','Geeza Pro','Segoe UI','Dubai',Tahoma,Arial,sans-serif;
  background:var(--bg); color:var(--ink); direction:rtl;
  line-height:1.7; font-size:15px; -webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
a{color:var(--gold-d);text-decoration:none;transition:color .15s}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0 0 12px;font-weight:800;letter-spacing:-.2px}
h1{font-size:22px} h2{font-size:18px} h3{font-size:16px}
small{color:var(--muted)}
::selection{background:var(--gold-soft)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#d8d1c4;border-radius:8px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:#c7bfae}

/* ===== تخطيط عام ===== */
.layout{display:flex;min-height:100vh}
.sidebar{
  width:236px;background:linear-gradient(180deg,var(--sidebar2),var(--sidebar));
  color:var(--sidebar-ink);flex-shrink:0;display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;box-shadow:inset -1px 0 0 rgba(255,255,255,.04);
}
.sidebar .brand{padding:20px 16px 16px;border-bottom:1px solid rgba(255,255,255,.07);text-align:center}
.sidebar .brand img{max-height:48px;max-width:154px;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.3))}
.sidebar .brand .txt{font-weight:800;font-size:21px;color:#fff;letter-spacing:1.5px}
.sidebar .who{padding:13px 16px;font-size:13px;color:var(--sidebar-mut);border-bottom:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;gap:2px}
.sidebar .who b{color:#fff;display:block;font-size:14px;font-weight:700}
.nav{flex:1;overflow-y:auto;padding:10px 10px}
.nav a{
  display:flex;align-items:center;gap:11px;color:var(--sidebar-ink);
  padding:11px 13px;margin:2px 0;font-size:14.5px;border-radius:10px;position:relative;
  transition:background .16s,color .16s,transform .08s;
}
.nav a .ic{width:22px;text-align:center;opacity:.92;font-size:16px}
.nav a:hover{background:rgba(255,255,255,.07);text-decoration:none}
.nav a:active{transform:scale(.99)}
.nav a.active{background:linear-gradient(90deg,rgba(184,137,59,.26),rgba(184,137,59,.10));color:#fff;font-weight:700}
.nav a.active:before{content:"";position:absolute;right:-10px;top:8px;bottom:8px;width:4px;border-radius:0 4px 4px 0;background:var(--gold-l)}
.sidebar .side-foot{padding:10px 10px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(255,255,255,.09);display:flex;flex-direction:column;gap:4px;flex-shrink:0}
.sidebar .sf-link{display:flex;align-items:center;gap:11px;color:var(--sidebar-ink);font-size:14px;font-weight:600;padding:11px 13px;border-radius:10px;transition:background .15s}
.sidebar .sf-link .ic{width:22px;text-align:center;font-size:16px;opacity:.92}
.sidebar .sf-link:hover{background:rgba(255,255,255,.07);text-decoration:none}
.sidebar .sf-link.active{background:linear-gradient(90deg,rgba(184,137,59,.26),rgba(184,137,59,.10));color:#fff;font-weight:700}
.sidebar .sf-logout{color:#eab8b0}
.sidebar .sf-logout:hover{background:rgba(255,90,70,.12)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(8px);
  border-bottom:1px solid var(--line);padding:12px 22px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  position:sticky;top:0;z-index:20;transition:box-shadow .2s;
}
.topbar.scrolled{box-shadow:0 6px 20px rgba(28,27,25,.07)}
.topbar .pg{font-weight:800;font-size:17px}
.topbar .tb-right{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:13px}
#clock{font-variant-numeric:tabular-nums;background:var(--gold-soft);color:var(--gold-d);padding:6px 12px;border-radius:9px;font-weight:700;box-shadow:inset 0 0 0 1px rgba(184,137,59,.18)}
.content{padding:24px;max-width:1180px;width:100%;margin:0 auto;animation:fadeUp .3s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ===== الموبايل ===== */
.menu-btn{display:none;background:none;border:0;font-size:22px;cursor:pointer;color:var(--ink);padding:4px 8px;border-radius:8px}
.menu-btn:active{background:var(--bg2)}
.scrim{display:none}
@media(max-width:860px){
  .menu-btn{display:block}
  .sidebar{position:fixed;z-index:73;right:0;top:0;height:100vh;height:100dvh;transform:translateX(100%);transition:transform .24s ease;box-shadow:-6px 0 30px rgba(0,0,0,.32)}
  body.nav-open .sidebar{transform:translateX(0)}
  body.nav-open .scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.42);z-index:72;animation:fadeUp .2s}
  .content{padding:16px}
  .topbar{padding:10px 12px}
  .topbar .tb-right{gap:5px}
  .topbar .tb-right #clock{display:none}          /* الوقت موجود في شريط الهاتف */
  .sys-switch{padding:2px}
  .sys-switch a{padding:5px 8px;font-size:15px}   /* إيموجي بس */
  .sys-switch .sw-lb{display:none}
  .tb-icon{min-width:32px;height:34px;padding:0 5px;font-size:13px}
  .topbar .pg{font-size:15px;max-width:30vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* ===== كروت ===== */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;margin-bottom:18px}
.card .hd{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-4px 0 16px;padding-bottom:12px;border-bottom:1px solid var(--line2)}
.card .hd h2,.card .hd h3{margin:0}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g5{grid-template-columns:repeat(5,1fr)}
@media(max-width:980px){.g4,.g5{grid-template-columns:repeat(2,1fr)}}
@media(max-width:860px){.g2,.g3,.g4,.g5{grid-template-columns:1fr}}

/* ===== كروت أرقام ===== */
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);position:relative;overflow:hidden;transition:transform .14s,box-shadow .14s}
.stat:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.stat:before{content:"";position:absolute;top:0;right:0;width:4px;height:100%;background:var(--gold)}
.stat:after{content:"";position:absolute;left:-30px;bottom:-30px;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle,rgba(184,137,59,.08),transparent 70%)}
.stat .lbl{color:var(--muted);font-size:13px;margin-bottom:6px;font-weight:600}
.stat .val{font-size:26px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.5px}
.stat .sub{font-size:12px;color:var(--muted);margin-top:3px}
.stat.green:before{background:var(--ok)} .stat.green .val{color:var(--ok)} .stat.green:after{background:radial-gradient(circle,rgba(46,125,91,.10),transparent 70%)}
.stat.gold:before{background:var(--gold)} .stat.gold .val{color:var(--gold-d)}
.stat.blue:before{background:var(--info)} .stat.blue .val{color:var(--info)} .stat.blue:after{background:radial-gradient(circle,rgba(44,93,134,.10),transparent 70%)}

/* ===== جداول ===== */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line2);border-radius:12px}
table.tbl{width:100%;border-collapse:collapse;font-size:14px;min-width:520px}
table.tbl th,table.tbl td{border-bottom:1px solid var(--line2);padding:11px 13px;text-align:right;white-space:nowrap}
table.tbl thead th{background:var(--line2);color:var(--muted);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.4px;position:sticky;top:0}
table.tbl tbody tr{transition:background .12s}
table.tbl tbody tr:nth-child(even){background:var(--line2)}
table.tbl tbody tr:hover{background:var(--gold-soft)}
table.tbl tr:last-child td{border-bottom:0}
table.tbl td.num,table.tbl th.num{font-variant-numeric:tabular-nums}
.empty{padding:30px;text-align:center;color:var(--muted)}

/* ===== فورم ===== */
label.fld{display:block;margin-bottom:13px}
label.fld>span{display:block;font-size:13.5px;color:var(--muted);margin-bottom:5px;font-weight:600}
input[type=text],input[type=password],input[type=number],input[type=tel],input[type=date],input[type=search],select,textarea{
  width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--card);color:var(--ink);
  font-family:inherit;font-size:15px;outline:none;transition:border-color .15s,box-shadow .15s;
}
input::placeholder,textarea::placeholder{color:var(--muted2)}
input:focus,select:focus,textarea:focus{border-color:var(--gold);box-shadow:var(--ring)}
.row{display:flex;gap:12px;flex-wrap:wrap}
.row>*{flex:1;min-width:140px}

/* ===== أزرار ===== */
.btn{display:inline-flex;align-items:center;gap:7px;justify-content:center;
  background:linear-gradient(180deg,var(--gold-l),var(--gold));color:#fff;border:0;border-radius:var(--radius-sm);padding:11px 18px;
  font-family:inherit;font-size:14.5px;font-weight:700;cursor:pointer;text-decoration:none;
  box-shadow:0 2px 8px rgba(184,137,59,.28);transition:filter .15s,transform .06s,box-shadow .15s}
.btn:hover{filter:brightness(1.04);text-decoration:none;box-shadow:0 4px 14px rgba(184,137,59,.36)}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:none;box-shadow:var(--ring),0 2px 8px rgba(184,137,59,.28)}
.btn.sm{padding:6px 12px;font-size:13px;border-radius:8px;box-shadow:none}
.btn.block{width:100%}
.btn.ghost{background:var(--card);color:var(--ink);border:1px solid var(--line);box-shadow:none}
.btn.ghost:hover{background:var(--bg2);filter:none;border-color:#dcd5c8}
.btn.green{background:linear-gradient(180deg,#379e72,var(--ok));box-shadow:0 2px 8px rgba(46,125,91,.28)}
.btn.danger{background:linear-gradient(180deg,#d4503f,var(--err));box-shadow:0 2px 8px rgba(192,57,43,.26)}
.btn.info{background:linear-gradient(180deg,#3a73a0,var(--info));box-shadow:0 2px 8px rgba(44,93,134,.26)}
.btn.warn{background:linear-gradient(180deg,#b9851a,var(--warn));box-shadow:0 2px 8px rgba(154,107,0,.26);color:#fff}
.btn:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}
.btn-row{display:flex;gap:8px;flex-wrap:wrap}

/* ===== شارات ===== */
.badge{display:inline-block;padding:3px 11px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;line-height:1.6}
.b-gold{background:var(--gold-soft);color:var(--gold-d)}
.b-green{background:var(--ok-bg);color:var(--ok)}
.b-red{background:var(--err-bg);color:var(--err)}
.b-warn{background:var(--warn-bg);color:var(--warn)}
.b-info{background:var(--info-bg);color:var(--info)}
.b-gray{background:#edeae3;color:#6a6459}

/* ===== تنبيهات (inline) ===== */
.alert{padding:12px 15px;border-radius:var(--radius-sm);margin-bottom:14px;font-size:14px;font-weight:600;border:1px solid transparent}
.alert-success{background:var(--ok-bg);color:var(--ok);border-color:#bfe3cf}
.alert-error{background:var(--err-bg);color:var(--err);border-color:#f5c6c0}
.alert-info{background:var(--info-bg);color:var(--info);border-color:#c9def0}
.alert-warn{background:var(--warn-bg);color:var(--warn);border-color:#f0dca6}

/* ===== Toasts (إشعارات عائمة) ===== */
.toasts{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:300;display:flex;flex-direction:column;gap:10px;width:min(440px,92vw);pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:center;gap:11px;background:var(--card);border:1px solid var(--line);border-right:4px solid var(--muted2);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow-lg);font-weight:600;font-size:14px;animation:toastIn .3s cubic-bezier(.2,.7,.3,1)}
.toast.hiding{animation:toastOut .25s forwards}
.toast .ti{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:50%;font-size:13px;font-weight:800;flex-shrink:0;background:var(--line2);color:var(--muted)}
.toast .tm{flex:1;line-height:1.5}
.toast .tx{background:none;border:0;font-size:19px;color:var(--muted2);cursor:pointer;line-height:1;padding:0 2px;border-radius:6px}
.toast .tx:hover{color:var(--ink)}
.toast.t-success{border-right-color:var(--ok)} .toast.t-success .ti{background:var(--ok-bg);color:var(--ok)}
.toast.t-error{border-right-color:var(--err)} .toast.t-error .ti{background:var(--err-bg);color:var(--err)}
.toast.t-info{border-right-color:var(--info)} .toast.t-info .ti{background:var(--info-bg);color:var(--info)}
.toast.t-warn{border-right-color:var(--warn)} .toast.t-warn .ti{background:var(--warn-bg);color:var(--warn)}
@keyframes toastIn{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateY(-12px)}}

/* ===== متفرقات ===== */
.hint{font-size:13px;color:var(--muted);margin:6px 0}
.divider{height:1px;background:var(--line);margin:16px 0}
.pill-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.pill-tabs a{padding:8px 16px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:14px;color:var(--ink);font-weight:600;transition:all .15s}
.pill-tabs a.active{background:linear-gradient(180deg,var(--gold-l),var(--gold));color:#fff;border-color:var(--gold);box-shadow:0 2px 8px rgba(184,137,59,.28)}
.pill-tabs a:hover{text-decoration:none;border-color:var(--gold)}
.stage-flow{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12.5px}
.stage-flow .st{padding:4px 11px;border-radius:8px;background:var(--line2);color:var(--muted)}
.stage-flow .st.done{background:var(--ok-bg);color:var(--ok);font-weight:700}
.stage-flow .st.cur{background:linear-gradient(180deg,var(--gold-l),var(--gold));color:#fff;font-weight:700}
.stage-flow .arr{color:#cbb8a0}
.text-c{text-align:center}.text-l{text-align:left}
.mt0{margin-top:0}.mb0{margin-bottom:0}
.muted{color:var(--muted)}
.nowrap{white-space:nowrap}

/* ===== صفحة الدخول ===== */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;
  background:radial-gradient(1200px 500px at 70% -10%,#3a322a,transparent),linear-gradient(135deg,#211e1b,#33291f)}
.login-card{background:var(--card);border-radius:20px;padding:36px 30px;width:100%;max-width:390px;box-shadow:0 24px 60px rgba(0,0,0,.36);animation:fadeUp .35s ease}
.login-card .lg{text-align:center;margin-bottom:18px}
.login-card .lg img{max-height:62px;max-width:176px;object-fit:contain}
.login-card .lg .txt{font-weight:800;font-size:27px;letter-spacing:2px;color:var(--gold-d)}
.login-card .sub{text-align:center;color:var(--muted);font-size:13.5px;margin-bottom:22px}
.login-card .btn{margin-top:6px}

/* ===== صفحات الإدارة (مستخدمين/فروع/سجل) ===== */
.form{margin:0}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:14px}
.form label{display:flex;flex-direction:column;gap:5px;font-size:13.5px;color:var(--muted);font-weight:600}
.form label input,.form label select,.form label textarea{font-weight:600;color:var(--ink)}
.form label .hint{font-weight:600;color:var(--muted);margin:0}
.inline-form{display:inline-flex;align-items:center;gap:6px;margin:0}
.inline-form input,.inline-form select{width:auto}
.row-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.note{margin-top:12px;font-size:12.5px;color:var(--muted);background:var(--bg2);border:1px dashed var(--line);border-radius:var(--radius-sm);padding:10px 12px;line-height:1.7}
.pager{display:flex;gap:12px;align-items:center;justify-content:center;margin-top:16px;flex-wrap:wrap}
.pager-info{color:var(--muted);font-size:13px;font-weight:600}

/* ===== طباعة: إخفاء الواجهة (الإيصال له ستايل مستقل) ===== */
@media print{
  .sidebar,.topbar,.menu-btn,.scrim,.toasts{display:none!important}
  .main,.content{margin:0;padding:0;max-width:none}
  body{background:#fff}
}

/* ===== احترام تقليل الحركة ===== */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

/* ===== منتقي المنتجات (Combobox) ===== */
.picker{position:relative}
.picker-input{width:100%}
.picker-panel{position:absolute;z-index:60;top:calc(100% + 5px);right:0;left:0;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-lg);max-height:300px;overflow-y:auto;padding:6px}
.picker-head{font-size:12px;color:var(--muted);font-weight:700;padding:6px 10px 8px}
.picker-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 11px;border-radius:9px;cursor:pointer}
.picker-item:hover,.picker-item.hi{background:var(--gold-soft)}
.picker-item.disabled{opacity:.5;cursor:not-allowed}
.picker-item .pi-name{font-weight:700;font-size:14px}
.picker-item .pi-meta{font-size:12px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.pi-out{color:var(--err);font-weight:700;font-size:11px;margin-right:4px}

/* ===== جرس التنبيهات ===== */
.bell{position:relative;font-size:19px;line-height:1;text-decoration:none;padding:5px;border-radius:9px;display:inline-flex;align-items:center}
.bell:hover{background:var(--bg2);text-decoration:none}
.bell-badge{position:absolute;top:-3px;left:-5px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:var(--err);color:#fff;font-size:11px;font-weight:800;display:inline-grid;place-items:center;box-shadow:0 0 0 2px var(--card);font-variant-numeric:tabular-nums}
@keyframes bellRing{0%,100%{transform:rotate(0)}15%{transform:rotate(18deg)}30%{transform:rotate(-15deg)}45%{transform:rotate(11deg)}60%{transform:rotate(-7deg)}75%{transform:rotate(3deg)}}
.bell.ring{animation:bellRing .8s ease}

/* ===== ترتيب التوب (تقارير) ===== */
.rank{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:8px;background:var(--bg2);color:var(--muted);font-weight:800;font-size:12px}
.rank.r1{background:#f6e3b0;color:#8a6526}
.rank.r2{background:#e6e6e6;color:#666}
.rank.r3{background:#f0ddc4;color:#9a6b00}

/* ===== أدوات الفترة ===== */
.period-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.period-bar .lbl{font-weight:700;color:var(--muted);font-size:13px;margin-left:4px}

/* ============================================================
   تحسينات UI/UX إضافية (v3)
   ============================================================ */

/* زر أثناء الحفظ: سبينر + قفل ضد الضغط المزدوج */
.btn.is-loading{position:relative;color:transparent!important;pointer-events:none}
.btn.is-loading::after{content:"";position:absolute;top:50%;left:50%;width:16px;height:16px;margin:-8px 0 0 -8px;
  border:2px solid rgba(255,255,255,.55);border-top-color:#fff;border-radius:50%;animation:btnspin .6s linear infinite}
.btn.ghost.is-loading::after{border-color:rgba(0,0,0,.22);border-top-color:var(--gold-d)}
@keyframes btnspin{to{transform:rotate(360deg)}}

/* شريط تقدّم أعلى الصفحة عند التنقّل/التحديث */
#ddProgress{position:fixed;top:0;right:0;left:0;height:3px;z-index:400;pointer-events:none;background:transparent;opacity:0;transition:opacity .25s}
#ddProgress.on{opacity:1}
#ddProgress .bar{height:100%;width:0;background:linear-gradient(90deg,var(--gold-d),var(--gold-l));
  box-shadow:0 0 10px rgba(184,137,59,.65);transition:width .25s ease}

/* focus-visible للوصولية على عناصر التنقّل */
.nav a:focus-visible,.pill-tabs a:focus-visible,.bell:focus-visible,.picker-input:focus-visible,
.btn.sm.ghost:focus-visible,a.btn:focus-visible{outline:none;box-shadow:var(--ring)}

/* إخفاء أسهم إدخال الأرقام (شكل أنضف) */
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield}

/* منتقي المنتجات: رأس ثابت + تلميح كيبورد أسفل */
.picker-head{position:sticky;top:-6px;background:var(--card);border-bottom:1px solid var(--line2);margin:-6px -6px 4px;padding:9px 12px;border-radius:12px 12px 0 0;z-index:1}
.picker-foot{position:sticky;bottom:-6px;background:var(--bg2);border-top:1px solid var(--line2);margin:4px -6px -6px;padding:7px 12px;border-radius:0 0 12px 12px;font-size:11px;color:var(--muted2);display:flex;gap:12px;flex-wrap:wrap}
.picker-foot kbd{background:var(--card);border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:0 5px;font-size:10.5px;font-family:inherit;color:var(--muted)}
.picker-item.hi{outline:2px solid var(--gold-l);outline-offset:-2px}

/* أزرار الحفظ لاصقة أسفل الشاشة في الموبايل (نقطة البيع/الفواتير) */
@media(max-width:860px){
  .sticky-actions{position:sticky;bottom:0;background:linear-gradient(180deg,rgba(255,255,255,0),var(--card) 26%);
    padding:14px 0 10px;margin:6px -2px 0;z-index:15}
  .sticky-actions .btn{width:100%;padding:15px;font-size:16px}
}

/* حالة فارغة أوضح */
.empty{background:repeating-linear-gradient(-45deg,transparent,transparent 10px,rgba(184,137,59,.02) 10px,rgba(184,137,59,.02) 20px);border-radius:10px}

/* تحسين ظل الكارت عند المرور */
.card{transition:box-shadow .18s}
.card:hover{box-shadow:0 2px 4px rgba(28,27,25,.05),0 8px 24px rgba(28,27,25,.07)}

/* ============================================================
   v5 — دارك مود + LTR + تحسينات UX
   ============================================================ */

/* ---------- 🌙 الوضع الداكن ---------- */
html[data-theme="dark"]{
  --bg:#131210; --bg2:#191713; --card:#1e1b17; --ink:#ece7db; --muted:#a99f8d; --muted2:#867d6c;
  --line:#2d2a24; --line2:#26231e;
  --gold:#c99a4b; --gold-d:#d9ae63; --gold-l:#e2bd78; --gold-soft:#2b251c;
  --ok:#5cc492; --ok-bg:#15271e;
  --err:#e26a5c; --err-bg:#2c1815;
  --warn:#d9a93f; --warn-bg:#2a2212;
  --info:#6aa5d8; --info-bg:#16222c;
  --shadow:0 1px 2px rgba(0,0,0,.35),0 4px 16px rgba(0,0,0,.35);
  --shadow-lg:0 12px 38px rgba(0,0,0,.55);
  --ring:0 0 0 3px rgba(201,154,75,.28);
}
html[data-theme="dark"] ::-webkit-scrollbar-thumb{background:#3a352c;border-color:var(--bg)}
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover{background:#4a4438}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{
  background:var(--bg2);color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:var(--muted2)}
html[data-theme="dark"] .alert-error{border-color:#4a2622}
html[data-theme="dark"] .alert-info{border-color:#23394a}
html[data-theme="dark"] .alert-warn{border-color:#4a3d1a}
html[data-theme="dark"] .badge{filter:brightness(1.05)}
html[data-theme="dark"] .receipt, html[data-theme="dark"] .login-card{background:var(--card)}
html[data-theme="dark"] img{filter:brightness(.96)}
/* انتقال ناعم بين الثيمين */
body,.card,.stat,.topbar,.sidebar,table.tbl,input,select,textarea,.toast,.picker-panel,.alert{
  transition:background-color .25s ease,color .2s ease,border-color .25s ease}

/* ---------- 🔤 دعم الإنجليزي (LTR) ---------- */
[dir="ltr"] body{direction:ltr}
[dir="ltr"] .nav a.active:before{right:auto;left:-10px;border-radius:4px 0 0 4px}
[dir="ltr"] .stat:before{right:auto;left:0}
[dir="ltr"] .stat:after{left:auto;right:-30px}
[dir="ltr"] table.tbl th,[dir="ltr"] table.tbl td{text-align:left}
[dir="ltr"] .toast{border-right:1px solid var(--line);border-left:4px solid var(--muted2)}
[dir="ltr"] .toast.t-success{border-left-color:var(--ok)}
[dir="ltr"] .toast.t-error{border-left-color:var(--err)}
[dir="ltr"] .toast.t-info{border-left-color:var(--info)}
[dir="ltr"] .toast.t-warn{border-left-color:var(--warn)}
[dir="ltr"] .pi-out{margin-right:0;margin-left:4px}
[dir="ltr"] .bell-badge{left:auto;right:-5px}
[dir="ltr"] .period-bar .lbl{margin-left:0;margin-right:4px}
@media (max-width:920px){
  [dir="ltr"] .sidebar{right:auto;left:0;transform:translateX(-100%);box-shadow:6px 0 30px rgba(0,0,0,.32)}
  [dir="ltr"] .sidebar.open{transform:translateX(0)}
}

/* ---------- ✨ تحسينات UX ---------- */
/* أزرار التوب بار (لغة/ثيم) */
.tb-icon{display:inline-grid;place-items:center;min-width:38px;height:38px;padding:0 10px;border-radius:11px;
  border:1px solid var(--line);background:var(--card);color:var(--ink);font-weight:800;font-size:14px;
  cursor:pointer;text-decoration:none;transition:transform .12s,box-shadow .15s,background .2s}
.tb-icon:hover{transform:translateY(-1px);box-shadow:var(--shadow);text-decoration:none}
.tb-icon:active{transform:translateY(0)}

/* فوكس واضح للكيبورد */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.btn:focus-visible{
  outline:none;box-shadow:var(--ring)}

/* أزرار: رفعة خفيفة */
.btn{transition:transform .12s ease,box-shadow .15s ease,filter .15s ease}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.btn:active{transform:translateY(0) scale(.99)}

/* جداول: صف hover + رأس ثابت جوه السكرول */
table.tbl tbody tr{transition:background .12s}
table.tbl tbody tr:hover{background:var(--gold-soft)}
.table-wrap{max-height:70vh;overflow:auto}
.table-wrap table.tbl thead th{position:sticky;top:0;background:var(--card);z-index:2;box-shadow:0 1px 0 var(--line)}

/* كروت الإحصائيات: لمسة hover */
.stat{transition:transform .15s ease,box-shadow .2s ease}
.stat:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}

/* حقول أنضف */
input,select,textarea{transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{border-color:var(--gold);box-shadow:var(--ring)}

/* حركة أهدأ لمن يفضّلها */
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}

/* شارة الميزة التجريبية في القائمة */
.beta-badge{font-size:11px;margin-inline-start:auto;opacity:.9}
.nav a{position:relative}
/* لافتة تجريبي أعلى الصفحة */
.beta-ribbon{display:flex;align-items:center;gap:10px;background:linear-gradient(90deg,var(--warn-bg),transparent);border:1px solid var(--warn);border-inline-start:4px solid var(--warn);border-radius:10px;padding:10px 14px;margin-bottom:14px;font-size:14px}
.beta-ribbon b{color:var(--warn)}
/* كروت الباقات */
.tier-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.tier-card{border:2px solid var(--line);border-radius:16px;padding:18px;background:var(--card);display:flex;flex-direction:column;gap:10px;transition:.15s}
.tier-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.tier-card.cur{border-color:var(--ok);box-shadow:var(--ring)}
.tier-card .price{font-size:26px;font-weight:800;color:var(--gold)}
.tier-card .price small{font-size:13px;color:var(--muted);font-weight:500}
.tier-card ul{margin:0;padding:0;list-style:none;font-size:13px;display:flex;flex-direction:column;gap:6px}
.tier-card ul li{display:flex;gap:6px;align-items:flex-start}
.feat-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px;background:var(--card);flex-wrap:wrap}
.feat-row.off{opacity:.6}
.feat-row.locked{background:var(--bg2)}
.switch{position:relative;display:inline-block;width:48px;height:26px;flex:0 0 auto}
.switch input{opacity:0;width:0;height:0}
.slider{position:absolute;cursor:pointer;inset:0;background:var(--line);border-radius:999px;transition:.2s}
.slider:before{content:"";position:absolute;height:20px;width:20px;inset-inline-start:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.switch input:checked + .slider{background:var(--ok)}
.switch input:checked + .slider:before{transform:translateX(22px)}
[dir="rtl"] .switch input:checked + .slider:before{transform:translateX(-22px)}

/* ============================================================
   📱 تحسينات نسخة الموبايل (v6)
   ============================================================ */
@media(max-width:640px){
  /* كروت الأرقام عمودين بدل واحد — استغلال أفضل للشاشة */
  .g2,.g3,.g4{grid-template-columns:repeat(2,1fr);gap:10px}
  .stat{padding:13px}
  .stat .val{font-size:20px}
  .stat .lbl{font-size:11.5px}
  .stat .sub{font-size:10.5px}

  /* الكروت أخف على الموبايل */
  .card{padding:14px;margin-bottom:12px;border-radius:14px}
  .card .hd{margin:-2px 0 12px;padding-bottom:10px;flex-wrap:wrap}
  .card .hd h2,.card .hd h3{font-size:16px}

  /* الصفوف تتكدّس عمودي */
  .row{flex-direction:column;gap:10px}
  .row .fld{width:100%}
  .fld input,.fld select,.fld textarea{font-size:16px} /* يمنع تكبير iOS التلقائي */

  /* الجداول: خط وحواف أصغر + تمرير أفقي */
  .tbl{font-size:13px}
  .tbl th,.tbl td{padding:8px 7px}
  .tbl th{font-size:11.5px}
  .table-wrap{border-radius:10px}

  /* الأزرار: صف الأزرار يمتد كامل العرض */
  .btn-row{flex-wrap:wrap}
  .btn-row .btn{flex:1 1 auto}
  .btn.block,.btn-row .btn{min-height:44px}

  /* العنوان العلوي أنضف */
  .topbar{padding:9px 12px}
  .content{padding:13px}

  /* الأوتوكومبليت يملأ العرض */
  .ac-box{max-height:240px}
  .ac-item{padding:12px}

  /* الستيبر (+/−) أكبر للمس */
  .st-btn{width:34px;height:38px;font-size:20px}
  .stepper input{height:38px}

  /* كاميرا الحضور تملأ الشاشة */
  #camWrap{max-width:100%}
  #cam{aspect-ratio:3/4}
}

/* شاشات صغيرة جداً */
@media(max-width:380px){
  .g2,.g3,.g4,.g5{grid-template-columns:1fr}
  .stat .val{font-size:22px}
}

/* ============================================================
   🏠 الهوم بيدج v7 — وصول سريع + عناوين أقسام (كمبيوتر + موبايل)
   ============================================================ */
.quick-bar{display:grid;grid-template-columns:repeat(8,1fr);gap:10px;margin-bottom:18px}
.quick-bar .qa{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--card);border:1px solid var(--line);
  border-radius:14px;padding:13px 6px;text-decoration:none;color:var(--ink);font-weight:700;font-size:12.5px;text-align:center;
  box-shadow:var(--shadow);transition:transform .13s,box-shadow .13s,border-color .13s;position:relative}
.quick-bar .qa span{font-size:22px;line-height:1}
.quick-bar .qa:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:var(--shadow-lg)}
.quick-bar .qbadge{position:absolute;top:6px;inset-inline-end:8px;background:var(--err);color:#fff;border-radius:20px;
  font-size:10.5px;padding:1px 7px;font-weight:800}
.sec-title{font-size:15px;font-weight:800;color:var(--muted);margin:6px 2px 10px;display:flex;align-items:center;gap:8px}
.sec-title:after{content:"";flex:1;height:1px;background:var(--line)}
@media(max-width:980px){.quick-bar{grid-template-columns:repeat(4,1fr)}}
@media(max-width:640px){
  .quick-bar{grid-template-columns:repeat(4,1fr);gap:8px}
  .quick-bar .qa{padding:10px 4px;font-size:11px;border-radius:12px}
  .quick-bar .qa span{font-size:19px}
  .sec-title{font-size:13.5px}
}

/* أفاتار المستخدمين */
.avatar{border-radius:50%;object-fit:cover;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;border:2px solid var(--line)}
.avatar-letter{background:linear-gradient(135deg,var(--gold),#8a6428);color:#fff;font-weight:800}

/* ============================================================
   💬 الشات (نظام جهات عمل + أونلاين)
   ============================================================ */
.chat-wrap{display:grid;grid-template-columns:320px 1fr;gap:14px;align-items:start}
.chat-contacts{padding:14px;max-height:78vh;display:flex;flex-direction:column}
.contact-list{overflow-y:auto;flex:1;margin:0 -6px;padding:0 6px}
.contact{display:flex;align-items:center;gap:10px;padding:10px 8px;border-radius:12px;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line2);position:relative}
.contact:hover{background:var(--gold-soft,#faf5ec)}
.contact.active{background:var(--gold-soft,#faf5ec);border-inline-start:3px solid var(--gold)}
.c-av{position:relative;flex-shrink:0}
.c-av .dot{position:absolute;bottom:1px;inset-inline-end:1px;width:11px;height:11px;border-radius:50%;background:#aaa;border:2px solid var(--card)}
.c-av .dot.on{background:#31a24c}
.c-info{display:flex;flex-direction:column;line-height:1.35;min-width:0;flex:1}
.c-info b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-info small{font-size:11px}
.c-seen{color:var(--muted)}
.c-seen.on{color:#31a24c;font-weight:700}
.c-unread{background:var(--err);color:#fff;border-radius:20px;font-size:11px;font-weight:800;padding:2px 8px}
.chat-thread{padding:0;display:flex;flex-direction:column;max-height:78vh;min-height:420px;overflow:hidden}
.chat-head{padding:12px 16px;margin:0;border-bottom:1px solid var(--line)}
.msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:8px;background:var(--bg2)}
.m{max-width:72%;align-self:flex-start}
.m.mine{align-self:flex-end}
.m-body{background:var(--card);border:1px solid var(--line);padding:9px 13px;border-radius:16px 16px 16px 4px;font-size:14.5px;word-break:break-word}
.m.mine .m-body{background:linear-gradient(135deg,var(--gold),#8a6428);color:#fff;border:none;border-radius:16px 16px 4px 16px}
.m-time{font-size:10.5px;color:var(--muted);margin-top:2px;padding:0 4px}
.m.mine .m-time{text-align:left}
.m-date{text-align:center;margin:8px 0}
.m-date span{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:3px 14px;font-size:11.5px;color:var(--muted)}
.chat-compose{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line);background:var(--card)}
.chat-compose input{flex:1;padding:11px 14px;border:1px solid var(--line);border-radius:22px;font-size:15px}
.chat-back{display:none}
@media(max-width:860px){
  .chat-wrap{grid-template-columns:1fr}
  .chat-back{display:inline-flex}
  /* على الموبايل: لو فيه محادثة مفتوحة نخفي القائمة */
  body.chat-open #contactsPane{display:none}
  .chat-thread{max-height:none;min-height:70vh}
}

/* 📨 بوب أب رسالة (فيسبوك ستايل) */
.msg-pop{position:fixed;bottom:18px;inset-inline-start:18px;z-index:9999;background:var(--card);border:1px solid var(--line);
  border-radius:14px;box-shadow:0 12px 34px rgba(0,0,0,.24);padding:12px 14px;display:flex;gap:10px;align-items:flex-start;
  max-width:330px;cursor:pointer;animation:popUp .28s ease;text-decoration:none;color:var(--ink)}
.msg-pop .mp-icon{font-size:26px}
.msg-pop .mp-name{font-weight:800;font-size:14px}
.msg-pop .mp-body{font-size:13px;color:var(--muted);margin-top:2px;max-height:38px;overflow:hidden}
.msg-pop .mp-time{font-size:11px;color:var(--muted2,#999);margin-top:3px}
.msg-pop .mp-x{margin-inline-start:auto;background:none;border:none;font-size:16px;cursor:pointer;color:var(--muted)}
@keyframes popUp{from{transform:translateY(24px);opacity:0}to{transform:translateY(0);opacity:1}}

/* علامة التوثيق الزرقاء + التاج */
.verified-badge{display:inline-flex;vertical-align:middle;margin-inline-start:3px}
.verified-badge svg{display:block}
.perm-grid label:hover{border-color:var(--gold)}

/* ===== تبويبات + مرفقات + فويس ===== */
.chat-tabs{display:flex;gap:4px;margin-bottom:6px}
.ct-tab{flex:1;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:8px;font-weight:700;font-size:13px;cursor:pointer;color:var(--muted)}
.ct-tab.active{background:var(--gold-soft,#faf5ec);color:var(--gold-d,#8a6428);border-color:var(--gold)}
.m-sender{font-size:11.5px;font-weight:800;color:var(--gold-d,#8a6428);margin-bottom:2px}
.m-attach{margin-bottom:3px}
.m-img{max-width:200px;max-height:220px;border-radius:12px;display:block}
.m-audio{height:40px;max-width:230px}
.m-file{display:inline-block;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:8px 12px;text-decoration:none;color:var(--ink);font-size:13px;font-weight:600}
.m.mine .m-file{background:rgba(255,255,255,.2);color:#fff;border:none}
.cc-btn{background:none;border:none;font-size:20px;cursor:pointer;padding:4px 6px;border-radius:8px}
.cc-btn:hover{background:var(--bg2)}
.attach-preview{align-items:center;gap:10px;padding:8px 12px;border-top:1px solid var(--line);background:var(--card)}
.voice-ui{align-items:center;gap:10px;padding:10px 14px;border-top:1px solid var(--line);background:var(--card);font-weight:700}
.rec-dot{width:12px;height:12px;border-radius:50%;background:var(--err);animation:pulse 1s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* ===== 💬 دوك الشات الجانبي (كل الصفحات — زي فيسبوك) ===== */
#chatDock{position:fixed;inset-inline-end:0;top:64px;bottom:0;width:270px;background:var(--card);border-inline-start:1px solid var(--line);
  box-shadow:-4px 0 18px rgba(0,0,0,.06);z-index:35;transform:translateX(0);transition:transform .24s ease;display:flex;flex-direction:column}
[dir="rtl"] #chatDock{transform:translateX(0)}
#chatDock.collapsed{transform:translateX(100%)}
[dir="rtl"] #chatDock.collapsed{transform:translateX(-100%)}
#chatDock .dock-hd{padding:12px 14px;border-bottom:1px solid var(--line);font-weight:800;display:flex;justify-content:space-between;align-items:center}
#chatDock .dock-list{overflow-y:auto;flex:1}
.dock-c{display:flex;align-items:center;gap:9px;padding:9px 12px;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line2)}
.dock-c:hover{background:var(--gold-soft,#faf5ec)}
.dock-c .c-av{position:relative}
.dock-c b{font-size:13px;font-weight:700}
.dock-c small{font-size:10.5px;color:var(--muted)}
.dock-toggle{position:fixed;inset-inline-end:16px;bottom:18px;z-index:36;width:54px;height:54px;border-radius:50%;
  background:linear-gradient(135deg,var(--gold),#8a6428);color:#fff;border:none;font-size:24px;cursor:pointer;
  box-shadow:0 6px 20px rgba(0,0,0,.28);display:flex;align-items:center;justify-content:center}
.dock-toggle .dt-badge{position:absolute;top:-2px;inset-inline-end:-2px;background:var(--err);color:#fff;border-radius:20px;font-size:11px;font-weight:800;padding:1px 6px;border:2px solid var(--card)}
/* نفسح مكان للدوك على الشاشات الكبيرة */
@media(min-width:1200px){ body.dock-on .content{margin-inline-end:270px} }
/* على الموبايل الدوك بيغطي */
@media(max-width:1199px){ #chatDock{top:0;width:280px;z-index:60} }

/* ============================================================
   📱 المنيو السفلية الثابتة + الشيت (موبايل فقط)
   ============================================================ */
.bottom-nav{display:none}
.sheet-scrim,.action-sheet{display:none}

@media(max-width:860px){
  /* المنيو السفلية — أيقونات خطّية نظيفة (flat) */
  .bottom-nav{
    display:flex;position:fixed;bottom:0;left:0;right:0;z-index:50;
    background:var(--card);border-top:1px solid var(--line);
    padding:8px 6px calc(8px + env(safe-area-inset-bottom,0px));
    box-shadow:0 -3px 16px rgba(0,0,0,.07);align-items:stretch;justify-content:space-around}
  .bn-item{position:relative;flex:1;background:none;border:none;cursor:pointer;
    display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px 0;
    text-decoration:none;color:var(--muted);font-family:inherit;transition:color .15s}
  .bn-item:active{transform:scale(.96)}
  .bn-svg{width:25px;height:25px;display:block}
  .bn-lb{font-size:11.5px;font-weight:600;letter-spacing:-.1px}
  .bn-item.active{color:var(--gold-d,#8a6528)}
  .bn-item.active .bn-svg{stroke-width:2.1}
  .bn-badge{position:absolute;top:-2px;inset-inline-end:24%;background:var(--err);color:#fff;
    border-radius:20px;font-size:10px;font-weight:800;padding:1px 5px;min-width:16px;text-align:center;line-height:1.5}

  /* الشيت */
  /* الشيت — يظهر بس لما مش hidden (كان بيبلع اللمسات قبل كده) */
  .sheet-scrim:not([hidden]){display:block;position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.42);
    opacity:0;transition:opacity .24s}
  .sheet-scrim.show{opacity:1}
  .action-sheet:not([hidden]){display:block;position:fixed;left:0;right:0;bottom:0;z-index:61;
    background:var(--card);border-radius:22px 22px 0 0;padding:8px 14px calc(16px + env(safe-area-inset-bottom,0px));
    transform:translateY(100%);transition:transform .26s cubic-bezier(.2,.8,.2,1);box-shadow:0 -8px 30px rgba(0,0,0,.25)}
  .action-sheet.show{transform:translateY(0)}
  .as-grab{width:40px;height:4px;border-radius:99px;background:var(--line);margin:6px auto 10px}
  .as-title{text-align:center;font-weight:800;font-size:14px;color:var(--muted);margin-bottom:8px}
  .as-item{display:flex;align-items:center;gap:14px;padding:15px 12px;text-decoration:none;
    color:var(--ink);font-weight:700;font-size:15.5px;border-radius:14px}
  .as-item:active{background:var(--bg2)}
  .as-item+.as-item{border-top:1px solid var(--line2)}
  .as-ic{font-size:24px;width:30px;text-align:center}
  .as-arrow{margin-inline-start:auto;color:var(--muted);font-size:22px}
  .as-cancel{width:100%;margin-top:10px;padding:15px;border:none;border-radius:14px;
    background:var(--bg2);color:var(--ink);font-weight:800;font-size:15.5px;cursor:pointer;font-family:inherit}

  /* نفسح مكان تحت للمنيو + نخفي زرار الشات العائم (الدوك) عشان ميتعارضش */
  .content{padding-bottom:78px !important}
  .dock-toggle{bottom:80px !important}
  /* نخفي همبرجر التوب بار (بقى في المنيو السفلية) */
  .menu-btn{display:none}
}

/* ============================================================
   📱 تحسين شكل الشات على الموبايل (زي الصورة — iOS نضيف)
   ============================================================ */
@media(max-width:860px){
  /* قائمة المحادثات ملء الشاشة بشكل نظيف */
  .chat-wrap{gap:0}
  .chat-contacts{border:none;box-shadow:none;padding:10px 4px 4px;border-radius:0;max-height:none}
  .chat-tabs{position:sticky;top:0;background:var(--card);z-index:2;padding-bottom:6px}
  .contact{padding:12px 12px;border-bottom:1px solid var(--line2);border-radius:0}
  .contact.active{border-inline-start:none;background:var(--gold-soft,#faf5ec)}
  .c-info b{font-size:15px}
  .c-info small{font-size:12px}
  .c-av .dot{width:13px;height:13px}
  /* المحادثة تملأ الشاشة فوق المنيو السفلية */
  body.chat-open .chat-thread{position:fixed;inset:0;bottom:0;z-index:45;border-radius:0;max-height:none;min-height:100vh}
  body.chat-open .bottom-nav{display:none}     /* نخفي المنيو وقت المحادثة المفتوحة */
  body.chat-open .dock-toggle{display:none}
  body.chat-open .content{padding-bottom:0 !important}
  .chat-head{position:sticky;top:0;background:var(--card);z-index:3;padding:12px 14px;padding-top:calc(12px + env(safe-area-inset-top,0px))}
  .chat-compose{position:sticky;bottom:0;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}
  .m{max-width:82%}
  .m-body{font-size:15px}
  /* شريط بحث علوي شكل الصورة */
  .chat-contacts .hd h3{font-size:20px;font-weight:800}
}

/* ============================================================
   🖥️ تحسينات نسخة الكمبيوتر (Desktop ≥861px)
   ============================================================ */
@media(min-width:861px){
  /* الشات يملأ ارتفاع الشاشة زي تطبيقات الماسنجر — مفيش فراغات */
  .chat-wrap{height:calc(100vh - 128px);align-items:stretch}
  .chat-contacts{max-height:none;height:100%}
  .chat-thread{max-height:none;height:100%;min-height:0}
  .msgs{min-height:0}

  /* صفحة الشات تاخد عرض أوسع (مش محبوسة في 1180) */
  body.page-messages .content{max-width:1320px}
}

/* سويتش النظام (جملة/قطاعي) في التوب بار */
.sys-switch{display:inline-flex;background:var(--bg2);border:1px solid var(--line);border-radius:999px;padding:2px;gap:2px}
.sys-switch a{padding:5px 12px;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--muted);text-decoration:none;transition:all .15s;white-space:nowrap}
.sys-switch a.on{background:linear-gradient(135deg,var(--gold),#8a6528);color:#fff;box-shadow:0 2px 6px rgba(138,101,40,.3)}
.sys-badge{display:inline-flex;align-items:center;gap:4px;background:var(--gold-soft,#faf5ec);color:var(--gold-d,#8a6528);border:1px solid var(--gold);padding:5px 12px;border-radius:999px;font-size:12.5px;font-weight:700;white-space:nowrap}
.sys-badge.retail{background:#eaf3ff;color:#2563a5;border-color:#9cc2ea}
@media(max-width:860px){
  .sys-switch a{padding:5px 9px;font-size:11.5px}
  .sys-switch a:not(.on) span,.sys-badge{font-size:11px}
}

/* 🔔 قائمة الإشعارات المنسدلة */
.notif-wrap{position:relative;display:inline-flex}
.notif-dd{position:absolute;top:calc(100% + 8px);inset-inline-end:0;width:320px;max-width:90vw;background:var(--card);
  border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 34px rgba(0,0,0,.2);z-index:80;overflow:hidden}
.nd-hd{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line);font-size:14px}
.nd-list{max-height:60vh;overflow-y:auto}
.nd-item{display:block;padding:11px 14px;border-bottom:1px solid var(--line2);text-decoration:none;color:var(--ink);transition:background .12s}
.nd-item:hover{background:var(--bg2);text-decoration:none}
.nd-title{font-weight:700;font-size:13.5px}
.nd-body{font-size:12.5px;color:var(--muted);margin-top:2px}
.nd-time{font-size:11px;color:var(--muted2,#999);margin-top:3px}
.tb-icon.ring{animation:bellRing .9s ease}
@keyframes bellRing{0%,100%{transform:rotate(0)}20%{transform:rotate(16deg)}40%{transform:rotate(-14deg)}60%{transform:rotate(9deg)}80%{transform:rotate(-5deg)}}
@media(max-width:860px){ .notif-dd{position:fixed;top:56px;inset-inline:8px;width:auto} }

/* ============================================================
   ✨ تحسينات واجهة عامة
   ============================================================ */
/* بادج الطوارئ (أحمر) موحّد مع أيقونات التوب بار */
.tb-icon.tb-alert{border-color:var(--err);color:var(--err);background:var(--err-bg);position:relative}
.tb-icon.tb-alert:hover{background:var(--err);color:#fff}
.tb-icon.tb-alert .bell-badge{background:var(--err);box-shadow:0 0 0 2px var(--card)}
/* الجرس والبلاغ: أيقونات موحّدة */
#ddNotifBtn,#ddIssueBtn{font-size:17px}
#ddIssueBtn:hover{background:var(--err-bg);border-color:var(--err)}
/* بادج الإشعارات على الجرس */
#ddNotifBtn .bell-badge{top:-4px;inset-inline-end:-4px;left:auto}

/* كروت أنعم مع حركة رفع خفيفة عند المرور */
.card{transition:box-shadow .2s ease, transform .2s ease}
.card:hover{box-shadow:var(--shadow-lg)}
/* أزرار الاختصار السريع في اللوحة أوضح */
.qa{transition:transform .14s ease, box-shadow .2s ease, border-color .2s}
.qa:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--gold-l)}
/* الجداول: صف مميّز عند المرور */
.tbl tbody tr{transition:background .12s}
.tbl tbody tr:hover{background:var(--gold-soft)}
/* حقول الإدخال: تركيز أوضح بلون العلامة */
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);box-shadow:var(--ring)}

/* شاشات صغيرة جداً: نخفي عنوان الصفحة (البوتوم ناف بيوضّح الصفحة) */
@media(max-width:430px){
  .topbar .pg{display:none}
  .topbar .tb-right{gap:4px}
  .tb-icon{min-width:31px;padding:0 4px}
}

/* 🏦 هيرو الخزنة (إجمالي كل الفلوس) */
.treasury-hero .th-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.treasury-hero .th-big{font-size:38px;font-weight:800;color:var(--gold-d);font-variant-numeric:tabular-nums;letter-spacing:-1px;line-height:1.1}
.treasury-hero .th-chips{display:flex;gap:10px;flex-wrap:wrap}
.treasury-hero .th-chip{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 16px;text-align:center;min-width:96px}
@media(max-width:860px){
  .treasury-hero .th-row{gap:12px}
  .treasury-hero .th-big{font-size:30px}
  .treasury-hero .th-chips{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
  .treasury-hero .th-chip{min-width:0;padding:8px 10px}
}

/* الشات دوك فيتشر ديسكتوب — نخفيه تماماً على الموبايل (الشات من المنيو السفلية) */
@media(max-width:860px){
  #chatDock, .dock-toggle{display:none !important}
}

/* كروت قابلة للدوس */
.clickable-card{transition:transform .14s ease, box-shadow .2s ease, border-color .2s}
.clickable-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--gold-l)}
.clickable-card:active{transform:translateY(0)}

/* ═══════════ شاشة تحميل باللوجو عند التنقل ═══════════ */
#ddLoadLogo{position:fixed;inset:0;z-index:9998;display:none;align-items:center;justify-content:center;
  background:rgba(255,255,255,.82);backdrop-filter:blur(3px);opacity:0;transition:opacity .18s ease}
#ddLoadLogo.on{display:flex;opacity:1}
#ddLoadLogo .dl-box{position:relative;width:104px;height:104px;display:flex;align-items:center;justify-content:center}
#ddLoadLogo img{width:66px;height:66px;object-fit:contain;border-radius:14px;animation:ddLogoPulse 1.1s ease-in-out infinite;z-index:2}
#ddLoadLogo .dl-ring{position:absolute;inset:0;border-radius:50%;border:3px solid var(--gold-soft);border-top-color:var(--gold);animation:ddSpin .85s linear infinite}
@keyframes ddLogoPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.86);opacity:.65}}
@keyframes ddSpin{to{transform:rotate(360deg)}}
html[data-theme="dark"] #ddLoadLogo{background:rgba(20,18,15,.85)}

/* ═══════════ إشعارات دائمة (متختفيش غير لما تقفلها) ═══════════ */
#ddNotifStack{position:fixed;top:64px;left:50%;transform:translateX(-50%);z-index:9990;
  width:min(94vw,380px);display:flex;flex-direction:column;gap:9px;pointer-events:none}
.dn-card{pointer-events:auto;background:var(--card);border:1px solid var(--line);border-inline-start:4px solid var(--gold);
  border-radius:13px;box-shadow:var(--shadow-lg);padding:11px 12px 11px 13px;display:flex;gap:10px;align-items:flex-start;
  animation:dnIn .28s cubic-bezier(.2,.9,.3,1.2);position:relative;text-decoration:none;color:inherit}
.dn-card.closing{animation:dnOut .22s ease forwards}
.dn-ic{font-size:20px;line-height:1.2;flex:0 0 auto}
.dn-main{flex:1;min-width:0}
.dn-t{font-weight:800;font-size:14px;color:var(--ink);margin-bottom:2px}
.dn-b{font-size:12.5px;color:var(--muted);line-height:1.5;word-break:break-word}
.dn-time{font-size:11px;color:var(--muted);margin-top:3px;opacity:.8}
.dn-x{flex:0 0 auto;width:26px;height:26px;border:none;background:var(--line2);color:var(--ink);border-radius:8px;
  cursor:pointer;font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .15s}
.dn-x:hover{background:var(--err-bg);color:var(--err)}
.dn-allx{pointer-events:auto;align-self:center;background:rgba(0,0,0,.55);color:#fff;border:none;border-radius:20px;
  padding:5px 14px;font-size:12px;font-weight:700;cursor:pointer;box-shadow:var(--shadow)}
@keyframes dnIn{from{opacity:0;transform:translateY(-14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes dnOut{to{opacity:0;transform:translateX(30px) scale(.94)}}
html[data-theme="dark"] .dn-card{background:#221f1a;border-color:#3a352c}
@media(max-width:560px){ #ddNotifStack{top:58px;width:94vw} }

/* زرار قفل لكل إشعار في قائمة الجرس */
.nd-item{position:relative}
.nd-x{position:absolute;top:8px;left:8px;width:22px;height:22px;border:none;background:transparent;color:var(--muted);
  cursor:pointer;font-size:15px;border-radius:6px;display:flex;align-items:center;justify-content:center}
.nd-x:hover{background:var(--err-bg);color:var(--err)}

/* زرار تفعيل إشعارات الموبايل في قائمة الجرس */
.nd-push{display:block;width:100%;border:none;background:linear-gradient(135deg,var(--gold-soft),#fff);
  color:var(--gold-d);font-weight:700;font-size:12.5px;padding:10px 12px;cursor:pointer;text-align:right;
  border-bottom:1px solid var(--line);line-height:1.5}
.nd-push:hover{background:var(--gold-soft)}
html[data-theme="dark"] .nd-push{background:#2a2620;color:#e6c98f}

/* ═══════════ علامات الصح في الشات (وصل/استلم/شاف) ═══════════ */
.m-time{display:inline-flex;align-items:center;gap:3px}
.m.mine .m-time{flex-direction:row;justify-content:flex-end}
.m-tick{display:inline-flex;align-items:center;line-height:1;vertical-align:middle}
.m-tick svg{display:block}
.m.mine .m-body{position:relative}

/* ═══════════ تنظيم أوضح لواجهة الشات على الموبايل ═══════════ */
@media(max-width:860px){
  body.chat-open .msgs{padding:12px 10px;gap:6px;-webkit-overflow-scrolling:touch}
  .m{max-width:85%}
  .m-body{padding:8px 12px;font-size:15px;line-height:1.5;border-radius:14px 14px 14px 4px}
  .m.mine .m-body{border-radius:14px 14px 4px 14px}
  .m-time{font-size:11px}
  .chat-head{box-shadow:0 1px 6px rgba(0,0,0,.05)}
  .chat-head .c-av img,.chat-head .c-av{width:38px;height:38px}
  .chat-compose{gap:6px;padding:9px 8px;padding-bottom:calc(9px + env(safe-area-inset-bottom,0px));box-shadow:0 -1px 6px rgba(0,0,0,.05)}
  .chat-compose input{padding:10px 14px;font-size:16px}   /* 16px يمنع الزوم في iOS */
  .chat-compose .btn{padding:10px 14px;border-radius:50%;min-width:44px}
  .m-date span{font-size:11px;padding:2px 12px}
  /* القائمة الجانبية (المحادثات) أنضف على الموبايل */
  .chat-contacts .contact{padding:11px 12px}
  .chat-contacts .c-last{font-size:12.5px;color:var(--muted)}
}

/* ═══════════ مودال طلب تفعيل الإشعارات (أول تسجيل دخول) ═══════════ */
.ddpp-ov{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.5);backdrop-filter:blur(3px);animation:ddppFade .2s ease;padding:20px}
.ddpp-card{background:var(--card);border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,.3);max-width:360px;width:100%;
  padding:26px 22px;text-align:center;animation:ddppUp .28s cubic-bezier(.2,.9,.3,1.2)}
.ddpp-bell{font-size:48px;margin-bottom:6px;animation:ddppRing 1.2s ease-in-out infinite}
.ddpp-card h3{margin:6px 0 8px;font-size:19px}
.ddpp-card p{color:var(--muted);font-size:14px;line-height:1.7;margin:0 0 18px}
.ddpp-btns{display:flex;gap:10px;align-items:center}
@keyframes ddppFade{from{opacity:0}to{opacity:1}}
@keyframes ddppUp{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}
@keyframes ddppRing{0%,100%{transform:rotate(0)}20%{transform:rotate(14deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(6deg)}}

/* بادج وحدة المنتج في منتقي POS (تستر/ماستر/بوكس/طقم/ترافيل) */
.pi-unit{display:inline-block;background:var(--gold-soft);color:var(--gold-d);font-size:10.5px;font-weight:800;
  padding:1px 8px;border-radius:10px;margin-inline-start:5px;vertical-align:middle}
html[data-theme="dark"] .pi-unit{background:#3a3226;color:#e6c98f}

/* ===== مودال سكان الباركود ===== */
#ddScanModal{position:fixed;inset:0;z-index:9999;display:none}
#ddScanModal.open{display:block}
#ddScanModal .dds-back{position:absolute;inset:0;background:rgba(0,0,0,.65)}
#ddScanModal .dds-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(480px,94vw);
  background:var(--card,#fff);border-radius:16px;overflow:hidden;box-shadow:0 18px 60px rgba(0,0,0,.35)}
#ddScanModal .dds-hd{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}
#ddScanModal .dds-x{border:none;background:none;font-size:20px;cursor:pointer;color:var(--muted);padding:4px 8px}
#ddScanBox{width:100%;min-height:280px;background:#000}
#ddScanBox video{width:100% !important;border-radius:0 !important}
#ddScanModal .dds-msg{padding:10px 14px;font-size:13.5px;color:var(--muted);text-align:center}
html[data-theme="dark"] #ddScanModal .dds-card{background:#232323}
.btn-scan{white-space:nowrap}

/* ألوان مميزة لكل وحدة منتج (تفريق سريع بين المكرر) */
.pi-unit{color:#fff !important;font-weight:800}
.pi-unit-tester      {background:#2e7d5b !important}  /* تيستر — أخضر */
.pi-unit-master      {background:#b23b3b !important}  /* ماستر — أحمر */
.pi-unit-box         {background:#3b6cb2 !important}  /* بوكس — أزرق */
.pi-unit-splash      {background:#c26a00 !important}  /* بادي سبلاش — برتقالي */
.pi-unit-master_niche{background:#6a3bb2 !important}  /* ماستر نيش — بنفسجي */
.pi-unit-hard_cover  {background:#5a5a5a !important}  /* هارد كفر — رمادي غامق */
.pi-unit-white_box   {background:#111 !important}     /* وايت بوكس — أسود */
.pi-unit-set         {background:#b2933b !important}  /* طقم — ذهبي */
.pi-unit-travel      {background:#0d8a8a !important}  /* ترافيل — تركواز */
/* بادج مستقل لصفوف الأونلاين */
.u-badge{display:inline-block;color:#fff;font-size:11px;font-weight:800;padding:2px 9px;border-radius:10px;margin-inline-start:6px;vertical-align:middle}

/* قايمة اقتراحات إضافة المخزون (بديل الـdatalist عشان تبان الوحدة) */
.sug-panel{position:absolute;top:100%;inset-inline:0;z-index:60;background:var(--card,#fff);border:1px solid var(--line);
  border-radius:12px;box-shadow:0 12px 34px rgba(0,0,0,.14);max-height:280px;overflow-y:auto;margin-top:4px}
.sug-item{padding:10px 12px;cursor:pointer;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--line);font-size:14px}
.sug-item:last-child{border-bottom:none}
.sug-item:hover{background:var(--gold-soft,#f6f0e4)}
html[data-theme="dark"] .sug-panel{background:#232323}
html[data-theme="dark"] .sug-item:hover{background:#3a3226}

/* ============================================================
   تحسينات الجاهزية للإنتاج
   ============================================================ */

/* ===== الطباعة: الفاتورة/البوليصة تطلع نضيفة من غير عناصر الشاشة ===== */
@media print{
  .bottom-nav,.action-sheet,.dock-c,.fab,#ddScanModal,.sug-panel,.picker-panel,
  .btn,.btn-scan,.no-print,form .btn,.pill-tabs,.alert-info,.hint{display:none!important}
  .card{border:none!important;box-shadow:none!important;padding:0!important;margin:0 0 10px!important;break-inside:avoid}
  .tbl{width:100%;border-collapse:collapse}
  .tbl th,.tbl td{border:1px solid #999!important;padding:6px 8px!important;font-size:12px}
  .tbl tr{break-inside:avoid}
  thead{display:table-header-group}     /* رأس الجدول يتكرر في كل صفحة */
  a[href]::after{content:none!important} /* من غير روابط مطبوعة */
  body{background:#fff;color:#000;font-size:12.5px}
  .stat{border:1px solid #ccc!important;break-inside:avoid}
}

/* ===== أحجام لمس مريحة على الموبايل (44px معيار اللمس) ===== */
@media (max-width:920px) and (pointer:coarse){
  .btn{min-height:44px}
  .btn.sm{min-height:38px;padding:8px 14px;font-size:13.5px}
  input[type="checkbox"],input[type="radio"]{min-width:20px;min-height:20px}
  .tbl td .btn.sm{min-height:36px}
  select,input,textarea{min-height:44px;font-size:16px}  /* 16px بيمنع تكبير الشاشة تلقائياً في iOS */
  .picker-item,.sug-item{min-height:46px}
  .nav a{min-height:44px;display:flex;align-items:center}
}

/* ===== وضوح التركيز لكل عنصر تفاعلي (تنقّل بالكيبورد) ===== */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid var(--gold);outline-offset:2px;border-radius:6px}

/* ===== الحالات الفاضية: دعوة للتصرّف مش مجرد نص ===== */
.empty{padding:26px 18px;text-align:center;color:var(--muted);font-size:14px;line-height:1.9}
.empty b{display:block;color:var(--ink);font-size:15px;margin-bottom:4px}

/* ===== منع نطّ الصفحة وقت التحميل ===== */
.btn[data-busy]{opacity:.6;pointer-events:none;position:relative}

/* أزرار إغلاق الإشعارات: مساحة لمس أكبر من غير ما يكبر شكلها */
@media (pointer:coarse){
  .dn-x{width:34px;height:34px;font-size:17px}
  .dn-allx{min-height:36px;padding-inline:16px}
}
/* توسيع منطقة اللمس بدون تغيير المقاس البصري (للماوس كمان) */
.dn-x{position:relative}
.dn-x::after{content:"";position:absolute;inset:-9px}

/* زرار إغلاق التنبيه (Toast): منطقة لمس مريحة */
.toast .tx{position:relative;min-width:32px;min-height:32px;display:inline-flex;align-items:center;justify-content:center}
.toast .tx::after{content:"";position:absolute;inset:-6px}

/* ============================================================
   إكمال الوضع الليلي — عناصر مكانتش متغطّية
   ============================================================ */
html[data-theme="dark"]{
  --sidebar:#171512; --sidebar2:#1f1c18;   /* الشريط الجانبي أغمق شوية من الكروت */
}
html[data-theme="dark"] .b-gray{background:#2b2823;color:var(--muted)}
html[data-theme="dark"] .rank.r1{background:#3a3020;color:#e6c98f}
html[data-theme="dark"] .rank.r2{background:#2b2823;color:var(--muted)}
html[data-theme="dark"] .rank.r3{background:#332a1e;color:#d9ae63}
html[data-theme="dark"] .sys-badge.retail{background:#16222c;color:#8ec0ec;border-color:#2c4a66}
html[data-theme="dark"] .sys-badge.wholesale{background:#2b251c;color:#e2bd78;border-color:#4a3d28}
/* الجداول: خطوط أوضح في الظلام */
html[data-theme="dark"] table.tbl th{background:var(--bg2);color:var(--muted);border-color:var(--line)}
html[data-theme="dark"] table.tbl td{border-color:var(--line)}
html[data-theme="dark"] table.tbl tbody tr:hover{background:#221f1a}
/* الكروت: حدّ أوضح عشان تتفصل عن الخلفية */
html[data-theme="dark"] .card,html[data-theme="dark"] .stat{border-color:var(--line)}
/* المنتقي والاقتراحات */
html[data-theme="dark"] .picker-panel{background:var(--card);border-color:var(--line)}
html[data-theme="dark"] .picker-item:hover,html[data-theme="dark"] .picker-item.hi{background:#2b251c}
html[data-theme="dark"] .picker-foot kbd{background:var(--bg2);border-color:var(--line);color:var(--muted)}
/* شريط التنقّل السفلي والأكشن شيت */
html[data-theme="dark"] .bottom-nav{background:var(--card);border-color:var(--line)}
html[data-theme="dark"] .action-sheet{background:var(--card)}
html[data-theme="dark"] .as-item{border-color:var(--line)}
html[data-theme="dark"] .as-item:hover{background:var(--bg2)}
/* التنبيهات */
html[data-theme="dark"] .toast{background:var(--card);border-color:var(--line);color:var(--ink)}
/* الشات */
html[data-theme="dark"] .m-body{background:var(--bg2);border-color:var(--line)}
html[data-theme="dark"] .dock-c{background:var(--card);border-color:var(--line)}
html[data-theme="dark"] .dock-hd{background:var(--bg2);border-color:var(--line)}
/* الخزنة */
html[data-theme="dark"] .treasury-hero .th-chip{background:var(--bg2);border-color:var(--line)}
/* الطباعة دايماً فاتحة حتى لو الشاشة ليلي */
@media print{
  html[data-theme="dark"]{--bg:#fff;--bg2:#fff;--card:#fff;--ink:#000;--muted:#444;--line:#999;--line2:#ccc}
  html[data-theme="dark"] *{background:#fff!important;color:#000!important}
  html[data-theme="dark"] img{filter:none!important}
}

/* شارة الإشعارات: خلفية أغمق في الوضع الليلي عشان الرقم الأبيض يتقرا */
html[data-theme="dark"] .bell-badge,
html[data-theme="dark"] .tb-icon.tb-alert .bell-badge,
html[data-theme="dark"] #ddNotifBtn .bell-badge,
html[data-theme="dark"] .bn-badge,
html[data-theme="dark"] .qbadge,
html[data-theme="dark"] .dt-badge,
html[data-theme="dark"] .c-unread{background:#9e2c21;color:#fff}

/* ===== عناوين أقسام القايمة الجانبية ===== */
.nav-group{
  color:var(--sidebar-mut);font-size:11px;font-weight:800;letter-spacing:.6px;
  padding:14px 13px 5px;margin-top:4px;text-transform:none;opacity:.75;
  border-top:1px solid rgba(255,255,255,.07);
}
.nav-group:first-child{border-top:none;margin-top:0}

/* ===== صفحة حالة السيستم ===== */
.status-hero{border-width:2px}
.status-hero.status-ok{border-color:var(--ok)}
.status-hero.status-warn{border-color:var(--warn)}
.status-hero.status-bad{border-color:var(--err)}
.status-hero .sh-main{display:flex;align-items:center;gap:14px}
.status-hero .sh-ic{font-size:38px;line-height:1}
.status-hero .sh-title{margin:0;font-size:19px;font-weight:800}
.status-hero .sh-sub{color:var(--muted);font-size:13.5px;margin-top:2px}
.status-hero .sh-counts{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.status-hero .sh-c{padding:6px 14px;border-radius:999px;font-size:13px;font-weight:700;border:1px solid var(--line)}
.status-hero .sh-c b{font-size:15px;margin-inline-end:3px}
.status-hero .sh-c.ok{background:var(--ok-bg);color:var(--ok);border-color:transparent}
.status-hero .sh-c.warn{background:var(--warn-bg);color:var(--warn);border-color:transparent}
.status-hero .sh-c.bad{background:var(--err-bg);color:var(--err);border-color:transparent}
.status-hero .sh-time{margin-top:12px;font-size:12.5px;color:var(--muted2)}
.sc-urgent{padding:11px 13px;border:1px solid var(--line);border-inline-start:4px solid var(--err);
  border-radius:10px;margin-bottom:8px;background:var(--err-bg)}
.sc-urgent:last-child{margin-bottom:0}
.sc-u-top{font-size:14.5px;margin-bottom:3px}
.sc-u-fix{font-size:13px;color:var(--ink);opacity:.85;line-height:1.75}
.mono{font-variant-numeric:tabular-nums;font-size:13.5px}
html[data-theme="dark"] .sc-urgent{background:#2c1815;border-color:var(--line);border-inline-start-color:var(--err)}

/* ===== أنماط الكروت الموحّدة (بدل الستايلات المبعثرة) ===== */
.card.accent   {border-color:var(--gold-l);border-width:1px}
.card.accent-2 {border:2px solid var(--gold)}
.card.success  {border:2px solid var(--ok)}
.card.warn     {border:2px solid var(--warn)}
.card.danger   {border:2px solid var(--err);background:var(--err-bg)}
.card.soft     {background:var(--gold-soft);border-color:var(--gold-l)}
.card.compact  {padding:14px 18px}
.card.compact .hd{margin:-2px 0 12px;padding-bottom:10px}
.card.tight    {padding:12px 16px}
/* نفس المسافات بين كل الكروت مهما كان النمط */
.card + .card{margin-top:0}

/* ===== أزرار زيادة/نقصان الكمية (+/−) ===== */
.qty-stepper{display:inline-flex;align-items:stretch;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--card)}
.qty-stepper input{width:52px;text-align:center;border:none;border-radius:0;background:transparent;font-weight:700;
  border-inline:1px solid var(--line);padding:0;-moz-appearance:textfield}
.qty-stepper input::-webkit-outer-spin-button,.qty-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qty-btn{width:34px;border:none;background:var(--gold-soft);color:var(--gold-d);font-size:20px;font-weight:800;
  line-height:1;cursor:pointer;user-select:none;transition:background .12s;display:flex;align-items:center;justify-content:center}
.qty-btn:hover{background:var(--gold-l);color:#fff}
.qty-btn:active{transform:scale(.94)}
@media (pointer:coarse){ .qty-btn{width:42px;min-height:42px;font-size:22px} .qty-stepper input{width:48px} }
html[data-theme="dark"] .qty-stepper{background:var(--card);border-color:var(--line)}
html[data-theme="dark"] .qty-btn{background:#3a3226;color:var(--gold)}
html[data-theme="dark"] .qty-btn:hover{background:var(--gold-d);color:#fff}

/* ===== ملصقات الباركود — المقاسات بقت متغيّرات (--bc-w/--bc-h/--bc-barw) بتتحقن من الإعدادات في الصفحة نفسها ===== */
.bc-sheet{display:flex;flex-wrap:wrap;gap:2mm;margin-top:14px}
.bc-label{
  width:var(--bc-w,20mm);height:var(--bc-h,40mm);box-sizing:border-box;position:relative;
  border:1px dashed var(--line);border-radius:3px;
  background:#fff;color:#000;overflow:hidden;break-inside:avoid;page-break-inside:avoid}
.bc-name{
  position:absolute;top:0.8mm;inset-inline:0.5mm;
  font-size:6.5pt;font-weight:800;line-height:1.1;text-align:center;
  height:4.6mm;overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* الباركود بيترسم أفقي طبيعي، وبندوّره 90 درجة عشان ياخد شكل الملصق الطولي
   مقاس صريح (مش max-width) عشان سماكة البارات تفضل ثابتة ومقروءة بغض النظر عن حجم الحاوية */
/* الباركود بموضع مطلق ثابت تمامًا — مش متأثر بطول اسم المنتج أو التفافه إطلاقاً */
.bc-imgwrap{position:absolute;inset:0;overflow:hidden}
.bc-img{position:absolute;top:56%;left:50%;width:var(--bc-barw,31mm);height:auto;
  transform:translate(-50%,-50%) rotate(90deg);transform-origin:center center}
.bc-fallback{font-family:monospace;font-size:10pt;font-weight:800;letter-spacing:1px}
@media print{
  /* وقت طباعة الملصقات: نخفي كل حاجة غير ورقة الملصقات */
  body.printing-labels>*{display:none!important}
  body.printing-labels>#bcSheet{display:block!important;margin:0!important;padding:0!important;gap:0!important}
  body.printing-labels .bc-label{
    border:none!important;border-radius:0!important;margin:0!important;
    width:var(--bc-w,20mm)!important;height:var(--bc-h,40mm)!important;
    page-break-after:always;break-after:page}      /* كل ملصق صفحة لوحده */
  body.printing-labels .bc-label:last-child{page-break-after:auto;break-after:auto}
  /* ملاحظة: مقاس الورقة (@page) بيتحقن بالجافاسكربت وقت الطباعة بس،
     عشان مايأثرش على طباعة الفواتير والتقارير العادية */
  body.printing-labels{margin:0!important;padding:0!important;background:#fff!important}
}