/* NILE ERP — Premium Enterprise Mega Menu
   طبقة UI معزولة داخل #navLauncherBackdrop؛ لا تغيّر الروابط أو الصلاحيات. */

.nav-launcher-backdrop{
  --mm-accent:#247a45;--mm-accent-rgb:36,122,69;
  display:none;position:fixed;inset:0;z-index:12600;
  align-items:flex-start;justify-content:center;
  padding:clamp(18px,4vh,42px) clamp(12px,2.5vw,36px);
  background:transparent;  /* من غير تعتيم ورا القائمة - القائمة نفسها ليها خلفية كاملة */
  overscroll-behavior:contain;
}
.nav-launcher-backdrop.launcher-open{display:flex}
.nav-launcher-panel{
  --mm-accent:#247a45;--mm-accent-rgb:36,122,69;
  width:min(600px,100%);max-height:calc(100dvh - clamp(36px,8vh,84px));
  display:flex;flex-direction:column;overflow:hidden;direction:rtl;color:var(--text,#17231c);
  background:var(--surface,#fff);
  background:color-mix(in srgb,var(--surface,#fff) 97%,var(--mm-accent) 3%);
  border:1px solid var(--border,#d9e2dc);
  border-color:color-mix(in srgb,var(--mm-accent) 22%,var(--border,#d9e2dc));
  border-radius:clamp(16px,1.7vw,22px);
  box-shadow:0 28px 70px -28px rgba(4,25,14,.55),0 10px 28px -16px rgba(4,25,14,.32);
  animation:navLauncherIn .2s cubic-bezier(.2,.8,.2,1);
}
.nav-launcher-lock{overflow:hidden!important}
.nav-launcher-panel[data-accent="shift"]{--mm-accent:#297c58;--mm-accent-rgb:41,124,88}
.nav-launcher-panel[data-accent="finance"]{--mm-accent:#1f6d52;--mm-accent-rgb:31,109,82}
.nav-launcher-panel[data-accent="people"]{--mm-accent:#376f67;--mm-accent-rgb:55,111,103}
.nav-launcher-panel[data-accent="reports"]{--mm-accent:#356c72;--mm-accent-rgb:53,108,114}
.nav-launcher-panel[data-accent="settings"]{--mm-accent:#485f58;--mm-accent-rgb:72,95,88}
.nav-launcher-panel[data-accent="custom"]{--mm-accent:#4b7160;--mm-accent-rgb:75,113,96}
@keyframes navLauncherIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}

.nav-launcher-panel-header{
  min-height:50px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px clamp(10px,1.4vw,14px);
  background:linear-gradient(180deg,rgba(var(--mm-accent-rgb),.075),rgba(var(--mm-accent-rgb),.025));
  border-bottom:1px solid rgba(var(--mm-accent-rgb),.15);
}
.nav-launcher-heading{display:flex;align-items:center;gap:11px;min-width:0}
.nav-launcher-section-icon{
  width:30px;height:30px;flex:0 0 30px;display:grid;place-items:center;border-radius:9px;
  color:var(--mm-accent);background:rgba(var(--mm-accent-rgb),.11);
  border:1px solid rgba(var(--mm-accent-rgb),.15);font-size:15px;
}
.nav-launcher-heading-copy{display:flex;flex-direction:column;gap:1px;min-width:0}
.nav-launcher-panel-title{color:var(--text,#17231c);font-size:clamp(13px,1vw,15px);font-weight:900;line-height:1.35}
.nav-launcher-panel-description{color:var(--text-faint,#6f7f76);font-size:clamp(10px,.85vw,11.5px);font-weight:650;line-height:1.4}
.nav-launcher-close{
  width:35px;height:35px;flex:0 0 35px;display:grid;place-items:center;cursor:pointer;font-size:14px;
  border:1px solid var(--border-soft,rgba(15,23,42,.11));border-radius:10px;
  background:var(--surface,#fff);color:var(--text-dim,#526158);
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.nav-launcher-close:hover{background:#fff5f4;border-color:#edc9c4;color:#a9362b;transform:translateY(-1px)}
.nav-launcher-close:focus-visible{outline:3px solid rgba(var(--mm-accent-rgb),.24);outline-offset:2px}
.nav-launcher-panel-body{
  min-height:0;padding:10px;overflow:auto;
  scrollbar-width:thin;scrollbar-color:rgba(var(--mm-accent-rgb),.28) transparent;
}

.nav-launcher-backdrop .nav-hover-menu.mm-grid.menu-open{
  position:static!important;inset:auto!important;width:100%!important;min-width:0!important;max-width:none!important;
  max-height:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;background:transparent!important;animation:none!important;overflow:visible!important;
}
.nav-launcher-backdrop .nav-hover-menu.mm-grid:not(.mega-menu).menu-open{
  display:grid!important;grid-auto-flow:row;gap:6px!important;align-content:start;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

/* التوزيع اتوحّد على 4 أعمدة ثابتة لكل الأقسام - أبسط وأمنع للفراغات من
   قواعد التوزيع القديمة اللي كانت بتمدّد بلاطات وتسيب خانات فاضية. */

/* الأقسام الفرعية كانت كروت منفصلة جنب بعض، وكل كارت بيحجز ارتفاع عموده كامل -
   فالقسم اللي فيه 3 أيقونات كان بيسيب فراغ أبيض كبير تحته جنب القسم اللي فيه 8.
   display:contents بتذوّب الكارت نفسه فتنزل كل الأيقونات فى شبكة واحدة متصلة،
   والعنوان بياخد سطر كامل - يعني ترصيص متساوي من غير أي فراغات. */
.nav-launcher-backdrop .nav-hover-menu.mega-menu.mm-grid.menu-open{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:6px!important;align-content:start!important;
}
.nav-launcher-backdrop .mega-menu__group,
.nav-launcher-backdrop .mega-menu__group--wide{
  display:contents!important;padding:0!important;border:0!important;background:none!important;
}
.nav-launcher-backdrop .dropdown-header-title{
  grid-column:1/-1!important;display:flex!important;align-items:center!important;gap:7px!important;min-height:18px;
  margin:4px 1px 0!important;padding:0 1px 3px!important;border:0!important;
  border-bottom:1px solid rgba(var(--mm-accent-rgb),.13)!important;
  color:var(--text-dim,#46564d)!important;font-size:11px!important;font-weight:850!important;white-space:normal!important;
}
.nav-launcher-backdrop .nav-hover-menu:not(.mega-menu)>.dropdown-header-title{display:none!important}
.nav-launcher-backdrop .dropdown-header-title i{color:var(--mm-accent)!important;font-size:13px!important}
.nav-launcher-backdrop .hover-item{
  min-width:0!important;min-height:56px!important;margin:0!important;padding:6px 4px!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;
  text-align:center!important;white-space:normal!important;overflow-wrap:anywhere;
  color:var(--text-dim,#46564d)!important;background:var(--surface,#fff)!important;
  border:1px solid var(--border-soft,rgba(15,23,42,.09))!important;border-radius:11px!important;
  box-shadow:0 1px 2px rgba(14,35,23,.025)!important;
  font-size:0.6875rem!important;font-weight:760!important;line-height:1.2!important;text-decoration:none!important;
  transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease!important;
}
.nav-launcher-backdrop .hover-item .item-icon{
  width:26px!important;height:26px!important;flex:0 0 26px;display:grid!important;place-items:center!important;margin:0!important;
  border-radius:8px!important;background:rgba(var(--mm-accent-rgb),.085)!important;color:var(--mm-accent)!important;
  font-size:12.5px!important;transition:transform .18s ease,background .18s ease!important;
}
.nav-launcher-backdrop .hover-item:hover{
  color:color-mix(in srgb,var(--mm-accent) 88%,#13231a)!important;background:rgba(var(--mm-accent-rgb),.07)!important;
  border-color:rgba(var(--mm-accent-rgb),.26)!important;box-shadow:0 7px 18px -13px rgba(6,44,23,.48)!important;
  transform:translateY(-2px)!important;
}
.nav-launcher-backdrop .hover-item:hover .item-icon{background:rgba(var(--mm-accent-rgb),.14)!important;transform:translateY(-1px)}
.nav-launcher-backdrop .hover-item.active,.nav-launcher-backdrop .hover-item[aria-current="page"]{
  color:var(--mm-accent)!important;background:rgba(var(--mm-accent-rgb),.095)!important;
  border-color:rgba(var(--mm-accent-rgb),.34)!important;box-shadow:inset 0 -2px 0 rgba(var(--mm-accent-rgb),.55)!important;
}
.nav-launcher-backdrop .hover-item:focus-visible{
  outline:3px solid rgba(var(--mm-accent-rgb),.23)!important;outline-offset:2px!important;
  border-color:rgba(var(--mm-accent-rgb),.45)!important;
}
.nav-launcher-backdrop .hover-item-divider{display:none!important}

@media (max-width:900px){
  .nav-launcher-backdrop{padding:14px}
  .nav-launcher-panel{max-height:calc(100dvh - 28px)}
  .nav-launcher-backdrop .nav-hover-menu.mega-menu.mm-grid.menu-open{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .nav-launcher-backdrop .mega-menu__group--wide{grid-column:span 2}
}
@media (max-height:800px) and (min-width:701px){
  .nav-launcher-backdrop{padding-block:18px}
  .nav-launcher-panel{max-height:calc(100dvh - 36px)}
  .nav-launcher-panel-header{min-height:58px;padding-block:8px}
  .nav-launcher-section-icon{width:36px;height:36px;flex-basis:36px;font-size:17px}
  .nav-launcher-panel-body{padding:10px 12px}
  .nav-launcher-backdrop .mega-menu__group{padding:7px!important}
  .nav-launcher-backdrop .hover-item{min-height:62px!important;padding:7px 6px!important}
  .nav-launcher-backdrop .hover-item .item-icon{width:30px!important;height:30px!important;flex-basis:30px;font-size:14px!important}
}
@media (max-width:700px){
  .nav-launcher-backdrop{padding:8px;align-items:stretch}
  .nav-launcher-panel{max-height:calc(100dvh - 16px);border-radius:15px}
  .nav-launcher-panel-header{min-height:59px;padding:9px 11px}
  .nav-launcher-section-icon{width:36px;height:36px;flex-basis:36px;border-radius:10px;font-size:17px}
  .nav-launcher-panel-body{padding:9px}
  .nav-launcher-backdrop .nav-hover-menu.mega-menu.mm-grid.menu-open{grid-template-columns:1fr!important}
  .nav-launcher-backdrop .mega-menu__group--wide{grid-column:auto}
  .nav-launcher-backdrop [data-layout]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .nav-launcher-backdrop [data-layout]>.hover-item{grid-column:auto!important}
  .nav-launcher-backdrop [data-layout="single"]{grid-template-columns:minmax(0,1fr)!important}
  .nav-launcher-backdrop .hover-item{min-height:65px!important;font-size:0.6875rem!important}
}
@media (max-width:390px){
  .nav-launcher-panel-description{display:none}
  .nav-launcher-panel-body{padding:8px}
  .nav-launcher-backdrop .mega-menu__group{padding:7px!important}
  .nav-launcher-backdrop .hover-item{min-height:61px!important;padding:7px 5px!important}
}
@media (prefers-reduced-motion:reduce){
  .nav-launcher-panel{animation:none}
  .nav-launcher-backdrop .hover-item,.nav-launcher-backdrop .hover-item .item-icon,.nav-launcher-close{transition:none!important}
}
[data-theme="dark"] .nav-launcher-backdrop{background:rgba(2,10,7,.52)}
[data-theme="dark"] .nav-launcher-panel{background:color-mix(in srgb,var(--surface,#14221a) 96%,var(--mm-accent) 4%)}
[data-theme="dark"] .nav-launcher-backdrop .hover-item{background:rgba(255,255,255,.035)!important}

/* ------------------------------------------------------------------ */
/* نمط "Hub" المضغوط (V26): بلاطات مربعة بتوهج أخضر + بحث لحظي + مؤشر ESC.
   كل القواعد إضافية على نفس الماركأب - لا تغيير للروابط ولا شروط الصلاحيات
   ولا ماركأب القوائم (محروسة باختبارات test_mega_menu_static). */

/* اللوحة اتوسّعت شوية عشان الشبكة الكثيفة (5-6 أعمدة) متتداسش - لسه أضيق
   من عرض الشاشة بكتير فالإحساس "منبثقة مركّزة" مش صفحة جديدة. */
.nav-launcher-panel{width:min(780px,100%)}

/* الشبكة: auto-fill ببلاطة ~100px بيدّي 6 أعمدة على العرض الكامل ويتقلّص
   تلقائيًا للأقل - أمنع من الأعمدة الثابتة مع عدد بلاطات متغيّر بالصلاحيات. */
@media (min-width:901px){
  .nav-launcher-backdrop .nav-hover-menu.mega-menu.mm-grid.menu-open,
  .nav-launcher-backdrop .nav-hover-menu.mm-grid:not(.mega-menu).menu-open{
    grid-template-columns:repeat(auto-fill,minmax(100px,1fr))!important;gap:7px!important;
  }
  /* البلاطة المربعة 1:1 على الديسكتوب فقط - على الموبايل (عمود واحد) المربع
     بعرض الشاشة كله هيتحوّل لبلاطة عملاقة، فبنرجع للصف المضغوط. */
  .nav-launcher-backdrop .hover-item{aspect-ratio:1/1;min-height:0!important;padding:8px 6px!important}
}
/* أيقونة صغيرة دقيقة (24px بحد أقصى) بتوهج أخضر خفيف - التوهج بيوصّل
   إحساس الـglass بتاع التصميم المرجعي لكن بأخضر النيل (#2EA84E). */
.nav-launcher-backdrop .hover-item .item-icon{
  width:24px!important;height:24px!important;flex-basis:24px;font-size:13px!important;
  box-shadow:0 0 9px rgba(var(--mm-accent-rgb),.38),inset 0 0 6px rgba(var(--mm-accent-rgb),.14);
}
.nav-launcher-backdrop .hover-item:hover{
  border-color:rgba(var(--mm-accent-rgb),.55)!important;
  box-shadow:0 8px 20px -12px rgba(6,44,23,.5),0 0 12px rgba(var(--mm-accent-rgb),.28)!important;
}
/* إخفاء الفلترة - كلاس واحد للبلاطة وللعنوان الفرعي الفاضي. */
.nav-launcher-backdrop .hover-item.launcher-hidden,
.nav-launcher-backdrop .dropdown-header-title.launcher-hidden{display:none!important}

/* خانة البحث المضغوطة (ارتفاع ~30px) - بتاخد مكانها فى الهيدر جنب
   الإجراءات، والأيقونة جواها عشان المساحة. */
.nav-launcher-search{
  display:flex;align-items:center;gap:6px;height:30px;padding:0 9px;
  background:rgba(var(--mm-accent-rgb),.06);border:1px solid rgba(var(--mm-accent-rgb),.22);
  border-radius:9px;color:var(--text-faint,#6f7f76);
}
.nav-launcher-search i{font-size:12px}
.nav-launcher-search input{
  border:0;outline:0;background:transparent;height:100%;width:130px;
  font:inherit;font-size:12px;color:var(--text,#17231c);
}
.nav-launcher-search input::placeholder{color:var(--text-faint,#6f7f76)}
.nav-launcher-search:focus-within{
  border-color:rgba(var(--mm-accent-rgb),.5);
  box-shadow:0 0 0 3px rgba(var(--mm-accent-rgb),.14);
}
/* مؤشر ESC: تلميح كيبورد صغير جنب زرار القفل - جزء من نمط الـlauncher
   (زي kbd فى كوماند باليت)، وبيختفي على الشاشات الصغيرة عشان المساحة. */
.nav-launcher-esc{
  align-self:center;padding:2px 7px;border-radius:6px;font-size:11px;font-weight:700;
  font-family:inherit;color:var(--text-faint,#6f7f76);
  background:rgba(var(--mm-accent-rgb),.07);border:1px solid rgba(var(--mm-accent-rgb),.25);
  box-shadow:0 1.5px 0 rgba(var(--mm-accent-rgb),.25);
}
@media (max-width:700px){
  .nav-launcher-esc{display:none}
  .nav-launcher-search input{width:96px}
}
@media (max-width:390px){
  .nav-launcher-search{display:none}
}
[data-theme="dark"] .nav-launcher-search{background:rgba(255,255,255,.05)}
[data-theme="dark"] .nav-launcher-search input{color:#e7f1ea}
