.altia-imagen-interactiva .selected.blinking td{
    animation: blink 2s infinite; /* Parpadeo */
}

/* Fila guardada (verde suave y parpadeo) */
.altia-imagen-interactiva .saved {
    background-color: #65f085 !important; /* Verde suave */
}

.altia-imagen-interactiva .saved.blinking {
    animation: blink 1s infinite; /* Parpadeo */
}

/* Animación de parpadeo */
@keyframes blink {
    0% {
        background-color: rgb(19, 255, 145, 1);
    }
    50% {
        background-color: rgb(19, 255, 145, 0.3);
    }
    100% {
        background-color: rgb(19, 255, 145, 1);
    }
}

@keyframes pulse {
    0% {
        transform: scale(1); /* Tamaño normal */
    }
    100% {
        transform: scale(1.5); /* Aumenta el tamaño */
    }
}

@keyframes pulseSoft {
    0% {
        transform: scale(1); /* Tamaño normal */
    }
    100% {
        transform: scale(1.2); /* Aumenta el tamaño */
    }
}

/* Estilos para las cajitas de coordenadas */
.mouse-coordinates {
    position: fixed;
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 12px;
    display: none; /* Estará oculta por defecto */
    pointer-events: none; /* Para que no interfiera con el puntero */
    z-index: 999;
}

.altia-img-interactiva-wrapper{
    position: relative;
}

.altia-img-interactiva-wrapper .img-base img{
    cursor: crosshair;
    /* position: relative; */
    /* z-index: 1; */
}

.point-clickable.active{
    animation: pulse 0.5s infinite alternate; /* Aplica la animación pulse */
}

.point-clickable.active > img{
    animation: pulse 0.5s infinite alternate; /* Aplica la animación pulse */
}

.point-clickable:hover{
    cursor: pointer;
}

.point-over-img .modal-dialog .modal-content{
    margin-top: 150px;
}

.point-over-img .modal-dialog-centered .modal-content .modal-body{
    max-height: 80vh;
    overflow: scroll;
}

.point-clickable.active::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 20px;
    height: 20px;
    background-color: rgba(255, 0, 0, 1);
    pointer-events: none;
    border-radius: 50%;
}

.point-clickable {
    width: 20px;
    height: 20px;
    /* background-color: rgba(0, 0, 0, 0.6); */
    border-radius: 50%;
    filter: drop-shadow(0px 5px 4px rgba(0, 0, 0, 0.9));
}

.point-clickable > img{
    top: -2.5px;
    position: relative;
    /*animation: pulseSoft 0.5s infinite alternate; !* Aplica la animación pulse *!*/

}

.img-interactive-point {
  width: 20px;
  height: 20px;
}

@media (max-width: 768px) {
  .point-clickable {
    width: 8px;
    height: 8px;
  }
  .img-interactive-point {
    width: 8px;
    height: 8px;
  }

}