﻿.btn-toolbar {
    background-color: #FFFFFF;
    height: 32px;
    padding: 8px 12px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #E4E6ED;
}

.btn-toolbar_dropdown {
    background-color: #FFFFFF;
    height: 32px;
    align-items: center;
    border-radius: 8px;
    border: 1px solid #E4E6ED;
}

.btn-toolbar_dropdown_input {
    height: 32px;
}

.btn {
    justify-content: center;
    align-items: center;
    border-radius: 8px !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
}



.btn-sm {
    padding: 6px 16px !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
}

.btn-md {
    padding: 8px 12px !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
}

.btn-lg {
    padding: 12px 16px !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
}


.btn-xl {
    padding: 20px !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
}

.btn-disabled {
    background: #E2E3E4;
    color: #B1B3B8;
}

.btn-primary-icon > .mud-svg-icon {
    fill: transparent;
}

.btn-primary {
    background: #588DF6 !important;
    color: #FFFFFF !important;
}

    .btn-primary:hover {
        background: #7CA8FF !important;
    }

    .btn-primary:focus {
        background: #7CA8FF !important;
        box-shadow: 0px 0px 0px 3px #DDDCFF, 0px 3px 4px -3px rgba(17, 12, 34, 0.10);
    }

.btn-success {
    background: #0ED065 !important;
    color: #FFFFFF !important;
}

    .btn-success:hover {
        background: #2AE77F !important;
    }

    .btn-success:focus {
        background: #2AE77F !important;
        box-shadow: 0px 0px 0px 3px #AFFAD0, 0px 3px 4px -3px rgba(17, 12, 34, 0.10);
    }

.btn-secondary {
    background: #EAEDF4 !important;
    color: #0C1120 !important;
    border-bottom: 0px !important;
}

    .btn-secondary:hover {
        background: #E4E6ED !important;
    }

    .btn-secondary:focus {
        background: #E4E6ED !important;
        box-shadow: 0px 0px 0px 3px #ECECED, 0px 3px 4px -3px rgba(17, 12, 34, 0.10) !important;
    }

.btn-tertiary {
    border: 1px solid #E4E6ED !important;
    background: #FFF !important;
    color: #0C1120 !important;
}

    .btn-tertiary:hover {
        background: #F3F4F8 !important;
    }

    .btn-tertiary:focus {
        background: #F3F4F8 !important;
        box-shadow: 0px 0px 0px 3px #ECECED, 0px 3px 4px -3px rgba(17, 12, 34, 0.10) !important;
    }

.btn-error {
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    background: #F03D3D !important;
    color: #FFFFFF !important;
}

    .btn-error:hover {
        background: #FF7373 !important;
        box-shadow: 0px 0px 0px 3px rgba(255, 224, 224, 1) !important;
    }

    .btn-error:focus {
        background: #FF7373 !important;
        box-shadow: 0px 3px 4px -3px rgba(17, 12, 34, 0.1) !important;
    }

@media screen and (max-width: 960px) {
    .btn-mobile-full-width {
        width: 100%;
    }
}
