/* =========================================================================
 * RightHomes4U — v4.12 mobile filters drawer
 * The sidebar is very tall on phones, which made the page endless to
 * scroll. On <= 900px it collapses behind a "Filters" button.
 * ======================================================================= */

.rh-mfilters-bar { display: none !important; }

@media (max-width: 900px) {
	.rh-page .rh-mfilters-bar {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 10px !important;
		width: 100% !important;
		margin: 0 0 12px !important;
	}
	.rh-page .rh-mfilters-btn {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 8px !important;
		width: 100% !important;
		padding: 13px 16px !important;
		border: 1px solid #e6eaf0 !important;
		border-radius: 12px !important;
		background: #fff !important;
		color: #101828 !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		line-height: 1 !important;
		cursor: pointer !important;
		box-shadow: 0 6px 18px -12px rgba(16, 24, 40, .5) !important;
		transition: background .18s ease, color .18s ease, border-color .18s ease !important;
	}
	.rh-page .rh-mfilters-btn:hover,
	.rh-page .rh-mfilters-btn:focus,
	.rh-page .rh-mfilters-btn:focus-visible,
	.rh-page .rh-mfilters-btn.is-open {
		background: #fff3ec !important;
		border-color: #f2600c !important;
		color: #f2600c !important;
		outline: none !important;
	}
	.rh-page .rh-mfilters-btn .rh-mfilters-count {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		min-width: 20px !important;
		height: 20px !important;
		padding: 0 6px !important;
		border-radius: 999px !important;
		background: #f2600c !important;
		color: #fff !important;
		font-size: 11px !important;
		font-weight: 700 !important;
	}

	/* collapsed by default */
	.rh-page .rh-layout__side .rh-filters { display: none !important; }
	.rh-page .rh-layout__side.rh-side-open .rh-filters { display: block !important; }
	.rh-page .rh-layout__side { margin-bottom: 12px !important; }

	/* shorter panels so the list is reachable without endless scrolling */
	.rh-page .rh-filters .rh-panel__body { max-height: 240px !important; overflow-y: auto !important; }
	.rh-page .rh-filters .rh-panel__body::-webkit-scrollbar { width: 4px; }
	.rh-page .rh-filters .rh-panel__body::-webkit-scrollbar-thumb { background: #dfe4ec; border-radius: 4px; }
}
