/* ===== 登录页（横屏左右分栏 / 竖屏上下堆叠，自动适应） =====
   颜色全部来自 style.css 开头的那张颜色表，要改色去那里改 */

.lg-view{
  min-height:100vh;min-height:100dvh;display:flex;padding:20px;
  background:var(--dark);overflow:auto;
}
.lg-card{
  margin:auto;width:100%;max-width:880px;
  display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;
  background:var(--black);border-radius:14px;padding:64px 56px;
  box-shadow:0 24px 60px rgba(0,0,0,.45);
}
.lg-brand{
  font-size:40px;font-weight:800;letter-spacing:.01em;line-height:1.1;
  color:var(--accent);
}
.lg-form{display:flex;flex-direction:column;width:100%;max-width:340px;}
.lg-title{margin:0;font-size:26px;font-weight:700;line-height:1.2;color:var(--white);}
.lg-sub{margin:8px 0 28px;font-size:14px;line-height:1.5;color:var(--line);}
.lg-label{margin:14px 0 6px;font-size:13px;color:var(--paper);}
.lg-label:first-of-type{margin-top:0;}

.lg-input{
  width:100%;height:44px;padding:0 14px;border:none;border-radius:8px;
  background:var(--paper);color:var(--black);font-size:15px;outline:none;
}
.lg-input::placeholder{color:var(--mid);}
.lg-input:focus{box-shadow:0 0 0 2px var(--accent);}
/* 浏览器自动填充密码时会把输入框染成黄/蓝色，这里压回灰白 */
.lg-input:-webkit-autofill{
  -webkit-box-shadow:0 0 0 100px var(--paper) inset;-webkit-text-fill-color:var(--black);
}

.lg-pass{position:relative;}
.lg-pass .lg-input{padding-right:46px;}
.lg-eye{
  position:absolute;right:4px;top:4px;width:36px;height:36px;padding:0;
  display:flex;align-items:center;justify-content:center;
  border:none;border-radius:6px;background:none;color:var(--mid);
}
.lg-eye:hover{color:var(--black);}
.lg-eye svg{width:18px;height:18px;}
.lg-eye .ic-hide{display:none;}
.lg-eye.on .ic-show{display:none;}
.lg-eye.on .ic-hide{display:block;}

.lg-submit{
  margin-top:24px;height:44px;border:none;border-radius:8px;
  background:rgba(255,255,255,.16);color:var(--white);font-size:15px;font-weight:600;
}
.lg-submit:hover,.lg-submit:focus-visible{background:var(--accent);color:var(--black);outline:none;}
.lg-error{min-height:18px;margin-top:12px;font-size:13px;color:var(--danger);}

/* 手机竖屏：上下堆叠 */
@media (max-width:760px){
  .lg-view{padding:16px;}
  .lg-card{grid-template-columns:1fr;gap:28px;max-width:420px;padding:36px 24px 28px;}
  .lg-brand{font-size:34px;}
  .lg-form{max-width:none;}
  .lg-input{font-size:16px;} /* 16px 以上，iPhone 才不会在点输入框时自动放大页面 */
}
