/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

.location-explorer {
	--le-border-color: rgba(100, 87, 111, 0.20);
	--le-panel-border-color: var(--le-border-color);
	--le-surface: #FFFFFF;
	--le-text: inherit;
	--le-muted-text: #64576F;
	--le-accent: #6D1E2A;
	--le-panel-padding-y: 60px;
	--le-panel-padding-x: 40px;
	--le-accordion-item-gap: 0;
	--le-infowindow-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.08);
	--le-infowindow-width: 244px;
	--le-marker-image-height: 160px;

	min-height: 700px;
	border: 0;
	border-top: 1px solid var(--le-border-color);
	overflow: hidden;
}

.location-explorer__layout {
	display: flex;
	width: 100%;
	min-height: 700px;
}

.location-explorer__map {
	flex: 1 1 auto;
	min-width: 0;
	height: 700px;
}

.location-explorer__panel {
	flex: 0 0 26%;
	background: #FFF;
	z-index: 2;
	box-shadow: -6px 0 30px 0 rgba(0, 0, 0, 0.10);
}

@media (min-width: 992px) {
	.location-explorer__panel {
		min-width: 450px;
	}
}

@media (max-width: 991px) {
	.location-explorer__layout {
		flex-direction: column;
		min-height: 0;
	}

	.location-explorer__panel {
		flex: 0 0 auto;
	}
}

.location-explorer .acf-map {
	height: 100%;
	min-height: 100%;
	visibility: visible;
	margin: 0;
}

	@media (max-width: 991px) {
		.location-explorer .acf-map {
			min-height: 500px;
			border-bottom: 1px solid var(--le-border-color);
		}
	}

	.location-explorer .acf-map .gm-style .gm-style-iw-c {
		width: var(--le-infowindow-width);
		background: var(--le-surface);
		box-shadow: var(--le-infowindow-shadow);
	}

	.location-explorer .acf-map .gm-style .gm-style-iw-c:after {
		content: "";
		width: 20px;
		height: 20px;
		transform: rotate(-45deg);
		position: absolute;
		bottom: -10px;
		left: calc(50% - 10px);
		display: block;
		background: var(--le-surface);
		box-shadow: var(--le-infowindow-shadow);
		z-index: -1;
	}

	.location-explorer .acf-map .gm-style .gm-style-iw-d {
		background: var(--le-surface);
	}

	.location-explorer .acf-map .gm-style .gm-style-iw-c .gm-style-iw-d+button[style] {
		background: rgba(255,255,255,0.5);
	}

	.location-explorer .gm-style-pbc[style] {
		display: none !important;
	}

	.location-explorer .marker__image {
		width: 100%;
		height: var(--le-marker-image-height);
		position: relative;
		display: block;
	}

		.location-explorer .marker__image img {
			position: absolute;
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
		}
	
	.location-explorer .acf-map .gm-style .gm-style-iw-c .marker__body {
		padding: 20px;
	}

	.location-explorer .marker__heading {
		margin: 0;
	}

	.location-explorer .marker__content {
		margin-top: 12px;
		color: var(--le-muted-text);
	}

		.location-explorer .marker__content :last-child {
			margin-bottom: 0;
		}

.location-explorer__title.h4 {
	margin: 0 0 32px;
	color: var(--le-accent);
}


.location-explorer__content {
	border-left: 1px solid var(--le-panel-border-color);
	height: 100%;
	padding: var(--le-panel-padding-y) var(--le-panel-padding-x);
	position: relative;
	display: block;
	height: 700px;
	overflow-y: scroll;
}

@media (max-width: 991px) {
	.location-explorer__content {
		border-left: 0;
	}
}

@media (max-width: 991px) {
	.location-explorer__content {
		min-height: 420px;
	}
}

.location-explorer__accordion {
	position: relative;
	display: block;
	border-bottom: 1px solid var(--le-panel-border-color);
	margin-bottom: 10px;
}

	h6.location-explorer__card-header-title {
		margin: 0;
		padding: 20px 0;
		display: flex;
		width: 100%;
		align-items: center;
		cursor: pointer;
		color: var(--le-accent);
	}

	.location-explorer__accordion-chevron {
		margin-left: auto;
		transition: 0.2s all;
		transform: rotate(0deg);
		color: currentColor;
	}

	h6.location-explorer__card-header-title.active .location-explorer__accordion-chevron {
		transform: rotate(-180deg);
	}

	.location-explorer__accordion .location-explorer__card-body {
		padding-bottom: 30px;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}

	.location-explorer__accordion .location-explorer__card-body a {
		display: block;
		color: var(--le-muted-text);
		text-decoration: none;
	}

.location-explorer__accordion .location-explorer__collapse {
	transition: 0.2s all;
}

.location-explorer__accordion .location-explorer__collapse:not(.show) {
	display: block;
	max-height: 0;
	overflow: hidden;
	height: 100%;
	opacity: 0;
}

.location-explorer__accordion .location-explorer__collapse.show {
	margin-bottom: var(--le-accordion-item-gap);
	max-height: 100%;
	opacity: 1;
}

.location-explorer .gm-style .gm-style-iw-c {
	border-radius: 0;
	padding: 0;
}

.location-explorer .gm-style .gm-style-iw-d[style] {
	overflow: hidden!important;
}
