#map {
    height: 100%;
    width: 100%;
}

.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
    background-color: #191c16 !important;
    color: #e2e8f0 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 1.25rem !important;
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.5), 0 8px 10px -6px rgb(0 0 0 / 0.5) !important;
}

.leaflet-popup-content {
    margin: 0 !important;
    padding: 0 !important;
}

.leaflet-popup-content a {
    color: #FFFFFF !important;
}

.leaflet-popup-close-button {
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) !important;
    z-index: 1000 !important;
}

.custom-park-icon {
    background: transparent !important;
    border: transparent !important;
}

.custom-park-icon svg {
    transition: transform 0.2s ease, filter 0.2s ease;
    transform-origin: bottom center;
}

.highlighted-marker svg {
    transform: scale(1.35);
    filter: drop-shadow(0 6px 8px rgba(0, 0, 0, 0.5)) !important;
}

.highlighted-marker svg path:first-child {
    fill: var(--contrast-text-color) !important;
    stroke: #ffffff !important;
    stroke-width: 2px !important;
}

.custom-user-dot {
    background: transparent !important;
    border: transparent !important;
}

.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: var(--container-color);
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 3px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #a1a1aa;
}

/* Mobile Split-Screen Layout (2/3 Map, 1/3 List) */
.mobile-content-wrapper {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 0% !important;
    min-height: 0 !important;
}

.mobile-map-container {
    flex: 2 1 0% !important;
    position: relative !important;
    width: 100% !important;
    min-height: 0 !important;
    z-index: 0;
}

.mobile-list-container {
    flex: 1 1 0% !important;
    overflow-y: auto !important;
    width: 100% !important;
    min-height: 0 !important;
}