.map-container{width:100%;height:100%;position:absolute;top:0;left:0;right:0;bottom:0;z-index:500}.route-toast{position:absolute;top:20px;left:50%;transform:translateX(-50%);background-color:rgba(0,0,0,.65);color:white;padding:12px 24px;border-radius:8px;font-size:16px;font-weight:500;z-index:1000;box-shadow:0 4px 12px rgba(0,0,0,.3);animation:toast-fade-in .3s ease-out;pointer-events:none}.route-toast.fade-out{animation:toast-fade-out .3s ease-out forwards}@keyframes toast-fade-in{0%{opacity:0;transform:translateX(-50%) translateY(-10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}@keyframes toast-fade-out{0%{opacity:1;transform:translateX(-50%) translateY(0)}to{opacity:0;transform:translateX(-50%) translateY(-10px)}}.location-watch-toggle{position:absolute;bottom:5px;right:5px;width:40px;height:40px;padding:6px 12px;border-radius:50px;cursor:pointer;font-size:12px;z-index:900;box-shadow:0 2px 4px rgba(0,0,0,.2);color:white;display:flex;align-items:center;justify-content:center;background-color:white;transition:background-color .2s ease;&.active{background-color:rgb(165,240,255)}&:active{background-color:#e5e5e5}&.active:active{background-color:rgb(145,220,235)}svg{width:20px}}.current-location-marker{width:22px;height:22px;position:relative}.location-dot{background:#4285F4;width:16px;height:16px;border-radius:50%;border:3px solid white;box-shadow:0 0 3px rgba(0,0,0,.2)}.location-dot,.location-pulse{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.location-pulse{background:rgba(66,133,244,.15);width:22px;height:22px;border-radius:50%;animation:pulse 2s ease-out infinite}@keyframes pulse{0%{transform:translate(-50%,-50%) scale(.5);opacity:1}to{transform:translate(-50%,-50%) scale(2);opacity:0}}.highlight-marker{width:50px;height:50px;border-radius:50%;background-color:rgba(59,130,246,.3);animation:pulse-highlight 2s ease-out infinite}@keyframes pulse-highlight{0%{transform:scale(.8);opacity:1}to{transform:scale(2);opacity:0}}.map-marker{cursor:pointer}.attraction-marker .marker-icon,.bike-marker .marker-icon{width:48px;height:48px;border-radius:50%;background-color:#ffffff;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 8px rgba(0,0,0,.3);position:relative}.attraction-marker .marker-icon{border:3px solid #3b82f6}.bike-marker .marker-icon{border:3px solid #34d399}.marker-icon i{font-size:22px;position:relative}.attraction-marker .marker-icon i{color:#3b82f6}.bike-marker .marker-icon i{color:#34d399}.custom-popup{border-radius:12px!important;overflow:hidden}.custom-popup .mapboxgl-popup-content{border-radius:12px;padding:15px;box-shadow:0 3px 8px rgba(0,0,0,.15)}.custom-popup .mapboxgl-popup-close-button{position:absolute;width:30px;height:30px;font-size:24px;font-family:Arial,sans-serif;color:#666;background:transparent;border:none;border-radius:50%;cursor:pointer;right:5px;top:5px;text-align:center;line-height:22px;padding:0;transition:background-color .2s}.custom-popup .mapboxgl-popup-close-button:hover{background-color:rgba(0,0,0,.05)}.map-popup{padding:8px;max-width:280px}.map-popup h3{margin-top:0;margin-bottom:8px;font-size:16px;font-weight:600}.map-popup p{margin-bottom:8px;font-size:14px;line-height:1.4}.map-popup p.address{margin-top:10px;border-top:1px solid #eee;padding-top:8px}.map-popup a{color:#3b82f6;text-decoration:none}.map-popup a:hover{text-decoration:underline}