/* Wizi Listings Grid */
.wre-listings-grid {
	--wre-lg-navy: #1e2c38;
	--wre-lg-accent: #b26a2b;
	--wre-lg-line: rgba(30, 44, 56, 0.12);
	--wre-lg-muted: rgba(30, 44, 56, 0.62);
	--wre-lg-gap: 14px;
	--wre-lg-cols: 4;
}

.wre-listings-grid__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 18px;
}

.wre-listings-grid__tab {
	appearance: none;
	-webkit-appearance: none;
	border: 1px solid var(--wre-lg-line);
	background: #fff;
	border-radius: 999px;
	padding: 8px 14px;
	font-size: 13px;
	font-weight: 600;
	color: var(--wre-lg-muted);
	cursor: pointer;
	line-height: 1.2;
	text-decoration: none !important;
	box-shadow: none;
	outline: none;
	outline-offset: 0;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.wre-listings-grid__tab:hover,
.wre-listings-grid__tab:focus,
.wre-listings-grid__tab:focus-visible,
.wre-listings-grid__tab:active {
	text-decoration: none !important;
	outline: none !important;
	box-shadow: none;
}

.wre-listings-grid__tab:hover {
	border-color: var(--wre-lg-hover-border, var(--wre-lg-navy));
	color: var(--wre-lg-hover-color, var(--wre-lg-navy));
	background: var(--wre-lg-hover-bg, #fff);
}

.wre-listings-grid__tab.is-active {
	background: var(--wre-lg-navy);
	border-color: var(--wre-lg-navy);
	color: #fff;
}

.wre-listings-grid__tab.is-active:hover {
	background: var(--wre-lg-active-hover-bg, var(--wre-lg-navy));
	border-color: var(--wre-lg-active-hover-border, var(--wre-lg-navy));
	color: var(--wre-lg-active-hover-color, #fff);
}

.wre-listings-grid__results {
	display: grid;
	gap: var(--wre-lg-gap);
	grid-template-columns: repeat(var(--wre-lg-cols), minmax(0, 1fr));
	position: relative;
	min-height: 40px;
}

.wre-listings-grid__results.is-loading {
	opacity: 0.55;
	pointer-events: none;
}

.wre-listings-grid__item {
	min-width: 0;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.wre-listings-grid__item:hover {
	transform: translateY(-4px);
}

.wre-listings-grid__empty {
	grid-column: 1 / -1;
	margin: 0;
	padding: 24px 0;
	color: var(--wre-lg-muted);
	font-size: 14px;
}

@media (max-width: 1024px) {
	.wre-listings-grid {
		--wre-lg-cols: var(--wre-lg-cols-tablet, 2);
	}
}

@media (max-width: 767px) {
	.wre-listings-grid {
		--wre-lg-cols: var(--wre-lg-cols-mobile, 1);
	}
}