html,
body.forget-auth {
    min-height: 100%;
}

.forget-auth *,
.forget-auth *:before,
.forget-auth *:after {
    box-sizing: border-box;
}

body.forget-auth {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #eef7ff;
    background:
        radial-gradient(circle at 18% 18%, rgba(42, 229, 197, .28), transparent 28%),
        radial-gradient(circle at 82% 10%, rgba(111, 90, 255, .28), transparent 26%),
        linear-gradient(135deg, #071018 0%, #101827 48%, #071018 100%) !important;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    overflow-x: hidden;
}

body.forget-auth:before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);
    background-size: 48px 48px;
    opacity: .75;
}

.auth-theme-toggle {
    position: fixed;
    top: 22px;
    right: 22px;
    z-index: 20;
    min-width: 92px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 13px;
    color: #dcecff;
    border: 1px solid rgba(94, 255, 223, .24);
    border-radius: 999px;
    background: rgba(8, 20, 32, .62);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 36px rgba(0, 0, 0, .24);
    backdrop-filter: blur(16px);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    outline: none;
}

.auth-theme-toggle:hover,
.auth-theme-toggle:focus {
    color: #fff;
    border-color: rgba(94, 255, 223, .58);
    background: rgba(94, 255, 223, .12);
}

.auth-theme-toggle .fa {
    color: #5effdf;
    font-size: 14px;
}

.forget-auth .login {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: min(460px, calc(100% - 32px)) !important;
    min-height: 0;
    margin: 40px auto;
    overflow: visible !important;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(13, 25, 39, .92), rgba(7, 16, 26, .86));
    box-shadow: 0 28px 80px rgba(0, 0, 0, .38), 0 0 0 1px rgba(70, 240, 215, .06);
    backdrop-filter: blur(20px);
}

.forget-auth .login:before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: 8px;
    padding: 1px;
    background: linear-gradient(135deg, rgba(64, 241, 213, .72), rgba(116, 98, 255, .42), rgba(255, 255, 255, .06));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.forget-auth .loginbg {
    display: none;
}

.forget-auth .head {
    min-height: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 30px 34px 18px !important;
    background: transparent !important;
}

.forget-auth .head .name {
    flex: 1 1 auto;
    min-width: 0;
}

.forget-auth .head img {
    width: auto !important;
    max-width: 190px;
    height: auto !important;
    max-height: 56px;
}

.forget-auth .logo-text {
    color: #fff !important;
    font-size: 26px !important;
    font-weight: 800;
}

.forget-auth .toplink-auth-brand {
    align-items: center;
    display: inline-flex;
    gap: 12px;
    line-height: 1;
    text-decoration: none;
}

.forget-auth .toplink-auth-brand:hover,
.forget-auth .toplink-auth-brand:focus {
    color: #fff !important;
    text-decoration: none;
}

.forget-auth .toplink-auth-brand img {
    background: #fff;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 9px;
    box-shadow: 0 12px 28px rgba(0, 166, 200, .16);
    display: block;
    height: 42px !important;
    max-height: none;
    max-width: none;
    width: 42px !important;
}

.forget-auth .toplink-auth-brand span {
    color: currentColor;
    font-size: 25px;
    font-weight: 850;
    letter-spacing: 0;
}

.forget-auth-chip {
    flex: 0 0 auto;
    min-height: 30px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: rgba(58, 240, 211, .12);
    border: 1px solid rgba(58, 240, 211, .26);
    color: #7dffea;
    font-size: 11px;
    font-weight: 800;
}

.forget-auth .head .title {
    display: none;
}

.forget-auth .loginbox {
    padding: 0 34px 32px;
    background: transparent !important;
    color: #eef7ff;
}

.forget-auth-chip {
    background: rgba(64, 115, 180, .12);
    border-color: rgba(120, 157, 205, .26);
    color: #c8dcf6;
}

.auth-theme-toggle {
    border-color: rgba(120, 157, 205, .28);
}

.auth-theme-toggle:hover,
.auth-theme-toggle:focus {
    border-color: rgba(126, 167, 223, .5);
    background: rgba(126, 167, 223, .12);
}

.auth-theme-toggle .fa {
    color: #7ea7df;
}

