.btnDefault {
    color: var(--colorPrimer);
    background-color: var(--bgPrimer);
    font-size: .95rem;
    text-transform: capitalize;
    letter-spacing: 1px;
    padding: .4rem 1.6rem;
    border: 1px solid var(--bgPrimer);
    border-radius: .25rem;
    outline: none;
    transition: .4s;
}
.btnDefault:hover,
.btnDefault:focus {
    background-color: var(--hoverPrimer);
    border-color: var(--hoverPrimer);
}

.btnOutline {
    color: var(--bgPrimer);
    background-color: var(--bgTransparan);
    font-size: .95rem;
    text-transform: capitalize;
    letter-spacing: 1px;
    padding: .4rem 1.6rem;
    border: 1px solid var(--bgPrimer);
    border-radius: .25rem;
    outline: none;
    transition: .4s;
}
.btnOutline:hover,
.btnOutline:focus {
    color: var(--colorPrimer);
    background-color: var(--hoverPrimer);
    border-color: var(--hoverPrimer);
}

.btnDanger {
    color: var(--colorDanger);
    background-color: var(--bgDanger);
    font-size: .95rem;
    text-transform: capitalize;
    letter-spacing: 1px;
    padding: .4rem 1.6rem;
    border: 1px solid var(--bgDanger);
    border-radius: .25rem;
    outline: none;
    transition: .4s;
}
.btnDanger:hover,
.btnDanger:focus {
    background-color: var(--hoverDanger);
    border-color: var(--hoverDanger);
}

.btnOutlineDanger {
    color: var(--bgDanger);
    background-color: var(--bgTransparan);
    font-size: .95rem;
    text-transform: capitalize;
    letter-spacing: 1px;
    padding: .4rem 1.6rem;
    border: 1px solid var(--bgDanger);
    border-radius: .25rem;
    outline: none;
    transition: .4s;
}
.btnOutlineDanger:hover,
.btnOutlineDanger:focus {
    color: var(--colorDanger);
    background-color: var(--hoverDanger);
    border-color: var(--hoverDanger);
}

.btnWhite {
    color: var(--colorWhite);
    background-color: var(--bgWhite);
    font-size: .95rem;
    text-transform: capitalize;
    letter-spacing: 1px;
    padding: .4rem 1.6rem;
    border: 1px solid var(--bgWhite);
    border-radius: .25rem;
    outline: none;
    transition: .4s;
}
.btnWhite:hover,
.btnWhite:focus {
    background-color: var(--hoverWhite);
    border-color: var(--hoverWhite);
}

.btnDefault:focus, .btnOutline:focus, .btnDanger:focus, btnOutlineDanger, .btnWhite:focus {
    outline: none;
}

.btnFull {
    width: 100%;
}
.btnFlex {
    display: flex;
    justify-content: center;
    align-items: center;
}

button:disabled {
    color: var(--colorDisabled);
    background-color: var(--bgDisabled);
    border-color: var(--bgDisabled);
    pointer-events: none;
    user-select: none;
}

.form-control:focus {
    border-color: var(--primer) !important;
    box-shadow: none !important;
}