/* ==========================================================================
   Skyny Realty — child theme custom CSS
   Loaded from houzez-child/functions.php with a filemtime() version, so any
   edit here is picked up by browsers immediately (no manual cache-busting).
   ========================================================================== */

/* --------------------------------------------------------------------------
   #12993 — "Property Listing Half Map" template (/listing-with-map)
            usable property list below 1200px.

   Houzez's main.css swaps the list-view card into its GRID presentation below
   1200px (hides .hide-on-grid, shows .hide-on-list, hides .hidden-gird-cell).
   That grid presentation carries only the price and the status label — and this
   site publishes neither — so every card collapsed to a bare photo with a
   generic space-type caption: no address, no size and no floor.

   These rules keep the LIST content (which is where the real information is)
   at every width, and stack it photo-above-text so it reads on a phone.
   Same components, same styling as the desktop list — nothing new introduced.
   -------------------------------------------------------------------------- */

@media (max-width: 1199px) {

    /* 1. Keep the informative list content; drop the near-empty grid caption. */
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .hide-on-grid {
        display: block !important;
    }
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .hide-on-list {
        display: none !important;
    }
    /* NB: .hidden-gird-cell (.body-right) is deliberately left hidden. On this
       site it holds only the price and the "Details" button, and both are
       switched off site-wide (.info-row.phone is display:none at every width,
       desktop included), so showing it would just add an empty 100px block to
       every card. */

    /* 2. One card per row (the theme floats them 2-up, far too tight once the
          address and meta lines are back). */
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing .item-wrap {
        float: none;
        width: 100%;
        margin-bottom: 12px;
        padding-right: 0;
        padding-left: 0;
    }

    /* 3. Stack: photo on top, details underneath. */
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .property-item,
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .property-item .table-cell {
        display: block;
        width: 100%;
    }
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .figure-block {
        width: 100%;
        height: auto;
    }
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .item-thumb img {
        width: 100%;
        height: auto;
    }
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .item-body {
        width: 100%;
        padding: 15px;
    }
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .body-left,
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .body-right {
        width: 100%;
        margin-top: 0;
        min-height: 0;
    }
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .body-left {
        margin-bottom: 10px;
    }

    /* 4. Let the address headline wrap instead of being truncated mid-street. */
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .item-body .property-title {
        max-width: 100%;
        white-space: normal;
    }
    body.page-template-property-listings-map #section-body.houzez-body-half .property-listing.list-view .item-body .property-address {
        max-width: 100%;
    }
}

@media (max-width: 991px) {

    /* Below Bootstrap's md breakpoint the map and the list stack, and the theme
       sizes the map to the full viewport height — which pushed the whole list
       below the fold. Cap it so the results are reachable without a long scroll.
       (Inline height is written by the theme's JS, hence !important.) */
    body.page-template-property-listings-map #houzez-gmap-main.fave-screen-fix,
    body.page-template-property-listings-map #mapViewHalfListings.map-half {
        height: 320px !important;
    }
}
