/**
 * cav/locations-map — OpenStreetMap (MapLibre) presentation.
 *
 * Reproduces what the old Google map drew around the theme's own markup:
 * Roboto (Google Maps used to inject it), the info card and its tail, the
 * dark zoom control, the attribution strip and the "⌘ + scroll" overlay.
 * Measurements were taken from the live Google map on lcswma.org.
 */

@font-face {
	font-display: swap;
	font-family: Roboto;
	font-style: normal;
	font-weight: 400;
	src: url(vendor/roboto-latin-400-normal.woff2) format("woff2");
}

@font-face {
	font-display: swap;
	font-family: Roboto;
	font-style: normal;
	font-weight: 700;
	src: url(vendor/roboto-latin-700-normal.woff2) format("woff2");
}

.cav-locations-map .cav-locations-map__canvas.maplibregl-map {
	font: 400 11px Roboto, Arial, sans-serif;
}

/* Pins: a fixed 57 x 59.5 box (what the inline SVG produced under Google), bottom on the point. */
.cav-locations-map .cav-map-marker {
	cursor: pointer;
	height: 59.5px;
	width: 57px;
	z-index: 1;
}

.cav-locations-map .cav-map-marker svg {
	display: block;
}

.cav-locations-map .cav-map-cluster {
	cursor: pointer;
	font-family: Roboto, Arial, sans-serif;
	z-index: 2;
}

.cav-locations-map .maplibregl-ctrl-bottom-right {
	z-index: 3;
}

/* ---------- Info card (Google InfoWindow) ---------- */

.cav-locations-map .maplibregl-popup.cav-map-popup {
	z-index: 4;
}

.cav-map-popup .maplibregl-popup-tip {
	display: none;
}

.cav-map-popup .maplibregl-popup-content {
	background: none;
	border-radius: 0;
	box-shadow: none;
	padding: 0;
}

.cav-map-popup__inner {
	align-items: center;
	display: flex;
	flex-direction: column;
}

.cav-map-popup__card {
	background-color: #fff;
	border-radius: 8px;
	box-shadow: 0 2px 7px 1px rgba(0, 0, 0, 0.3);
	box-sizing: border-box;
	overflow: hidden auto;
	position: relative;
	width: 451px;
}

.cav-map-popup .cav-map-popup__close {
	appearance: none;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	cursor: pointer;
	display: block;
	height: 48px;
	margin: 0;
	min-height: 0;
	min-width: 0;
	opacity: 0.6;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 48px;
	z-index: 1;
}

.cav-map-popup .cav-map-popup__close:hover,
.cav-map-popup .cav-map-popup__close:focus-visible {
	opacity: 1;
}

.cav-map-popup .cav-map-popup__close span {
	background-color: #fff;
	display: block;
	height: 24px;
	margin: 12px;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E") center / 24px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E") center / 24px no-repeat;
	width: 24px;
}

.cav-map-popup__tail {
	filter: drop-shadow(0 4px 2px rgba(178, 178, 178, 0.4));
	height: 12px;
	margin-top: -1px;
	position: relative;
	width: 25px;
}

.cav-map-popup__tail::after {
	background-color: #fff;
	clip-path: polygon(0 0, 50% 100%, 100% 0);
	content: "";
	inset: 0;
	position: absolute;
}

/* Below 1024px the theme's full-screen modal shows the details instead. */
@media only screen and (max-width: 1023px) {
	.cav-locations-map .maplibregl-popup.cav-map-popup {
		display: none;
	}
}

/* ---------- Zoom control (Google dark scheme) ---------- */

.cav-locations-map .maplibregl-ctrl-bottom-right .maplibregl-ctrl-group {
	background-color: #444;
	border-radius: 2px;
	box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.3);
	margin: 0 10px 10px 0;
}

.cav-locations-map .maplibregl-ctrl-group button {
	background-color: #444;
	height: 40px;
	position: relative;
	width: 40px;
}

.cav-locations-map .maplibregl-ctrl-group button + button {
	border-top: 0;
	margin-top: 1px;
}

.cav-locations-map .maplibregl-ctrl-group button + button::before {
	background-color: #1a1a1a;
	content: "";
	height: 1px;
	left: 5px;
	position: absolute;
	right: 5px;
	top: -1px;
}

.cav-locations-map .maplibregl-ctrl button:not(:disabled):hover {
	background-color: #444;
}

.cav-locations-map .maplibregl-ctrl button .maplibregl-ctrl-icon {
	background-size: 28px;
}

.cav-locations-map .maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23b3b3b3' viewBox='0 -960 960 960'%3E%3Cpath d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80z'/%3E%3C/svg%3E");
}

.cav-locations-map .maplibregl-ctrl button.maplibregl-ctrl-zoom-in:not(:disabled):hover .maplibregl-ctrl-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23e6e6e6' viewBox='0 -960 960 960'%3E%3Cpath d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80z'/%3E%3C/svg%3E");
}

.cav-locations-map .maplibregl-ctrl button.maplibregl-ctrl-zoom-in:not(:disabled):active .maplibregl-ctrl-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 -960 960 960'%3E%3Cpath d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80z'/%3E%3C/svg%3E");
}

.cav-locations-map .maplibregl-ctrl button.maplibregl-ctrl-zoom-in:disabled .maplibregl-ctrl-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%234e4e4e' viewBox='0 -960 960 960'%3E%3Cpath d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80z'/%3E%3C/svg%3E");
	opacity: 1;
}

.cav-locations-map .maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23b3b3b3' viewBox='0 -960 960 960'%3E%3Cpath d='M200-440v-80h560v80z'/%3E%3C/svg%3E");
}

.cav-locations-map .maplibregl-ctrl button.maplibregl-ctrl-zoom-out:not(:disabled):hover .maplibregl-ctrl-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23e6e6e6' viewBox='0 -960 960 960'%3E%3Cpath d='M200-440v-80h560v80z'/%3E%3C/svg%3E");
}

.cav-locations-map .maplibregl-ctrl button.maplibregl-ctrl-zoom-out:not(:disabled):active .maplibregl-ctrl-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 -960 960 960'%3E%3Cpath d='M200-440v-80h560v80z'/%3E%3C/svg%3E");
}

.cav-locations-map .maplibregl-ctrl button.maplibregl-ctrl-zoom-out:disabled .maplibregl-ctrl-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%234e4e4e' viewBox='0 -960 960 960'%3E%3Cpath d='M200-440v-80h560v80z'/%3E%3C/svg%3E");
	opacity: 1;
}

/* ---------- Attribution strip ---------- */

.cav-locations-map .maplibregl-ctrl-bottom-right .maplibregl-ctrl.maplibregl-ctrl-attrib {
	background-color: rgba(0, 0, 0, 0.7);
	color: #fff;
	font: 400 10px/14px Roboto, Arial, sans-serif;
	margin: 0;
	padding: 0 6px;
}

.cav-locations-map .maplibregl-ctrl-attrib a {
	color: #fff;
	text-decoration: none;
}

.cav-locations-map .maplibregl-ctrl-attrib a:hover {
	color: #fff;
	text-decoration: underline;
}

/* ---------- "Use ⌘ + scroll to zoom the map" ---------- */

.cav-locations-map .maplibregl-cooperative-gesture-screen {
	background: rgba(0, 0, 0, 0.45);
	font-family: Roboto, Arial, sans-serif;
	font-size: 22px;
	text-align: center;
}