.btn-group {
    /**
     * Sometimes the buttons inside the button group are wrapped in a div like data-controller="dialog-container" etc
     * Bootstrap css only removes the border radius from the first child button in the group
    */
    > * {
        &:not(:last-child) > .btn {
            border-radius: 0;
        }
        &:last-child > .btn {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
        }
    }
    &.btn-group-padding-x-sm {
        .btn {
            &:not(:first-child) {
                padding-left: calc(var(--bs-btn-padding-x) / 1.7);
            }
            &:not(:last-child) {
                padding-right: calc(var(--bs-btn-padding-x) / 1.7);
            }
        }
    }
}
