/* TFM Maps Frontend Styles */

.tfmmaps-frontend-app {
	width: 100%;
	height: 500px; /* Default height, can be overridden by shortcode attribute */
	min-height: 400px;
	max-width: 100%; /* Ensure map doesn't overflow container */
	position: relative;
	overflow: visible;
	box-sizing: border-box;
}

/* Force AMCharts legend elements to be visible - CRITICAL for theme compatibility */
.tfmmaps-frontend-app text,
.tfmmaps-frontend-app tspan {
	fill: #000 !important;
	color: #000 !important;
	opacity: 1 !important;
	visibility: visible !important;
	display: inline !important;
	font-size: 14px !important;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

/* Force all SVG elements in map container to be visible */
.tfmmaps-frontend-app svg,
.tfmmaps-frontend-app svg * {
	visibility: visible !important;
	opacity: 1 !important;
}

/* Ensure legend container and all children are visible */
.tfmmaps-frontend-app g[role="group"],
.tfmmaps-frontend-app g[aria-label] {
	opacity: 1 !important;
	visibility: visible !important;
	display: block !important;
}

/* Force legend background to be visible */
.tfmmaps-frontend-app rect[fill="#ffffff"],
.tfmmaps-frontend-app rect[fill="rgb(255, 255, 255)"] {
	opacity: 0.9 !important;
	visibility: visible !important;
}

/* Ensure legend markers (colored rectangles) are visible */
.tfmmaps-frontend-app g[role="group"] > g > rect {
	opacity: 1 !important;
	visibility: visible !important;
	display: block !important;
	stroke-opacity: 1 !important;
	fill-opacity: 1 !important;
}

/* Ensure all SVG elements within the map container are rendered */
.tfmmaps-frontend-app svg {
	overflow: visible !important;
}

.tfmmaps-frontend-app svg * {
	visibility: visible !important;
}

/* Allow pointer events to pass through to map */
.tfmmaps-frontend-app .am5-html-container {
	pointer-events: none !important;
}

/* Ensure legend is visible but doesn't block map interaction */
.tfmmaps-frontend-app g[aria-label*="Legend"] {
	pointer-events: none !important;
}

/* Responsive sizing */
@media (max-width: 768px) {
	.tfmmaps-frontend-app {
		height: 400px;
		min-height: 300px;
	}
}
