:root{
    --primary-color: #52B788;
    --secondary-color: #00416B;
    --white-color: #fafafa;
    --gray-color: #e9ecef;
}
.text-primary{
    color: var(--primary-color) !important;
}
.text-secondary{
    color: var(--secondary-color) !important;
}
.auth-image-section, .auth-form-section{
    width: 100%;
    min-height: 100vh;
    height: 100%;
}
.auth-form-section{
    background-color: var(--light-color);
    align-content: center;
    padding: 30px;
}
.auth-image-section{
    background-image: linear-gradient(to bottom right, var(--primary-color),var(--secondary-color));
    color: var(--white-color);         
}
.auth-image-section .auth-text{
    height: 50vh;
    text-align: center;
    align-content: center;
}
.auth-image-section .auth-text hr{
    width: 50px;
    height: 2px;
    background-color: var(--white-color);
    justify-self: center;
}
.auth-image-section .image{
    width: 100%;
    height: 50vh;
    background-image: url(../../uploads/auth/auth-image-ar.webp);
    background-size: contain;
    background-repeat: no-repeat;
    /* background-position: center left; */
}
input[type="text"],input[type="email"],input[type="password"],
input[type="number"],input[type="url"],input[type="search"],
input[type="phone"],input[type="file"],input[type="date"],
textarea,select, .input-group-text{
    background-color: var(--gray-color) !important;
}
.btn-gradient {
    background-image: linear-gradient(to right, rgba(82, 183, 136, 1), rgba(0, 65, 107, 1));
    color: white;
    border: 0;
    border-radius: 10px;
}
.cursor-pointer{
    cursor: pointer;
}