.filtered-listings {
	#listing-container {
		&.active {
			gap: 4rem;

			#sidebar-nav {
				max-width: 22.5rem;
			}
		}
	}

	#all-filter-toggle {
		svg {
			transition: all 0.3s ease;
		}

		&.active svg {
			transform: rotate(90deg);
		}
	}

	button[data-filter] {
		&.active {
			background-color: #e6f5fd;
		}
	}
}

#price-slider {
	height: 8px;
	background: #e4e9f2;
	border-radius: 9px;
	border: 0;

	.noUi-handle {
		width: 30px;
		height: 30px;
		border-radius: 100%;
		box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
		top: -12px;
		border: 2px solid #235868;

		&:after,
		&:before {
			display: none;
		}
	}

	.noUi-connect {
		background: #235868;
	}
}

#listing-container {
	&.active {
		@media (max-width: 1440px) {
			.lg\:grid-cols-3 {
				grid-template-columns: repeat(2, minmax(0, 1fr));
			}
		}
		@media (max-width: 1024px) {
			.lg\:grid-cols-3 {
				grid-template-columns: repeat(1, minmax(0, 1fr));
			}
		}
	}
}

@media (max-width: 768px) {
	#sidebar-nav {
		margin-left: 0px;
		position: fixed;
		height: 100%;
		z-index: 10000;
		background: #fff;
		top: 0;

		.nav-inner {
			max-height: 100%;
		}
	}

	#listing-container.active #sidebar-nav {
		left: 0;
		width: 100vw;
		max-width: 100% !important;
	}
}