:root {
    --login-bg: #f3f5f7;
    --login-surface: #ffffff;
    --login-border: #dfe3e8;
    --login-text: #20262e;
    --login-muted: #68727d;
    --login-primary: #2563eb;
    --login-accent: #0f9f6e;
}

* {
    box-sizing: border-box;
}

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

body.error-page-wrapper {
    margin: 0;
    color: var(--login-text);
    background: var(--login-bg) !important;
    background-image: none !important;
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    opacity: 1 !important;
}

#LAY-user-login {
    min-height: 100vh;
    padding: 24px 16px;
}

.layadmin-user-login-main {
    position: relative;
    width: 400px;
    max-width: 100%;
    padding: 28px;
    background: var(--login-surface);
    border: 1px solid var(--login-border);
    border-top: 3px solid var(--login-accent);
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(32, 38, 46, 0.08);
    backdrop-filter: none;
}

.FontColor {
    margin: 0 0 8px;
    color: var(--login-text);
    background: none;
    -webkit-text-fill-color: currentColor;
    font-size: 24px;
    font-weight: 600;
}

.layadmin-user-login-header p,
.layui-trans,
.layadmin-user-login-footer {
    color: var(--login-muted) !important;
}

.layui-form-item {
    margin-bottom: 16px;
}

.layui-input {
    height: 42px;
    padding-left: 40px;
    color: var(--login-text);
    background: #fff;
    border: 1px solid var(--login-border);
    border-radius: 5px;
    transition: none;
}

.layui-input:focus {
    border-color: var(--login-primary) !important;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
}

.layadmin-user-login-icon {
    left: 12px;
    color: #7b8490;
}

#submit_login {
    height: 42px;
    color: #fff;
    background: var(--login-primary);
    border: 0;
    border-radius: 5px;
    font-size: 15px;
    transition: none;
}

#submit_login:hover {
    background: #1d4ed8;
    box-shadow: none;
    transform: none;
}

#sendcode {
    color: var(--login-primary);
    background: #fff;
    border: 1px solid #b9c8df;
    border-radius: 5px;
    transition: none;
}

.layadmin-user-jump-change,
.layadmin-user-login-footer a {
    color: var(--login-primary) !important;
}

.LoginIcon,
.LoginIcon:hover {
    color: var(--login-accent);
    transform: none;
}

.layadmin-user-login-other {
    gap: 12px;
}

.layadmin-user-login-footer {
    margin-top: 18px;
}

@media screen and (max-width: 520px) {
    #LAY-user-login {
        justify-content: flex-start;
        padding-top: 9vh;
    }

    .layadmin-user-login-main {
        width: 100%;
        padding: 22px 18px;
    }

    .FontColor {
        font-size: 21px;
    }

    .layadmin-user-login-other {
        flex-flow: row wrap;
        align-items: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
    }
}