/* ==========================================================================
   STYLES 2026 — new styles and overrides
   ==========================================================================
   Source: styles2026.less. Keep styles2026.css in sync when editing this file;
   WordPress serves the CSS file, not the LESS source.
   Registered in functions.php with a dependency on the existing "styles"
   stylesheet so these rules load after it without editing legacy styles.

   Keep future overrides grouped by page/component and explain the original
   constraint they address. Scope selectors to avoid affecting other views.
   ========================================================================== */

/* Properties / map view — minimum usable height
   Applies to the map and adjacent property list on ?view=map only.
   The original layout fits the header, content and footer into the viewport,
   which can leave very little height for the map. Allow document scrolling
   instead, while retaining the existing flex growth on taller screens.
   Grid view is unaffected; the breakpoint override below hides the list below 992px. */

body.page-properties.map {
  /* Override the inherited 100% body height so content can exceed the viewport. */
  height: auto;
}

body.page-properties.map main {
  /* Prevent the outer flex layout from shrinking main to make room for footer. */
  flex-shrink: 0;
}

body.page-properties.map #map-view {
  /* Update BOTH values when changing the minimum. A definite base height keeps
     the property list constrained and independently scrollable. Existing
     flex-grow can expand this shared row beyond 800px when space is available. */
  height: 800px;
  min-height: 800px;
  flex-shrink: 0;
}

body.page-properties.map #map-container {
  /* Replace height: 100% with flex cross-axis stretching so the map fills the
     final row height and stays aligned with the list, including when it grows. */
  height: auto;
}

/* Properties / map view — responsive property cards
   Increase the original 100px thumbnails and 14px titles without imposing a
   fixed card height. clamp(minimum, fluid value, maximum) keeps smaller desktop
   layouts compact and gives wider screens more generous spacing.
   Cards can grow further when a long property name wraps. The list is hidden
   below 992px; grid cards and map popups are unaffected. */
body.page-properties.map #map-view #property-list article {
  /* Vertical padding grows from 8px to 12px (previously 6px). */
  padding: clamp(8px, 0.6vw, 12px) 0;
}

body.page-properties.map #map-view #property-list article img {
  /* Thumbnail height drives the minimum row height: 112–144px plus padding.
     Keep object-fit: cover from the original stylesheet for consistent crops. */
  width: clamp(136px, 9vw, 176px);
  height: clamp(112px, 7.5vw, 144px);
}

body.page-properties.map #map-view #property-list article .card-content {
  /* Let the text column shrink and wrap beside the thumbnail on narrow lists. */
  min-width: 0;
  padding: 10px clamp(10px, 0.8vw, 16px);
}

body.page-properties.map #map-view #property-list article .card-content h2 {
  /* Approximately 15–18px at the default root size; rem bounds respect changes
     to the root font size. Preserve the full title instead of truncating it. */
  font-size: clamp(0.9375rem, calc(0.75rem + 0.3vw), 1.125rem);
  line-height: 1.4;
  overflow-wrap: anywhere;
}

/* Properties / map view — tablet and mobile layout
   Hide the sidebar below the 992px boundary (MD and smaller), extending the
   legacy <= 767px rule. At 992px and above the list remains visible.
   The map's existing flex growth fills the freed space and retains its 800px
   minimum height. The fractional bound also covers subpixel viewport widths. */
@media only screen and (max-width: 991.98px) {
  body.page-properties.map #map-view #property-list {
    display: none;
  }
}