@keyframes pulsate {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.7);
    }
    50% {
        transform: scale(1.1);
        box-shadow: 0 0 10px 10px rgba(0, 123, 255, 0);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(0, 123, 255, 0);
    }
}

.button-loading {
    animation: pulsate 1.5s infinite ease-in-out;
  opacity: 70%;
}

.button-normal {
    animation: none;
}

#responseTime {
    font-weight: bold;
    background-color: #e7f3ff;
    border-color: #b8daff;
    color: #004085;
    padding: 10px 15px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#responseTime::before {
    content: "⏱️";
    font-size: 1.2em;
    margin-right: 10px;
}

.response-time-fast {
    background-color: #d4edda;
    border-color: #c3e6cb;
    color: #155724;
}

.response-time-medium {
    background-color: #fff3cd;
    border-color: #ffeeba;
    color: #856404;
}

.response-time-slow {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}