.forget-auth-title {
    margin: 0 0 22px;
    color: #fff;
    font-size: 28px;
    line-height: 1.2;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.forget-auth .form-group {
    width: 100%;
    max-width: 360px;
    margin-right: 0;
    margin-left: 0;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 16px;
}

.forget-auth .form-horizontal .form-group > [class*="col-"] {
    float: none !important;
    width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.forget-auth .control-label {
    display: block;
    width: 100% !important;
    margin-bottom: 8px;
    color: #c7d6e8;
    font-weight: 700 !important;
    text-align: left;
    line-height: 1.35;
}

.forget-auth input[type="email"],
.forget-auth input[type="text"],
.forget-auth select,
.forget-auth .form-control {
    width: 100% !important;
    height: 46px !important;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 8px;
    outline: none;
    background: rgba(255, 255, 255, .07);
    color: #f5fbff;
    font-size: 14px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}

.forget-auth input::placeholder {
    color: #7d8da5;
}

.forget-auth input:focus,
.forget-auth select:focus,
.forget-auth .form-control:focus {
    border-color: rgba(71, 241, 215, .78);
    background: rgba(255, 255, 255, .095);
    box-shadow: 0 0 0 3px rgba(71, 241, 215, .12), inset 0 1px 0 rgba(255, 255, 255, .08);
}

.forget-auth select option {
    color: #f5fbff;
    background-color: #101b28;
}

.forget-auth #yanzm {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100% !important;
    margin-left: 0 !important;
}

.forget-auth #yanzm .col-xs-12,
.forget-auth #yanzm .col-md-7,
.forget-auth #yanzm .col-md-5 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.forget-auth #verifyImg {
    flex: 0 0 auto;
    width: 98px;
    height: 34px !important;
    margin: 0 !important;
    float: none !important;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 6px;
    background: rgba(255, 255, 255, .08);
}

.forget-auth .submit {
    display: block;
    max-width: 360px;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
    height: 52px;
    border: 0;
    border-radius: 8px;
    color: #041118;
    font-size: 15px;
    font-weight: 800;
    background: linear-gradient(135deg, #5effdf, #8ea2ff);
    box-shadow: 0 16px 38px rgba(64, 241, 213, .28);
    white-space: normal;
}

.forget-auth .submit:hover,
.forget-auth .submit:focus {
    filter: saturate(1.08);
}

.forget-auth .hr15,
.forget-auth .space-4 {
    display: none;
}

.forget-auth #language_sel {
    min-width: 190px;
}

.forget-auth form > div[style*="float:right"] {
    float: none !important;
    display: flex;
    justify-content: center;
    width: 100%;
    max-width: 360px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 18px;
    padding: 0 !important;
}

.forget-auth .btn,
.forget-auth .btn-default,
.forget-auth .dropdown-toggle {
    color: #dcecff !important;
    border: 1px solid rgba(94, 255, 223, .22) !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, .065) !important;
    text-shadow: none;
}

.forget-auth .dropdown-menu {
    width: 100%;
    max-height: 260px;
    overflow-y: auto;
    padding: 8px;
    border: 1px solid rgba(94, 255, 223, .22);
    border-radius: 8px;
    background: rgba(9, 20, 33, .98);
    box-shadow: 0 18px 50px rgba(0, 0, 0, .42);
}

.forget-auth .dropdown-menu > li > a {
    min-height: 36px;
    display: flex;
    align-items: center;
    gap: 9px;
    color: #cbd9eb;
    border-radius: 6px;
}

.forget-auth .dropdown-menu > li > a:hover,
.forget-auth .dropdown-menu > li > a:focus {
    color: #fff;
    background: rgba(94, 255, 223, .12);
}

.forget-auth label.error {
    margin-top: 7px;
    color: #ff8f9a !important;
    font-weight: 600 !important;
}

.forget-auth .layui-layer {
    border: 1px solid rgba(94, 255, 223, .28);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(13, 25, 39, .96), rgba(6, 16, 27, .94));
    box-shadow: 0 28px 80px rgba(0, 0, 0, .48);
}

.forget-auth .layui-layer-title,
.forget-auth .layui-layer-content {
    color: #e8f4ff;
    background: transparent;
    border-color: rgba(255, 255, 255, .1);
}

body.forget-auth .alert-modal {
    background: rgba(1, 8, 15, .72);
    opacity: 1;
    filter: none;
    backdrop-filter: blur(10px);
}

body.forget-auth .alert-container {
    overflow: hidden;
    border: 1px solid rgba(94, 255, 223, .28);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(13, 25, 39, .96), rgba(6, 16, 27, .94));
    box-shadow: 0 28px 80px rgba(0, 0, 0, .48), 0 0 0 1px rgba(94, 255, 223, .08);
    backdrop-filter: blur(20px);
}

body.forget-auth .alert-title,
body.forget-auth .alert-btn-box {
    color: #eff8ff;
    background: rgba(7, 18, 30, .94);
    border-color: rgba(255, 255, 255, .1);
}

body.forget-auth .alert-content {
    color: #dcecff;
    background: transparent;
}

