/* Selection remains legible on the original multi-colour SVG map. */
#mobile-svg[data-scheme-highlights-active] path[data-scheme-highlight-selected] {
	fill: var(--scheme-highlight-fill) !important;
}

.scheme-highlight-layer {
	display: none;
}

.scheme-highlight-layer.is-active {
	display: block;
}

.scheme-highlight-layer,
.scheme-highlight-layer * {
	pointer-events: none !important;
}

.scheme-highlight-shade {
	fill: #17202c;
	fill-opacity: 0.3;
}

.scheme-highlight-outline {
	stroke-linecap: round;
	stroke-linejoin: round;
}

.scheme-highlight-outline--outer {
	stroke: #00999a;
	stroke-width: 6px;
}

.scheme-highlight-outline--inner {
	stroke: #fff;
	stroke-width: 2px;
}

.scheme-result-marker {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	padding: 4px 8px;
	border: 2px solid #fff;
	border-radius: 9px;
	background: #00999a;
	color: #fff;
	box-shadow: 0 3px 12px rgba(0, 58, 59, 0.4);
	font-family: Montserrat, Arial, sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 20px;
	text-align: center;
	white-space: nowrap;
	cursor: pointer;
}

.scheme-result-marker::after {
	position: absolute;
	bottom: -7px;
	left: 50%;
	width: 0;
	height: 0;
	border-top: 6px solid #fff;
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
	content: '';
	transform: translateX(-50%);
}

.scheme-result-marker--hover {
	position: absolute;
	z-index: 600;
	min-width: 44px;
	min-height: 32px;
	margin-top: -8px;
	transform: translate(-50%, -100%);
	pointer-events: none;
	cursor: default;
}

.scheme-result-marker--hover[hidden] {
	display: none;
}

@media (max-width: 767px), (hover: none), (pointer: coarse) {
	.scheme-result-marker--hover {
		display: none;
	}
}
