/* ==========================================================================
   Salam BI v6 — واجهة القوائم الجديدة (مستوحاة من أسلوب لوحات الإدارة المؤسسية)
   - شريط وحدات علوي أفقي + قائمة جانبية بأقسام قابلة للطي + قائمة تقارير منبثقة (Mega menu)
   - لا ألوان ثابتة: كل الألوان من متغيرات الثيم الحالي (--panel, --bg, --line, --text,
     --muted, --palette-accent ...) فيعمل مع كل الثيمات بالوضعين النهاري والليلي.
   ========================================================================== */

:root {
  --v6-top-h: 56px;
  --v6-side-w: 264px;
  --v6-card: var(--card, var(--panel));
  --v6-top-bg: color-mix(in srgb, var(--panel) 88%, var(--palette-accent) 12%);
  --v6-strip: color-mix(in srgb, var(--bg) 70%, var(--line) 30%);
  --v6-hover: var(--palette-tint, rgba(37, 99, 235, .06));
  --v6-active: var(--palette-pill-bg, rgba(37, 99, 235, .12));
}

html, body { background: var(--bg); }
body { color: var(--text); margin: 0; }

/* ---- CSS أساسي للإطار لا يعتمد على Tailwind ----
   Tailwind (CDN) يولّد الكلاسات بعد أول رسم للصفحة؛ بدون هذه القواعد تظهر الصفحة لجزء من الثانية
   بدون تخطيط (النوافذ المخفية تظهر، والمحتوى يتحرك) فيبدو البرنامج وكأنه اختفى وظهر عند كل انتقال. */
.hidden { display: none; }
body:has(> .v6-body) { display: flex; flex-direction: column; }
.v6-top { position: sticky; top: 0; z-index: 40; }
.v6-body { flex: 1 1 auto; display: flex; overflow: hidden; min-height: 0; }
.v6-main { flex: 1 1 auto; overflow-y: auto; overflow-x: hidden; min-width: 0; }
.v6-page { padding: 16px; }
@media (min-width: 640px) { .v6-page { padding: 20px; } }
@media (min-width: 1024px) { .v6-page { padding: 24px; } }
.v6-page > * + * { margin-top: 1.5rem; }
#searchModal, #reportViewerModal { position: fixed; inset: 0; z-index: 50; }
#searchModal.hidden, #reportViewerModal.hidden, #colorThemeMenu.hidden { display: none !important; }
#toastContainer { position: fixed; bottom: 20px; left: 20px; z-index: 50; pointer-events: none; }
.v6-icon-btn > i:empty { display: inline-block; width: 18px; height: 18px; }

/* انتقال ناعم بين الصفحات (Edge/Chrome الحديث): تبقى الصفحة الحالية ظاهرة حتى تجهز التالية بدل الوميض الأبيض */
@view-transition { navigation: auto; }
/* بدون تلاشي: الصفحة الحالية تبقى كما هي حتى تجهز التالية ثم تُستبدل فوراً،
   فلا يختفي كارت النتائج أو أي جزء ثابت ويعود أثناء الانتقال */
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
::view-transition-old(root) { display: none; }

