@mixin blui-mat-stepper($stepperBackground, $stepperIcon, $stepperLabel) {
    /*stepper*/
    .mat-stepper-horizontal,
    .mat-stepper-vertical {
        background-color: $stepperBackground;

        .mat-step-icon:not(.mat-step-icon-selected):not(.mat-step-icon-state-edit) {
            background-color: map-get($stepperIcon, defaultBg);
            color: map-get($stepperIcon, defaultColor);
        }
        .mat-step-header[aria-selected='true'] .mat-step-icon {
            background-color: map-get($stepperIcon, activeBg);
            color: map-get($stepperIcon, activeColor);
        }

        .mat-step-header {
            .mat-step-label,
            .mat-step-label-selected {
                font-size: 0.875rem;
            }

            .mat-step-label {
                font-weight: 400;
            }

            .mat-step-label-active {
                font-weight: 600;
            }

            .mat-step-label {
                color: map-get($stepperLabel, defaultColor);
            }
            .mat-step-label-selected {
                color: map-get($stepperLabel, activeColor);
            }
            .mat-step-icon-content {
                font-size: 14px;
                line-height: 24px;
                font-weight: 400;
            }
            .mat-step-icon-selected .mat-step-icon-content {
                font-weight: 600;
            }

            &:hover,
            &.cdk-program-focused,
            &.cdk-mouse-focused,
            &.cdk-focused {
                background-color: unset;
            }

            .mat-focus-indicator.mat-button-base.ng-star-inserted {
                background-color: unset;
            }
        }
    }
}