body.forget-auth .alert-btn-p,
.forget-auth .layui-layer-btn .layui-layer-btn0 {
    color: #061019;
    border: 0;
    border-radius: 6px;
    background: linear-gradient(135deg, #5effdf, #8ea2ff);
    font-weight: 800;
}

body.forget-auth .alert-btn-p:hover,
.forget-auth .layui-layer-btn .layui-layer-btn0:hover {
    color: #041118;
    background: linear-gradient(135deg, #85ffe9, #a7b5ff);
}

.forget-auth-alert .alert-content {
    padding: 24px 24px 72px;
}

.forget-auth-alert-body {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.forget-auth-alert-icon {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(94, 255, 223, .36);
    border-radius: 50%;
    color: #72ffe7;
    background: rgba(94, 255, 223, .12);
    font-weight: 900;
    box-shadow: 0 0 24px rgba(94, 255, 223, .2);
}

.forget-auth-alert-body p {
    margin: 4px 0 0;
    color: #e8f4ff;
    font-size: 14px;
    line-height: 1.7;
}

body.forget-auth.theme-light {
    color: #132235;
    background:
        radial-gradient(circle at 18% 18%, rgba(37, 217, 190, .24), transparent 28%),
        radial-gradient(circle at 82% 10%, rgba(110, 122, 255, .18), transparent 26%),
        linear-gradient(135deg, #f7fbff 0%, #eef4f8 48%, #f8fbff 100%) !important;
}

body.forget-auth.theme-light:before {
    background-image:
        linear-gradient(rgba(25, 52, 78, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(25, 52, 78, .08) 1px, transparent 1px);
}

.theme-light .auth-theme-toggle {
    color: #203247;
    border-color: rgba(31, 158, 146, .24);
    background: rgba(255, 255, 255, .72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92), 0 14px 36px rgba(42, 75, 108, .14);
}

.theme-light .auth-theme-toggle:hover,
.theme-light .auth-theme-toggle:focus {
    color: #0b1726;
    border-color: rgba(31, 158, 146, .46);
    background: rgba(255, 255, 255, .92);
}

.theme-light.forget-auth .login {
    border-color: rgba(28, 58, 88, .12);
    background: linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(245, 250, 255, .74));
    box-shadow: 0 28px 80px rgba(42, 75, 108, .16), 0 0 0 1px rgba(255, 255, 255, .72);
}

.theme-light.forget-auth .login:before {
    background: linear-gradient(135deg, rgba(30, 190, 172, .52), rgba(111, 122, 255, .28), rgba(255, 255, 255, .72));
}

.theme-light.forget-auth .logo-text,
.theme-light .forget-auth-title {
    color: #102034 !important;
}

.theme-light .forget-auth-chip {
    color: #08766b;
    border-color: rgba(18, 170, 152, .22);
    background: rgba(18, 170, 152, .1);
}

.theme-light.forget-auth .loginbox {
    color: #15263a;
}

.theme-light.forget-auth .control-label {
    color: #51677f;
}

.theme-light.forget-auth input[type="email"],
.theme-light.forget-auth input[type="text"],
.theme-light.forget-auth select,
.theme-light.forget-auth .form-control {
    color: #14263b;
    border-color: rgba(28, 58, 88, .14);
    background: rgba(255, 255, 255, .72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .94);
}

.theme-light.forget-auth input::placeholder {
    color: #8090a3;
}

.theme-light.forget-auth input:focus,
.theme-light.forget-auth select:focus,
.theme-light.forget-auth .form-control:focus {
    border-color: rgba(13, 172, 153, .7);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 0 0 3px rgba(13, 172, 153, .13), inset 0 1px 0 rgba(255, 255, 255, .98);
}

.theme-light.forget-auth #verifyImg {
    border-color: rgba(28, 58, 88, .14);
    background: rgba(255, 255, 255, .72);
}

.theme-light.forget-auth .btn,
.theme-light.forget-auth .btn-default,
.theme-light.forget-auth .dropdown-toggle {
    color: #203247 !important;
    border-color: rgba(31, 158, 146, .2) !important;
    background: rgba(255, 255, 255, .72) !important;
}

.theme-light.forget-auth .dropdown-menu {
    border-color: rgba(31, 158, 146, .18);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 18px 50px rgba(42, 75, 108, .2);
}

.theme-light.forget-auth .dropdown-menu > li > a {
    color: #33465d;
}

.theme-light.forget-auth .dropdown-menu > li > a:hover,
.theme-light.forget-auth .dropdown-menu > li > a:focus {
    color: #102034;
    background: rgba(31, 158, 146, .1);
}

body.forget-auth.theme-light .alert-modal {
    background: rgba(218, 229, 239, .66);
}

body.forget-auth.theme-light .alert-container,
.theme-light.forget-auth .layui-layer {
    border-color: rgba(31, 158, 146, .22);
    background: linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(243, 248, 252, .94));
    box-shadow: 0 28px 80px rgba(42, 75, 108, .22), 0 0 0 1px rgba(255, 255, 255, .72);
}

body.forget-auth.theme-light .alert-title,
body.forget-auth.theme-light .alert-btn-box,
.theme-light.forget-auth .layui-layer-title,
.theme-light.forget-auth .layui-layer-content {
    color: #102034;
    background: transparent;
    border-color: rgba(28, 58, 88, .1);
}

body.forget-auth.theme-light .alert-content,
body.forget-auth.theme-light .forget-auth-alert-body p {
    color: #203247;
}

body.forget-auth.theme-light .forget-auth-alert-icon {
    color: #08766b;
    border-color: rgba(18, 170, 152, .25);
    background: rgba(18, 170, 152, .1);
    box-shadow: 0 0 24px rgba(18, 170, 152, .12);
}

.theme-light .forget-auth-chip,
.theme-light.forget-auth .forget-auth-chip {
    background: rgba(64, 115, 180, .1);
    border-color: rgba(120, 157, 205, .26);
    color: #28537f;
}

.theme-light.forget-auth input:focus,
.theme-light.forget-auth select:focus,
.theme-light.forget-auth .form-control:focus {
    border-color: rgba(67, 122, 190, .66);
    box-shadow: 0 0 0 3px rgba(67, 122, 190, .12), inset 0 1px 0 rgba(255, 255, 255, .98);
}

.theme-light.forget-auth .btn,
.theme-light.forget-auth .btn-default,
.theme-light.forget-auth .dropdown-toggle,
.theme-light.forget-auth .dropdown-menu,
body.forget-auth.theme-light .alert-container,
.theme-light.forget-auth .layui-layer {
    border-color: rgba(120, 157, 205, .24) !important;
}

.theme-light.forget-auth .dropdown-menu > li > a:hover,
.theme-light.forget-auth .dropdown-menu > li > a:focus {
    background: rgba(67, 122, 190, .1);
}

body.forget-auth.theme-light .forget-auth-alert-icon {
    color: #28537f;
    border-color: rgba(120, 157, 205, .28);
    background: rgba(64, 115, 180, .1);
    box-shadow: 0 0 24px rgba(67, 122, 190, .12);
}

@media (max-width: 520px) {
    body.forget-auth {
        align-items: center;
        justify-content: center;
        min-height: 100vh;
        padding: 18px 0;
    }

    .forget-auth .login {
        width: calc(100% - 24px) !important;
        margin: 0;
    }

    .forget-auth .head,
    .forget-auth .loginbox {
        padding-left: 22px !important;
        padding-right: 22px !important;
    }

    .forget-auth #yanzm {
        flex-direction: column;
        align-items: stretch;
    }

    .forget-auth .head img {
        max-width: 150px;
    }

    .forget-auth #language_sel {
        width: 100%;
        min-width: 0;
    }
}

