.mal-clubs-map {
	--mal-map-bg: var(--mal-bg, #0b0b0d);
	--mal-map-surface: var(--mal-surface, #141418);
	--mal-map-surface-2: var(--mal-surface-2, #1c1c22);
	--mal-map-border: var(--mal-border, #2a2a32);
	--mal-map-text: var(--mal-text, #f3f3f5);
	--mal-map-muted: var(--mal-text-muted, #a0a0ab);
	--mal-map-brand: var(--mal-brand, #0085ca);
	margin: 1.5rem 0 2rem;
	color: var(--mal-map-text);
	font-family: var(--mal-font-body, Figtree, system-ui, sans-serif);
}

.mal-clubs-map__title {
	margin: 0 0 0.75rem;
	font-family: var(--mal-font-display, "Bodoni Moda", Georgia, serif);
	font-weight: 600;
	font-size: clamp(1.5rem, 2.5vw, 2rem);
	color: var(--mal-map-text);
}

.mal-clubs-map__regions {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.35rem;
	margin: 0 0 0.65rem;
}

.mal-clubs-map button.mal-clubs-map__region,
.mal-clubs-map .mal-clubs-map__region {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 0.7rem 0.55rem;
	margin: 0;
	border: 1px solid var(--mal-map-border) !important;
	border-radius: 3px;
	background: var(--mal-map-surface) !important;
	background-color: var(--mal-map-surface) !important;
	background-image: none !important;
	box-shadow: none !important;
	color: var(--mal-map-muted) !important;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
	font-family: var(--mal-font-ui, Syne, system-ui, sans-serif);
	font-weight: 600;
	font-size: clamp(0.7rem, 1.8vw, 0.8125rem);
	letter-spacing: 0.04em;
	line-height: 1.25;
	text-transform: uppercase;
	appearance: none;
	-webkit-appearance: none;
}

.mal-clubs-map button.mal-clubs-map__region:hover,
.mal-clubs-map button.mal-clubs-map__region:focus-visible,
.mal-clubs-map .mal-clubs-map__region:hover,
.mal-clubs-map .mal-clubs-map__region:focus-visible {
	background: var(--mal-map-surface-2) !important;
	background-color: var(--mal-map-surface-2) !important;
	border-color: var(--mal-map-brand) !important;
	color: var(--mal-map-text) !important;
	outline: none;
}

.mal-clubs-map button.mal-clubs-map__region.is-active,
.mal-clubs-map .mal-clubs-map__region.is-active {
	background: var(--mal-map-surface-2) !important;
	background-color: var(--mal-map-surface-2) !important;
	border-color: var(--mal-map-brand) !important;
	color: var(--mal-map-brand) !important;
}

.mal-clubs-map__canvas-wrap {
	height: min(52vh, 22rem);
	min-height: 16rem;
	border: 1px solid var(--mal-map-border);
	background: var(--mal-map-bg);
	overflow: hidden;
}

@media (min-width: 900px) {
	.mal-clubs-map__canvas-wrap {
		height: min(62vh, 26rem);
		min-height: 22rem;
	}
}

.mal-clubs-map__canvas {
	width: 100%;
	height: 100%;
	min-height: 0;
}

.mal-clubs-map__info {
	color: #141418;
	font-family: Figtree, system-ui, sans-serif;
	max-width: 16rem;
}

.mal-clubs-map__info strong {
	display: block;
	margin-bottom: 0.35rem;
	font-family: Syne, system-ui, sans-serif;
	font-size: 0.9rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.mal-clubs-map__info p {
	margin: 0 0 0.35rem;
	font-size: 0.85rem;
	line-height: 1.4;
}

.mal-clubs-map__info a {
	color: #0085ca;
	font-weight: 600;
	text-decoration: none;
}

.mal-clubs-map__empty {
	color: var(--mal-text-muted, #a0a0ab);
}

@media (max-width: 520px) {
	.mal-clubs-map__regions {
		gap: 0.25rem;
	}

	.mal-clubs-map button.mal-clubs-map__region,
	.mal-clubs-map .mal-clubs-map__region {
		padding: 0.6rem 0.35rem;
		font-size: 0.65rem;
		letter-spacing: 0.03em;
	}
}