.map-view-container{background:#fff;border-radius:12px;margin:20px 0;overflow:hidden;box-shadow:0 4px 6px #0000001a}.map-header{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;padding:20px;display:flex}.map-header h2{margin:0;font-size:1.5rem;font-weight:600}.map-controls{flex-wrap:wrap;align-items:center;gap:15px;display:flex}.btn-location{color:#fff;cursor:pointer;background:#fff3;border:1px solid #ffffff4d;border-radius:6px;padding:8px 16px;font-size:14px;font-weight:500;transition:all .3s}.btn-location:hover{background:#ffffff4d;transform:translateY(-1px)}.device-count{background:#ffffff1a;border-radius:20px;padding:6px 12px;font-size:14px;font-weight:500}.map-container{border-radius:12px;width:100%;height:500px;min-height:600px;position:relative;overflow:hidden;box-shadow:0 10px 25px #0000001a}.map-container>div{border-radius:12px;width:100%!important;height:100%!important}.map-loading{color:#6c757d;background:#f8f9fa;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;height:400px;display:flex}.loading-spinner{border:4px solid #e9ecef;border-top-color:#007bff;border-radius:50%;width:40px;height:40px;margin-bottom:20px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.map-legend{background:#f8f9fa;border-top:1px solid #e9ecef;flex-wrap:wrap;align-items:center;gap:20px;padding:15px 20px;display:flex}.legend-item{color:#495057;align-items:center;gap:8px;font-size:14px;display:flex}.legend-marker{border:2px solid #fff;border-radius:50%;width:16px;height:16px;box-shadow:0 1px 3px #0003}.legend-marker.compliant{background-color:#28a745}.legend-marker.non-compliant{background-color:#dc3545}.legend-marker.technician{background-color:#007bff}.legend-marker.safe{background-color:#28a745}.legend-marker.warning{background-color:#ffc107}.legend-marker.danger{background-color:#dc3545}.leaflet-map{border-radius:8px;overflow:hidden}.leaflet-popup-content{min-width:200px;margin:8px}.device-popup h4{color:#333;margin:0 0 10px;font-size:16px;font-weight:600}.device-popup p{color:#666;margin:5px 0;font-size:14px}.device-popup strong{color:#333}.btn-select-device{color:#fff;cursor:pointer;background:#007bff;border:none;border-radius:4px;width:100%;margin-top:10px;padding:8px 16px;font-size:14px;font-weight:500;transition:background-color .3s}.btn-select-device:hover{background:#0056b3}.technician-popup h4{color:#007bff;margin:0 0 10px;font-size:16px;font-weight:600}.technician-popup p{color:#666;margin:5px 0;font-size:14px}.device-marker{cursor:pointer;transition:transform .2s}.device-marker:hover{transform:scale(1.2)}.technician-marker{cursor:pointer;filter:drop-shadow(0 2px 4px #0000004d);font-size:24px}@media (max-width:768px){.map-header{text-align:center;flex-direction:column;align-items:stretch}.map-controls{justify-content:center}.map-legend{text-align:center;flex-direction:column;align-items:stretch}.leaflet-map{height:400px!important}.map-container{min-height:400px}}@media (max-width:480px){.map-header{padding:15px}.map-header h2{font-size:1.3rem}.btn-location{padding:10px 20px;font-size:16px}.device-count{padding:8px 16px;font-size:16px}}.gps-manager-section{background:#f8f9fa;border-top:1px solid #e9ecef;padding:20px}.gps-device-manager{max-width:800px;margin:0 auto}.leaflet-control-zoom{border:2px solid #0003;border-radius:4px}.leaflet-control-zoom a{color:#333;background:#fff;border:none;border-bottom:1px solid #e9ecef;transition:all .3s}.leaflet-control-zoom a:hover{color:#007bff;background:#f8f9fa}.leaflet-control-zoom a:last-child{border-bottom:none}.leaflet-control-scale{color:#333;background:#fffc;border:2px solid #0003;border-radius:4px;padding:2px 5px;font-size:11px;font-weight:500}.leaflet-popup{animation:.3s ease-out popupFadeIn}@keyframes popupFadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.device-marker{animation:.6s ease-out markerBounce}@keyframes markerBounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}.map-loading p{color:#6c757d;margin:0;font-size:16px}.map-error{color:#721c24;background:#f8d7da;border:1px solid #f5c6cb;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;height:400px;display:flex}.map-error-icon{margin-bottom:20px;font-size:48px}.map-error-message{text-align:center;max-width:300px;font-size:16px}.daily-route-planner{margin:20px 0}.route-loading{color:#6c757d;background:#f8f9fa;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;height:200px;display:flex}.route-list{background:#f8f9fa;border-radius:8px;padding:20px}.route-map-container{border:1px solid #e9ecef;border-radius:8px;overflow:hidden}.route-map-header{border-bottom:1px solid #e9ecef}.route-map{border-radius:0 0 8px 8px}.route-marker{cursor:pointer;transition:transform .2s}.route-marker:hover{transform:scale(1.1)}.route-arrow{cursor:pointer;transition:transform .2s}.route-arrow:hover{transform:scale(1.1)}.route-popup h4{color:#007bff;margin:0 0 10px;font-size:16px;font-weight:600}.route-popup p{color:#666;margin:5px 0;font-size:14px}.route-popup strong{color:#333}@media (max-width:768px){.daily-route-planner,.route-list{padding:15px}.route-map{height:400px!important}}.google-maps-route-planner{font-family:Inter,sans-serif}.route-options-panel{border:1px solid #e5e7eb;transition:all .3s}.route-options-panel:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f61a}.route-options-panel input[type=checkbox]{accent-color:#3b82f6}.route-info-panel{border:1px solid #dbeafe;transition:all .3s}.route-info-panel:hover{border-color:#2563eb;box-shadow:0 4px 12px #2563eb1a}.map-container{border-radius:12px;position:relative;overflow:hidden;box-shadow:0 10px 25px #0000001a}.map-container>div{border-radius:12px}.booking-list{animation:.6s ease-out fadeInUp}.booking-list .grid>div{cursor:pointer;transition:all .3s}.booking-list .grid>div:hover{transform:translateY(-2px);box-shadow:0 8px 25px #00000026}.booking-list .grid>div button{transition:all .2s}.booking-list .grid>div button:hover{transform:scale(1.05)}.navigation-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border:none;border-radius:8px;padding:8px 16px;font-weight:600;transition:all .3s;box-shadow:0 2px 4px #10b98133}.navigation-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.navigation-button:active{transform:translateY(0)}.navigation-button:disabled{cursor:not-allowed;box-shadow:none;background:#9ca3af;transform:none}.btn-tracking{color:#fff;cursor:pointer;background:linear-gradient(135deg,#3b82f6 0%,#1d4ed8 100%);border:none;border-radius:8px;padding:8px 16px;font-weight:600;transition:all .3s;box-shadow:0 2px 4px #3b82f633}.btn-tracking:hover{transform:translateY(-2px);box-shadow:0 4px 12px #3b82f64d}.btn-tracking.active{background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%);box-shadow:0 2px 4px #dc262633}.btn-tracking.active:hover{box-shadow:0 4px 12px #dc26264d}.btn-center{color:#fff;cursor:pointer;background:linear-gradient(135deg,#8b5cf6 0%,#7c3aed 100%);border:none;border-radius:8px;padding:8px 16px;font-weight:600;transition:all .3s;box-shadow:0 2px 4px #8b5cf633}.btn-center:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #8b5cf64d}.btn-center:disabled{cursor:not-allowed;box-shadow:none;background:#9ca3af;transform:none}.btn-emergency{color:#fff;cursor:pointer;background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%);border:none;border-radius:8px;padding:8px 16px;font-weight:600;transition:all .3s;animation:2s infinite pulse;box-shadow:0 2px 4px #dc262633}.btn-emergency:hover{animation:none;transform:translateY(-2px);box-shadow:0 4px 12px #dc26264d}.btn-refresh{color:#fff;cursor:pointer;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border:none;border-radius:8px;padding:8px 16px;font-weight:600;transition:all .3s;box-shadow:0 2px 4px #10b98133}.btn-refresh:hover{transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.btn-refresh:active{transform:translateY(0)}.btn-route-planner{color:#fff;cursor:pointer;background:linear-gradient(135deg,#8b5cf6 0%,#7c3aed 100%);border:none;border-radius:8px;padding:8px 16px;font-weight:600;transition:all .3s;box-shadow:0 2px 4px #8b5cf633}.btn-route-planner:hover{transform:translateY(-2px);box-shadow:0 4px 12px #8b5cf64d}.btn-route-planner:active{transform:translateY(0)}@keyframes pulse{0%{box-shadow:0 2px 4px #dc262633}50%{box-shadow:0 2px 4px #dc262699}to{box-shadow:0 2px 4px #dc262633}}.safety-status{text-align:center;border-radius:20px;min-width:100px;padding:8px 16px;font-size:14px;font-weight:600}.safety-status.safe{color:#fff;background:linear-gradient(135deg,#10b981 0%,#059669 100%);box-shadow:0 2px 4px #10b9814d}.safety-status.warning{color:#fff;background:linear-gradient(135deg,#f59e0b 0%,#d97706 100%);box-shadow:0 2px 4px #f59e0b4d}.safety-status.alert{color:#fff;background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%);animation:2s infinite pulse;box-shadow:0 2px 4px #dc26264d}.safety-alerts-panel{background:#fef3c7;border:1px solid #f59e0b;border-radius:12px;margin:20px 0;padding:20px;box-shadow:0 4px 6px #0000001a}.safety-alerts-panel h3{color:#92400e;margin:0 0 15px;font-size:18px;font-weight:600}.alerts-list{flex-direction:column;gap:10px;display:flex}.alert-item{background:#fff;border-left:4px solid;border-radius:8px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:15px;display:flex}.alert-item.low{border-left-color:#10b981}.alert-item.medium{border-left-color:#f59e0b}.alert-item.high{border-left-color:#f97316}.alert-item.critical{background:#fef2f2;border-left-color:#dc2626}.alert-type{text-transform:uppercase;letter-spacing:.5px;font-size:12px;font-weight:600}.alert-message{color:#374151;flex:1}.alert-time{color:#6b7280;font-size:12px;font-weight:500}.technician-status-panel{background:#f0f9ff;border:1px solid #0ea5e9;border-radius:12px;margin:20px 0;padding:20px;box-shadow:0 4px 6px #0000001a}.technician-status-panel h3{color:#0369a1;margin:0 0 15px;font-size:18px;font-weight:600}.status-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;display:grid}.status-item{flex-direction:column;gap:5px;display:flex}.status-item .label{color:#64748b;text-transform:uppercase;letter-spacing:.5px;font-size:12px;font-weight:500}.status-item .value{color:#1e293b;font-size:14px;font-weight:600}.status-online{color:#059669!important}.status-busy{color:#d97706!important}.status-offline{color:#6b7280!important}.status-emergency{color:#dc2626!important;font-weight:700!important}.emergency-contacts-panel{background:#fef2f2;border:1px solid #fecaca;border-radius:12px;margin:20px 0;padding:20px;box-shadow:0 4px 6px #0000001a}.emergency-contacts-panel h3{color:#991b1b;margin:0 0 15px;font-size:18px;font-weight:600}.contacts-list{flex-direction:column;gap:15px;margin-bottom:15px;display:flex}.contact-item{background:#fff;border:1px solid #fecaca;border-radius:8px;justify-content:space-between;align-items:center;padding:12px;display:flex}.contact-label{color:#374151;font-weight:600}.contact-phone{color:#dc2626;background:#fef2f2;border-radius:6px;padding:8px 16px;font-weight:600;text-decoration:none;transition:all .3s}.contact-phone:hover{color:#b91c1c;background:#fecaca}.emergency-note{color:#6b7280;text-align:center;margin:0;font-size:14px;font-style:italic}.accuracy-tips-panel{background:#f0f9ff;border:1px solid #0ea5e9;border-radius:12px;margin:20px 0;padding:20px;box-shadow:0 4px 6px #0000001a}.accuracy-tips-panel h3{color:#0369a1;margin:0 0 15px;font-size:18px;font-weight:600}.tips-list{flex-direction:column;gap:12px;display:flex}.tip-item{background:#fff;border:1px solid #e0f2fe;border-radius:8px;align-items:center;gap:12px;padding:10px;display:flex}.tip-icon{text-align:center;width:24px;font-size:20px}.tip-text{color:#374151;font-size:14px;font-weight:500}.route-planner-quick-access{text-align:center;background:linear-gradient(135deg,#f0f9ff 0%,#e0f2fe 100%);border:1px solid #0ea5e9;border-radius:12px;margin:20px 0;padding:20px;box-shadow:0 4px 6px #0000001a}.route-planner-quick-access h3{color:#0369a1;margin:0 0 10px;font-size:20px;font-weight:600}.route-description{color:#64748b;margin:0 0 20px;font-size:14px;line-height:1.5}.btn-route-planner-large{color:#fff;cursor:pointer;background:linear-gradient(135deg,#8b5cf6 0%,#7c3aed 100%);border:none;border-radius:12px;width:100%;max-width:300px;padding:16px 32px;font-size:18px;font-weight:700;transition:all .3s;box-shadow:0 4px 8px #8b5cf64d}.btn-route-planner-large:hover{transform:translateY(-3px);box-shadow:0 8px 25px #8b5cf666}.btn-route-planner-large:active{transform:translateY(-1px)}.route-navigation-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border:none;border-radius:12px;padding:12px 24px;font-size:18px;font-weight:700;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 4px 8px #10b9814d}.route-navigation-button:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.route-navigation-button:hover:before{left:100%}.route-navigation-button:hover{transform:translateY(-3px)scale(1.02);box-shadow:0 8px 25px #10b98166}.route-navigation-button:active{transform:translateY(-1px)scale(1.01)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.route-options-panel .flex{flex-direction:column;gap:2rem}.route-info-panel .grid{grid-template-columns:1fr;gap:1rem}.booking-list .grid{grid-template-columns:1fr}.route-planner-quick-access{margin:15px 0;padding:15px}.btn-route-planner-large{max-width:100%;padding:14px 24px;font-size:16px}.map-controls{flex-direction:column;gap:10px}.btn-tracking,.btn-center,.btn-refresh,.btn-route-planner,.btn-emergency{width:100%;max-width:200px;margin:0 auto}}