/**
 * لوحة المفاتيح على الجوال: صفحات بـ body مركز عمودياً + حقول إدخال.
 * ضع class="zw-kb-page" على body (أو عبر {% block body_class %} في base).
 * اختياري: .zw-kb-scroll-anchor على الحاوية الرئيسية لمساحة تمرير تحت الأزرار.
 */
html {
  height: 100%;
}

@media (max-width: 768px) {
  body.zw-kb-page {
    align-items: flex-start !important;
    justify-content: center;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    height: auto !important;
    box-sizing: border-box;
    padding-top: max(12px, env(safe-area-inset-top, 0px));
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
    scroll-padding-bottom: max(100px, env(safe-area-inset-bottom, 0px));
  }

  body.zw-kb-page .zw-kb-scroll-anchor {
    margin-bottom: min(42vh, 320px);
  }

  body.zw-kb-page .btn-register-modern,
  body.zw-kb-page .btn-login-modern,
  body.zw-kb-page button[type="submit"] {
    scroll-margin-bottom: max(100px, env(safe-area-inset-bottom, 0px));
  }

  /* صفحات base: تمرير مريح عند التركيز في أسفل الشاشة */
  #mobile-viewport-fit-inner > main.container {
    scroll-padding-bottom: max(96px, env(safe-area-inset-bottom, 0px));
  }
}