.zent-btn-primary {
    color: $btn-white;
    background: $btn-primary;
    border-color: $btn-primary;

    &:link,
    &:visited,
    &:focus {
        color: $btn-white;
    }
    &:hover {
        color: $btn-white;
        background: $btn-primary-hover;
        border-color: $btn-primary-hover;
    }
    &:active {
        color: $btn-white;
        background: $btn-primary-active;
        border-color: $btn-primary-active;
    }

    &.zent-btn-loading {
        &:hover,
        &:active {
            background: $btn-primary;
            border-color: $btn-primary;
        }
        &::after {
            border-color: $btn-white transparent transparent transparent;
        }
    }
}
.zent-btn-primary-outline {
    color: $btn-primary;
    border-color: $btn-primary;
    background: $btn-white;

    &:link,
    &:visited,
    &:focus {
        color: $btn-primary;
    }
    &:hover {
        color: $btn-primary-hover;
        border-color: $btn-primary-hover;
    }
    &:active {
        color: $btn-primary-active;
        background: $btn-light-gray;
        border-color: $btn-primary-active;
    }

    &.zent-btn-loading {
        &:hover,
        &:active {
            border-color: $btn-primary;
            background: $btn-white;
        }
        &::after {
            border-color: $btn-primary transparent transparent transparent;
        }
    }
}

.zent-btn-danger {
    color: $btn-white;
    background: $btn-danger;
    border-color: $btn-danger;

    &:link,
    &:visited,
    &:focus {
        color: $btn-white;
    }
    &:hover {
        color: $btn-white;
        background: $btn-danger-hover;
        border-color: $btn-danger-hover;
    }
    &:active {
        color: $btn-white;
        background: $btn-danger-active;
        border-color: $btn-danger-active;
    }

    &.zent-btn-loading {
        &:hover,
        &:active {
            background: $btn-danger;
            border-color: $btn-danger-active;
        }
        &::after {
            border-color: $btn-white transparent transparent transparent;
        }
    }
}
.zent-btn-danger-outline {
    color: $btn-danger;
    border-color: $btn-danger;
    background: $btn-white;

    &:link,
    &:visited,
    &:focus {
        color: $btn-danger;
    }
    &:hover {
        color: $btn-danger-hover;
        border-color: $btn-danger-hover;
    }
    &:active {
        color: $btn-danger-active;
        background: $btn-light-gray;
        border-color: $btn-danger-active;
    }

    &.zent-btn-loading {
        &:hover,
        &:active {
            border-color: $btn-danger;
            background: $btn-white;
        }
        &::after {
            border-color: $btn-danger transparent transparent transparent;
        }
    }
}

.zent-btn-success {
    color: $btn-white;
    background: $btn-success;
    border-color: $btn-success;

    &:link,
    &:visited,
    &:focus {
        color: $btn-white;
    }
    &:hover {
        color: $btn-white;
        background: $btn-success-hover;
        border-color: $btn-success-hover;
    }
    &:active {
        color: $btn-white;
        background: $btn-success-active;
        border-color: $btn-success-active;
    }

    &.zent-btn-loading {
        &:hover,
        &:active {
            background: $btn-success;
            border-color: $btn-success-active;
        }
        &::after {
            border-color: $btn-white transparent transparent transparent;
        }
    }
}
.zent-btn-success-outline {
    color: $btn-success;
    border-color: $btn-success;
    background: $btn-white;

    &:link,
    &:visited,
    &:focus {
        color: $btn-success;
    }
    &:hover {
        color: $btn-success-hover;
        border-color: $btn-success-hover;
    }
    &:active {
        color: $btn-success-active;
        background: $btn-light-gray;
        border-color: $btn-success-active;
    }

    &.zent-btn-loading {
        &:hover,
        &:active {
            border-color: $btn-success;
            background: $btn-white;
        }
        &::after {
            border-color: $btn-success transparent transparent transparent;
        }
    }
}