body.forget-auth {
    background:
        radial-gradient(circle at 18% 18%, rgba(67, 122, 190, .22), transparent 28%),
        radial-gradient(circle at 82% 10%, rgba(111, 90, 255, .2), transparent 26%),
        linear-gradient(135deg, #071018 0%, #101827 48%, #071018 100%) !important;
}

.forget-auth .login {
    box-shadow: 0 28px 80px rgba(0, 0, 0, .38), 0 0 0 1px rgba(67, 122, 190, .08);
}

.forget-auth .login:before {
    background: linear-gradient(135deg, rgba(96, 138, 196, .64), rgba(116, 98, 255, .36), rgba(255, 255, 255, .06));
}

.forget-auth .toplink-auth-brand img {
    box-shadow: 0 12px 28px rgba(67, 122, 190, .14);
}

.forget-auth input:focus,
.forget-auth select:focus,
.forget-auth .form-control:focus {
    border-color: rgba(126, 167, 223, .72);
    box-shadow: 0 0 0 3px rgba(67, 122, 190, .14), inset 0 1px 0 rgba(255, 255, 255, .08);
}

.forget-auth .submit,
.forget-auth-alert .alert-btn-p,
.forget-auth-layer .layui-layer-btn a {
    background: linear-gradient(135deg, #5f89c8, #8ea2ff) !important;
    box-shadow: 0 16px 38px rgba(67, 122, 190, .24) !important;
}
