/* Add these styles at the top of the file */
#map {
    z-index: 0;
    position: relative;
}

/* Ensure the map tiles are visible */
.leaflet-tile-container img {
    width: 256px !important;
    height: 256px !important;
}

.marker-popup {
    padding: 8px;
    max-width: 200px;
}

.marker-popup h4 {
    margin: 0 0 8px 0;
    color: #333;
    font-size: 16px;
}

.marker-popup p {
    margin: 4px 0;
    color: #666;
    font-size: 14px;
}

/* Add these styles to your existing CSS */
.custom-marker {
    background: none;
    border: none;
}

.custom-marker svg {
    filter: drop-shadow(3px 3px 2px rgba(0, 0, 0, 0.3));
}