/* ═══════════════════════════════════════════════════════════════
   listings-views.css — Modular Listings View Styles
   ═══════════════════════════════════════════════════════════════
   Loaded LAST to override the competing list/map view rules.

   CRITICAL: Do NOT set `display` on .list-view-container here.
   JS toggleView() controls display:flex / display:none inline.
   Setting display via CSS !important will break the toggle.
   ═══════════════════════════════════════════════════════════════ */

/* ── LIST VIEW: Container is a flex column constrained to viewport ── */
#mainAppContent.executive-suite-shell #listingsView .list-view-container {
	/* DO NOT set display here — JS controls it */
	flex-direction: column !important;
	/* Explicit viewport-based height: viewport minus header(64) + filters(~196) */
	max-height: max(360px, calc(100dvh - 260px)) !important;
	min-height: 0 !important;
	overflow: hidden !important;
}

/* ── LIST VIEW: Grid scrolls within flex-allocated space ──
   KEY FIX: flex-basis: 0 (not auto) forces the grid to SHRINK
   to make room for siblings (the pagination host).
   The old rule used `flex: 1 1 auto` which let the grid expand
   based on content, pushing pagination below the overflow clip. */
#mainAppContent.executive-suite-shell #listingsView .list-view-grid {
	flex: 1 1 0 !important;
	min-height: 0 !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
	-webkit-overflow-scrolling: touch !important;
}

/* ── LIST VIEW: Pagination host pinned at bottom of flex column ── */
#mainAppContent.executive-suite-shell #listingsView #listListingsPaginationHost {
	flex: 0 0 auto !important;
	width: 100% !important;
	z-index: 10 !important;
}

/* ── Pagination host: hide when empty to avoid dead space ── */
#mainAppContent.executive-suite-shell #listingsView .listings-pagination-host:empty {
	display: none !important;
}