/* ═══════════════════════════════════════════════════════════════════
   Primix OS — Mobile Enhancement v3 (FINAL)
   layout responsivo للـ .os-* و touch targets؛ توجيه الـ sidebar
   والقائمة والـ backdrop لسكربت pmx-sidebar.js الموحّد
   ═══════════════════════════════════════════════════════════════════ */

/* ════ Safe areas للـ iPhone notch ════ */
@supports (padding: env(safe-area-inset-top)) {
  body {
    padding-top: env(safe-area-inset-top) !important;
  }
}

/* ════════════════════════════════════════════════════════════════
   🔑 THE KEY FIX: على الجوال، لا margin-right من sidebar
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  body {
    margin-inline-end: 0 !important;
  }

  /* os-ai-panel (لوحة AI) - نخليها tucked في الزاوية */
  .os-ai-panel {
    position: fixed !important;
    bottom: 70px !important;
    left: 10px !important;
    right: auto !important;
    top: auto !important;
    width: 60px !important;
    height: 60px !important;
    border-radius: 50% !important;
    z-index: 100 !important;
    overflow: hidden !important;
    transition: all 0.3s !important;
  }

  .os-ai-panel:not(.collapsed) {
    width: calc(100vw - 20px) !important;
    height: 70vh !important;
    border-radius: 16px !important;
    bottom: 80px !important;
  }

  /* المحتوى الرئيسي بكامل العرض */
  .os-main {
    padding: 12px !important;
    padding-top: calc(env(safe-area-inset-top, 0) + 70px) !important;
    max-width: 100% !important;
  }

  /* KPI grid — عمودين بدل 4 */
  .os-kpis {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }

  .os-kpi {
    padding: 14px !important;
  }

  .os-kpi-val {
    font-size: 20px !important;
  }

  /* Main grid (cards) — عمود واحد */
  .os-grid,
  .os-grid.cols-3 {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  /* Topbar — ترتيب عمودي */
  .os-topbar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 16px !important;
    margin-bottom: 20px !important;
  }

  .os-greeting-name {
    font-size: 20px !important;
  }

  .os-health {
    width: 100% !important;
    min-width: auto !important;
  }

  /* Cards padding أقل */
  .os-card {
    padding: 14px !important;
  }

  /* جداول قابلة للتمرير */
  table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap !important;
    max-width: 100% !important;
  }

  /* أزرار أكبر */
  button:not(.os-chip):not(.pmx-sb-sec-btn),
  .btn {
    min-height: 44px !important;
    padding: 10px 16px !important;
  }

  /* حقول الإدخال — منع iOS zoom */
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="tel"],
  input[type="search"],
  select,
  textarea {
    font-size: 16px !important;
    min-height: 44px !important;
  }

  /* منع horizontal overflow */
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
}

/* === PMX_TOUCH_TARGETS_FIX_V3 === */
@media (max-width:1023px){
  button,[role="button"],a,.btn,.pmx-btn,.nav-link,.tab,
  [onclick],[data-action],.chip,.badge-clickable,
  input[type="submit"],input[type="button"]{
    font-size:16px!important;
    min-height:48px!important;min-width:48px!important;
  }
  input,select,textarea{
    font-size:16px!important;
    min-height:44px!important;
  }
}