/**
 * Trees for Scouts — coverage map.
 *
 * Plugin-owned so the map works under any theme. Every Leaflet override is
 * scoped under .tfs-coverage-map so other Leaflet maps on the site are
 * untouched. Values are theme tokens with hex fallbacks approximating the
 * oklch tokens in the treesforscouts theme's assets/css/tokens.css.
 */

.tfs-coverage-map {
	position: relative;
}

.tfs-coverage-map__canvas {
	height: var(--tfs-map-height, 480px);
	min-height: 280px;
	background: var(--fir-wash, #e3efe6);
	font-family: var(--font-ui, sans-serif);
}

@media (max-width: 600px) {
	.tfs-coverage-map__canvas {
		height: min(var(--tfs-map-height, 480px), 70vh);
	}
}

/* Zip polygons */

.tfs-coverage-map .tfs-zip {
	fill: transparent;
	stroke: var(--ink-3, #8a918b);
	stroke-width: 0.6;
	stroke-opacity: 0.5;
}

.tfs-coverage-map .tfs-zip--covered {
	fill: var(--moss, #6f9660);
	fill-opacity: 0.45;
	stroke: var(--fir, #264a35);
	stroke-width: 1;
	stroke-opacity: 0.9;
}

.tfs-coverage-map .tfs-zip--selected {
	stroke: var(--gold, #c9a04a);
	stroke-width: 3;
	stroke-opacity: 1;
}

.tfs-coverage-map .tfs-zip:hover {
	fill-opacity: 0.6;
}

.tfs-coverage-map .tfs-zip:not(.tfs-zip--covered):hover {
	fill: var(--paper-3, #e3ded2);
}

/* Legend */

.tfs-coverage-map__legend {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-4, 1rem);
	padding: var(--s-3, 0.75rem) var(--s-4, 1rem);
	font: var(--fs-2xs, 0.75rem) / 1.3 var(--font-ui, sans-serif);
	color: var(--text-muted, #5b6b5c);
}

.tfs-coverage-map__key {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.tfs-coverage-map__key::before {
	content: '';
	display: inline-block;
	width: 12px;
	height: 12px;
}

.tfs-coverage-map__key--covered::before {
	background: var(--moss, #6f9660);
	border: 1px solid var(--fir, #264a35);
}

.tfs-coverage-map__key--selected::before {
	background: transparent;
	border: 2px solid var(--gold, #c9a04a);
}

/* No-JS / screen-reader list */

.tfs-coverage-map__list {
	padding: var(--s-3, 0.75rem) var(--s-4, 1rem);
	font: var(--fs-2xs, 0.75rem) / 1.3 var(--font-ui, sans-serif);
	color: var(--text-muted, #5b6b5c);
}

.tfs-coverage-map__list summary {
	cursor: pointer;
	color: var(--text-body, #1c2a1d);
}

/* Leaflet popup, restyled to match the print-like design */

.tfs-coverage-map .leaflet-popup-content-wrapper {
	border-radius: var(--r-1, 2px);
	box-shadow: var(--shadow-print, 3px 3px 0 #222);
	font-family: var(--font-ui, sans-serif);
}

.tfs-map-popup__zip {
	font-weight: 700;
	margin-bottom: 4px;
}

.tfs-map-popup__units {
	list-style: none;
	margin: 0 0 8px;
	padding: 0;
}

.tfs-map-popup__units li {
	margin-bottom: 6px;
}

.tfs-map-popup__tags {
	display: block;
	font-size: var(--fs-2xs, 0.75rem);
	color: var(--text-muted, #5b6b5c);
}

.tfs-map-popup__more {
	display: inline-block;
	margin-top: 2px;
}