@use "../../wwwroot/scss/variables" as *;

.radio-list {
    --bb-radio-item-width: #{$bb-radio-item-width};
    --bb-radio-item-padding: #{$bb-radio-item-padding};
    --bb-radio-group-item-active-color: #{$bb-radio-group-item-active-color};
    display: flex;
    flex-wrap: wrap;

    .form-check {
        width: var(--bb-radio-item-width);
    }

    &.is-vertical {
        flex-direction: column;
        height: auto;
        line-height: unset;

        .form-check:not(:last-child) {
            margin-block-end: .5rem;
        }
    }

    &.form-control {
        padding: var(--bb-radio-item-padding);
    }

    &.btn-group {
        display: inline-flex;
        flex: 0 !important;
        flex-wrap: nowrap;
        white-space: nowrap;

        > .btn {
            white-space: nowrap;

            &:not(:first-child) {
                border-left-color: transparent !important;
            }

            &:not(:last-child) {
                border-right-color: transparent !important;
            }
        }

        .active {
            color: var(--bb-radio-group-item-active-color);
        }

        &.disabled > span {
            opacity: var(--bs-btn-disabled-opacity);

            &:not(.active) {
                background-color: var(--bs-secondary-bg);
            }
        }
    }

    &.btn-group-vertical {
        .btn {
            margin-left: 0 !important;

            &:first-child {
                border-top-right-radius: var(--bs-border-radius);
            }

            &:last-child {
                border-bottom-left-radius: var(--bs-border-radius);
            }
        }
    }
}
