/* Mobile map availability fix */
/* Keep availability indicator in normal flow, same as desktop */

body.map-page .social-banner,
body.map-page .status-line {
  position: relative;
  z-index: 2;
}

body.map-page .map-wrap {
  margin-top: 0;
}

/* Ensure social banner stays visible above the full-screen fixed map on mobile */
@media (max-width: 768px){
  body.map-page #map{
    z-index: 1;
  }
  body.map-page .social-banner,
  body.map-page .status-line{
    position: relative;
    z-index: 20;
  }
}

/* Availability banner placement */
/* Mobile: keep banner and "Showing" line stacked top-left, above the map */
@media (max-width: 768px){
  body.map-page #socialBanner{
    position: fixed;
    top: 95px;
    left: 14px;
    right: auto;
    margin: 0;
    display: block !important;
    width: auto;
    max-width: calc(100vw - 90px);
    z-index: 89;
    padding: 6px 10px;
  }

  body.map-page #filterStatusLine{
    position: fixed;
    top: 137px; /* just under socialBanner */
    left: 14px;
    right: auto;
    margin: 0;
    width: auto;
    max-width: calc(100vw - 90px);
    z-index: 88;
    padding: 4px 10px 0;
    background: transparent;
  }

  body.map-page #map{
    z-index: 1;
  }
}
/* End availability banner placement */