:root {
    --animation-red-color: 220, 53, 69;
}

.animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.animate-pulse-red {
    --size: 0.65rem;
    height: var(--size);
    width: var(--size);
    border-radius: 50%;
    background: rgba(var(--animation-red-color), 1);
    box-shadow: 0 0 0 0 rgba(var(--animation-red-color), 1);
    animation: pulse-red 2s infinite;
}

.animate-spin-slow {
    animation: spin-slow 6s linear infinite;
    display: inline-block;
}

@keyframes pulse {
    50% {
        opacity: 0.5;
    }
}

@keyframes pulse-red {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(var(--animation-red-color), 0.7);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(var(--animation-red-color), 0);
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(var(--animation-red-color), 0);
    }
}

@keyframes spin-slow {
    100% {
        transform: rotate(360deg);
    }
}
