.loading {
    background-color: #6c757d; /* Цвет кнопки во время загрузки */
    cursor: not-allowed;
    animation: colorChange 1.5s linear infinite; /* Анимация смены цвета */
}

.loading:hover {
    background-color: #6c757d;
}

.loading::after {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border: 3px solid white;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-left: 10px; /* Отступ для спиннера */
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes colorChange {
    0% {
        background-color: #6c757d; /* Начальный цвет */
    }
    50% {
        background-color: #28a745; /* Цвет в середине анимации */
    }
    100% {
        background-color: #6c757d; /* Возвращаемся к начальному цвету */
    }
}