/* ===== 登录页全屏背景（2026-10-29）===== */
/* 前端写死：className:"relative hidden h-full flex-col ... lg:flex"
   hidden 让它小于 1024px 时不显示。这里强制全屏铺满。 */

/* 1) 整个登录页根容器铺满图片 */
body:has([style*="login-bg"]) {
  background: url(/login-bg.png) center center / cover no-repeat fixed !important;
  background-color: #05060a !important;
}

/* 2) 图片所在的左半分栏：解除 hidden，强制显示并铺满 */
div[style*="login-bg.png"] {
  display: flex !important;
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  background: url(/login-bg.png) center center / cover no-repeat !important;
  z-index: 0 !important;
  pointer-events: none !important;
}
/* 左栏内的文字层保持可读 */
div[style*="login-bg.png"] > * {
  pointer-events: auto;
}

/* 3) 右侧登录表单区：半透明玻璃卡片，压在背景之上 */
div[style*="login-bg.png"] ~ *,
body > div#root > div > div:has(> div[style*="login-bg.png"]) > div:last-child {
  position: relative;
  z-index: 10;
}

/* 4) 登录卡片本身做成半透明，能透出背景图 */
:has(> [style*="login-bg.png"]) > div:not([style*="login-bg.png"]) {
  /* 去掉毛玻璃虚影：只保留极淡的底色保证文字可读，不做模糊 */
  background: rgba(8, 10, 18, .28) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 0;
  box-shadow: none !important;
}

/* 5) 去���登录背��图被淡化 */
img[src*="login-bg"] { opacity: 1 !important; }

@media (max-width: 1023px) {
  /* 小屏：背景铺满整个页面，表单卡片居中半透明 */
  div[style*="login-bg.png"] { display: none !important; }
  body:has(form) {
    background: url(/login-bg.png) center center / cover no-repeat fixed !important;
  }
}

/* 2026-10-29：登录页彻底禁用毛玻璃效果（视觉虚影） */
:has([style*="login-bg"]) *,
body:has(form) * {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}


/* ===== 2026-10-29：登录表单移到右侧，左半露出完整背景图 ===== */
/* 表单外层容器（含「欢迎回来」标题 + form）：推到右侧 1/3 区域 */
:has(> div > form) > div,
:has(> form) > div {
  /* 容器布局：左右分栏 */
}

/* 直接命中登录页根容器，改为右侧定位 */
body:has(form[autocomplete="off"]) > div#root > div {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  padding-right: 7vw !important;
  min-height: 100vh !important;
  background: transparent !important;
}

/* 登录卡片本体：限制宽度、右侧垂直居中 */
body:has(form[autocomplete="off"]) > div#root > div > div,
body:has(form[autocomplete="off"]) > div#root > div > form,
body:has(form[autocomplete="off"]) > div#root > div > div:has(> form),
body:has(form[autocomplete="off"]) > div#root > div > div:has(> div > form) {
  width: min(420px, 92vw) !important;
  max-width: 420px !important;
  margin: 0 !important;
  background: rgba(8, 10, 18, .30) !important;
  border-radius: 16px !important;
  padding: 32px 28px !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .35) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* 表单元素的间距微调 */
body:has(form[autocomplete="off"]) form { margin: 0 !important; }

/* 小屏 / 窄窗口：回到居中，图片整体铺满 */
@media (max-width: 900px) {
  body:has(form[autocomplete="off"]) > div#root > div {
    justify-content: center !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
}
