/* ===========================================================================
   الشريط الجانبي — ستايل موحّد لكل الصفحات (assets/sidebar.js بيبنيه)
   كل القواعد تحت #appSidebar عشان تغلب ستايل الصفحات القديم و theme-queue
   من غير ما نمسح منهم سطر.
   ملحوظة مهمة: مفيش display على .sidebar-link هنا عن قصد — الروابط مخفية
   افتراضيًا (app.css) والصفحة بتظهرها بعد فحص الصلاحيات بـ style.display.
   =========================================================================== */

body.has-sb{ --sb-w:264px; }
body.has-sb.sb-railed{ --sb-w:72px; }

/* الصفحة: الشريط ثابت على اليمين والمحتوى ياخد الباقي */
.wrap.sb-wrap{ max-width:none !important; padding-right:calc(var(--sb-w) + 32px) !important; padding-left:32px !important;
  transition:padding-right .2s ease; }
.wrap.sb-wrap > .app-shell{ display:block; }
.wrap.sb-wrap .main-content{ max-width:1320px; margin-inline:auto; }

#appSidebar.sb{
  position:fixed; top:0; right:0; bottom:0; width:var(--sb-w); max-height:none; height:100vh;
  display:flex; flex-direction:column; gap:0; padding:0; margin:0; z-index:900;
  background:var(--surface, #fff); border:none; border-left:1px solid var(--border, #e5e7eb); border-radius:0;
  box-shadow:none; overflow:hidden; transition:width .2s ease; font-family:inherit;
}
#appSidebar.sb svg{ flex-shrink:0; }
#appSidebar.sb button, #appSidebar.sb input{ font-family:inherit; }

/* ---- الراس ---- */
#appSidebar .sb-head{ display:flex; align-items:center; gap:8px; padding:18px 16px 14px; border-bottom:1px solid var(--border); }
#appSidebar .sb-brand{ display:flex; align-items:center; gap:10px; flex:1; min-width:0; text-decoration:none; color:var(--text); }
#appSidebar .sb-logo{ width:34px; height:34px; border-radius:10px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  background:var(--green-deep); color:#fff; font-weight:800; font-size:16px; letter-spacing:0; }
#appSidebar .sb-brand-txt{ display:flex; flex-direction:column; min-width:0; line-height:1.3; }
#appSidebar .sb-brand-txt b{ font-size:15px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#appSidebar .sb-brand-txt small{ font-size:11.5px; color:var(--text-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#appSidebar .sb-rail-btn{ width:30px; height:30px; border-radius:8px; border:1px solid transparent; background:none; color:var(--text-dim);
  display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; }
#appSidebar .sb-rail-btn:hover{ background:var(--surface-2); color:var(--text); }
#appSidebar .sb-rail-btn svg{ width:17px; height:17px; }

/* ---- البحث والفلترة ---- */
#appSidebar .sb-tools{ padding:12px 12px 6px; display:flex; flex-direction:column; gap:8px; }
#appSidebar .sb-quick{ display:flex; align-items:center; gap:9px; width:100%; height:38px; padding:0 10px 0 8px;
  border:1px solid var(--border); border-radius:10px; background:var(--surface-2); color:var(--text);
  font-size:13.5px; font-weight:600; cursor:pointer; transition:border-color .15s, box-shadow .15s; }
#appSidebar .sb-quick:hover{ border-color:var(--green-deep); box-shadow:0 0 0 3px rgba(47,111,94,0.10); }
#appSidebar .sb-quick svg{ width:16px; height:16px; color:var(--text-dim); }
#appSidebar .sb-quick span.sb-label{ flex:1; text-align:right; }
#appSidebar kbd, .sb-pal kbd{ font-family:inherit; font-size:10.5px; font-weight:700; color:var(--text-dim); background:var(--surface);
  border:1px solid var(--border); border-bottom-width:2px; border-radius:6px; padding:1px 6px; direction:ltr; }
#appSidebar .sb-filter-row{ display:flex; gap:6px; }
#appSidebar .sb-filter{ flex:1; display:flex; align-items:center; gap:7px; height:34px; padding:0 9px; margin:0;
  border:1px solid transparent; border-radius:9px; background:var(--surface-2); cursor:text; }
#appSidebar .sb-filter:focus-within{ border-color:var(--green-deep); background:var(--surface); }
#appSidebar .sb-filter svg{ width:14px; height:14px; color:var(--text-dim); }
#appSidebar .sb-filter input{ flex:1; min-width:0; border:none; outline:none; background:none; padding:0; margin:0;
  font-size:12.5px; color:var(--text); box-shadow:none; height:auto; min-height:0; border-radius:0; }
