/* خط Tajawal من داخل حزمة النظام (يشتغل على الكمبيوتر والجوال والآيباد والتطبيق المثبّت حتى لو خطوط Google ما فتحت) */
@font-face{font-family:Tajawal;font-style:normal;font-weight:400;font-display:swap;src:local("Tajawal"),local("Tajawal-Regular"),url(fonts/Tajawal-Regular.ttf) format("truetype")}
@font-face{font-family:Tajawal;font-style:normal;font-weight:500;font-display:swap;src:local("Tajawal Medium"),local("Tajawal-Medium"),url(fonts/Tajawal-Medium.ttf) format("truetype")}
@font-face{font-family:Tajawal;font-style:normal;font-weight:700;font-display:swap;src:local("Tajawal Bold"),local("Tajawal-Bold"),url(fonts/Tajawal-Bold.ttf) format("truetype")}
@font-face{font-family:Tajawal;font-style:normal;font-weight:800;font-display:swap;src:local("Tajawal ExtraBold"),local("Tajawal-ExtraBold"),url(fonts/Tajawal-ExtraBold.ttf) format("truetype")}
@font-face{font-family:Tajawal;font-style:normal;font-weight:900;font-display:swap;src:local("Tajawal Black"),local("Tajawal-Black"),url(fonts/Tajawal-Black.ttf) format("truetype")}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* القائمة الجانبية يمين + الشرح أعلى الصفحة + لوحة المتابعة */
.n-side{display:flex;flex-direction:column;gap:3px;background:#fff;border-left:1px solid var(--line);padding:12px 10px}
.n-side a{position:relative;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:var(--navy);font-weight:700;font-size:15px;text-decoration:none;line-height:1.3}
.n-side a i{font-size:21px;color:var(--blue);flex:none}
.n-side a:hover{background:#f3f7fd}
.n-side a.on{background:var(--acc-bg);color:var(--blue);box-shadow:inset -3px 0 0 var(--blue)}
.n-side .n-badge{position:static;margin-inline-start:auto;transform:none}
.n-side-h{font-size:12px;color:var(--muted);padding:8px 12px 2px}
.n-menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:8px;padding:5px 9px;font:inherit;cursor:pointer}
.n-menu-btn i{font-size:20px;vertical-align:middle}
@media (min-width:1000px){
  body.n-body.n-has-side{padding-right:250px}
  body.n-has-side .n-side{position:fixed;top:0;right:0;bottom:0;width:250px;overflow-y:auto;z-index:30}
  body.n-has-side .n-main{max-width:1250px}
}
@media (max-width:999px){
  .n-menu-btn{display:inline-block}
  body.n-has-side .n-side{position:fixed;top:0;right:0;bottom:0;width:270px;max-width:85vw;overflow-y:auto;z-index:60;transform:translateX(110%);transition:transform .2s;box-shadow:-8px 0 30px rgba(0,0,0,.2)}
  body.n-menu-open .n-side{transform:none}
  body.n-menu-open::after{content:"";position:fixed;inset:0;background:rgba(7,31,64,.45);z-index:50}
}
.n-help{display:flex;gap:10px;align-items:flex-start;background:#f4f8ff;border:1px solid #d6e4fb;border-radius:12px;padding:10px 14px;margin:12px 0 4px;font-size:14px;line-height:1.7;color:var(--ink)}
.n-help>i{font-size:22px;color:var(--blue);flex:none;margin-top:2px}
.n-help .nx{color:var(--blue);margin-top:2px}
/* لوحة المتابعة */
.n-dk-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:10px 0}
.n-dk{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;text-decoration:none;color:var(--ink);box-shadow:0 1px 3px rgba(10,42,85,.05)}
.n-dk:hover{border-color:var(--sky)}
.n-dk-i{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;flex:none}
.n-dk-i i{font-size:21px}
.n-dk b{display:block;font-size:20px;color:var(--navy);line-height:1.2}
.n-dk small{color:var(--muted);font-size:12.5px}
.n-dash{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.n-dash .n-card{margin:0}
.n-donut-w{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.n-donut{width:190px;height:190px;flex:none}
.n-donut-n{font-size:8px;font-weight:800;fill:var(--navy)}
.n-donut-l{font-size:3.4px;fill:var(--muted)}
.n-legend{list-style:none;margin:0;padding:0;flex:1;min-width:180px}
.n-legend a{display:flex;align-items:center;gap:8px;padding:5px 2px;color:var(--ink);text-decoration:none;border-bottom:1px dashed var(--line)}
.n-legend i{width:12px;height:12px;border-radius:50%;flex:none}
.n-legend b{margin-inline-start:auto;color:var(--navy)}
.n-alist{list-style:none;margin:8px 0 0;padding:0}
.n-alist li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;border-bottom:1px solid var(--line)}
.n-alist a{display:flex;flex-direction:column;color:var(--ink);text-decoration:none;min-width:0}
.n-alist a span{color:var(--muted);font-size:13px;overflow-wrap:anywhere}
.n-bars{display:flex;align-items:flex-end;gap:10px;height:170px;padding-top:10px}
.n-bars .n-bar{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end;padding:0;margin:0;background:none;border:0;gap:0}
.n-bars .n-bar span{width:100%;max-width:46px;background:linear-gradient(180deg,#3b82f6,#1d4ed8);border-radius:8px 8px 0 0;min-height:4px;position:relative}
.n-bars .n-bar span b{position:absolute;top:-20px;left:0;right:0;text-align:center;font-size:12px;color:var(--navy)}
.n-bars .n-bar small{color:var(--muted);font-size:12px;margin-top:4px}
.n-perms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 12px;margin:6px 0}
/* تارقت المندوبين: بطاقة كحلية بألوان الإنجاز (مختلفة عن ألوان مراحل العملاء) */
.n-dash .nx-tg{background:linear-gradient(135deg,#0b1f44,#16336b);border-color:#0b1f44;color:#fff;grid-column:1/-1}
.nx-tg .n-h3{color:#fff;margin:0}
.nx-tg .nb-btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#fff}
.nx-tg-rings{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-top:8px}
.nx-tg-ring{display:flex;align-items:center;gap:12px;flex:1;min-width:230px}
.nx-tg-ring svg{width:130px;height:130px;flex:none}
.nx-tg-ring .t-n{font-size:8.5px;font-weight:800;fill:#fff}
.nx-tg-ring .t-l{font-size:3.6px;fill:#c7d4ee}
.nx-tg-ring b{display:block;font-size:17px}
.nx-tg-ring small{display:block;color:#c7d4ee;font-size:13px;line-height:1.6}
.nx-tg-reps{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px 18px}
.nx-tg-reps li{font-size:13.5px}
.nx-tg-reps .r{display:flex;justify-content:space-between;gap:8px}
.nx-tg-reps .bar{height:8px;border-radius:6px;background:rgba(255,255,255,.15);overflow:hidden;margin-top:4px}
.nx-tg-reps .bar i{display:block;height:100%;border-radius:6px}
.nx-tg-key{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font-size:12px;color:#c7d4ee}
.nx-tg-key span::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--c);margin-inline-end:5px;vertical-align:-1px}
.nx-tg .n-muted{color:#c7d4ee}
@media (max-width:1200px){.n-dk-row{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:800px){.n-dash{grid-template-columns:1fr}.n-perms{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.n-dk-row{grid-template-columns:1fr 1fr}.n-perms{grid-template-columns:1fr}.n-donut{width:150px;height:150px}}


/* بطاقة تارقت مستقلة: لا تستخدم ألوان مراحل العملاء. */
.n-target-card{border:1px solid #dbe5f2;background:linear-gradient(135deg,#f8fbff,#eef5ff);overflow:hidden}
.n-target-card>.n-row{gap:12px}.n-target-card .n-h3{color:#102a56}
.n-target-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin-top:14px}
.n-target-tile{display:flex;align-items:center;gap:14px;min-height:142px;padding:14px;border:1px solid #d7e3f2;border-radius:16px;background:#fff;color:#132747;text-decoration:none;box-shadow:0 3px 10px rgba(22,51,107,.06);transition:transform .15s,border-color .15s}
.n-target-tile:hover{transform:translateY(-2px);border-color:#7799c8}
.n-target-ring{--target-pct:0%;--target-color:#64748b;position:relative;display:grid;place-items:center;width:112px;height:112px;flex:0 0 112px;border-radius:50%;background:conic-gradient(var(--target-color) var(--target-pct),#e8eef6 0)}
.n-target-ring::before{content:"";position:absolute;inset:10px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px #edf1f6}
.n-target-ring span{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;line-height:1.15}.n-target-ring b{font-size:21px;color:#132747}.n-target-ring small{margin-top:3px;color:#64748b;font-size:11px;font-weight:700}
.n-target-ring.is-zero{--target-color:#64748b}.n-target-ring.is-low{--target-color:#e85d75}.n-target-ring.is-progress{--target-color:#ec9a29}.n-target-ring.is-hit{--target-color:#19a87a}.n-target-ring.is-over{--target-color:#8066df}
.n-target-copy{display:flex;min-width:0;flex:1;flex-direction:column;gap:4px}.n-target-copy>b{font-size:15px;color:#17325d}.n-target-copy>span{font-size:14px;font-weight:800;color:#0f766e}.n-target-copy>small{color:#64748b;line-height:1.45;overflow-wrap:anywhere}
.n-target-zero .n-target-copy>span{color:#64748b}
@media(max-width:560px){.n-target-card{padding:13px}.n-target-grid{grid-template-columns:1fr;gap:10px}.n-target-tile{min-height:128px;padding:12px;gap:12px}.n-target-ring{width:96px;height:96px;flex-basis:96px}.n-target-ring::before{inset:8px}.n-target-ring b{font-size:18px}.n-target-copy>b{font-size:14px}.n-target-copy>small{font-size:12px}}