/* ---------------- الشريط العلوي ---------------- */
.v6-top {
  --topbar-h: var(--v6-top-h);
  background: var(--v6-top-bg);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--line) 60%, transparent);
}
.v6-top-row {
  height: var(--v6-top-h);
  display: flex;
  align-items: stretch;
  gap: 14px;
  padding: 0 14px;
}
.v6-brand {
  display: flex; align-items: center; gap: 10px;
  padding-inline-end: 14px;
  border-inline-end: 1px solid var(--line);
  color: var(--text); text-decoration: none; flex-shrink: 0;
}
.v6-brand-mark {
  width: 32px; height: 32px; border-radius: 9px;
  display: grid; place-items: center;
  background: var(--theme-gradient, var(--palette-accent-grad, var(--palette-accent)));
  color: var(--on-primary, #fff); font-weight: 900; font-size: 17px;
}
.v6-brand-text { display: flex; flex-direction: column; line-height: 1.15; }
.v6-brand-name { font-weight: 800; font-size: 15px; letter-spacing: .2px; }
.v6-brand-sub { font-size: 10.5px; color: var(--muted); }

.v6-modules {
  display: flex; align-items: stretch; gap: 2px;
  flex: 1 1 auto; min-width: 0;
  overflow-x: auto; scrollbar-width: none;
}
.v6-modules::-webkit-scrollbar { display: none; }
.v6-mod {
  position: relative;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0 16px;
  font-size: 14px; font-weight: 600;
  color: var(--muted);
  white-space: nowrap;
  background: none; border: 0; cursor: pointer;
  text-decoration: none;
  transition: color .15s ease, background-color .15s ease;
}
.v6-mod:hover { color: var(--text); background: var(--v6-hover); }
.v6-mod.is-active {
  color: var(--text);
  background: var(--v6-active);
}
.v6-mod.is-active::after {
  content: ""; position: absolute; inset: auto 0 0 0; height: 3px;
  background: var(--palette-accent);
  border-radius: 3px 3px 0 0;
}
.v6-mod-menu[aria-expanded="true"] { color: var(--text); background: var(--v6-hover); }
.v6-badge {
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  background: #10B981; color: #fff; font-size: 10px; font-weight: 800;
  display: inline-grid; place-items: center;
}

.v6-tools { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.v6-icon-btn {
  width: 34px; height: 34px; border-radius: 8px;
  display: inline-grid; place-items: center;
  color: var(--muted); background: none; border: 0; cursor: pointer;
  transition: color .15s ease, background-color .15s ease;
}
.v6-icon-btn:hover { color: var(--palette-accent); background: var(--v6-hover); }
.v6-dot { position: absolute; top: 7px; right: 8px; width: 7px; height: 7px; border-radius: 50%; background: var(--palette-accent); }
.v6-status {
  display: none; align-items: center; gap: 6px;
  padding: 4px 10px; margin-inline-end: 4px;
  border-radius: 999px; font-size: 11.5px; font-weight: 700;
  color: #059669; background: rgba(16, 185, 129, .10); border: 1px solid rgba(16, 185, 129, .25);
}
.dark .v6-status { color: #34D399; }
@media (min-width: 1280px) { .v6-status { display: inline-flex; } }
.v6-user {
  display: flex; align-items: center; gap: 8px;
  padding-inline-start: 10px; margin-inline-start: 4px;
  border-inline-start: 1px solid var(--line);
}
.v6-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--palette-accent); color: var(--on-primary, #fff);
  font-weight: 800; font-size: 13px;
}
.v6-user-text { display: none; flex-direction: column; line-height: 1.2; }
@media (min-width: 1100px) { .v6-user-text { display: flex; } }
.v6-user-name { font-size: 12px; font-weight: 700; color: var(--text); }
.v6-user-role { font-size: 10px; color: var(--muted); }
.v6-logout:hover { color: #EF4444; background: rgba(239, 68, 68, .1); }

/* زر القائمة يظهر على الشاشات الصغيرة فقط */
@media (min-width: 1024px) { #sidebarToggleBtn { display: none !important; } }

/* ---------------- القائمة الجانبية ---------------- */
.v6-side {
  width: var(--v6-side-w);
  flex-shrink: 0;
  display: flex; flex-direction: column;
  background: var(--panel);
  border-inline-start: 1px solid var(--line);
  transition: width .2s ease, transform .25s ease;
}
@media (min-width: 1024px) {
  .v6-side { position: relative; }
}
.v6-side-scroll { flex: 1 1 auto; overflow-y: auto; padding: 10px 8px; }
.v6-sec { margin-bottom: 8px; }
.v6-sec > summary {
  list-style: none;
  display: flex; align-items: center; gap: 6px;
  padding: 8px 8px 6px;
  font-size: 13px; font-weight: 800; color: var(--text);
  cursor: pointer; user-select: none;
}
.v6-sec > summary::-webkit-details-marker { display: none; }
.v6-sec > summary::before {
  content: "▾"; width: 12px; text-align: center;
  font-size: 12px; line-height: 1; color: var(--muted);
}
.v6-sec:not([open]) > summary::before { content: "◂"; }
[dir="ltr"] .v6-sec:not([open]) > summary::before { content: "▸"; }
.v6-item {
  width: 100%;
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px;
  margin: 1px 0;
  border-radius: 7px;
  font-size: 13.5px; font-weight: 500;
  color: var(--muted);
  background: none; border: 0; cursor: pointer;
  text-align: start; text-decoration: none;
  transition: color .12s ease, background-color .12s ease;
}
.v6-item > i, .v6-item > svg { width: 16px; height: 16px; flex-shrink: 0; }
.v6-item > span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v6-item > em {
  font-style: normal; font-size: 10.5px; font-weight: 700;
  padding: 1px 7px; border-radius: 999px;
  background: var(--v6-hover); color: var(--muted);
}
.v6-item > em.v6-em-live { background: #10B981; color: #fff; }
.v6-item:hover { color: var(--text); background: var(--v6-hover); }
.v6-item.is-active {
  color: var(--text); font-weight: 700;
  background: var(--v6-active);
  box-shadow: inset -3px 0 0 var(--palette-accent);
}
[dir="ltr"] .v6-item.is-active { box-shadow: inset 3px 0 0 var(--palette-accent); }
.v6-cat-ico { width: 16px; text-align: center; flex: 0 0 16px !important; }
.v6-fly-arrow { width: 14px !important; height: 14px !important; opacity: .55; }
.v6-item-fly[aria-expanded="true"] { color: var(--text); background: var(--v6-hover); }
.v6-side-foot {
  padding: 10px 14px; font-size: 10.5px; color: var(--muted);
  border-top: 1px solid var(--line);
}
/* مقبض الطي: يظهر على حافة القائمة مثل زر «<≡» */
.v6-side-handle {
  position: absolute; top: 50%; left: -13px; transform: translateY(-50%);
  width: 26px; height: 44px; border-radius: 7px;
  display: none; place-items: center;
  background: var(--panel); color: var(--muted);
  border: 1px solid var(--line); cursor: pointer; z-index: 5;
  box-shadow: var(--shadow-md, 0 4px 6px -1px rgba(0,0,0,.07));
}
.v6-side-handle:hover { color: var(--palette-accent); }
.v6-h-open { display: none; }
@media (min-width: 1024px) { .v6-side-handle { display: grid; } }
html.v6-side-collapsed .v6-side { width: 0; border-inline-start-width: 0; }
html.v6-side-collapsed .v6-side-scroll,
html.v6-side-collapsed .v6-side-foot { visibility: hidden; }
html.v6-side-collapsed .v6-side-handle { left: -30px; }
html.v6-side-collapsed .v6-h-open { display: block; }
html.v6-side-collapsed .v6-h-close { display: none; }

/* الموبايل: القائمة تنزلق من اليمين (زر القائمة في الشريط العلوي) */
@media (max-width: 1023px) {
  .v6-side { position: fixed !important; top: var(--v6-top-h); bottom: 0; right: 0; box-shadow: -10px 0 30px rgba(0,0,0,.25); }
  .v6-brand-sub, .v6-modules { display: none; }
  .v6-top-row { gap: 8px; padding: 0 8px; }
  .v6-brand { border: 0; padding: 0; }
  .v6-tools { margin-inline-start: auto; }
}
@media (max-width: 560px) {
  #fullscreenToggleBtn, .v6-tools .v6-icon-btn.relative { display: none; }
  .v6-crumbs { padding: 0 12px; }
}

/* ---------------- المحتوى + مسار التنقل ---------------- */
.v6-main { background: var(--bg); }
.v6-crumbs {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between;
  min-height: 40px; padding: 0 22px;
  font-size: 12.5px;
  background: color-mix(in srgb, var(--bg) 92%, transparent);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--line);
}
.v6-crumbs nav { display: flex; align-items: center; gap: 8px; min-width: 0; }
.v6-crumbs a { color: var(--muted); text-decoration: none; white-space: nowrap; }
.v6-crumbs a:hover { color: var(--palette-accent); }
.v6-sep { color: var(--muted); opacity: .6; }
.v6-crumb-cur { color: var(--text); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------------- قائمة التقارير المنبثقة (Mega menu) ---------------- */
.v6-mega {
  position: fixed;
  top: calc(var(--v6-top-h) + 6px);
  right: calc(var(--v6-side-w) + 8px);
  width: min(1040px, calc(100vw - var(--v6-side-w) - 32px));
  max-height: calc(100vh - var(--v6-top-h) - 24px);
  display: flex; flex-direction: column;
  background: var(--v6-card);
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .28);
  z-index: 60;
  overflow: hidden;
}
.v6-mega[hidden] { display: none; }
html.v6-side-collapsed .v6-mega { right: 16px; width: min(1040px, calc(100vw - 32px)); }
@media (max-width: 1023px) { .v6-mega { right: 8px; left: 8px; width: auto; } }
.v6-mega-head {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border-bottom: 1px solid var(--line);
}
.v6-mega-search {
  flex: 1 1 auto; display: flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: 8px;
  background: var(--bg); border: 1px solid var(--line); color: var(--muted);
}
.v6-mega-search:focus-within { border-color: var(--palette-accent); box-shadow: 0 0 0 3px var(--palette-focus-ring); }
.v6-mega-search input { flex: 1; background: none; border: 0; outline: 0; color: var(--text); font-size: 13px; padding: 0; }
.v6-mega-search input:focus { box-shadow: none; }
.v6-mega-all { font-size: 12.5px; font-weight: 700; color: var(--palette-accent); text-decoration: none; white-space: nowrap; }
.v6-mega-grid {
  overflow-y: auto;
  padding: 12px 14px 16px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 6px 22px;
  align-content: start;
}
.v6-mega-col { min-width: 0; padding-bottom: 8px; }
.v6-mega-title {
  display: flex; align-items: center; gap: 8px;
  margin: 6px 0 6px; padding: 7px 10px;
  font-size: 13px; font-weight: 800; color: var(--text);
  background: var(--v6-strip);
  border-radius: 6px;
}
.v6-mega-count { margin-inline-start: auto; font-size: 10.5px; font-weight: 700; color: var(--muted); }
.v6-mega-col ul { list-style: none; margin: 0; padding: 0; }
.v6-mega-col li a {
  position: relative;
  display: block;
  padding: 6px 22px 6px 8px;
  font-size: 13px; line-height: 1.45;
  color: var(--text); text-decoration: none;
  border-radius: 6px;
}
.v6-mega-col li a::before {
  content: "›"; position: absolute; right: 8px; top: 5px;
  color: var(--muted); font-weight: 700;
}
.v6-mega-col li a:hover { color: var(--palette-accent); background: var(--v6-hover); }
.v6-mega-col li a:hover::before { color: var(--palette-accent); }
.v6-mega-col li a.is-current { color: var(--palette-accent); font-weight: 700; background: var(--v6-active); }
.v6-mega-col li.v6-more-item { display: none; }
.v6-mega-col.is-expanded li.v6-more-item,
.v6-mega.is-searching .v6-mega-col li.v6-more-item { display: list-item; }
.v6-mega.is-searching .v6-mega-col li.v6-no-match { display: none !important; }
.v6-mega.is-searching .v6-mega-col.v6-col-empty { display: none; }
.v6-mega-more {
  margin: 4px 0 0; padding: 4px 8px;
  font-size: 12.5px; font-weight: 700;
  color: var(--palette-accent);
  background: none; border: 0; cursor: pointer;
}
.v6-mega-more:hover { text-decoration: underline; }
.v6-mega-col.is-expanded .v6-mega-more,
.v6-mega.is-searching .v6-mega-more { display: none; }
.v6-mega.is-focused .v6-mega-col:not(.is-focus) { opacity: .45; }
.v6-mega.is-focused .v6-mega-col.is-focus .v6-mega-title { box-shadow: inset -3px 0 0 var(--palette-accent); }
.v6-mega-empty { grid-column: 1 / -1; text-align: center; color: var(--muted); padding: 30px 0; }

/* ---------------- صفحة التقارير داخل الإطار الجديد ----------------
   ارتفاع العمود الجانبي وكارت النتائج = المساحة المتاحة تحت الشريط العلوي ومسار التنقل،
   فينتهي كارت التشغيل بمحاذاة أسفل الجدول بدون تمرير إضافي للصفحة. */
:root { --v6-avail-h: calc(100vh - var(--v6-top-h) - 40px - 48px); }
@media (min-width: 1081px) {
  .v6-page .sidebar-col { top: 12px; height: var(--v6-avail-h); max-height: var(--v6-avail-h); }
  .v6-page .results-card,
  .v6-page .reports-layout { min-height: var(--v6-avail-h); }
}

/* ---------------- تكثيف الجداول (أسلوب القوائم) ---------------- */
.v6-page table thead th { font-size: 12.5px; }

@media (prefers-reduced-motion: reduce) {
  .v6-side, .v6-mod, .v6-item, .v6-icon-btn { transition: none; }
}
@media print {
  .v6-top, .v6-side, .v6-crumbs, .v6-mega { display: none !important; }
}

/* ==========================================================================
   v6.1 — شكل قوائم موحّد (نفس شكل قائمة القسم المنبثقة) + شريط تشغيل سفلي
   ========================================================================== */

/* ---- قائمة قسم واحد (عند اختيار قسم من القائمة الجانبية): لوحة عمودية ضيقة بجانب القائمة ---- */
.v6-mega.is-single {
  width: 380px;
  top: calc(var(--v6-top-h) + 6px);
  bottom: 12px;
  max-height: none;
}
.v6-mega.is-single .v6-mega-all { display: none; }
.v6-mega.is-single .v6-mega-grid { grid-template-columns: 1fr; padding: 8px 10px 12px; }
.v6-mega.is-single .v6-mega-col:not(.is-focus) { display: none; }
.v6-mega.is-single .v6-mega-col li.v6-more-item { display: list-item; }
.v6-mega.is-single .v6-mega-more { display: none; }
.v6-mega.is-single .v6-mega-title {
  position: sticky; top: -8px; z-index: 1;
  margin-top: 0;
  box-shadow: inset -3px 0 0 var(--palette-accent);
  background: color-mix(in srgb, var(--v6-card) 70%, var(--v6-strip) 30%);
}
@media (max-width: 1023px) { .v6-mega.is-single { width: auto; } }

/* شكل عنصر القائمة الموحّد (يُستخدم في القائمة المنبثقة وقائمة «التقارير المتاحة») */
.v6-mega-col li a,
.v6-page .report-nav-item {
  position: relative;
  display: block;
  padding: 7px 24px 7px 8px !important;
  font-size: 13px !important; font-weight: 500 !important; line-height: 1.5 !important;
  min-height: 0 !important;
  color: var(--text) !important;
  background: none !important;
  border: 0 !important; border-radius: 6px !important;
  box-shadow: none !important;
  transform: none !important;
  text-decoration: none;
}
.v6-mega-col li a::before,
.v6-page .report-nav-item::before {
  content: "›"; position: absolute; right: 9px; top: 6px;
  color: var(--muted); font-weight: 700;
}
.v6-mega-col li a:hover,
.v6-page .report-nav-item:hover {
  color: var(--palette-accent) !important;
  background: var(--v6-hover) !important;
}
.v6-mega-col li a:hover::before,
.v6-page .report-nav-item:hover::before { color: var(--palette-accent); }
.v6-mega-col li a.is-current,
.v6-page .report-nav-item.active {
  color: var(--palette-accent) !important;
  font-weight: 700 !important;
  background: var(--v6-active) !important;
}
.v6-mega-col li a.is-current::before,
.v6-page .report-nav-item.active::before { color: var(--palette-accent); }
.v6-page .report-nav-item .report-nav-title { color: inherit !important; font-weight: inherit !important; }
/* الاسم الإنجليزي القديم تحت كل تقرير: مخفي لتطابق شكل القائمة */
.v6-page .report-nav-item .report-nav-sub { display: none !important; }
.v6-page .report-sub-list { padding: 4px 4px 6px !important; gap: 0 !important; background: transparent !important; }
.v6-page .report-sub-list li + li { border-top: 0 !important; }

/* رؤوس أقسام «التقارير المتاحة» بنفس شكل رأس القسم في القائمة المنبثقة */
.v6-page .sidebar-accordion { border: 0 !important; background: transparent !important; box-shadow: none !important; }
.v6-page .accordion-summary {
  padding: 7px 10px !important;
  border-radius: 6px !important;
  background: var(--v6-strip) !important;
  font-size: 13px !important; font-weight: 800 !important; color: var(--text) !important;
}
.v6-page .sidebar-accordion[open] > .accordion-summary { box-shadow: inset -3px 0 0 var(--palette-accent); }
.v6-page .accordion-summary .badge-count {
  background: none !important; color: var(--muted) !important; font-size: 10.5px !important;
}

/* ---- شريط التشغيل والتصدير: شريط أفقي ثابت أسفل الشاشة بعرض منطقة المحتوى ---- */
.v6-runbar {
  position: fixed !important;
  bottom: 0; left: 0; right: var(--v6-side-w);
  z-index: 45;
  margin: 0 !important;
  display: flex !important; flex-direction: row !important; align-items: center; flex-wrap: wrap;
  gap: 10px !important;
  padding: 10px 18px !important;
  border: 0 !important; border-top: 1px solid var(--line) !important;
  border-radius: 0 !important;
  background: color-mix(in srgb, var(--panel) 94%, transparent) !important;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: 0 -8px 24px rgba(0, 0, 0, .18) !important;
}
html.v6-side-collapsed .v6-runbar { right: 0; }
@media (max-width: 1023px) { .v6-runbar { right: 0; padding: 8px 10px !important; } }
.v6-runbar .run-action-btn { width: auto !important; min-width: 190px; height: 42px !important; padding: 0 26px; flex: 0 0 auto; }
.v6-runbar .exports-grid { display: flex !important; flex-wrap: wrap; gap: 8px !important; flex: 1 1 auto; }
.v6-runbar .export-btn { height: 40px !important; padding: 0 16px; flex: 0 0 auto; }
.v6-runbar .export-btn.btn-print { grid-column: auto !important; margin-inline-start: auto; }
.v6-runbar > .muted { padding: 0 !important; }
/* مساحة أسفل المحتوى حتى لا يغطي الشريط آخر الجدول، وارتفاعات صفحة التقارير تحسب الشريط */
html.v6-has-runbar .v6-main { padding-bottom: 64px; }
html.v6-has-runbar { --v6-avail-h: calc(100vh - var(--v6-top-h) - 40px - 48px - 64px); }
@media print { .v6-runbar { display: none !important; } }

/* ---- التمرير داخل منطقة المحتوى فقط: الشريط العلوي والقائمة الجانبية ثابتان،
        ومسار التنقل وعمود الفلاتر sticky داخل منطقة المحتوى ---- */
body:has(> .v6-body) { height: 100vh; min-height: 0 !important; overflow: hidden; }
.v6-body { min-height: 0; }
.v6-crumbs { top: 0; }
@media (min-width: 1024px) {
  .v6-page .sidebar-col { top: calc(40px + 12px); }
}

/* ==========================================================================
   v6.2 — صفحة التقرير: بدون كارت «التقارير المتاحة» (الاختيار من القوائم)،
   الفلاتر بطول العمود وبنفس شكل قائمة التقارير، و«التجميع حسب» مثبت أعلاها
   ========================================================================== */
.v6-page .sidebar-col:has(#runForm) #sidebarReportsCard { display: none !important; }
.v6-page .sidebar-col:has(#runForm) #runForm { min-height: 0; flex: 1 1 auto; }

.v6-page .filter-panel-card { padding: 0 10px 10px !important; }
.v6-page .filter-panel-header-sticky {
  margin: 0 -10px 8px !important;
  padding: 12px 14px 10px !important;
  box-shadow: none !important;
}
.v6-page .filter-panel-title { font-size: 15px !important; color: var(--palette-accent) !important; }

/* «التجميع حسب» مثبت أعلى القائمة (خارج منطقة التمرير) بشكله الحالي */
.v6-page .v6-dims { flex: 0 0 auto; margin: 0 0 10px !important; }

/* باقي مجموعات الفلاتر: رأس القسم كشريط مثل رؤوس أقسام التقارير، والعناصر مسطحة */
.v6-page .filter-scroll-area .filter-group {
  border: 0 !important; border-radius: 0 !important;
  padding: 0 !important; margin: 0 0 12px !important;
  background: transparent !important; box-shadow: none !important;
}
.v6-page .filter-scroll-area .filter-group-header {
  position: sticky; top: 0; z-index: 2;
  margin: 0 0 4px !important;
  padding: 7px 10px !important;
  border-radius: 6px;
  font-size: 13px !important; font-weight: 800 !important;
  color: var(--text) !important;
  background: var(--v6-strip);
  box-shadow: inset -3px 0 0 var(--palette-accent);
}
.v6-page .filter-scroll-area .filter-group-header svg { color: var(--muted); }
.v6-page .filter-scroll-area .filter-item-card {
  background: transparent !important;
  border: 0 !important; border-radius: 6px !important;
  box-shadow: none !important;
  padding: 8px 8px 10px !important;
  margin: 0 !important;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent) !important;
}
.v6-page .filter-scroll-area .filter-item-card:last-child { border-bottom: 0 !important; }
.v6-page .filter-scroll-area .filter-item-card:hover { background: var(--v6-hover) !important; }
.v6-page .filter-scroll-area .filter-item-card.is-active {
  background: var(--v6-active) !important;
  box-shadow: inset -3px 0 0 var(--palette-accent) !important;
}
.v6-page .filter-scroll-area .filter-item-card .chk-filter { font-size: 13px !important; }

/* ---- حركة الانتقال بين قائمة التقارير والفلاتر ----
   1) عند اختيار تقرير: القائمة المنبثقة تنزلق يميناً وتختفي تحت القائمة الرئيسية.
   2) بعد فتح التقرير: عمود الفلاتر يدخل من تحت القائمة الرئيسية متحركاً يساراً إلى مكانه. */
#appSidebar { z-index: 42; }  /* فوق المحتوى وفوق القائمة وهي تنزلق تحته */
.v6-mega.is-leaving {
  z-index: 41;
  pointer-events: none;
  animation: v6-slide-out-right .32s cubic-bezier(.55, 0, .75, .3) forwards;
}
@keyframes v6-slide-out-right {
  from { transform: translateX(0); opacity: 1; }
  to   { transform: translateX(calc(100% + 24px)); opacity: .2; }
}
html.v6-filters-enter .v6-page .sidebar-col {
  animation: v6-slide-in-left .42s cubic-bezier(.2, .8, .25, 1) both;
}
@keyframes v6-slide-in-left {
  from { transform: translateX(calc(100% + 40px)); opacity: 0; }
  to   { transform: translateX(0); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .v6-mega.is-leaving, html.v6-filters-enter .v6-page .sidebar-col { animation: none; }
}

/* ==========================================================================
   v6.3 — بدون القائمة الجانبية الرئيسية وبدون قائمة التقارير المنسدلة:
   «التقارير» في الشريط العلوي يفتح مركز التقارير (قائمة «التقارير المتاحة»).
   ========================================================================== */
.v6-runbar { right: 0 !important; }
@media (max-width: 1023px) {
  .v6-modules { display: flex !important; }
  .v6-brand-text { display: none; }
}
/* اختيار تقرير من «التقارير المتاحة»: القائمة تنزلق يميناً وتختفي، ثم تدخل الفلاتر يساراً مكانها */
.v6-page .sidebar-col.v6-list-leaving {
  pointer-events: none;
  animation: v6-slide-out-right .32s cubic-bezier(.55, 0, .75, .3) forwards;
}
@media (prefers-reduced-motion: reduce) {
  .v6-page .sidebar-col.v6-list-leaving { animation: none; }
}

/* ---- أزرار الرجوع (على الحافة اليمنى للعمود): من الفلاتر إلى التقارير، ومن قسم مفتوح إلى الأقسام ---- */
.v6-page .sidebar-col { overflow: visible !important; }
/* الشبكة كانت تقص ما يخرج عن حدودها (overflow-x: clip) فيختفي نصف الزر؛ منطقة المحتوى نفسها تمنع التمرير الأفقي */
.v6-page .reports-layout { overflow-x: visible !important; }
.v6-back-tab {
  position: absolute; top: 50%; right: -15px; transform: translateY(-50%);
  z-index: 20;
  width: 30px; height: 96px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  padding: 0; border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--palette-accent);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .14);
  cursor: pointer;
  font-family: inherit;
  transition: background-color .15s ease, color .15s ease, box-shadow .15s ease, right .2s ease;
}
.v6-back-tab[hidden] { display: none; }
/* النص العربي مُدار 90° (الكتابة الرأسية تكسر اتصال الحروف العربية) */
.v6-back-label { width: 16px; height: 60px; display: grid; place-items: center; }
.v6-back-label > span {
  display: block; white-space: nowrap;
  transform: rotate(90deg);
  font-size: 11.5px; font-weight: 800;
}
.v6-back-tab svg { animation: v6-nudge-right 1.6s ease-in-out infinite; flex: 0 0 auto; }
.v6-back-tab:hover {
  right: -18px;
  background: var(--palette-accent); color: var(--on-primary, #fff);
  box-shadow: 0 8px 22px var(--palette-accent-shadow, rgba(37, 99, 235, .35));
}
.v6-back-tab:focus-visible { outline: 2px solid var(--palette-accent); outline-offset: 2px; }
@keyframes v6-nudge-right {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(3px); }
}
/* من قسم مفتوح إلى الأقسام: القائمة تنزلق يميناً ثم تعود بالأقسام مغلقة */
.v6-page .sidebar-col.v6-sub-leaving {
  pointer-events: none;
  animation: v6-slide-out-right .26s cubic-bezier(.55, 0, .75, .3) forwards;
}
.v6-page .sidebar-col.v6-sub-enter {
  animation: v6-slide-in-left .4s cubic-bezier(.2, .8, .25, 1) both;
}
/* الرجوع: الفلاتر تنزلق يميناً وتختفي، ثم تدخل قائمة التقارير يساراً مكانها */
.v6-page .sidebar-col.v6-filters-leaving {
  pointer-events: none;
  animation: v6-slide-out-right .32s cubic-bezier(.55, 0, .75, .3) forwards;
}
html.v6-list-enter .v6-page .sidebar-col {
  animation: v6-slide-in-left .42s cubic-bezier(.2, .8, .25, 1) both;
}
/* آخر تقرير اختير يظهر مميزاً عند الرجوع للقائمة */
.v6-page .report-nav-item.v6-last-picked:not(.active) {
  color: var(--palette-accent) !important;
  background: var(--v6-hover) !important;
  box-shadow: inset -3px 0 0 var(--palette-accent) !important;
}
@media (prefers-reduced-motion: reduce) {
  .v6-back-tab svg, .v6-page .sidebar-col.v6-filters-leaving, html.v6-list-enter .v6-page .sidebar-col,
  .v6-page .sidebar-col.v6-sub-leaving, .v6-page .sidebar-col.v6-sub-enter { animation: none; }
}
@media (max-width: 1080px) { .v6-back-tab { display: none; } }

/* ---- شريط التشغيل يظهر متحركاً من أسفل إلى أعلى ---- */
.v6-runbar { animation: v6-slide-up .42s cubic-bezier(.2, .8, .25, 1) .12s both; }
@keyframes v6-slide-up {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .v6-runbar { animation: none; } }

/* ---- الموبايل والشاشات الصغيرة (عمود واحد): العمود بلا ارتفاع ثابت، فلا يجوز أن تعتمد
   منطقة الفلاتر على flex-basis: 0 (كانت تنكمش إلى صفر فتظهر قائمة الفلاتر فارغة) ---- */
@media (max-width: 1080px) {
  .v6-page .sidebar-col { height: auto !important; max-height: none !important; }
  .v6-page #runForm,
  .v6-page .filter-panel-card { flex: 0 0 auto !important; min-height: 0 !important; overflow: visible !important; }
  .v6-page .filter-scroll-area {
    flex: 0 0 auto !important;
    max-height: 62vh;
    overflow-y: auto;
  }
  .v6-page .sidebar-card { max-height: none !important; }
  .v6-page .sidebar-accordions { max-height: 70vh; }
}

/* شريط التشغيل فوق المحتوى دائماً (كان z-index الخاص بصفحة التقارير = 14 يغلب فيختفي خلف الفلاتر) */
.v6-runbar.actions-stack { z-index: 45 !important; }
/* الموبايل: الأزرار في صف واحد يتحرك أفقياً بدل أن يصبح الشريط عالياً ويغطي المحتوى */
@media (max-width: 760px) {
  .v6-runbar { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; }
  .v6-runbar::-webkit-scrollbar { display: none; }
  .v6-runbar .run-action-btn { min-width: 140px; padding: 0 16px; }
  .v6-runbar .exports-grid { flex-wrap: nowrap !important; flex: 0 0 auto; }
  .v6-runbar .export-btn { padding: 0 12px; white-space: nowrap; }
  .v6-runbar .export-btn.btn-print { margin-inline-start: 0; }
}

/* ---- عنوان التقرير في كارت مستقل، وكارت عرض البيانات تحته بفاصل ---- */
.v6-page .reports-content-col { gap: 12px; }
.v6-report-head-card {
  flex: 0 0 auto;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 16px 22px;
  box-shadow: var(--shadow);
}
.v6-report-head-card .results-head { margin: 0 !important; padding: 0 !important; border: 0 !important; }
@media (min-width: 1081px) {
  .v6-page .reports-content-col:has(.v6-report-head-card) { height: var(--v6-avail-h); }
  .v6-page .results-card.v6-has-head-card { flex: 1 1 auto; min-height: 0 !important; height: auto !important; }
}
html[data-color-theme="editorial-rainbow-cinematic"] .v6-report-head-card {
  background: var(--er-glass) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
  border-color: var(--er-border) !important;
  box-shadow: var(--er-shadow);
}

/* ---- شريط التشغيل: شريط عائم بزوايا ناعمة من اليمين واليسار بدل الحواف الحادة ---- */
.v6-runbar {
  left: 12px !important;
  right: 12px !important;
  bottom: 10px !important;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  overflow: hidden;
}
.v6-runbar::before { border-radius: 16px 16px 0 0; }
html.v6-has-runbar .v6-main { padding-bottom: 76px; }
html.v6-has-runbar { --v6-avail-h: calc(100vh - var(--v6-top-h) - 40px - 48px - 76px); }
@media (max-width: 1023px) { .v6-runbar { left: 8px !important; right: 8px !important; bottom: 8px !important; } }
@media (max-width: 760px) { .v6-runbar { overflow-x: auto; } }

/* كارت العنوان بارتفاع ثابت حتى لا يتحرك كارت البيانات عند التنقل بين تقارير عناوينها مختلفة الطول */
.v6-report-head-card { min-height: 96px; display: flex; align-items: center; box-sizing: border-box; }
.v6-report-head-card .results-head { width: 100%; }