#appSidebar .sb-sq{ width:34px; height:34px; border-radius:9px; border:1px solid var(--border); background:var(--surface);
  color:var(--text-dim); display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; }
#appSidebar .sb-sq:hover{ color:var(--green-deep); border-color:var(--green-deep); }
#appSidebar .sb-sq svg{ width:15px; height:15px; }

/* ---- الروابط ---- */
#appSidebar .sb-nav{ flex:1; overflow-y:auto; overflow-x:hidden; padding:6px 10px 14px; scrollbar-width:thin; }
#appSidebar .sb-group{ margin-top:6px; }
#appSidebar .sb-group[hidden], #appSidebar .sb-group.sb-miss{ display:none !important; }
#appSidebar .sb-group-head{ display:flex; align-items:center; justify-content:space-between; width:100%; padding:8px 8px 6px;
  border:none; background:none; cursor:pointer; color:var(--text-dim); font-size:12px; font-weight:700; }
#appSidebar .sb-group-head:hover{ color:var(--text); }
#appSidebar .sb-chev{ width:14px; height:14px; transition:transform .18s; }
#appSidebar .sb-group.closed .sb-chev{ transform:rotate(90deg); }
#appSidebar .sb-group.closed .sb-group-body{ display:none; }
#appSidebar.sb-filtering .sb-group.closed .sb-group-body{ display:block; }   /* الفلترة بتفتح كل حاجة */
#appSidebar.sb-filtering .sb-group.closed .sb-chev{ transform:none; }

#appSidebar .sidebar-link{ align-items:center; gap:11px; padding:9px 10px; margin:1px 0; border-radius:9px;
  border:none; border-right:3px solid transparent; font-size:14px; font-weight:600; color:var(--text);
  text-decoration:none; background:none; transition:background .12s, color .12s; white-space:nowrap; }
#appSidebar .sidebar-link .sb-ic{ width:18px; height:18px; color:var(--text-dim); transition:color .12s; }
#appSidebar .sidebar-link:hover{ background:var(--surface-2); color:var(--text); }
#appSidebar .sidebar-link:hover .sb-ic{ color:var(--text); }
#appSidebar .sidebar-link.active{ background:var(--q-good-soft, rgba(47,111,94,0.1)); color:var(--green-deep); font-weight:700;
  border-right-color:var(--green-deep); }
#appSidebar .sidebar-link.active .sb-ic{ color:var(--green-deep); }
#appSidebar .sidebar-link.sb-miss{ display:none !important; }
#appSidebar .sb-empty{ font-size:12.5px; color:var(--text-dim); text-align:center; padding:18px 8px; }

/* ---- الفوتر ---- */
#appSidebar .sb-foot{ border-top:1px solid var(--border); padding:12px; display:flex; flex-direction:column; gap:8px; margin:0; }
#appSidebar .sb-user{ display:flex; align-items:center; gap:10px; padding:4px 4px; min-width:0; }
#appSidebar .sb-avatar{ width:34px; height:34px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  background:var(--q-good-soft, #E3EFEA); color:var(--green-deep); font-weight:800; font-size:14px; }
#appSidebar .sb-user-txt{ display:flex; flex-direction:column; line-height:1.3; min-width:0; }
#appSidebar .sb-user-txt b{ font-size:13.5px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#appSidebar .sb-user-txt small{ font-size:11.5px; color:var(--text-dim); }
#appSidebar .sb-logout{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; height:38px; margin:0;
  border:1px solid var(--border); border-radius:10px; background:var(--surface-2); color:var(--text); text-decoration:none;
  font-size:13.5px; font-weight:600; cursor:pointer; padding:0 10px; transition:all .12s; }
#appSidebar .sb-logout svg{ width:16px; height:16px; }
#appSidebar .sb-logout:hover{ border-color:var(--danger); color:var(--danger); background:var(--surface); }

