/* Leaflet specific styles that can't be replaced by Tailwind */
.leaflet-control-container {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.leaflet-popup-content {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Material design markers */
.start-marker,
.end-marker {
    border: none !important;
    background: transparent !important;
}

/* Chart.js canvas styles */
canvas {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

/* SVG plot styling */
svg {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

/* Hover highlight styles */
.hover-highlight {
    pointer-events: none;
}

.custom-tooltip {
    background: rgba(0, 0, 0, 0.8) !important;
    border: none !important;
    border-radius: 4px !important;
    color: white !important;
    font-size: 12px !important;
    padding: 8px !important;
}

/* Chart container positioning */
#speedChart, #elevationChart, #windChart {
    position: relative;
    overflow: visible;
}

/* Visibility control classes */
.show {
    display: block !important;
}

.hide {
    display: none !important;
}

/* Ensure overlays work properly */
.chart-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    cursor: default; /* Remove crosshair */
    pointer-events: auto;
    z-index: 10;
}