

.map-container {
  position: relative !important; 
  display: inline-block !important; 
}

.gps-pin {
  position: absolute; 
  width: 20px;        
  height: 20px;
  background: linear-gradient(45deg, #f7c80c, #ffdb4d); 
  border: 3px solid #0F539A; 
  border-radius: 50% 50% 50% 0; 
  transform: rotate(-45deg); 
  cursor: pointer; 
  z-index: 10; 
  transition: all 0.3s ease; 
  box-shadow: 0 4px 12px rgba(0,0,0,0.3); 
  animation: pinPulse 2s infinite; 
}

.gps-pin::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  width: 8px;
  height: 8px;
  background: #ffffff;
  border-radius: 50%;
}

/* 🔧 HOVER MODIFICADO (2025-10-28): Solo tooltip visible, sin efecto de escala en el pin */
.gps-pin:hover {
  /* transform: rotate(-45deg) scale(1.3); */ /* ❌ Escala deshabilitada */
  /* box-shadow: 0 6px 20px rgba(0,0,0,0.5); */ /* ❌ Sombra extra deshabilitada */
  animation: none;
  z-index: 30;
}

.gps-pin:hover .pin-tooltip {
  z-index: 35;
}

@keyframes pinPulse {
  0% {
    box-shadow: 0 4px 12px rgba(0,0,0,0.3), 0 0 0 0 rgba(247, 200, 12, 0.7);
  }
  70% {
    box-shadow: 0 4px 12px rgba(0,0,0,0.3), 0 0 0 10px rgba(247, 200, 12, 0);
  }
  100% {
    box-shadow: 0 4px 12px rgba(0,0,0,0.3), 0 0 0 0 rgba(247, 200, 12, 0);
  }
}

.pin-tooltip {
  position: absolute;      
  
  bottom: 35px;            
  left: 50%;               
  transform: translateX(-50%); 
  background: rgba(255,255,255,0.95); 
  backdrop-filter: blur(10px); 
  border: 2px solid #f7c80c;   
  border-radius: 12px;         
  padding: 12px;               
  min-width: 200px;            
  box-shadow: 0 8px 32px rgba(0,0,0,0.2); 
  opacity: 0;                  
  visibility: hidden;          
  transition: all 0.3s ease;   
  z-index: 25;                 
  text-align: center;          
  
}

/* ✅ TOOLTIP ACTIVADO (2025-10-28): Tooltip aparece al hover, sin efecto de zoom en el pin */
.gps-pin:hover .pin-tooltip {
  opacity: 1;
  visibility: visible;
}

.pin-tooltip::after {
  content: ''; 
  position: absolute; 
  top: 100%;          
  left: 50%;          
  transform: translateX(-50%); 
  border: 8px solid transparent; 
  border-top-color: #f7c80c;    
}

.pin-tooltip::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 2px;
  height: 28px;
  background: #f7c80c;
  box-shadow: 0 2px 8px 0 rgba(247,200,12,0.25);
  transform: translateX(-50%);
  z-index: 19;
  pointer-events: none;
}

/* Tooltip invertido cuando está cerca de la navbar */
.pin-tooltip.tooltip-flipped {
  bottom: auto !important;
  top: 35px !important;
  left: 50% !important;
  transform: translateX(-50%) rotate(0deg) !important;
}

.pin-tooltip.tooltip-flipped::after {
  top: auto !important;
  bottom: 100% !important;
  border-top-color: transparent !important;
  border-bottom-color: #f7c80c !important;
}

.pin-tooltip.tooltip-flipped::before {
  top: auto !important;
  bottom: 100% !important;
}

.pin-tooltip img {
  width: 100%;                
  height: 80px;               
  object-fit: cover;          
  border-radius: 8px;         
  margin-bottom: 8px;         
  box-shadow: 0 2px 8px rgba(0,0,0,0.2); 
}

.pin-tooltip h6 {
  color: #0F539A;             
  font-weight: bold;          
  margin: 8px 0 4px 0;        
  font-size: 14px;            
}

.pin-tooltip p {
  color: #666;                
  font-size: 12px;            
  margin: 0;                  
  line-height: 1.3;           
}

@media (max-width: 768px) {
  .gps-pin {
    width: 16px;   
    height: 16px;
  }
  .gps-pin::before {
    width: 6px;    
    height: 6px;
  }
  .pin-tooltip {
    min-width: 160px; 
    padding: 8px;     
    font-size: 11px;  
  }
  .pin-tooltip img {
    height: 60px;     
  }
}