﻿#bizimply-links-btn .spinner-border {
    width: 1rem;
    height: 1rem;
    border-width: 0.15em;
}


.modal-xl-custom {
    max-width: 800px;
    width: 90vw;
}

    .modal-xl-custom .modal-content {
        min-height: 50vh;
        max-height: 85vh;
        height: auto;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
    }

    .modal-xl-custom .modal-body {
        flex: 1;
        overflow-y: auto;
        padding: 1.5rem;
    }

    .modal-xl-custom .modal-footer-sticky {
        position: sticky;
        bottom: 0;
        background: #fff;
        padding: 1rem 1.5rem;
        border-top: 1px solid #eee;
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.05);
        z-index: 10;
    }

.status-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
    position: relative;
}

    .status-dot.connected {
        background-color: #28a745;
        box-shadow: 0 0 6px 2px rgba(40, 167, 69, 0.5);
        animation: pulseGreen 1.5s infinite;
    }

    .status-dot.disconnected {
        background-color: #dc3545;
        box-shadow: 0 0 6px 2px rgba(220, 53, 69, 0.5);
        animation: pulseRed 1.5s infinite;
    }

.row:not(.row-collapse), .container .row:not(.row-collapse) {
    width: 100% !important;
    padding: 0px !important;
    margin: 0px !important;
}

.status-connected-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    min-width: 96px; 
    font-size: 1rem;
    font-weight: 500;
    color: #1f6b3a;
    cursor: default;
    user-select: none;
}

.integrations-btn-normalised-width {
    width: 150px;
    margin: 0px !important;
    white-space: nowrap;
}

@keyframes pulseGreen {
    0% {
        box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.4);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(40, 167, 69, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(40, 167, 69, 0);
    }
}

@keyframes pulseRed {
    0% {
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.4);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(220, 53, 69, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0);
    }
}

@media only screen and (max-width: 768px) {
    .justtip-green {
        font-size: 10px;
    }

    #bizimply-links-btn {
        max-height: 30px !important;
    }

    .modal-dialog {
        max-width: 90vw;
    }
}
