.light-mode {
    transition: all 0.5s ease;
}

.inputCss {
    border: 0;
    background-color: var(--gray-ef);
    color: var(--bs-body-color);
}

.note-css {
    font-size: var(--font-15);
}

.username_font {
    font-family: var(--bs-font-bold);
    font-size: 15px;
}

.password_font {
    font-family: var(--bs-font-bold);
    font-size: var(--font-15);
}

.remember_me_font {
    font-family: var(--bs-font-bold);
    font-size: var(--font-13);
    padding-left: var(--padding-left-5);

}

.login_button {
    color: var(--white);
    font-size: var(--font-12);
    font-family: var(--bs-font-bold);
    background-color: var(--dark-blue);
    border-radius: var(--bs-border-radius);
    border: 0;
    width: var(--width-30);
}

.login_button:hover {
    background-color: var(--soft-blue);
    color: var(--white);
    border-color: var(--soft-blue);
}

.login_button:active {
    background-color: var(--dark-cyan);
    color: var(--white);
    border-color: var(--dark-cyan);
}

.login_button:disabled {
    background-color: var(--soft-cyan);
    color: var(--white);
    border-color: var(--soft-cyan);
}

.forgot_password_font {
    font-family: var(--bs-font-bold);
    font-size: var(--font-15);
}

.inputCss {
    border-color: var(--bs-border-color-a7);
    border-radius: var(--bs-border-radius);
    font-size: var(--font-15);
}

.border-css {
    border-radius: var(--bs-border-radius);
    border: 0;
}

.gradientCSS {
    background-image: var(--bs-gradient);
    height: 4px;
    border-radius: var(--bs-border-radius);
}

.eyePosition {
    height: 100%;
    top: 0;
    right: 0;
    padding-right: var(--right-15);
    color: var(--bs-body-color);
    background: var(--bs-bg-transparent);
    border: 0;
    right:-38px;
}