/*
 * JUST AQAR — HOME LAYOUT CLEAN V17
 *
 * الهدف:
 * مصدر هندسي واحد لعرض ومحاذاة الصفحة الرئيسية.
 * .home-layout-frame هو الوحيد الذي يحدد عرض الصفحة/gutters/sidebar.
 *
 * لا نكرر width على:
 * app-main / success-partners / app-footer
 * ولا نستخدم JavaScript لفرض العرض.
 */

.home-layout-frame,
.home-layout-frame *,
.home-layout-frame *::before,
.home-layout-frame *::after {
  box-sizing: border-box;
}

/* =========================================================
   1) ONE PAGE FRAME
   ========================================================= */
.home-layout-frame {
  width: min(
    var(--page-max, 1700px),
    calc(100% - (var(--page-gutter, 16px) * 2))
  );
  max-width: var(--page-max, 1700px);
  margin-inline: auto;
  padding: 0;
  position: relative;
}

/* tablet */
@media (min-width: 700px) {
  .home-layout-frame {
    width: min(
      var(--page-max, 1700px),
      calc(100% - (var(--page-gutter-tablet, 24px) * 2))
    );
  }
}

/* desktop: sidebar offset lives HERE only */
@media (min-width: 1100px) {
  .home-layout-frame {
    width: min(
      var(--page-max, 1700px),
      calc(100% - (var(--page-gutter-desktop, 32px) * 2))
    );
    padding-right: calc(var(--desktop-sidebar-w, 0px) + 28px);
  }
}

/* =========================================================
   2) MAIN — do not calculate page width again
   ========================================================= */
.home-layout-frame > .app-main.favorites-main {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Override the standalone PWA rule that gives app-main its own gutter. */
html.ja-pwa-runtime .home-layout-frame > .app-main.favorites-main,
html.ja-app-runtime .home-layout-frame > .app-main.favorites-main {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

/* Main blocks share exactly the same left/right edges. */
.home-layout-frame > .app-main.favorites-main > .user-card,
.home-layout-frame > .app-main.favorites-main > #searchAccordion.search-card,
.home-layout-frame > .app-main.favorites-main > .search-card,
.home-layout-frame > .app-main.favorites-main > .hero-card,
.home-layout-frame > .app-main.favorites-main > .section-switcher,
.home-layout-frame > .app-main.favorites-main > #cardsContainer,
.home-layout-frame > .app-main.favorites-main > #units-pagination,
.home-layout-frame > .app-main.favorites-main > #projects-pagination {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/*
 * البنر مستثنى عمداً:
 * يحتفظ بمقاسه السابق max-width:700px حسب التصميم المعتمد.
 */

/* =========================================================
   3) SUCCESS PARTNERS + FOOTER
   They are OUTSIDE main, but inside the SAME frame.
   Therefore no page-width formula and no sidebar padding here.
   ========================================================= */
.home-layout-frame > .success-partners-section,
.home-layout-frame > .app-footer {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

/* Cancel old desktop sidebar padding duplicated inside partners/footer. */
@media (min-width: 1100px) {
  .home-layout-frame > .success-partners-section {
    padding-right: 22px !important;
  }

  .home-layout-frame > .app-footer {
    padding-right: 28px !important;
  }
}

/* Keep their approved mobile visual padding; only width is unified. */
@media (max-width: 600px) {
  .home-layout-frame > .success-partners-section,
  .home-layout-frame > .app-footer {
    width: 100% !important;
    max-width: none !important;
  }

  .home-layout-frame > .success-partners-section {
    padding: 18px 14px !important;
  }

  .home-layout-frame > .app-footer {
    padding: 22px 18px !important;
  }
}

/* =========================================================
   4) CARD GRID / PAGINATION
   ========================================================= */
.home-layout-frame #cardsContainer {
  min-width: 0;
}

.home-layout-frame #units-pagination,
.home-layout-frame #projects-pagination {
  box-sizing: border-box;
}

/* =========================================================
   5) SAFETY — no horizontal drift from child sections
   ========================================================= */
.home-layout-frame > .app-main,
.home-layout-frame > .success-partners-section,
.home-layout-frame > .app-footer {
  inset-inline: auto !important;
}

/* Avoid old hover rules shifting footer off the common line. */
.home-layout-frame > .app-footer:hover {
  transform: none !important;
}
