/* Estilos para el contenedor de los puntos de carga */
.loading-dots {
    display: inline-block;
    font-size: 2em;
    line-height: 1;
    color: #4345a1;
    font-family: monospace;
    font-weight: bold;
    letter-spacing: -0.3em;
}

/* Estilos de cada punto */
.dot {
    opacity: 0;
    animation: pulse 1s infinite;
    animation-timing-function: ease-in-out;
}

/* Retrasos para que los puntos parpadeen secuencialmente */
.dot:nth-child(2) {
    animation-delay: 0.2s;
}

.dot:nth-child(3) {
    animation-delay: 0.4s;
}

/* Definición de la animación: cambia la opacidad */
@keyframes pulse {
    0% {
    opacity: 0;
    }
    50% {
    opacity: 1;
    }
    100% {
    opacity: 0;
    }
}