/**=====================
    3.29 Login CSS Start
==========================**/
.login-card {
    min-height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 auto;
    background: url("../images/login/login_bg.jpg");
    background-position: center;
    padding: 30px 12px;
}

    .login-card .logo {
        display: block;
        margin-bottom: 30px;
        text-align: center;
    }

    .login-card .btn-showcase .btn {
        line-height: 1;
        padding: 10px 15px;
        margin: 0;
    }

        .login-card .btn-showcase .btn + .btn {
            margin-left: 5px;
        }

        .login-card .btn-showcase .btn svg {
            height: 16px;
            vertical-align: bottom;
        }

    .login-card .login-main {
        width: 450px;
        padding: 40px;
        border-radius: 10px;
        -webkit-box-shadow: 0 0 37px rgba(8, 21, 66, 0.05);
        box-shadow: 0 0 37px rgba(8, 21, 66, 0.05);
        margin: 0 auto;
        background-color: #fff;
    }

        .login-card .login-main .theme-form h4 {
            margin-bottom: 5px;
        }

        .login-card .login-main .theme-form label {
            font-size: 15px;
            letter-spacing: 0.4px;
        }

            .login-card .login-main .theme-form label a.ms-2 {
                margin-right: 0 !important;
                margin-left: 5px !important;
            }

        .login-card .login-main .theme-form .checkbox label::before {
            background-color: #f9f9fa;
            border: 1px dashed #dfdfdf;
        }

        .login-card .login-main .theme-form .or {
            position: relative;
        }

            .login-card .login-main .theme-form .or:before {
                content: "";
                position: absolute;
                width: 65%;
                height: 2px;
                background-color: #f3f3ff;
                top: 9px;
                z-index: 0;
                right: 0;
            }

[dir=rtl] .login-card .login-main .theme-form .or:before {
    right: unset;
    left: 0;
}

.login-card .login-main .theme-form input {
    /*background-color: #f3f3ff;*/
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    border-color: var(--theme-default) !important;
}

    .login-card .login-main .theme-form input::-webkit-input-placeholder {
        color: #999999;
    }

    .login-card .login-main .theme-form input:hover, .login-card .login-main .theme-form input:focus {
        border: 1px dashed #b9c1cc;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        -webkit-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }

.login-card .login-main .theme-form p {
    margin-bottom: 25px;
    font-size: 14px;
    color: #898989;
}

[dir=rtl] .login-card .login-main .theme-form p a {
    margin-right: 0 !important;
    margin-left: 5px !important;
}

.login-card .login-main .theme-form .form-group {
    margin-bottom: 10px;
    position: relative;
}

.login-card .login-main .theme-form .link {
    position: absolute;
    top: 10px;
    right: 0;
}

[dir=rtl] .login-card .login-main .theme-form .link {
    right: unset;
    left: 0;
}

.login-card .login-main .theme-form .social .btn:hover {
    background-color: var(--theme-default);
    border-color: var(--theme-default);
    color: #fff !important;
}

    .login-card .login-main .theme-form .social .btn:hover .feather {
        color: #fff !important;
    }

.show-hide {
    position: absolute;
    top: 52px;
    right: 20px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

[dir=rtl] .show-hide {
    right: unset;
    left: 20px;
}

.show-hide span {
    cursor: pointer;
    font-size: 13px;
    color: var(--theme-default);
}

    .show-hide span.show:before {
        content: "show";
    }

    .show-hide span:before {
        content: "hide";
    }

.needs-validation .invalid-feedback {
    color: #898989;
}

.needs-validation .show-hide {
    right: 30px;
}

.needs-validation .invalid-tooltip {
    top: 10px;
    right: 10px;
}

.login-card .login-main .theme-form label {
    font-size: 14px;
}

.login-card .login-main .theme-form .show-hide {
    top: 50%;
}

/**=====================
    3.29 Login CSS Ends
==========================**/

.auth-card {
    /*background: url(/assets/theme/images/login/login_bg.jpg);*/
    background: none;
}

    .auth-card > div {
        flex: 1 1 100%;
    }

    .auth-card span.field-validation-error,
    .auth-card span.field-validation-valid {
        display: inline;
    }

.auth-page .logo-wrapper {
    max-width: 300px;
    margin: 0 auto;
}

body.auth-page .text-success.validation-summary-errors[role="alert"] {
    --bs-alert-color: var(--bs-success-text-emphasis);
    --bs-alert-bg: var(--bs-success-bg-subtle);
    --bs-alert-border-color: var(--bs-success-border-subtle);
    --bs-alert-link-color: var(--bs-success-text-emphasis);
    background-color: var(--bs-alert-bg);
    border-color: var(--bs-alert-border-color);
}