// bootstrap classes
$custom-switch-indicator-border-with: 2px;
.custom-switch {
    .custom-control-label {
        &:before,
        &:after {
            margin-top: -$custom-switch-indicator-border-with;
        }
        &:before {
            background-color: $custom-control-indicator-disabled-bg;
            border-width: $custom-switch-indicator-border-with;
            border-color: transparent;
            height: calc(#{$custom-switch-indicator-size} + #{$custom-switch-indicator-border-with} * 2);
        }
        &:after {
            background-color: $custom-control-indicator-checked-color;
        }
    }
    .custom-control-input:checked {
        ~ .custom-control-label{
            &:after {
                transform: translateX(calc((#{$custom-switch-width} / 2) - #{$custom-switch-indicator-border-with}));
            }
        }
    }
}