/* 重新设计的移动端登录/注册样式（主题变量驱动，保留后端逻辑） */
:root{
    --bg: #f3f6f9;
    --surface: #ffffff;
    --muted: #6b7280;
    --text: #0f1724;
    --primary: #0f4db6; /* 新主色：沉稳深蓝 */
    --primary-700: #0b3f92;
    --accent: #ef6b61; /* 点缀珊瑚 */
    --radius-lg: 14px;
    --radius-md: 10px;
    --shadow-1: 0 10px 30px rgba(16,24,40,0.08);
}
html,body{
    height:100%;
    margin:0;
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Arial", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;
    background: linear-gradient(180deg, var(--bg), #f0f3f7);
    color:var(--text);
    -webkit-text-size-adjust:100%;
}

/* 顶部大图（简洁，去掉复杂纹理） */
.logo-box{ display:none; } /* 头部大图改为卡片内徽章式展示，隐藏原来的大头部 */
.logo-box .logo img{ display:none; }

/* 卡片整体布局，卡片覆盖在 logo 下方形成层次感 */
.auth-wrap{
    max-width:420px;
    margin: 0 auto;
    padding: 0 18px 28px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}
.auth-card{
    background: transparent;
    padding: 0;
}
.auth-panel{
    background: var(--surface);
    border-radius: var(--radius-lg);
    padding: 34px 20px 20px;
    box-shadow: var(--shadow-1);
    overflow: visible;
    width: 440px;
    max-width: calc(100% - 32px);
    position: relative;
    margin: 0 auto;
}
.auth-title{
    text-align:center;
    font-size:16px;
    font-weight:700;
    margin-top: 8px;
    margin-bottom:14px;
    color:var(--text);
}

/* 输入样式：大圆角、内阴影、左侧图标、清晰焦点 */
.form-row{ position:relative; margin-bottom:14px; }
.form-row i{ position:absolute; left:14px; top:50%; transform:translateY(-50%); font-size:18px; color:#9aa6b2; }
.form-input{
    width:100%;
    height:48px;
    padding:0 14px 0 44px;
    border-radius:var(--radius-md);
    border:1px solid rgba(15,23,42,0.06);
    background: linear-gradient(180deg,#ffffff,#fbfdff);
    box-shadow: 0 1px 0 rgba(255,255,255,0.6) inset;
    font-size:15px;
    color:var(--text);
    outline:none;
    transition:box-shadow .18s ease, border-color .18s ease, transform .12s ease;
}
.form-input::placeholder{ color: #b6c0c9; }
.form-input:focus{ border-color:var(--primary); box-shadow:0 8px 28px rgba(15,77,182,0.08); transform:translateY(-1px); }

/* 按钮：纯色 + 轻微立体感 */
.primary-btn{
    width:100%;
    height:48px;
    border-radius:10px;
    background: linear-gradient(180deg,var(--primary),var(--primary-700));
    border:0;
    color:#fff;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
    box-shadow: 0 8px 22px rgba(15,77,182,0.12);
    transition: transform .12s ease, box-shadow .12s ease, opacity .12s;
}
.primary-btn:active{ transform:translateY(1px); box-shadow:0 6px 14px rgba(15,77,182,0.12); }
.primary-btn[disabled]{ opacity:.6; cursor:not-allowed; }

/* tip 行与链接 */
.tip-bar{ text-align:center; margin-top:12px; font-size:13px; color:var(--muted); display:flex; justify-content:center; gap:10px; align-items:center; }
.tip-bar a{ color:var(--accent); text-decoration:none; font-weight:600; }

/* 记住密码 & 忘记密码：紧凑、在一行显示 */
.remember-row{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:4px; }
.real-checkbox{ position:absolute; left:-9999px; /* hide native input but keep for logic */ }
.checkbox-label{ position:relative; padding-left:34px; cursor:pointer; color:var(--muted); user-select:none; }
.checkbox-label:before{
    content:'';
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
    width:18px;
    height:18px;
    border-radius:4px;
    border:1px solid rgba(15,23,42,0.12);
    background:#fff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.6);
}
.checkbox-label.checked:before{
    background: linear-gradient(180deg,var(--primary),var(--primary-700));
    border-color: transparent;
    box-shadow: 0 6px 12px rgba(15,77,182,0.12);
}
.forget-password{ color:var(--primary); text-decoration:none; font-size:14px; font-weight:700; }

/* small screen tweaks */
@media (max-width:420px){
    .logo-box{ height:140px; }
    .logo-box .logo img{ width:140px; }
    .auth-wrap{ margin-top:-50px; padding: 0 14px 18px; }
    .auth-panel{ padding:14px; border-radius:12px; }
}

/* 主内容垂直居中容器（减去 toolbar 高度 56px） */
.kaijiang-auth-root .main-center{
    min-height: calc(100vh - 56px);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding: 18px 0;
}

/* 最终覆盖：在 .kaijiang-auth-root 下强制覆盖任何全局样式，确保页面完全使用本主题 */
.kaijiang-auth-root .login-appbar,
.kaijiang-auth-root .v-toolbar,
.kaijiang-auth-root .v-app-bar,
.kaijiang-auth-root .v-sheet,
.kaijiang-auth-root .v-btn,
.kaijiang-auth-root .v-input,
.kaijiang-auth-root .v-icon,
.kaijiang-auth-root .v-label {
    all: unset;
}
.kaijiang-auth-root * { box-sizing: border-box; }

.kaijiang-auth-root .auth-wrap { margin: -60px auto 0 !important; }
.kaijiang-auth-root .logo-box { display:flex !important; }
.kaijiang-auth-root .auth-panel,
.kaijiang-auth-root .auth-card,
.kaijiang-auth-root .form-container,
.kaijiang-auth-root .form-row,
.kaijiang-auth-root .form-input,
.kaijiang-auth-root .primary-btn,
.kaijiang-auth-root .tip-bar,
.kaijiang-auth-root .checkbox-label {
    /* 重新声明，使用 !important 覆盖任何遗留样式 */
}

.kaijiang-auth-root .form-input {
    width:100% !important;
    height:48px !important;
    padding:0 14px 0 44px !important;
    border-radius:var(--radius-md) !important;
    border:1px solid rgba(15,23,42,0.06) !important;
    background: linear-gradient(180deg,#ffffff,#fbfdff) !important;
    box-shadow: 0 1px 0 rgba(255,255,255,0.6) inset !important;
    font-size:15px !important;
    color:var(--text) !important;
}
.kaijiang-auth-root .primary-btn {
    background: linear-gradient(180deg,var(--primary),var(--primary-700)) !important;
    color:#fff !important;
    border-radius:10px !important;
    box-shadow: 0 6px 18px rgba(15,91,181,0.12) !important;
}
.kaijiang-auth-root .checkbox-label:before,
.kaijiang-auth-root .checkbox-label.checked:before {
    border-radius:4px !important;
}
.kaijiang-auth-root .remember-row { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:8px !important; }

/* 顶部大图（logo 区） */
/* 小徽章式 logo 放置在卡片顶部居中 */
.auth-badge{
    display:none !important; /* 隐藏顶部徽章与 logo */
}
.auth-badge img{ display:none !important; }

/* 让卡片稍微覆盖头部，形成层次感 */
.auth-wrap {
    max-width: 420px;
    margin: 0 auto;
    padding: 0 18px 28px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.auth-panel {
    background: #fff;
    border-radius: 12px;
    padding: 18px;
    box-shadow: 0 10px 30px rgba(20,25,40,0.06);
}

.auth-card { /* 保留外层背景与额外间距 */
    background: transparent;
    box-shadow: none;
    padding: 0;
}

/* 输入框带图标 */
.form-row { position: relative; margin-bottom: 14px; }
.form-row i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); font-size: 18px; color: #9aa3ac; }
.form-row .form-input { padding-left: 44px; height:48px; border-radius: 8px; }

.tip-bar { text-align: center; margin-top: 12px; font-size: 13px; color: #6b7280; }
.tip-bar a { color: #dc443c; text-decoration: none; margin: 0 6px; }

/* 内部小标题样式 */
.auth-panel .auth-title { text-align: center; font-size: 16px; font-weight: 600; margin-bottom: 8px; color:#1f2937; }

@media (max-width:420px){
    .logo-box{ height:140px; }
    .logo-box .logo img{ width: 130px; }
    .auth-wrap { margin-top: -56px; padding: 0 14px 18px; }
}
