/* ==========================================================================
   Layout — Shell (body / main / container)
   ساختار کلی صفحه به‌صورت flex عمودی تا footer همیشه پایین بماند.
   جایگزین footer با position:absolute قدیمی (که روی موبایل مشکل‌ساز بود).
   ========================================================================== */
body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

/* فرزند مستقیم body که محتوای اصلی را نگه می‌دارد باید رشد کند
   تا footer همیشه پایین صفحه بماند (sticky footer با flex). */
body > .container {
  width: 100%;
  flex: 1 0 auto;
}

main[role="main"] {
  width: 100%;
}

/* کانتینر اصلی محتوا: عرض حداکثری + پدینگ ریسپانسیو */
.container,
.container-fluid {
  padding-inline: var(--container-pad);
}

/* یک کلاس کمکی برای عرض محتوای متمرکز */
.site-container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}