/* ============================================================
   爱上水果 · 登录页「星夜果园」质感  login-fx.css
   ------------------------------------------------------------
   · 加载顺序：style.css → login-fx.css → mobile.css
   · 桌面 + 手机统一升级为深空玻璃质感，配合 login-fx.js 粒子
   ============================================================ */

/* ---------- 背景：深空果园 ---------- */
.login-view {
  background:
    radial-gradient(1000px 640px at 82% 10%, rgba(240, 122, 27, .30) 0, transparent 58%),
    radial-gradient(760px 520px at 10% 92%, rgba(216, 27, 27, .22) 0, transparent 55%),
    radial-gradient(880px 600px at 50% 118%, rgba(255, 255, 255, .05) 0, transparent 60%),
    linear-gradient(155deg, #141210 0%, #0D0A08 68%, #080605 100%);
}
.login-overlay {
  background: none;
}

/* ---------- 品牌区 ---------- */
.login-brand .logo {
  border: 1px solid rgba(255, 255, 255, .22);
  box-shadow:
    0 0 0 6px rgba(255, 255, 255, .045),
    0 18px 44px rgba(0, 0, 0, .55),
    0 0 60px rgba(240, 122, 27, .40);
  animation: fxLogoFloat 5.2s ease-in-out infinite;
}
@keyframes fxLogoFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-9px); }
}
.login-brand h1 {
  background: linear-gradient(92deg, #FFFFFF 10%, #FFB199 58%, #E8492A 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: .08em;
  filter: drop-shadow(0 4px 18px rgba(232, 73, 42, .35));
}
.login-brand .sys { color: rgba(255, 255, 255, .60); letter-spacing: .14em; }
.login-brand .slogan { color: rgba(255, 255, 255, .92); }
.login-brand .slogan em {
  text-shadow: 0 0 22px rgba(232, 73, 42, .60);
}
.login-brand .points div { color: rgba(255, 255, 255, .80); }
.login-brand .points svg {
  color: #F07A1B;
  filter: drop-shadow(0 0 6px rgba(240, 122, 27, .65));
}

/* ---------- 登录卡：暗夜玻璃 ---------- */
.login-card {
  background: rgba(20, 16, 14, .72);
  border: 1px solid rgba(255, 255, 255, .11);
  box-shadow:
    0 24px 64px rgba(0, 0, 0, .55),
    inset 0 1px 0 rgba(255, 255, 255, .07);
  backdrop-filter: blur(26px) saturate(1.35);
  -webkit-backdrop-filter: blur(26px) saturate(1.35);
  will-change: transform;
}
.login-card .top h2 {
  background: linear-gradient(92deg, #FFFFFF, #D9DEE8);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.login-card .top p { color: #A8B0BE; }

/* 输入框 */
.field input {
  background: rgba(255, 255, 255, .055);
  border-color: rgba(255, 255, 255, .11);
  color: #F3F4F6;
}
.field input::placeholder { color: #697180; }
.field input:focus {
  background: rgba(255, 255, 255, .085);
  border-color: rgba(255, 92, 122, .68);
  box-shadow: 0 0 0 4px rgba(255, 92, 122, .16), 0 0 24px rgba(255, 92, 122, .14);
}
.field .ico { color: #697180; }
.field .eye { color: #697180; }
.field .eye:hover { color: #F3F4F6; background: rgba(255, 255, 255, .08); }
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #161922 inset;
  -webkit-text-fill-color: #F3F4F6;
  caret-color: #F3F4F6;
  transition: background-color 99999s;
}

/* 记住我 / 忘记密码 */
.remember { color: #A8B0BE; }
.forgot { color: #FF7A94; }
.forgot:hover { text-shadow: 0 0 12px rgba(255, 122, 148, .6); }

/* 登录按钮：渐变 + 流光扫过 */
.btn-primary {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  background: linear-gradient(135deg, #FF7A3D 0%, #FF3D7F 100%);
  box-shadow: 0 12px 30px rgba(255, 92, 122, .40), inset 0 1px 0 rgba(255, 255, 255, .25);
  letter-spacing: .3em;
  text-indent: .3em;
}
.btn-primary::after {
  content: '';
  position: absolute;
  top: 0; left: -70%;
  width: 42%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .38), transparent);
  transform: skewX(-20deg);
  animation: fxShine 3.4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes fxShine {
  0%   { left: -70%; }
  52%  { left: 135%; }
  100% { left: 135%; }
}
.btn-primary:active {
  transform: scale(.97);
  box-shadow: 0 5px 16px rgba(255, 92, 122, .45);
}

/* 提示与页脚 */
.msg { color: #F87171; }
.login-foot { color: #697180; }
