/* form css */
#card-auth .btn-submit {
    width: 100%;
    height: 42px;
    border-radius: 10px;
    border: none;
    margin-top: 10px;
    background-color: #e07e38;
}

#card-auth .btn-submit h5 {
    color: white;
    margin-bottom: 0px;
}

#card-auth .field-password {
    position: relative;
}

#card-auth .field-password i {
    position: absolute;
    right: 13px;
    top: 39px;
}

#card-auth .disable-submit {
    pointer-events: none;
    filter: brightness(0.7);
}

#card-auth .form-group label {
    font-weight: 500;
    color: #6c6c6d;
}

/* info msg register */
#card-auth .list-msg{
    position: relative;
    display: flex;
    padding: 8px 15px !important;
    background: grey;
    border-radius: 10px;
    border: 2px solid rgba(255, 255, 255, 0.493);
    color: #eaeaea;
}
 
#card-auth .list-msg p{
    font-size: 14px;
    font-weight: 500;
    color: #eaeaea;
    margin-bottom: 0;
}
#card-auth .list-msg.success{
    background: #8bc32f;
}
#card-auth .list-msg.error{
    background: #e67352;
}

#card-auth .list-msg.info{
    background: #2f9ac3;
}


#card-auth .line {
    top: calc(50% - 0.5px);
    position: absolute;
    border-bottom: 1px solid #ced4da;
}

/* link */
#card-auth.card a {
    text-decoration: underline !important;
}

#card-auth.card a.forgot-pass {
    text-decoration: none !important;
    font-size: 12px;
    color: #6c757da3;
    float: right;
    bottom: -5px;
    position: relative;
}

/* loader css */
#card-auth.card {
    transition: all ease-in-out 0.2s;
}

#card-auth.card.loader-active {
    width: 430px;
    height: 430px;
}

#card-auth .card-body.hide-time {
    display: none;
}


#card-auth .card-loader {
    transition: ease-in-out 0.2s all;
    transform: scale(1.0);
}

#card-auth .card-loader.hide-loader {
    transform: scale(0.0);
}

#card-auth .loader-auth {
    position: relative;
    border-radius: 60px;
    height: 120px;
    width: 120px;
    background-color: white;
    border: 9px solid #e07e38;
    animation: moveAround 2s linear infinite;
}

#card-auth .loader-auth::before {
    height: 60px;
    width: 60px;
    background-color: #ffffff;
    position: absolute;
    top: -12px;
    left: -12px;
    content: "";
}

@keyframes moveAround {
    0% {
        transform: rotateZ(0deg);
    }
    100% {
        transform: rotateZ(360deg);
    }
}

#close-auth-box {
    cursor: pointer;
    color: #212529 !important;
    position: absolute;
    top: 13px;
    right: 18px;
}

#card-auth .loading-circle {
    height: 20px;
    width: 20px;
    border-radius: 10px;
    border: 2px solid rgba(255, 255, 255, 0.719);
    margin: 0 auto;
    position: relative;
    animation: moveAround 1.6s linear infinite;
}

#card-auth .loading-circle::before {
    height: 10px;
    width: 10px;
    background-color: #e07e38;
    position: absolute;
    top: -4px;
    left: -4px;
    content: "";
}

@keyframes moveAround {
    0% {
        transform: rotateZ(0deg);
    }
    100% {
        transform: rotateZ(360deg);
    }
}

#card-auth .form-group .small-message {
    font-size: 12px;
}

#card-auth .btn-auth-google {
    width: 100%; 
    left: -5px; 
    top: -5px;
} 

#card-auth .btn-auth-google.page-trip {
    width: 100%; 
    left: -5px; 
    top: -5px;
}