/* 大气分屏式登录页样式 —— 替代原 login.css 的翻转卡片风格 */
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
    font-family: "Microsoft YaHei", "PingFang SC", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background: #0f2c4c;
    color: #1b2b3a;
}

.login-wrap { display: flex; min-height: 100vh; }

/* ===== 左侧品牌渐变区 ===== */
.login-brand {
    flex: 1 1 56%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 64px 8%;
    color: #fff;
    overflow: hidden;
    background:
        radial-gradient(1100px 560px at 18% 18%, rgba(43,150,180,.38), transparent 60%),
        radial-gradient(900px 520px at 82% 88%, rgba(31,111,139,.42), transparent 60%),
        linear-gradient(135deg, #0f2c4c 0%, #14507a 52%, #1b7a8f 100%);
}
.login-brand::after {
    content: ""; position: absolute; right: -140px; top: -140px;
    width: 460px; height: 460px; border-radius: 50%;
    background: rgba(255,255,255,.06);
}
.login-brand::before {
    content: ""; position: absolute; left: -90px; bottom: -120px;
    width: 380px; height: 380px; border-radius: 50%;
    background: rgba(255,255,255,.05);
}
.brand-inner { position: relative; z-index: 2; max-width: 540px; }
.brand-logo {
    width: 76px; height: 76px; border-radius: 18px;
    background: rgba(255,255,255,.14);
    display: flex; align-items: center; justify-content: center;
    font-size: 32px; font-weight: 700; letter-spacing: 1px;
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255,255,255,.25);
    margin-bottom: 30px;
}
.brand-title { font-size: 42px; font-weight: 700; margin: 0 0 10px; letter-spacing: 2px; }
.brand-sub {
    font-size: 13px; letter-spacing: 3px; text-transform: uppercase;
    opacity: .7; margin: 0 0 24px;
}
.brand-desc { font-size: 17px; opacity: .92; margin: 0 0 32px; line-height: 1.6; }
.brand-feats { list-style: none; padding: 0; margin: 0; }
.brand-feats li {
    position: relative; padding-left: 28px; margin-bottom: 15px;
    font-size: 15px; opacity: .92;
}
.brand-feats li::before {
    content: ""; position: absolute; left: 0; top: 7px;
    width: 10px; height: 10px; border-radius: 50%;
    background: #37d0c4;
    box-shadow: 0 0 0 4px rgba(55,208,196,.2);
}
.brand-footer {
    position: absolute; bottom: 26px; left: 8%; z-index: 2;
    font-size: 13px; opacity: .6;
}

/* ===== 右侧登录卡片区 ===== */
.login-main {
    flex: 1 1 44%;
    max-width: 640px;
    display: flex; align-items: center; justify-content: center;
    background: #f4f7fb;
    padding: 40px;
}
.login-card {
    width: 100%; max-width: 388px;
    background: #fff; border-radius: 20px;
    padding: 44px 42px 38px;
    box-shadow: 0 22px 60px rgba(15,44,76,.18);
}
.login-head { font-size: 27px; font-weight: 700; color: #1b2b3a; margin: 0 0 6px; }
.login-tip { font-size: 13px; color: #8a97a8; margin: 0 0 24px; }
.form-group { margin-bottom: 18px; }
.form-group > label {
    display: block; font-size: 13px; color: #5a6675;
    margin-bottom: 7px; font-weight: 600;
}
.form-control {
    width: 100%; height: 46px;
    border: 1px solid #dfe5ec; border-radius: 10px;
    padding: 0 14px; font-size: 15px; color: #1b2b3a;
    background: #fbfcfe; outline: none;
    transition: border-color .2s, box-shadow .2s, background .2s;
}
.form-control:focus {
    border-color: #2a84c9;
    box-shadow: 0 0 0 3px rgba(42,132,201,.15);
    background: #fff;
}
.code-row { display: flex; gap: 12px; align-items: flex-start; }
.code-row .form-control { flex: 1; }
.captcha-img {
    width: 122px; height: 46px; border-radius: 10px;
    cursor: pointer; border: 1px solid #dfe5ec; object-fit: cover;
}
.btn-login {
    width: 100%; height: 48px; border: none; border-radius: 10px;
    background: linear-gradient(135deg, #14507a, #1b7a8f);
    color: #fff; font-size: 17px; font-weight: 600; letter-spacing: 4px;
    cursor: pointer; margin-top: 8px;
    transition: opacity .2s, transform .1s;
}
.btn-login:hover { opacity: .92; }
.btn-login:active { transform: translateY(1px); }
.wechat-btn {
    display: block; width: 100%; margin-top: 14px;
    height: 46px; line-height: 44px; text-align: center;
    border: 1px solid #1aad19; color: #1aad19; border-radius: 10px;
    text-decoration: none; font-size: 15px; font-weight: 600;
    background: #f3fbf3; transition: background .2s;
}
.wechat-btn:hover { background: #e7f7e7; color: #1aad19; text-decoration: none; }

.alert-danger { font-size: 13px; margin-bottom: 18px; }

/* ===== 响应式：窄屏隐藏品牌区，卡片居中于渐变背景 ===== */
@media (max-width: 860px) {
    .login-brand { display: none; }
    .login-main {
        flex: 1 1 100%; max-width: none;
        background: linear-gradient(135deg, #0f2c4c, #1b7a8f);
    }
    .login-card { box-shadow: 0 22px 60px rgba(0,0,0,.3); }
}