/* buttons.css */

.optimize-btn {
    margin-top: 4%;
}

.btn-group .btn {
    transition: box-shadow 0.3s, border-color 0.3s;
}

.btn-group .btn.clicked {
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        background-color: transparent;
        border-color: var(--bs-primary) !important;
        color: var(--bs-primary);
}

.optimize-btn {
    margin-top: 4%;
}

.icon-button {
    margin-top: 30px !important;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    margin: 0;
    font-size: 16px;
    color: var(--bs-primary);
}

.disabled-option {
    color: rgba(0, 0, 0, 0.5) !important;
    pointer-events: none;
}

/* Dot Loader CSS */
.dot-loader {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

    .dot-loader .dot {
        width: 8px;
        height: 8px;
        background-color: currentColor;
        border-radius: 50%;
        animation: dot-blink 0.6s infinite alternate;
    }

        .dot-loader .dot:nth-child(2) {
            animation-delay: 0.2s;
        }

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

@keyframes dot-blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}