/* ---- الشريط المصغّر (أيقونات بس) ---- */
body.sb-railed #appSidebar .sb-label,
body.sb-railed #appSidebar .sb-brand-txt,
body.sb-railed #appSidebar .sb-filter-row,
body.sb-railed #appSidebar .sb-group-head{ display:none !important; }
body.sb-railed #appSidebar .sb-head{ flex-direction:column; padding:14px 8px 10px; }
body.sb-railed #appSidebar .sb-brand{ flex:none; }
body.sb-railed #appSidebar .sb-rail-btn svg{ transform:scaleX(-1); }
body.sb-railed #appSidebar .sb-tools{ padding:10px 12px 4px; }
body.sb-railed #appSidebar .sb-quick{ justify-content:center; padding:0; }
body.sb-railed #appSidebar .sb-nav{ padding:4px 12px; }
body.sb-railed #appSidebar .sb-group{ margin-top:4px; padding-top:4px; border-top:1px solid var(--border); }
body.sb-railed #appSidebar .sb-group:first-child{ border-top:none; }
body.sb-railed #appSidebar .sb-group.closed .sb-group-body{ display:block; }
body.sb-railed #appSidebar .sidebar-link{ justify-content:center; padding:10px 0; border-right-width:0; }
body.sb-railed #appSidebar .sb-foot{ padding:10px 12px; }
body.sb-railed #appSidebar .sb-user{ justify-content:center; padding:0; }
body.sb-railed #appSidebar .sb-logout{ padding:0; }

/* ---- الموبايل: درج بيطلع من اليمين (نفس منطق الصفحات القديم: .open) ---- */
#mobileMenuBtn svg{ width:20px; height:20px; }
@media (max-width:900px){
  body.has-sb, body.has-sb.sb-railed{ --sb-w:0px; }
  .wrap.sb-wrap{ padding-right:16px !important; padding-left:16px !important; }
  #appSidebar.sb{ width:290px; max-width:84vw; transform:translateX(100%); transition:transform .25s ease;
    box-shadow:-8px 0 30px rgba(0,0,0,0.18); z-index:1000; }
  #appSidebar.sb.open{ transform:translateX(0); }
  body:has(#appSidebar.open) #mobileMenuBtn{ opacity:0; pointer-events:none; }
  #appSidebar .sb-rail-btn{ display:none; }
  body.sb-railed #appSidebar .sb-label, body.sb-railed #appSidebar .sb-brand-txt,
  body.sb-railed #appSidebar .sb-filter-row, body.sb-railed #appSidebar .sb-group-head{ display:revert !important; }
  body.sb-railed #appSidebar .sidebar-link{ justify-content:flex-start; padding:9px 10px; }
}

/* ---- البحث السريع ---- */
.sb-pal-back{ position:fixed; inset:0; z-index:2000; background:rgba(15,23,20,0.35); backdrop-filter:blur(2px);
  display:flex; align-items:flex-start; justify-content:center; padding:12vh 16px 16px; }
.sb-pal-back[hidden]{ display:none; }
.sb-pal{ width:100%; max-width:540px; background:var(--surface, #fff); border:1px solid var(--border); border-radius:14px;
  box-shadow:0 24px 60px rgba(0,0,0,0.22); overflow:hidden; direction:rtl; font-family:inherit; }
.sb-pal-in{ display:flex; align-items:center; gap:10px; padding:0 16px; height:54px; border-bottom:1px solid var(--border); margin:0; }
.sb-pal-in svg{ width:18px; height:18px; color:var(--text-dim); flex-shrink:0; }
#sbPalInput{ flex:1; border:none; outline:none; background:none; font-size:15px; color:var(--text); padding:0; margin:0;
  font-family:inherit; box-shadow:none; height:auto; min-height:0; border-radius:0; }
.sb-pal-list{ max-height:50vh; overflow-y:auto; padding:6px; }
.sb-pal-grp{ font-size:11.5px; font-weight:700; color:var(--text-dim); padding:10px 10px 4px; }
.sb-pal .sb-pal-item{ display:flex; align-items:center; gap:11px; width:100%; padding:10px; border:none; border-radius:9px;
  background:none; color:var(--text); font-family:inherit; font-size:14px; font-weight:600; cursor:pointer; text-align:right; }
.sb-pal .sb-pal-item svg{ width:17px; height:17px; color:var(--text-dim); }
.sb-pal .sb-pal-item span{ flex:1; }
.sb-pal .sb-pal-item .sb-pal-enter{ opacity:0; width:15px; height:15px; }
.sb-pal .sb-pal-item.on{ background:var(--q-good-soft, #E3EFEA); color:var(--green-deep); }
.sb-pal .sb-pal-item.on svg{ color:var(--green-deep); }
.sb-pal .sb-pal-item.on .sb-pal-enter{ opacity:1; }
.sb-pal-none{ padding:26px; text-align:center; color:var(--text-dim); font-size:13px; }