/* Mobile edge-to-edge reset — keep the public site painted to the physical screen edge. */
@media (max-width: 900px) {
  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100% !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    background: #ffffff !important;
  }

  /* The footer reveal is desktop-only. On phones it created a second visual surface
     that could appear as a white/beige strip near the system navigation area. */
  body.public-footer-reveal {
    overflow-x: hidden !important;
  }

  body.public-footer-reveal .public-page-surface {
    position: relative !important;
    z-index: auto !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }

  body.public-footer-reveal > .drg-site-footer {
    position: relative !important;
    inset: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: 100% !important;
    margin-top: 0 !important;
  }

  body.properties-page,
  body.property-detail-page,
  body.map-mobile-show-map,
  body.properties-page > main,
  body.property-detail-page > main,
  body.map-mobile-show-map > main {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    background: #ffffff !important;
  }

  body.properties-page,
  body.property-detail-page,
  body.map-mobile-show-map {
    padding-bottom: 0 !important;
  }

  /* The loading layer must cover the large viewport too, not only the transient
     visual viewport reported while Android/iOS browser controls are visible. */
  .premium-preloader {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 100lvh !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Paint the safe-area itself without adding layout spacing. */
  @supports (padding-bottom: env(safe-area-inset-bottom)) {
    html,
    body,
    .premium-preloader {
      background-clip: border-box !important;
    }

    .premium-preloader::after {
      content: '';
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      height: env(safe-area-inset-bottom);
      min-height: env(safe-area-inset-bottom);
      background: inherit;
      pointer-events: none;
    }
  }
}