/* Phase 10.2.6 — Responsive Command UI Fix
   الهدف: جعل صفحة Executive Command Center متوازنة عند تصغير عرض الشاشة
   بدون تغيير backend أو أي استعلامات Oracle.
*/

/* لا نجعل الهيدر يغطي المحتوى أثناء النزول داخل صفحة القيادة */
body.page-dashboard .elite-topbar {
  position: relative !important;
  top: auto !important;
  z-index: 4 !important;
  margin: 0 0 18px !important;
  border-radius: 24px !important;
}

/* تحسين قياس الصفحة ومنع تمدد أفقي مزعج */
body.page-dashboard .elite-main {
  overflow-x: hidden !important;
}
body.page-dashboard .cmdx,
body.page-dashboard .cmdx * {
  max-width: 100%;
}

/* شاشات أصغر من Full HD: تقليل عرض السايدبار وضغط الهيدر */
@media (max-width: 1680px) {
  body.page-dashboard .elite-sidebar {
    width: 258px !important;
    padding: 18px 14px !important;
  }
  body.page-dashboard .elite-main {
    margin-inline-start: 258px !important;
    padding: 16px 22px 24px !important;
  }
  body.page-dashboard[dir="rtl"] .elite-main,
  html[dir="rtl"] body.page-dashboard .elite-main,
  body.elite-body.page-dashboard[dir="rtl"] .elite-main {
    margin-inline-start: 0 !important;
    margin-inline-end: 258px !important;
  }

  body.page-dashboard .elite-brand-mark {
    width: 42px !important;
    height: 42px !important;
    border-radius: 13px !important;
  }
  body.page-dashboard .elite-brand-mark img {
    width: 39px !important;
    height: 39px !important;
  }
  body.page-dashboard .elite-brand strong { font-size: 1.08rem !important; }
  body.page-dashboard .elite-nav a {
    min-height: 44px !important;
    padding: 10px 12px !important;
    gap: 10px !important;
  }
  body.page-dashboard .elite-nav a span {
    width: 25px !important;
    height: 25px !important;
  }

  body.page-dashboard .elite-topbar {
    display: grid !important;
    grid-template-columns: minmax(300px, 1fr) minmax(180px, 230px) minmax(260px, 420px) auto auto auto !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 18px !important;
  }
  body.page-dashboard .elite-title-block {
    min-width: 0 !important;
  }
  body.page-dashboard .elite-title-block h1 {
    font-size: clamp(1.55rem, 1.75vw, 2.1rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.055em !important;
  }
  body.page-dashboard .elite-title-block p {
    font-size: .82rem !important;
    line-height: 1.35 !important;
  }
  body.page-dashboard .elite-branch-select {
    min-width: 0 !important;
    width: 100% !important;
    padding: 9px 11px !important;
  }
  body.page-dashboard .elite-search {
    min-width: 0 !important;
    max-width: none !important;
    width: 100% !important;
  }
  body.page-dashboard .elite-meta { min-width: 86px !important; }
  body.page-dashboard .elite-lang { padding: 10px 12px !important; }
  body.page-dashboard .elite-user { gap: 8px !important; }
  body.page-dashboard .elite-user > span {
    width: 38px !important;
    height: 38px !important;
  }
}

/* عند عرض متوسط: الهيدر يصبح صفين مرتبًا، والـ Situation Bar تصبح 3×2 بدل ازدحام 6 أعمدة */
@media (max-width: 1480px) {
  body.page-dashboard .elite-topbar {
    grid-template-columns: minmax(280px, 1fr) minmax(180px, 230px) auto auto auto !important;
  }
  body.page-dashboard .elite-search {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
  }

  body.page-dashboard .cmdx-situation {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    border-radius: 22px !important;
  }
  body.page-dashboard .cmdx-situation article {
    min-height: 108px !important;
    padding: 16px 17px !important;
  }
  body.page-dashboard .cmdx-status-tile {
    grid-template-columns: 52px 1fr !important;
    gap: 12px !important;
  }
  body.page-dashboard .cmdx-status-tile .cmdx-live-chip {
    position: absolute !important;
    top: 12px !important;
    inset-inline-end: 12px !important;
  }
  body.page-dashboard .cmdx-icon {
    width: 50px !important;
    height: 50px !important;
    border-radius: 17px !important;
  }
  body.page-dashboard .cmdx-square {
    width: 38px !important;
    height: 38px !important;
    border-radius: 14px !important;
  }
  body.page-dashboard .cmdx-situation strong {
    font-size: clamp(1.35rem, 2vw, 2rem) !important;
  }

  body.page-dashboard .cmdx-pulse-row {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
  body.page-dashboard .cmdx-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    grid-template-areas:
      "flow flow"
      "capacity finance"
      "clinical alerts"
      "actions actions" !important;
  }
  body.page-dashboard .cmdx-flow-line {
    grid-template-columns: 1fr 22px 1fr 22px 1fr 22px 1.05fr 22px 1fr !important;
  }
  body.page-dashboard .cmdx-flow-node {
    min-height: 94px !important;
    padding: 10px !important;
  }
  body.page-dashboard .cmdx-flow-node.primary {
    min-height: 106px !important;
  }
}

/* عند أجهزة لابتوب صغيرة أو تكبير المتصفح: نخفي السايدبار كقائمة جانبية لتوسيع مساحة البيانات */
@media (max-width: 1180px) {
  body.page-dashboard .elite-mobile-bar {
    display: flex !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 50 !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: rgba(255,255,255,.92) !important;
    backdrop-filter: blur(18px) !important;
    border-bottom: 1px solid var(--elite-line, #e4eaf4) !important;
    padding: 10px 12px !important;
  }
  body.page-dashboard .elite-sidebar {
    width: min(286px, 86vw) !important;
    transform: translateX(-110%) !important;
    transition: .22s ease !important;
  }
  html[dir="rtl"] body.page-dashboard .elite-sidebar,
  body.elite-body.page-dashboard[dir="rtl"] .elite-sidebar {
    transform: translateX(110%) !important;
  }
  body.sidebar-open.page-dashboard .elite-sidebar {
    transform: translateX(0) !important;
  }
  body.sidebar-open.page-dashboard .sidebar-scrim {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 18 !important;
    background: rgba(15,23,42,.46) !important;
    backdrop-filter: blur(2px) !important;
  }
  body.page-dashboard .elite-main,
  html[dir="rtl"] body.page-dashboard .elite-main,
  body.elite-body.page-dashboard[dir="rtl"] .elite-main {
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
    padding: 14px !important;
  }
  body.page-dashboard .elite-topbar {
    grid-template-columns: 1fr 1fr !important;
    border: 1px solid var(--elite-line, #e4eaf4) !important;
    border-radius: 20px !important;
  }
  body.page-dashboard .elite-title-block,
  body.page-dashboard .elite-search {
    grid-column: 1 / -1 !important;
  }
  body.page-dashboard .elite-branch-select,
  body.page-dashboard .elite-meta,
  body.page-dashboard .elite-lang,
  body.page-dashboard .elite-user {
    min-width: 0 !important;
    width: 100% !important;
  }

  body.page-dashboard .cmdx-situation,
  body.page-dashboard .cmdx-trust {
    grid-template-columns: 1fr 1fr !important;
  }
  body.page-dashboard .cmdx-status-tile {
    grid-column: 1 / -1 !important;
  }
  body.page-dashboard .cmdx-pulse-row,
  body.page-dashboard .cmdx-finance-grid,
  body.page-dashboard .cmdx-clinical-top {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
  body.page-dashboard .cmdx-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "flow"
      "capacity"
      "finance"
      "clinical"
      "alerts"
      "actions" !important;
  }
  body.page-dashboard .cmdx-flow-line {
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
    gap: 10px !important;
  }
  body.page-dashboard .cmdx-flow-line > i {
    display: none !important;
  }
  body.page-dashboard .cmdx-flow-node {
    border-radius: 22px !important;
  }
}

/* موبايل حقيقي */
@media (max-width: 720px) {
  body.page-dashboard .elite-topbar,
  body.page-dashboard .cmdx-situation,
  body.page-dashboard .cmdx-pulse-row,
  body.page-dashboard .cmdx-finance-grid,
  body.page-dashboard .cmdx-clinical-top,
  body.page-dashboard .cmdx-trust {
    grid-template-columns: 1fr !important;
  }
  body.page-dashboard .cmdx-status-tile {
    grid-column: auto !important;
  }
  body.page-dashboard .cmdx-flow-line {
    grid-template-columns: 1fr !important;
  }
  body.page-dashboard .cmdx-specialties li {
    grid-template-columns: 28px 1fr auto !important;
  }
  body.page-dashboard .cmdx-specialties i {
    display: none !important;
  }
  body.page-dashboard .cmdx-quick {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
}
