/* Liquid Glass Cursor Effect */
.liquid-cursor {
    position: fixed;
    width: 80px; /* Larger to show off the effect */
    height: 80px;
    border-radius: 50%;
    
    /* The Magic: Apply the SVG filter to the backdrop */
    background: radial-gradient(
        circle at 30% 30%,
        rgba(255, 255, 255, 0.15) 0%,
        rgba(255, 255, 255, 0.05) 40%,
        rgba(255, 255, 255, 0) 60%,
        rgba(0, 0, 0, 0.05) 100%
    );
    
    backdrop-filter: url(#liquid-glass);
    -webkit-backdrop-filter: url(#liquid-glass);
    
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-bottom-color: rgba(255, 255, 255, 0.2);
    border-right-color: rgba(255, 255, 255, 0.2);
    
    box-shadow: 
        /* Inner highlight for volume */
        inset 2px 2px 5px rgba(255, 255, 255, 0.4),
        inset -2px -2px 10px rgba(0, 0, 0, 0.1),
        /* Drop shadow for lift */
        0 10px 20px rgba(0, 0, 0, 0.2),
        0 5px 10px rgba(0, 0, 0, 0.1);
        
    pointer-events: none;
    transform: translate(-50%, -50%);
    z-index: 9999;
    transition: opacity 0.3s, transform 0.2s;
    opacity: 0; /* Hidden by default until hover */
}

.liquid-cursor.active {
    transform: translate(-50%, -50%) scale(1.1);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
}

/* Hide default cursor on map */
#map {
    cursor: none;
}

/* Ensure Leaflet controls are still usable */
.leaflet-control-container {
    cursor: auto;
}