@mixin button-style($bg-color, $hover-color) {
    color: #fff;
    background-color: $bg-color;

    .p-splitbutton-button {
        &:disabled {
            background-color: inherit;
        }

        &:not(:disabled) {
            &:hover {
                background-color: $hover-color;
            }

            &:focus {
                background-color: $hover-color;
                outline: 1px solid $hover-color;
            }
        }
    }

    .p-splitbutton-dropdown {
        border-left: none;

        &:disabled {
            background-color: inherit;
        }

        &:not(:disabled) {
            &:hover {
                background: $hover-color;
            }

            &:focus {
                background: $hover-color;
                outline: 1px solid $hover-color;
            }
        }
    }
}

body .p-splitbutton {
    border-radius: 4px;
    border: 1px solid #dedce5;
    display: inline-flex;
    position: relative;
    @include button-style(#fff, #dedce5);
    color: #212533;

    .p-splitbutton-dropdown {
        border-left: 1px solid #dedce5;
    }

    .p-button-label {
        padding: 9.5px 8px 9.5px 15px;
    }

    .p-button + .p-button {
        margin-left: 0;
    }

    &:has(.p-button-secondary) {
        @include button-style(#7892a1, #525966);
    }

    &:has(.p-button-success) {
        @include button-style(#0c9348, #085b2d);
    }

    &:has(.p-button-info) {
        @include button-style(#428bca, #063951);
    }

    &:has(.p-button-warning) {
        @include button-style(#f29112, #ee7708);
    }

    &:has(.p-button-help) {
        @include button-style(#400753, #290535);
    }

    &:has(.p-button-danger) {
        @include button-style(#c13018, #431919);
    }

    &:has(button:disabled) {
        opacity: 0.5 !important;
    }
}