/* ========================================
   月之暗面 - 登录页设计（电脑端）
   ======================================== */

/* ===== 重置 ===== */
html, body {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

#app {
  width: 100% !important;
  height: 100% !important;
}

/* ===== 登录页背景 ===== */
.view-account,
.view-account[data-v-7de6931f] {
  overflow: hidden !important;
  background: linear-gradient(135deg, #0c0f1a 0%, #1a1d35 40%, #0f1225 100%) !important;
  background-image: none !important;
  min-height: 100vh !important;
  position: relative !important;
  width: 100% !important;
  height: 100vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 1 !important;
}

/* ===== 星空背景层 ===== */
.view-account::before {
  content: '' !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image:
    radial-gradient(2px 2px at 5% 15%, rgba(255,255,255,0.9), transparent),
    radial-gradient(2px 2px at 15% 45%, rgba(179,136,255,0.8), transparent),
    radial-gradient(1px 1px at 25% 25%, rgba(255,255,255,0.7), transparent),
    radial-gradient(2px 2px at 35% 65%, rgba(124,77,255,0.7), transparent),
    radial-gradient(1px 1px at 45% 10%, rgba(255,255,255,0.8), transparent),
    radial-gradient(2px 2px at 55% 55%, rgba(255,255,255,0.6), transparent),
    radial-gradient(1px 1px at 65% 35%, rgba(179,136,255,0.9), transparent),
    radial-gradient(2px 2px at 75% 75%, rgba(255,255,255,0.5), transparent),
    radial-gradient(1px 1px at 85% 20%, rgba(124,77,255,0.8), transparent),
    radial-gradient(2px 2px at 95% 60%, rgba(255,255,255,0.7), transparent),
    radial-gradient(1px 1px at 10% 80%, rgba(255,255,255,0.6), transparent),
    radial-gradient(2px 2px at 20% 90%, rgba(179,136,255,0.7), transparent),
    radial-gradient(1px 1px at 30% 5%, rgba(255,255,255,0.8), transparent),
    radial-gradient(2px 2px at 40% 40%, rgba(124,77,255,0.6), transparent),
    radial-gradient(1px 1px at 50% 85%, rgba(255,255,255,0.7), transparent),
    radial-gradient(2px 2px at 60% 15%, rgba(255,255,255,0.5), transparent),
    radial-gradient(1px 1px at 70% 50%, rgba(179,136,255,0.8), transparent),
    radial-gradient(2px 2px at 80% 30%, rgba(255,255,255,0.6), transparent),
    radial-gradient(1px 1px at 90% 70%, rgba(124,77,255,0.7), transparent),
    radial-gradient(2px 2px at 98% 95%, rgba(255,255,255,0.5), transparent) !important;
  background-size: 100% 100% !important;
  animation: twinkle 4s ease-in-out infinite !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

@keyframes twinkle {
  0%, 100% { opacity: 0.7; }
  50% { opacity: 1; }
}

/* ===== 右上角紫色光晕 ===== */
.view-account::after {
  content: '' !important;
  position: fixed !important;
  top: -300px !important;
  right: -300px !important;
  width: 700px !important;
  height: 700px !important;
  background: radial-gradient(circle, rgba(124,77,255,0.3) 0%, rgba(83,109,254,0.15) 40%, transparent 70%) !important;
  border-radius: 50% !important;
  animation: pulse 8s ease-in-out infinite !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

@keyframes pulse {
  0%, 100% { transform: scale(1); opacity: 0.6; }
  50% { transform: scale(1.15); opacity: 0.9; }
}

/* ===== 左下角蓝色光晕 ===== */
.view-account .glow-bottom {
  position: fixed !important;
  bottom: -350px !important;
  left: -350px !important;
  width: 700px !important;
  height: 700px !important;
  background: radial-gradient(circle, rgba(83,109,254,0.25) 0%, rgba(124,77,255,0.1) 40%, transparent 70%) !important;
  border-radius: 50% !important;
  animation: pulse 10s ease-in-out infinite reverse !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

/* ===== 登录卡片 ===== */
.view-account-container,
.view-account-container[data-v-7de6931f] {
  background: linear-gradient(145deg, rgba(20,25,50,0.9), rgba(15,20,40,0.95)) !important;
  border: 1px solid rgba(124,77,255,0.3) !important;
  border-radius: 28px !important;
  box-shadow:
    0 25px 80px rgba(0,0,0,0.6),
    0 0 60px rgba(124,77,255,0.15),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
  padding: 60px 55px !important;
  max-width: 480px !important;
  width: 90% !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 10 !important;
  backdrop-filter: blur(30px) !important;
  -webkit-backdrop-filter: blur(30px) !important;
}

/* ===== Logo区域 ===== */
.view-account-top,
.view-account-top[data-v-7de6931f] {
  padding: 25px 0 20px 0 !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.view-account-top img,
.view-account-top svg,
.view-account-top .logo,
.view-account-top > *:first-child {
  display: block !important;
  margin: 0 auto 25px auto !important;
  max-width: 100% !important;
  filter: drop-shadow(0 0 30px rgba(124,77,255,0.6)) !important;
  border-radius: 16px !important;
  padding: 12px !important;
  background: linear-gradient(145deg, rgba(124,77,255,0.12), rgba(83,109,254,0.08)) !important;
  box-shadow: 0 0 30px rgba(124,77,255,0.25) !important;
}

/* ===== 标题 ===== */
.view-account-top h1,
.view-account-top h2,
.view-account-top h3,
.view-account-top .title,
.view-account-top[data-v-7de6931f] h1,
.view-account-top[data-v-7de6931f] h2,
.view-account-top[data-v-7de6931f] h3,
.view-account-top[data-v-7de6931f] .title {
  color: #ffffff !important;
  font-size: 48px !important;
  font-weight: 700 !important;
  margin: 0 0 10px 0 !important;
  letter-spacing: 6px !important;
  background: linear-gradient(135deg, #ffffff 0%, #b388ff 50%, #7c4dff 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  animation: titleGlow 3s ease-in-out infinite !important;
  text-shadow: none !important;
  filter: drop-shadow(0 0 15px rgba(124,77,255,0.8)) !important;
}

@keyframes titleGlow {
  0%, 100% {
    filter: drop-shadow(0 0 15px rgba(124,77,255,0.6));
    transform: scale(1);
  }
  50% {
    filter: drop-shadow(0 0 30px rgba(124,77,255,1));
    transform: scale(1.02);
  }
}

.view-account-top-desc,
.view-account-top-desc[data-v-7de6931f] {
  color: rgba(255,255,255,0.6) !important;
  font-size: 15px !important;
  margin-top: 5px !important;
}

/* ===== 表单 ===== */
.view-account .ant-form-item {
  margin-bottom: 22px !important;
}

/* ===== 输入框 ===== */
.view-account .ant-input,
.view-account .ant-input-affix-wrapper {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(124,77,255,0.25) !important;
  color: #ffffff !important;
  border-radius: 14px !important;
  height: 52px !important;
  font-size: 16px !important;
  padding: 0 18px !important;
  transition: all 0.3s ease !important;
}

.view-account .ant-input:hover,
.view-account .ant-input-affix-wrapper:hover {
  border-color: rgba(124,77,255,0.5) !important;
  background: rgba(255,255,255,0.08) !important;
}

.view-account .ant-input:focus,
.view-account .ant-input-affix-wrapper-focused {
  border-color: #7c4dff !important;
  background: rgba(255,255,255,0.1) !important;
  box-shadow: 0 0 0 4px rgba(124,77,255,0.15), 0 0 30px rgba(124,77,255,0.2) !important;
}

.view-account .ant-input::placeholder {
  color: rgba(255,255,255,0.4) !important;
}

.view-account .ant-input-prefix {
  color: rgba(124,77,255,0.8) !important;
  font-size: 18px !important;
  margin-right: 12px !important;
}

/* ===== 登录按钮 ===== */
.view-account .ant-btn-primary {
  background: linear-gradient(135deg, #7c4dff 0%, #536dfe 50%, #7c4dff 100%) !important;
  background-size: 200% 100% !important;
  border: none !important;
  border-radius: 14px !important;
  height: 54px !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  box-shadow: 0 8px 35px rgba(124,77,255,0.5) !important;
  transition: all 0.4s ease !important;
}

.view-account .ant-btn-primary:hover {
  background-position: 100% 0 !important;
  box-shadow: 0 12px 45px rgba(124,77,255,0.7) !important;
  transform: translateY(-3px) !important;
}

/* ===== 复选框 ===== */
.view-account .ant-checkbox-wrapper {
  color: rgba(255,255,255,0.7) !important;
  font-size: 14px !important;
}

.view-account .ant-checkbox-inner {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(124,77,255,0.3) !important;
  border-radius: 5px !important;
  width: 18px !important;
  height: 18px !important;
}

.view-account .ant-checkbox-checked .ant-checkbox-inner {
  background: linear-gradient(135deg, #7c4dff, #536dfe) !important;
  border-color: #7c4dff !important;
}

/* ===== 链接 ===== */
.view-account a {
  color: rgba(179,136,255,1) !important;
  font-size: 14px !important;
  transition: all 0.2s ease !important;
}

.view-account a:hover {
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(179,136,255,0.5) !important;
}

/* ===== 分割线 ===== */
.view-account-other,
.view-account-other[data-v-7de6931f] {
  border-top: 1px solid rgba(124,77,255,0.15) !important;
  padding-top: 20px !important;
  margin-top: 25px !important;
}

.view-account .default-color,
.view-account .default-color[data-v-7de6931f] {
  color: rgba(255,255,255,0.6) !important;
}

/* ===== 标签 ===== */
.view-account .ant-form-item-label > label {
  color: rgba(255,255,255,0.8) !important;
  font-size: 14px !important;
}

/* ===== 错误提示 ===== */
.view-account .ant-form-item-explain-error {
  color: #ff8a80 !important;
}

/* ===== 加载动画 ===== */
.first-loading-wrap {
  background: linear-gradient(135deg, #0c0f1a 0%, #1a1d35 40%, #0f1225 100%) !important;
}

.first-loading-wrap .dot i {
  background-color: #7c4dff !important;
}

/* ===== 深色模式 ===== */
html[data-theme="dark"] body {
  background: linear-gradient(135deg, #060812 0%, #0d1020 40%, #080a15 100%) !important;
}

/* ===== 隐藏顶部红色通知框 ===== */
.n-alert,
.n-alert.n-alert--error,
[class*="alert"][class*="error"],
[class*="notice"][class*="bar"],
[class*="notification"][class*="top"],
[class*="update"][class*="time"],
[class*="content-update"],
[class*="fileLastModified"],
div[style*="border"][style*="red"],
div[style*="border-color: rgb(220"],
div[style*="border-color: #e74c3c"],
div[style*="border-color: #ff"],
div[style*="background"][style*="rgba(255, 0, 0"],
div[style*="background-color: rgba(255, 107, 107"] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* ========================================
   横屏自动缩放 - 确保登录按钮可见
   ======================================== */
@media (max-height: 700px) and (orientation: landscape) {
  .view-account-container,
  .view-account-container[data-v-7de6931f] {
    transform-origin: center center !important;
    transform: scale(0.85) !important;
    padding: 40px 45px !important;
  }

  .view-account-top,
  .view-account-top[data-v-7de6931f] {
    padding: 15px 0 10px 0 !important;
  }

  .view-account-top img,
  .view-account-top svg {
    margin-bottom: 15px !important;
    padding: 8px !important;
  }

  .view-account-top h1,
  .view-account-top[data-v-7de6931f] h1 {
    font-size: 36px !important;
    margin-bottom: 5px !important;
  }

  .view-account .ant-form-item {
    margin-bottom: 15px !important;
  }

  .view-account .ant-input,
  .view-account .ant-input-affix-wrapper {
    height: 44px !important;
  }

  .view-account .ant-btn-primary {
    height: 46px !important;
  }
}

@media (max-height: 550px) and (orientation: landscape) {
  .view-account-container,
  .view-account-container[data-v-7de6931f] {
    transform: scale(0.7) !important;
    padding: 30px 35px !important;
  }

  .view-account-top,
  .view-account-top[data-v-7de6931f] {
    padding: 10px 0 5px 0 !important;
  }

  .view-account-top img,
  .view-account-top svg {
    margin-bottom: 10px !important;
    padding: 6px !important;
  }

  .view-account-top h1,
  .view-account-top[data-v-7de6931f] h1 {
    font-size: 28px !important;
    margin-bottom: 3px !important;
    letter-spacing: 4px !important;
  }

  .view-account-top-desc,
  .view-account-top-desc[data-v-7de6931f] {
    font-size: 12px !important;
  }

  .view-account .ant-form-item {
    margin-bottom: 10px !important;
  }

  .view-account .ant-input,
  .view-account .ant-input-affix-wrapper {
    height: 38px !important;
    font-size: 14px !important;
  }

  .view-account .ant-btn-primary {
    height: 40px !important;
    font-size: 15px !important;
  }

  .view-account-other,
  .view-account-other[data-v-7de6931f] {
    margin-top: 15px !important;
    padding-top: 12px !important;
  }
}

@media (max-height: 400px) and (orientation: landscape) {
  .view-account-container,
  .view-account-container[data-v-7de6931f] {
    transform: scale(0.6) !important;
    padding: 20px 25px !important;
  }

  .view-account-top,
  .view-account-top[data-v-7de6931f] {
    padding: 5px 0 !important;
  }

  .view-account-top img,
  .view-account-top svg {
    margin-bottom: 5px !important;
    padding: 4px !important;
  }

  .view-account-top h1,
  .view-account-top[data-v-7de6931f] h1 {
    font-size: 22px !important;
    margin-bottom: 2px !important;
    letter-spacing: 2px !important;
  }

  .view-account .ant-form-item {
    margin-bottom: 6px !important;
  }

  .view-account .ant-input,
  .view-account .ant-input-affix-wrapper {
    height: 32px !important;
    font-size: 12px !important;
  }

  .view-account .ant-btn-primary {
    height: 34px !important;
    font-size: 13px !important;
  }
}