:root {
    --chup-green: #115934;
    --chup-orange: #F26522;
    --bs-font-sans-serif: "Poppins", sans-serif;
    --bs-primary: var(--chup-green);
    --bs-secondary: var(--chup-orange);
    --bs-link-color: var(--chup-green);
    --bs-link-hover-color: var(--chup-orange);
}

html, body {
    height: 100%;
}

body {
    display: flex;
    align-items: center;
    padding: 40px 20px;
}

@media (min-width: 768px) {
    body {
        display: flex;
        align-items: center;
        padding: 40px 0;
    }
}

.auth-wrapper {
    max-width: 590px;
    width: 100%;
    margin: 0 auto;
}

.auth-wrapper .card {
    --bs-card-spacer-y: 32px;
    --bs-card-spacer-x: 32px;
    --bs-card-border-color: #fff;
    --bs-card-border-radius: 16px;
    box-shadow: 0px 4px 29px rgba(41, 41, 41, 0.25);
}

@media (min-width: 768px) {
    .auth-wrapper .card {
        --bs-card-spacer-y: 40px;
        --bs-card-spacer-x: 120px;
        --bs-card-border-radius: 40px;
    }
}

.auth-wrapper .card .card-body .logo {
    width: 165px;
    height: 86px;
    margin-bottom: 32px;
}

.form-control-lg {
    padding: 0.625rem 1.25rem;
    font-size: 1.25rem;
}

.btn-primary {
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: var(--bs-secondary);
    --bs-btn-hover-border-color: var(--bs-secondary);
    --bs-btn-active-bg: var(--bs-secondary);
    --bs-btn-active-border-color: var(--bs-secondary);
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-group-lg>.btn, .btn-lg {
    --bs-btn-padding-y: 1rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-font-size: 1.5rem;
    --bs-btn-border-radius: var(--bs-border-radius-lg);
}

.cursor-pointer {
    cursor: pointer;
}

.btn-close {
    font-size: 0.875rem;
}

.btn-back {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-hover-color: var(--bs-secondary);
}

.avatar-success {
    width: 60px;
    height: 60px;
    padding: 12px;
    background-color: #C3ECD7;
    color: var(--bs-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.form-control.form-control-lg.is-invalid {
    background-position: right 18px center;
}

.input-password {
    position: relative;
}

.input-password .form-control.form-control-lg {
    padding-right: calc(1.5rem + 1.25rem);
}

.input-password .toggle-type {
    display: flex;
    position: absolute;
    top: 16px;
    right: 20px;
    cursor: pointer;
}

.input-password .toggle-type svg {
    width: 20px;
    height: 20px;
}

.input-password .form-control.is-invalid {
    padding-right: calc(3rem + .75rem);
    background-position: right calc(2.8rem + .25rem) center;
}