/* ---- منع الزوم (بالصباعين / الدبل تاب / تكبير الآيفون لما تضغط على خانة) ---- */
html,body{touch-action:manipulation;-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (max-width:860px){input.inp,select.inp,textarea.inp,.inp{font-size:16px}}

/* ==========================================================================
   صفحة الدخول (تذكرني / إظهار كلمة المرور) + زرار «تحميل التطبيق» (PWA)
   ========================================================================== */
.login-form{background:radial-gradient(900px 500px at 0% 100%,rgba(224,138,60,.07),transparent),var(--bg)}
.login-form form{background:var(--surface);border:1px solid var(--border);border-radius:22px;padding:34px 30px 26px;box-shadow:0 24px 60px -28px rgba(31,26,22,.28)}
.login-sub{margin:0 0 24px}
.lf{margin-bottom:16px;display:flex;flex-direction:column;gap:7px}
.lf label{font-size:13px;font-weight:600;color:var(--text-2)}
.lf-box{position:relative}
.lf-box > svg.i{position:absolute;top:50%;right:14px;transform:translateY(-50%);color:var(--text-3);pointer-events:none;transition:color .15s}
.lf-box .inp{height:50px;border-radius:12px;padding-right:44px;font-size:15px;background:var(--surface-2)}
.lf-box .inp:focus{background:#fff}
.lf-box:focus-within > svg.i{color:var(--primary)}
.lf-box .inp[type=password],.lf-box .inp#lg-pass{padding-left:46px}
.lf-eye{position:absolute;top:50%;left:6px;transform:translateY(-50%);width:38px;height:38px;border:0;background:transparent;border-radius:10px;color:var(--text-3);cursor:pointer;display:grid;place-items:center}
.lf-eye:hover{background:var(--surface-3);color:var(--text)}

.remember{display:flex;align-items:flex-start;gap:11px;padding:12px 14px;margin:4px 0 18px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);cursor:pointer;user-select:none;transition:border-color .15s,background .15s}
.remember:hover{border-color:var(--border-strong)}
.remember input{position:absolute;opacity:0;width:1px;height:1px}
.rm-box{width:22px;height:22px;flex:none;border-radius:7px;border:2px solid var(--border-strong);background:#fff;margin-top:1px;display:grid;place-items:center;transition:.15s}
.rm-box::after{content:'';width:10px;height:6px;border:2.5px solid #fff;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px);opacity:0;transition:opacity .12s}
.remember input:checked ~ .rm-box{background:var(--primary);border-color:var(--primary)}
.remember input:checked ~ .rm-box::after{opacity:1}
.remember input:focus-visible ~ .rm-box{box-shadow:0 0 0 3px var(--primary-100)}
.remember:has(input:checked){border-color:rgba(180,88,14,.45);background:var(--primary-50)}
.rm-tx{display:flex;flex-direction:column;line-height:1.45}
.rm-tx b{font-size:14px;font-weight:700;color:var(--text)}
.rm-tx small{font-size:12px;color:var(--text-3)}

.login-err{background:var(--danger-50);color:var(--danger);border:1px solid rgba(200,50,58,.25);border-radius:10px;padding:10px 12px;font-size:13px;font-weight:600;margin:-4px 0 14px}
.login-err[hidden]{display:none}
.login-btn{width:100%;height:50px;justify-content:center;font-size:15.5px;border-radius:12px}
.login-fix{display:block;text-align:center;margin-top:16px;font-size:12px;color:var(--text-3);text-decoration:underline}
.login-fix:hover{color:var(--text-2)}
@media (max-width:860px){
  .login-form{padding:20px 16px;align-items:start;padding-top:max(28px,env(safe-area-inset-top))}
  .login-form form{padding:26px 20px 22px;border-radius:20px}
}

/* ---- لا يوجد اتصال أثناء فتح السيستم (المستخدم لسه مسجّل) ---- */
.boot-off{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(1000px 500px at 80% 0%,#3b2a1c,transparent),linear-gradient(160deg,#1f1a16,#2d211a);color:#fff}
.boot-off-box{width:100%;max-width:400px;text-align:center;background:rgba(255,255,255,.06);border:1px solid rgba(224,138,60,.3);border-radius:24px;padding:32px 24px}
.boot-off-box img{border-radius:22px;margin-bottom:14px}
.boot-off-box h1{font-size:21px;margin:0 0 8px}
.boot-off-box p{color:#cbc2b8;margin:0 0 22px;line-height:1.8}
.boot-off-box .btn{width:100%;height:50px;justify-content:center;font-size:15px}
.boot-off-box a{display:block;margin-top:14px;color:#a89d92;font-size:12.5px;text-decoration:underline}

/* ---- زرار «تحميل التطبيق» ---- */
.pwa-x[hidden]{display:none!important}
.pwa-x-or{display:flex;align-items:center;gap:12px;margin:16px 0 12px;color:var(--text-3);font-size:12.5px;font-weight:700}
.pwa-x-or::before,.pwa-x-or::after{content:'';flex:1;height:1px;background:var(--border)}
.pwa-x-btn{width:100%;min-height:54px;display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 16px;border-radius:14px;border:1.5px solid rgba(180,88,14,.45);background:#fffaf4;color:#7a3c08;cursor:pointer;font-family:inherit;transition:background .18s,border-color .18s,transform .12s,box-shadow .18s}
.pwa-x-btn:hover{background:var(--primary-50);border-color:var(--primary);box-shadow:0 10px 22px -14px rgba(180,88,14,.9);transform:translateY(-1px)}
.pwa-x-btn:disabled{opacity:.7;cursor:progress}
.pwa-x-ic{width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,#e08a3c,#b4580e);color:#fff;display:grid;place-items:center;flex-shrink:0;box-shadow:0 6px 14px -8px rgba(180,88,14,.9)}
.pwa-x-ic svg.i{width:20px;height:20px;stroke-width:2.1}
.pwa-x-tx{display:flex;flex-direction:column;align-items:flex-start;line-height:1.3;text-align:start}
.pwa-x-tx b{font-size:15px;font-weight:700;color:#5c2d05}
.pwa-x-tx small{font-size:11.5px;color:#9a5a1c;font-weight:600}

.pwa-x-sheet{position:fixed;inset:0;z-index:100000;display:none}
.pwa-x-sheet.on{display:block}
.pwa-x-back{position:absolute;inset:0;background:rgba(20,12,9,.6);opacity:0;transition:opacity .25s}
.pwa-x-sheet.show .pwa-x-back{opacity:1}
.pwa-x-box{position:absolute;bottom:0;left:0;right:0;margin:0 auto;max-width:480px;max-height:92vh;overflow:auto;background:#fff;border-radius:24px 24px 0 0;padding:10px 20px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -12px 40px rgba(0,0,0,.25);transform:translateY(100%);transition:transform .32s cubic-bezier(.2,.8,.2,1);color:var(--text)}
.pwa-x-sheet.show .pwa-x-box{transform:translateY(0)}
@media (min-width:768px){.pwa-x-box{bottom:50%;border-radius:24px;transform:translateY(60%) scale(.96);opacity:0;transition:transform .25s,opacity .2s}.pwa-x-sheet.show .pwa-x-box{transform:translateY(50%);opacity:1}.pwa-x-grab{display:none}}
.pwa-x-grab{width:44px;height:5px;border-radius:5px;background:var(--border);margin:0 auto 10px}
.pwa-x-head{display:flex;align-items:center;gap:12px;margin:0 -20px 14px;padding:14px 20px;background:linear-gradient(135deg,#1f1a16,#2d211a);color:#fff;border-bottom:3px solid #e08a3c}
.pwa-x-head img{border-radius:14px;box-shadow:0 6px 16px -8px rgba(0,0,0,.5)}
.pwa-x-head b{display:block;font-size:16.5px;font-weight:700;color:#fff}
.pwa-x-head small{display:block;font-size:12.5px;color:rgba(255,255,255,.7)}
.pwa-x-close{margin-inline-start:auto;background:rgba(255,255,255,.14);border:0;width:34px;height:34px;border-radius:10px;color:#fff;font-size:15px;cursor:pointer}
.pwa-x-steps{display:none}
.pwa-x-steps.on{display:block}
.pwa-x-primary{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:linear-gradient(135deg,#2d211a,#1f1a16);color:#fff!important;text-decoration:none!important;box-shadow:0 14px 28px -14px rgba(31,26,22,.9);margin-bottom:12px}
.pwa-x-primary img{border-radius:11px;box-shadow:0 0 0 2px rgba(224,138,60,.6)}
.pwa-x-primary b{display:block;font-size:15.5px;font-weight:700}
.pwa-x-primary small{display:block;font-size:12px;color:#f0a35e;font-weight:600}
.pwa-x-flow{display:grid;gap:6px;margin-bottom:10px}
.pwa-x-fl{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--text-2);line-height:1.6}
.pwa-x-fl .pwa-x-n{width:26px;height:26px;border-radius:8px;font-size:12px}
.pwa-x-manual{border-top:1px dashed var(--border);padding-top:10px;margin-top:4px}
.pwa-x-manual summary{cursor:pointer;font-size:12.5px;font-weight:700;color:var(--text-3);margin-bottom:8px;list-style:none}
.pwa-x-manual summary::-webkit-details-marker{display:none}
.pwa-x-manual summary::before{content:'▸ ';color:var(--primary)}
.pwa-x-manual[open] summary::before{content:'▾ '}
.pwa-x-step{display:flex;align-items:center;gap:12px;background:var(--surface-2);border:1px solid var(--border);border-radius:14px;padding:12px 14px;margin-bottom:8px;font-size:14px;font-weight:600;line-height:1.7}
.pwa-x-n{width:30px;height:30px;border-radius:10px;background:#1f1a16;color:#f0a35e;font-weight:700;display:grid;place-items:center;flex-shrink:0}
.pwa-x-chip{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;background:#e8f1ff;color:#007aff;vertical-align:middle;margin-inline-start:4px}
.pwa-x-note{background:#fffaf4;border:1px solid rgba(180,88,14,.3);color:#7a3c08;border-radius:14px;padding:12px 14px;font-size:13.5px;font-weight:600;line-height:1.8;margin-bottom:8px}
.pwa-x-copy{width:100%;height:46px;border-radius:13px;border:1.5px solid #1f1a16;background:#fff;color:#1f1a16;font-weight:700;font-family:inherit;cursor:pointer;margin-bottom:6px}
.pwa-x-ok-badge{background:var(--success-50);color:var(--success);border:1px solid rgba(15,138,95,.3);border-radius:12px;padding:10px 12px;font-weight:700;font-size:14px;text-align:center;margin-bottom:10px}
.pwa-x-ok{width:100%;height:50px;border:0;border-radius:14px;background:var(--primary);color:#fff;font-weight:700;font-size:15px;font-family:inherit;cursor:pointer;margin-top:8px}
.pwa-x-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,160%);background:#1f1a16;color:#fff;border:1px solid rgba(224,138,60,.5);padding:12px 22px;border-radius:14px;font-weight:700;font-size:14.5px;z-index:100001;box-shadow:0 14px 30px -12px rgba(0,0,0,.5);transition:transform .3s;white-space:nowrap}
.pwa-x-toast.on{transform:translate(-50%,0)}

/* ---- التحميل من غير دايرة بتلف ---- */
.skel{padding:6px 0;opacity:0;animation:skIn .2s ease .35s forwards}
@keyframes skIn{to{opacity:1}}
.skel .sk{background:var(--surface-3);border-radius:12px;height:92px}
.skel .sk-h{height:34px;width:38%;margin-bottom:18px}
.skel .sk-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:14px}
.skel .sk-b{height:260px}
@media (max-width:860px){.skel .sk-row{grid-template-columns:1fr 1fr}.skel .sk-row .sk:last-child{display:none}}
/* شاشة البداية: اللوجو ثابت (من غير حركة) */
.boot-splash{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg,#f6f4f1)}
.boot-splash img{width:84px;height:84px;border-radius:22px;box-shadow:0 12px 30px -14px rgba(31,26,22,.45)}

/* ==========================================================================
   Modal موحّد «Premium» — هيدر وفوتر غامقين، الجسم بيعمل scroll لوحده
   ========================================================================== */
.overlay{background:rgba(20,14,10,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);align-items:center;padding:3vh 16px;animation:fade .18s ease}
.modal.pm{width:100%;max-width:720px;max-height:92vh;display:flex;flex-direction:column;border-radius:20px;overflow:hidden;border:0;background:#f7f5f2;
  box-shadow:0 40px 90px -20px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.06);animation:pmIn .18s cubic-bezier(.2,.8,.2,1)}
@keyframes pmIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
.modal.pm.sm{max-width:460px}.modal.pm.md{max-width:720px}.modal.pm.lg{max-width:980px}.modal.pm.xl{max-width:1200px}
.modal.pm .modal-head{flex:none;position:relative;display:flex;align-items:center;gap:14px;padding:18px 22px;background:linear-gradient(135deg,#2a211b,#1a1512);color:#fff;border:0}
.mh-ico{width:44px;height:44px;flex:none;border-radius:13px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#f0a259,#c4650f);box-shadow:0 10px 22px -10px rgba(240,162,89,.9)}
.mh-ico svg.i{width:21px;height:21px;stroke-width:2}
.mh-tx{display:flex;flex-direction:column;min-width:0;line-height:1.35}
.modal.pm .modal-head h3{font-size:18px;font-weight:600;margin:0;color:#fff;font-family:'Readex Pro',var(--font)}
.mh-tx small{font-size:12.5px;color:#b9ada1;margin-top:3px}
.modal.pm .modal-head .x{margin-inline-start:auto;width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:rgba(255,255,255,.08);color:#e9e1d8;padding:0;border:0;cursor:pointer;transition:.15s}
.modal.pm .modal-head .x:hover{background:#c8323a;color:#fff}
.modal.pm .modal-body{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:22px 24px;background:#f7f5f2}
.modal.pm .modal-foot{flex:none;display:flex;align-items:center;gap:12px;padding:14px 22px;background:linear-gradient(135deg,#2a211b,#1a1512);border:0;border-radius:0;box-shadow:0 -12px 26px -20px rgba(0,0,0,.6)}
.mf-btns{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.mf-sum{margin-inline-start:auto;color:#fff;font-size:13px;color:#b9ada1;display:flex;align-items:baseline;gap:8px;white-space:nowrap}
.mf-sum b{font-size:21px;color:#fff;font-weight:700;font-variant-numeric:tabular-nums}
.modal.pm .modal-foot .btn{height:44px;min-width:104px;justify-content:center;border-radius:12px;font-size:14.5px;font-weight:600}
.modal.pm .modal-foot .btn.primary{min-width:150px;background:linear-gradient(135deg,#e99a4d,#b4580e);border-color:transparent;box-shadow:0 10px 22px -12px rgba(240,162,89,.9)}
.modal.pm .modal-foot .btn:not(.primary):not(.danger){background:transparent;border:1px solid rgba(255,255,255,.15);color:#fff}
.modal.pm .modal-foot .btn:not(.primary):not(.danger):hover{background:rgba(255,255,255,.08)}
.modal.pm .modal-foot .btn.danger{background:#c8323a;border-color:#c8323a;color:#fff}
.modal.pm .f label{font-weight:600;color:var(--text-2)}
.modal.pm .inp{height:44px;border-radius:12px;background:#fff}
.modal.pm textarea.inp{height:auto}
/* كروت الأقسام جوه المودال */
.pm-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px;margin-bottom:14px;box-shadow:0 1px 2px rgba(31,26,22,.04)}
.pm-card:last-child{margin-bottom:0}
.pm-card > .pm-ct{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:15px;font-weight:600}
.pm-card > .pm-ct small{font-weight:400;font-size:12px;color:var(--text-3)}
@media (max-width:860px){
  .overlay{padding:0;align-items:flex-end;background:rgba(15,10,7,.62)}
  .modal.pm,.modal.pm.sm,.modal.pm.md,.modal.pm.lg,.modal.pm.xl{max-width:none;width:100%;max-height:94dvh;max-height:94vh;border-radius:24px 24px 0 0;animation:pmUp .26s cubic-bezier(.2,.9,.25,1);box-shadow:0 -20px 50px -10px rgba(0,0,0,.5)}
  .modal.pm.lg,.modal.pm.xl{height:94vh}
  /* هيدر الموبايل: مقبض صغير فوق + عنوان مضغوط */
  .modal.pm .modal-head{padding:22px 16px 14px;gap:12px}
  .modal.pm .modal-head::after{content:'';position:absolute;top:8px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:4px;background:rgba(255,255,255,.22)}
  .mh-ico{width:40px;height:40px;border-radius:12px}
  .mh-ico svg.i{width:19px;height:19px}
  .modal.pm .modal-head h3{font-size:16.5px}
  .mh-tx small{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:62vw}
  .modal.pm .modal-head .x{width:36px;height:36px;border-radius:50%}
  .modal.pm .modal-body{padding:12px 12px 18px;-webkit-overflow-scrolling:touch}
  .modal.pm .form-grid{gap:12px}
  .modal.pm .f,.modal.pm .f.c3,.modal.pm .f.c4,.modal.pm .f.c6,.modal.pm .f.c8,.modal.pm .f.c2{grid-column:span 12}
  .modal.pm .inp{height:48px;font-size:16px;border-radius:13px}
  .modal.pm textarea.inp{min-height:84px}
  .modal.pm .f label{font-size:13px}
  /* الفوتر: الإجمالي فوق، الزرار الأساسي عريض، والباقي جنب بعض */
  .modal.pm .modal-foot{flex-wrap:wrap;padding:12px 14px calc(12px + env(safe-area-inset-bottom));gap:10px;border-radius:0}
  .mf-btns{flex:1 1 100%;order:2;display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:8px}
  .mf-btns .btn{min-width:0!important;padding:0 8px;height:46px;font-size:13.5px}
  .mf-btns .btn.primary{grid-column:1 / -1;height:52px;font-size:15.5px;border-radius:14px}
  .mf-sum{order:1;width:100%;justify-content:space-between;margin:0;padding:2px 2px 0}
  .mf-sum:empty{display:none}
  .pm-card{padding:14px;border-radius:16px;margin-bottom:12px}
  .pm-card > .pm-ct{font-size:14.5px;margin-bottom:12px}
  .pm-card > .pm-ct small{display:none}
}
@keyframes pmUp{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}

/* عناوين أقسام الفورم */
.fs-title{font-size:14.5px!important;color:var(--text)!important;align-items:center}
.fs-title::before{display:none}
.fs-ico{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:var(--primary-50);color:var(--primary);flex:none}
.fs-ico svg.i{width:17px;height:17px}
.fs-title small{font-size:12px;font-weight:500;color:var(--text-3);margin-inline-start:4px}
.inp-ico{position:relative}
.inp-ico > svg.i{position:absolute;top:50%;right:13px;transform:translateY(-50%);color:var(--text-3);pointer-events:none}
.inp-ico > .inp{padding-right:40px}
.inp-ico > select.inp{padding-right:40px}
.inp-ico:focus-within > svg.i{color:var(--primary)}
.inp[type=tel]{direction:ltr;text-align:right}

/* ---- فورم العميل: الخريطة والموقع ---- */
.loc-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px}
.loc-bar .btn{height:44px;border-radius:12px}
.loc-search{position:relative;flex:1;min-width:220px}
.loc-search > svg.i{position:absolute;top:50%;right:13px;transform:translateY(-50%);color:var(--text-3);pointer-events:none;z-index:1}
.loc-search .inp{padding-right:40px;width:100%}
.loc-sug{position:absolute;top:calc(100% + 6px);inset-inline:0;z-index:1200;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 18px 40px -16px rgba(0,0,0,.35);overflow:hidden;max-height:260px;overflow-y:auto}
.loc-sug button{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:start;padding:10px 12px;border:0;background:#fff;cursor:pointer;font-size:13px;line-height:1.6;border-bottom:1px solid var(--surface-3)}
.loc-sug button:hover{background:var(--primary-50)}
.loc-sug button svg.i{color:#EA4335;margin-top:3px}
.ls-empty{padding:12px;font-size:13px;color:var(--text-3)}
.loc-map{height:340px;border-radius:14px;overflow:hidden;border:1px solid var(--border);position:relative;z-index:0;background:#e8eaed}
.loc-st{margin-top:10px;font-size:12.5px;color:var(--text-3);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.loc-st.ok{color:var(--success)}
.loc-st.err{color:var(--danger)}
@media (max-width:860px){.loc-map{height:260px}.loc-bar .btn{flex:1}.loc-search{flex:1 1 100%;min-width:0}}

/* ---- خرائط شكل Google (Leaflet + Esri) — كل خرائط السيستم ---- */
.gmap.leaflet-container{font-family:inherit;background:#e8eaed}
.gmap .leaflet-bar{border:0!important;box-shadow:0 1px 4px rgba(0,0,0,.3)!important;border-radius:22px!important;overflow:hidden}
.gmap .leaflet-bar a{width:40px!important;height:40px!important;line-height:40px!important;font-size:20px!important;color:#666!important;background:#fff!important;border:0!important}
.gmap .leaflet-bar a:first-child{border-bottom:1px solid #eee!important}
.gmap .leaflet-bar a:hover{color:#222!important;background:#f5f5f5!important}
.gm-types{display:flex;background:#fff;border-radius:10px;box-shadow:0 1px 4px rgba(0,0,0,.3);overflow:hidden}
.gm-types button{border:0;background:#fff;padding:8px 14px;font:500 13px inherit;font-family:inherit;color:#555;cursor:pointer}
.gm-types button.on{color:#111;font-weight:700;background:#f1f3f4}
.gm-locate{width:40px;height:40px;border-radius:50%;border:0;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.3);display:grid;place-items:center;color:#666;cursor:pointer;margin-bottom:6px!important}
.gm-locate:hover{color:#1a73e8}
.gm-locate.busy{color:#1a73e8;animation:none;opacity:.7}
.g-pin{width:30px;height:42px;position:relative;filter:drop-shadow(0 3px 3px rgba(0,0,0,.35))}
.g-pin::before{content:'';position:absolute;inset:0 0 auto 0;width:30px;height:30px;border-radius:50% 50% 50% 0;background:#EA4335;transform:rotate(-45deg);transform-origin:center;top:2px;border:1px solid #b31412}
.g-pin i{position:absolute;top:11px;left:50%;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:#fff;z-index:1}
.gmap .leaflet-control-attribution{font-size:10px;background:rgba(255,255,255,.75)!important}

/* فاصل بسيط في القائمة الجانبية */
.nav-sep{height:1px;background:rgba(255,255,255,.08);margin:8px 12px}
.app.mini .nav-sep{display:none}

/* ---- فاتورة البيع جوه المودال ---- */
.layout-aside.in-modal{grid-template-columns:minmax(0,1fr) 340px;gap:16px}
.layout-aside.in-modal .aside-sticky{top:0}
.layout-aside.in-modal .card{border-radius:16px}
@media (max-width:1000px){.layout-aside.in-modal{grid-template-columns:1fr}.layout-aside.in-modal .aside-sticky{position:static}}
/* «+ إضافة عميل جديد باسم …» في قائمة البحث */
.combo-new{display:flex;align-items:center;gap:8px;width:100%;padding:11px 12px;border:0;border-top:1px dashed var(--border);background:var(--primary-50);color:var(--primary);font:600 13.5px inherit;font-family:inherit;cursor:pointer;text-align:start}
.combo-new:hover{background:var(--primary-100)}

/* ==========================================================================
   لوحة التحكم
   ========================================================================== */
.dash-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin:4px 0 18px}
.dash-head h1{margin:0;font-size:24px;font-family:'Readex Pro',var(--font);font-weight:600}
.dash-head p{margin:4px 0 0;color:var(--text-3);font-size:13px}
.hero-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.hero-kpi{position:relative;overflow:hidden;border-radius:20px;padding:18px 18px 16px;color:#fff;min-height:150px;display:flex;flex-direction:column;box-shadow:0 18px 34px -20px var(--hk-sh)}
.hero-kpi::after{content:'';position:absolute;width:180px;height:180px;border-radius:50%;background:rgba(255,255,255,.09);left:-60px;bottom:-90px}
.hero-kpi::before{content:'';position:absolute;width:110px;height:110px;border-radius:50%;background:rgba(255,255,255,.07);left:40px;top:-50px}
.hk-red{background:linear-gradient(140deg,#f2575a,#c72a32);--hk-sh:rgba(199,42,50,.8)}
.hk-blue{background:linear-gradient(140deg,#3d7fe0,#1c4fa8);--hk-sh:rgba(28,79,168,.8)}
.hk-green{background:linear-gradient(140deg,#23b26d,#118553);--hk-sh:rgba(17,133,83,.8)}
.hk-purple{background:linear-gradient(140deg,#8b5cf6,#5b34c4);--hk-sh:rgba(91,52,196,.8)}
.hk-top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13.5px;font-weight:600;opacity:.95;position:relative;z-index:1}
.hk-ico{width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.18);display:grid;place-items:center}
.hk-ico svg.i{width:19px;height:19px}
.hk-val{font-size:30px;font-weight:700;letter-spacing:-.5px;margin:12px 0 10px;position:relative;z-index:1;font-family:'Readex Pro',var(--font)}
.hk-val small{font-size:13px;font-weight:500;opacity:.8;margin-inline-start:6px}
.hk-foot{margin-top:auto;display:flex;flex-direction:column;gap:4px;position:relative;z-index:1}
.hk-sub{font-size:11.5px;opacity:.82}
.tr{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;padding:3px 8px;border-radius:999px;width:fit-content}
.tr small{font-weight:500;opacity:.85;margin-inline-start:4px}
.tr svg.i{width:13px;height:13px}
.hero-kpi .tr{background:rgba(255,255,255,.2);color:#fff}
.hero-kpi .tr.down{background:rgba(0,0,0,.18)}
.card .tr.up{background:var(--success-50);color:var(--success)}
.card .tr.down{background:var(--danger-50);color:var(--danger)}
.card .tr.flat{background:var(--surface-3);color:var(--text-3)}
.dq{margin-bottom:16px}
/* الدواير */
.donut{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center}
.dn-svg,.rg-svg{position:relative;flex:none}
.dn-svg circle{transition:stroke-dasharray .6s ease}
.dn-c,.rg-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.dn-c b{font-size:17px;font-weight:700}
.dn-c small{font-size:11px;color:var(--text-3)}
.dn-leg{flex:1;min-width:150px;display:flex;flex-direction:column;gap:9px}
.dn-leg div{display:flex;align-items:center;gap:8px;font-size:13px}
.dn-leg i{width:11px;height:11px;border-radius:4px;flex:none}
.dn-leg span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-2)}
.dn-leg b{font-size:12.5px}
.rings{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
.kring{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;min-width:0}
.kring .rg-c{font-size:20px;font-weight:700}
.rg-t{display:flex;flex-direction:column;gap:2px}
.rg-t b{font-size:13px}
.rg-t small{font-size:11.5px;color:var(--text-3)}
.mini-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mini-stats > div{background:var(--surface-2);border:1px solid var(--border);border-radius:14px;padding:12px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.mini-stats span{font-size:12px;color:var(--text-3);display:flex;align-items:center;gap:5px}
.mini-stats span svg.i{width:14px;height:14px}
.mini-stats b{font-size:16px;white-space:nowrap}
.mini-stats b small{font-size:11px;font-weight:500;color:var(--text-3)}
.mini-stats .tr{font-size:11px;padding:2px 8px}
/* أحدث العمليات */
.ops{display:flex;flex-direction:column;gap:4px;padding-top:6px}
.op{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid var(--surface-3)}
.op:last-child{border-bottom:0}
.op-ico{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-weight:700;flex:none}
.op-ico.in{background:var(--success-50);color:var(--success)}
.op-ico.out{background:var(--danger-50);color:var(--danger)}
.op-t{flex:1;min-width:0;display:flex;flex-direction:column}
.op-t b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.op-t small{font-size:11.5px;color:var(--text-3)}
.op-v{font-size:14px}
.op-v.in{color:var(--success)}
.op-v.out{color:var(--danger)}
@media (max-width:1200px){.hero-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){
  .dash-head{align-items:center;margin:0 0 14px}
  .dash-head h1{font-size:19px}
  .dash-head .btn{display:none}
  .hero-grid{gap:10px;margin-bottom:12px}
  .hero-kpi{min-height:128px;padding:14px 14px 12px;border-radius:18px}
  .hk-top{font-size:12px}
  .hk-ico{width:32px;height:32px;border-radius:10px}
  .hk-val{font-size:21px;margin:8px 0}
  .hk-val small{font-size:11px}
  .hk-sub{display:none}
  .tr small{display:none}
  .dq{display:flex;overflow-x:auto;gap:10px;scroll-snap-type:x mandatory;padding-bottom:4px;margin:0 -14px 12px;padding-inline:14px;scrollbar-width:none}
  .dq::-webkit-scrollbar{display:none}
  .dq a{flex:0 0 108px;scroll-snap-align:start}
  .donut{gap:14px}
  .sec-kpis{grid-template-columns:1fr 1fr!important;gap:10px}
}

/* ==========================================================================
   الجداول — شكل موحّد في السيستم كله
   ========================================================================== */
.toolbar{padding:14px 16px;gap:10px;background:#fff;border-bottom:1px solid var(--border)}
.toolbar .search input{height:42px;border-radius:12px;background:var(--surface-2);border:1px solid var(--border);font-size:13.5px}
.toolbar .search input:focus{background:#fff;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-100)}
.toolbar .search svg{top:12px}
.toolbar .filters .inp{height:42px;border-radius:12px}
/* أزرار Excel / طباعة: داكنة بخط أبيض */
.tb-btns{display:flex;gap:8px}
.toolbar .tb-btns .btn,.toolbar .tb-btns .btn.ghost{height:40px;padding:0 14px;border-radius:12px;border:0;background:linear-gradient(135deg,#2f251e,#1a1512);color:#fff;font-weight:600;font-size:13px;box-shadow:0 6px 14px -10px rgba(0,0,0,.7)}
.toolbar .tb-btns .btn:hover{background:linear-gradient(135deg,#3a2d24,#231c17);color:#fff}
.toolbar .tb-btns .btn svg.i{color:#f0a259}

.table-wrap{background:#fff}
table.t{font-size:13.5px}
table.t thead th{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,#2a211b,#1f1915);color:#e9e1d8;font-weight:600;font-size:12.5px;letter-spacing:.2px;padding:13px 16px;border:0;white-space:nowrap}
table.t thead th:first-child{border-start-start-radius:0}
table.t thead th.sortable:hover{color:#fff}
table.t thead th .arr{color:#f0a259;opacity:1}
table.t tbody td{padding:14px 16px;border-bottom:1px solid #f1ede8;color:var(--text)}
table.t tbody tr:nth-child(even) td{background:#fcfbf9}
table.t tbody tr{transition:background .12s}
table.t tbody tr:hover td{background:#fdf5ec}
table.t tbody tr.click:hover td:first-child{box-shadow:inset -3px 0 0 #e0772b}
table.t tbody tr:last-child td{border-bottom:0}
table.t td b{font-weight:600}
table.t tfoot td{background:linear-gradient(180deg,#fdf6ee,#fbefe2);color:#7a3c08;font-weight:700;font-size:14px;padding:13px 16px;border-top:2px solid #f3d9bf}
table.t .row-actions{opacity:1;gap:6px}
/* أزرار الإجراءات في الصف: داكنة وأيقونة بيضاء */
table.t [data-act].btn,.mcard-act [data-act].btn{width:34px;height:34px;padding:0;justify-content:center;border-radius:10px;border:0;background:linear-gradient(135deg,#2f251e,#1a1512);color:#fff;box-shadow:0 4px 10px -6px rgba(0,0,0,.7);transition:transform .12s,background .12s;position:relative}
table.t [data-act].btn svg.i,.mcard-act [data-act].btn svg.i{width:16px;height:16px;color:#fff}
table.t [data-act].btn:hover,.mcard-act [data-act].btn:hover{background:linear-gradient(135deg,#e99a4d,#b4580e);transform:translateY(-1px)}
table.t [data-act].btn.danger,.mcard-act [data-act].btn.danger{background:linear-gradient(135deg,#d6454c,#a8252c)}
table.t [data-act].btn.success,.mcard-act [data-act].btn.success{width:auto;padding:0 12px;gap:6px;background:linear-gradient(135deg,#23b26d,#118553);font-size:12.5px;font-weight:600}
/* أزرار فيها نص (مش أيقونة بس) */
table.t [data-act].btn:not(.act-btn):not(.success){width:auto;padding:0 12px;gap:6px;font-size:12.5px;font-weight:600}
/* tooltip باسم الزرار */
[data-tip]::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,4px);background:#1a1512;color:#fff;font-size:11.5px;font-weight:600;padding:5px 9px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;transition:.15s;z-index:20;box-shadow:0 8px 18px -8px rgba(0,0,0,.6)}
[data-tip]:hover::after{opacity:1;transform:translate(-50%,0)}
@media (hover:none){[data-tip]::after{display:none}}
/* الترقيم */
.pager{padding:12px 16px;gap:10px;color:var(--text-3);font-size:12.5px;border-top:1px solid var(--border);background:#fff;border-radius:0 0 18px 18px}
.pager .btn{height:34px;padding:0 14px;border-radius:10px;border:0;background:#2a211b;color:#fff}
.pager .btn:disabled{opacity:.35}
/* اسم بأفاتار في الجدول */
.cell-name{display:flex;align-items:center;gap:11px;min-width:0}
.cell-av{width:38px;height:38px;border-radius:12px;flex:none;display:grid;place-items:center;font-weight:700;font-size:15px;color:#fff;background:linear-gradient(135deg,#e99a4d,#b4580e)}
.cell-name > div{min-width:0}
.cell-name b{display:block;font-size:14px}
.cell-name small{display:block;color:var(--text-3);font-size:12px;margin-top:2px}
/* الموبايل: كروت */
.mcard{border-radius:16px!important;border:1px solid var(--border)!important;box-shadow:0 2px 6px rgba(31,26,22,.04)}
.mcard-act{display:flex;gap:8px;flex-wrap:wrap;padding-top:10px;margin-top:10px;border-top:1px dashed var(--border)}
.mcard-act [data-act].btn{width:40px;height:40px;border-radius:12px}
@media (max-width:860px){.tb-btns .btn span{display:none}.toolbar .tb-btns .btn{width:40px;padding:0;justify-content:center}}

/* ==========================================================================
   السرعة: شيل التأثيرات التقيلة (البلور بيتعاد رسمه مع كل scroll، والأنيميشن بيأخر ظهور الصفحة)
   ========================================================================== */
.topbar,.bottom-nav,.overlay,.sheet-ov,.backdrop{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.topbar{background:#f6f4f1!important}
#view > *{animation:none!important}
.kpi,.card{transition:none}
@media (max-width:860px){
  .topbar{background:#fff!important}
  .bottom-nav{background:#fff!important}
  .overlay{background:rgba(15,10,7,.66)}
}

/* ==========================================================================
   هيدر الصفحات — بانر غامق بنفس روح النوافذ
   ========================================================================== */
.page-head{margin:6px 0 20px!important;padding:20px 24px!important;border:0!important;border-radius:22px!important;
  background:linear-gradient(135deg,#2a211b 0%,#1a1512 100%)!important;color:#fff;box-shadow:0 18px 40px -26px rgba(0,0,0,.8)!important;overflow:hidden;position:relative;align-items:center;gap:16px}
.page-head::before{content:''!important;position:absolute;inset:auto -60px -120px auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(240,162,89,.22),transparent 65%)!important;-webkit-mask-image:none!important;mask-image:none!important;pointer-events:none}
.page-head::after{display:none!important}
.page-head .ph-ico{width:52px!important;height:52px!important;border-radius:16px!important;background:linear-gradient(145deg,#f0a259,#c4650f)!important;color:#fff!important;box-shadow:0 10px 24px -10px rgba(240,162,89,.9)!important}
.page-head .ph-crumb,.page-head .ph-crumb span{color:#a89d92!important}
.page-head .ph-crumb span:last-child{color:#f0a259!important}
.page-head h1{color:#fff!important;font-family:'Readex Pro',var(--font)!important;font-weight:600!important;font-size:23px!important}
.page-head p{color:#b9ada1!important}
.page-head .actions .btn{height:44px!important;border-radius:13px!important;padding:0 18px!important;font-weight:600}
.page-head .actions .btn.primary{background:linear-gradient(135deg,#f0a259,#c4650f)!important;border:0!important;box-shadow:0 10px 22px -12px rgba(240,162,89,.9)!important}
.page-head .actions .btn:not(.primary):not(.success):not(.danger){background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.16)!important;color:#fff!important;box-shadow:none!important}
.page-head .actions .btn:not(.primary):not(.success):not(.danger):hover{background:rgba(255,255,255,.14)!important}
.page-head .actions .inp{height:44px;border-radius:13px;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#fff}
.page-head .actions .inp option{color:#1d1a17}
.page-head .badge{background:rgba(255,255,255,.12)!important;color:#fff!important}

/* ==========================================================================
   كروت الإحصائيات
   ========================================================================== */
.kpi{--kc:#e0772b;--kbg:#fdf3ea;border:1px solid var(--border)!important;border-radius:20px!important;padding:18px 18px 16px!important;background:#fff;box-shadow:0 1px 2px rgba(31,26,22,.04);position:relative;overflow:hidden;gap:4px}
.kpi::before{content:'';position:absolute;inset:0 0 auto 0;height:4px;background:var(--kc);opacity:.9}
.kpi::after{content:'';position:absolute;width:140px;height:140px;border-radius:50%;background:var(--kbg);left:-50px;bottom:-70px;pointer-events:none}
.kpi > *{position:relative;z-index:1}
.kpi-primary{--kc:#e0772b;--kbg:#fdf3ea}.kpi-success{--kc:#1baf7a;--kbg:#e8f6f0}.kpi-danger{--kc:#e14b4b;--kbg:#fcecec}
.kpi-info{--kc:#2a78d6;--kbg:#eaf2fc}.kpi-warning{--kc:#e0a100;--kbg:#fdf4df}.kpi-gray{--kc:#8f877d;--kbg:#f1eeea}
.kpi .k-label{font-size:13px!important;font-weight:600!important;color:var(--text-2)!important;gap:10px!important}
.kpi .k-ico{width:42px!important;height:42px!important;border-radius:13px!important;background:var(--kc)!important;color:#fff!important;box-shadow:0 8px 16px -10px var(--kc)}
.kpi .k-ico svg.i{width:20px;height:20px}
.kpi .k-val{font-size:27px!important;font-weight:700!important;margin:10px 0 2px!important;font-family:'Readex Pro',var(--font)!important;letter-spacing:-.4px}
.kpi .k-val small{font-size:12px!important;color:var(--text-3)!important}
.kpi .k-foot{font-size:12px!important;color:var(--text-3)!important;padding-top:8px;margin-top:4px;border-top:1px dashed var(--border)}
.kpi .k-foot a{color:var(--kc);font-weight:600}

/* ==========================================================================
   الموبايل
   ========================================================================== */
@media (max-width:860px){
  /* هيدر الصفحة */
  .page-head{margin:4px 0 14px!important;padding:16px!important;border-radius:20px!important;gap:12px!important;flex-wrap:wrap}
  .page-head .ph-ico{width:44px!important;height:44px!important;border-radius:14px!important}
  .page-head .ph-ico svg{width:21px;height:21px}
  .page-head h1{font-size:18px!important}
  .page-head p{font-size:12px!important;-webkit-line-clamp:2}
  .page-head .actions{order:3;width:100%;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:8px;overflow:visible!important}
  .page-head .actions .btn{width:100%;justify-content:center;height:44px!important;padding:0 10px!important;font-size:13.5px}
  .page-head .actions .btn.primary{order:-1}
  .page-head .actions .muted,.page-head .actions .kbd{display:none}
  /* التبويبات */
  .tabs{width:100%!important;display:grid!important;grid-auto-flow:column;grid-auto-columns:1fr;padding:4px!important;border-radius:14px!important;margin-bottom:14px!important}
  .tabs a{justify-content:center;padding:10px 8px!important}
  /* الكروت */
  .grid.g4,.sec-kpis{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .kpi{padding:14px 13px 12px!important;border-radius:18px!important}
  .kpi .k-label{font-size:12px!important;gap:8px!important}
  .kpi .k-ico{width:34px!important;height:34px!important;border-radius:11px!important}
  .kpi .k-ico svg.i{width:17px;height:17px}
  .kpi .k-val{font-size:20px!important;margin-top:8px!important}
  .kpi .k-foot{font-size:11px!important;padding-top:6px}
  /* شريط البحث والفلاتر فوق الجدول */
  .toolbar{display:grid!important;grid-template-columns:1fr auto;gap:10px!important;padding:12px!important}
  .toolbar .search{grid-column:1;order:0!important;min-width:0}
  .toolbar .search input{width:100%!important;height:44px}
  .toolbar .tb-btns{grid-column:2;order:0!important}
  .toolbar .grow{display:none}
  .toolbar .tb-extra,.toolbar .filters{grid-column:1 / -1;order:1!important;display:flex!important;flex-wrap:wrap!important;gap:8px!important;overflow:visible!important;width:auto!important}
  .toolbar .filters .inp,.toolbar .tb-extra .inp{flex:1 1 calc(50% - 4px)!important;min-width:0!important;height:44px}
  .toolbar .date-chip{flex:1 1 100%;width:100%;height:44px;justify-content:space-between}
  .toolbar .date-chip input{flex:1;width:auto!important;min-width:0!important}
  /* الجدول بيتحول لكروت */
  .mcards{padding:10px;display:flex;flex-direction:column;gap:10px;background:var(--surface-2)}
  .mcard{background:#fff;padding:14px!important}
  .mcard-top .t1{font-weight:600;font-size:14.5px}
  .mcard-top .t2{font-weight:700;font-size:15px;color:var(--text)}
  .mcard-grid{gap:8px 12px!important}
  .mcard-grid label{font-size:11px;color:var(--text-3)}
  .content{padding-top:8px}
}
/* لوحة التحكم: نفس بانر الصفحات */
.dash-head{padding:20px 24px;border-radius:22px;background:linear-gradient(135deg,#2a211b,#1a1512);color:#fff;box-shadow:0 18px 40px -26px rgba(0,0,0,.8);position:relative;overflow:hidden;margin:6px 0 16px}
.dash-head::before{content:'';position:absolute;inset:auto -60px -120px auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(240,162,89,.22),transparent 65%);pointer-events:none}
.dash-head > *{position:relative}
.dash-head h1{color:#fff}
.dash-head p{color:#b9ada1}
.dash-head .btn{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);color:#fff;height:44px;border-radius:13px}
@media (max-width:860px){.dash-head{padding:16px;border-radius:20px;margin:4px 0 12px}}
/* الطباعة: من غير خلفيات غامقة */
@media print{
  .page-head,.dash-head{background:none!important;color:#000!important;box-shadow:none!important;padding:0!important;margin:0 0 12px!important}
  .page-head h1,.page-head p{color:#000!important}
  .page-head::before,.dash-head::before{display:none!important}
  table.t thead th{background:#eee!important;color:#000!important}
}