/* ============================================================
   customer_premium.css 【11-05 客户端统一升级】
   ── 千川云官网/会员页换装 admin 同款 Indigo 高端皮肤 + 手机自适应
   用法：在 dashboard/login/register/forgot/user_detail/index 的
        </head> 前引入，并替换掉 theme_3d.css（本文件已吸收其有用
        的视觉增强，并接管其全部天空蓝硬编码）。
   原则（与 3D 主题一致）：只做视觉增强，不改 DOM 结构、不改类名、
        不改布局逻辑；手机规则只加不断。
   ============================================================ */

/* ── 1) Indigo 高端令牌（对齐 admin premium：#4f46e5→#7c3aed）── */
:root{
  --accent:#4f46e5 !important;
  --accent-deep:#7c3aed !important;
  --accent-soft:#eef2ff !important;
  --accent2:#7c3aed !important;
  --bg2:#f6f7fb !important;
  --bg3:#eceef6 !important;
  --border:#e7e9f2 !important;
  --border-strong:#d4d8ea !important;
  --text:#131629 !important;
  --muted:#4a5168 !important;
  --dim:#6e7490 !important;
  --grad:linear-gradient(135deg,#4f46e5 0%,#7c3aed 100%) !important;
  --shadow-sm:0 1px 2px rgba(18,22,45,.04),0 1px 3px rgba(18,22,45,.06) !important;
  --shadow-md:0 8px 20px -6px rgba(18,22,45,.10),0 2px 6px -2px rgba(18,22,45,.06) !important;
  --shadow-lg:0 18px 40px -10px rgba(79,70,229,.22),0 4px 12px -4px rgba(18,22,45,.10) !important;
  --radius:12px !important;
}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","HarmonyOS Sans SC","MiSans","PingFang SC","Microsoft YaHei",sans-serif !important;
  font-feature-settings:"tnum" 1,"tabular-nums" 1;
  background-image:none !important;   /* 压掉 3D 主题的天空色光晕 */
}

/* ── 2) 天空蓝硬编码 → Indigo（theme_3d 遗留 + 页面内联遗留）── */
.topbar h1,.topbar .logo{color:var(--text) !important}
.topbar .logo .mark,.brand-dot,.logo .mark{
  background:var(--grad) !important;
  box-shadow:0 2px 10px rgba(79,70,229,.35) !important;
}
.btn-gold,.balance-cta-btn{
  background:var(--grad) !important;
  color:#fff !important;
  box-shadow:0 4px 14px rgba(79,70,229,.30) !important;
}
tr:hover td{background:rgba(79,70,229,.045) !important}
.sidebar-nav a.active,.nav a.active{
  background:linear-gradient(90deg,rgba(79,70,229,.15),rgba(124,58,237,.09)) !important;
  color:var(--accent) !important;
  box-shadow:inset 3px 0 0 var(--accent) !important;
}
.badge-blue{background:rgba(79,70,229,.10) !important;color:#4338ca !important;box-shadow:inset 0 0 0 1px rgba(79,70,229,.16) !important}
.badge-green{background:rgba(5,150,105,.12) !important;color:#047857 !important}
.badge-red{background:rgba(220,38,38,.10) !important;color:#b91c1c !important}
.badge-gold{background:rgba(245,158,11,.14) !important;color:#b45309 !important}

/* 余额卡：天空蓝渐变 → Indigo 渐变（吸收原双层光斑，改紫调） */
.balance-card{
  background:linear-gradient(135deg,#3730a3 0%,#4f46e5 45%,#7c3aed 100%) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  box-shadow:0 1px 2px rgba(18,22,45,.05),0 14px 34px -8px rgba(79,70,229,.45) !important;
}
.balance-card::after{background:radial-gradient(circle,rgba(167,139,250,.24),transparent 65%) !important}
.balance-cta a{
  background:#fff !important;color:#4338ca !important;
  box-shadow:0 4px 16px rgba(30,27,75,.28) !important;
}

/* ── 3) premium 组件抛光（Linear/Stripe 质感）── */
.card{border-radius:var(--radius) !important;transition:box-shadow .25s cubic-bezier(.4,0,.2,1),border-color .25s cubic-bezier(.4,0,.2,1)}
.card:hover{box-shadow:var(--shadow-md) !important;border-color:color-mix(in srgb,var(--accent) 18%,var(--border)) !important}
.btn{border-radius:10px !important;transition:all .2s cubic-bezier(.4,0,.2,1) !important}
.btn:active{transform:scale(.97) !important}
.btn-gold:hover{box-shadow:0 8px 22px rgba(79,70,229,.38) !important}
.btn-outline{border-color:color-mix(in srgb,var(--accent) 35%,var(--border)) !important;color:var(--accent) !important}
input:focus,select:focus,textarea:focus,.field input:focus{
  border-color:var(--accent) !important;
  outline:none !important;
  box-shadow:0 0 0 3px rgba(79,70,229,.14) !important;
}
::selection{background:var(--accent) !important;color:#fff !important}
.quota-card .q-value.blue,.quota-card .q-value.gold{color:#4338ca !important}
.quota-card .q-bar-fill{background:var(--grad) !important}

/* ── 4) 手机自适应（≤768 / ≤640 两档；只加不断）── */
@media (max-width:768px){
  .container{padding:16px 14px !important}
  .welcome h1{font-size:20px !important}
  .balance-card{padding:26px 18px !important}
  .balance-card .balance-amount{font-size:36px !important}
  .app-mock{display:none !important}          /* 官网的电脑壳 mock 在手机上没有信息量 */
  .btn-row{flex-wrap:wrap;gap:10px}
}
@media (max-width:640px){
  body{-webkit-text-size-adjust:100%}
  /* 输入 16px 防 iOS Safari 聚焦自动放大页 */
  input,select,textarea{font-size:16px !important}
  /* 拇指可点 */
  .btn,.btn-gold,.btn-outline,.btn-p,.btn-s,a.btn{min-height:44px;min-width:44px}
  .btn-p{width:100% !important}
  /* 顶栏：小屏收敛成一行可横滑 */
  .topbar{padding:10px 14px !important;gap:10px !important}
  .topbar .nav{gap:12px !important;font-size:12px !important;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .topbar .nav::-webkit-scrollbar{display:none}
  .topbar .user{display:none}                    /* 用户名占位，手机上让位给导航 */
  /* 登录/注册/找回：压缩顶部留白 → 登录按钮首屏可见 */
  .wrap,.box{margin-top:2vh !important;padding:22px 16px !important}
  .wrap .card,.box .card{padding:20px 16px !important}
  .foot{flex-direction:column;gap:8px;text-align:center}
  .code-row{flex-direction:column;gap:8px}
  /* 卡片与表格 */
  .card{padding:16px 14px !important}
  .card-head{padding:12px 14px !important}
  .card-body{padding:14px !important}
  table{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
  th,td{padding:9px 12px !important;font-size:13px !important}
  /* 弹窗/支付卡全宽 */
  .modal{width:calc(100vw - 24px) !important;max-width:none !important;left:50% !important;right:auto !important;transform:translateX(-50%) !important;padding:20px 16px !important}
  .pay-card{width:calc(100vw - 32px) !important;max-width:none !important;padding:18px 16px !important}
  .quota-card{padding:14px !important}
  .quota-card .q-value{font-size:22px !important}
  .balance-cta a{display:block !important;text-align:center !important}
  /* 官网 */
  .beian{font-size:11px !important}
}

/* ── 5) 三路排查补充：theme_3d 摘除后的视觉补位 + 残留天空蓝清扫（11-05）── */
/* theme_3d 原承担且 premium 之前没接住的三样 */
th{background:color-mix(in srgb,var(--bg2) 88%,var(--accent) 4%) !important;
   letter-spacing:.4px;border-bottom:1px solid var(--border) !important}
table{border-collapse:separate;border-spacing:0}
.qj-btn{transition:transform .18s cubic-bezier(.4,0,.2,1),box-shadow .18s}
.qj-btn:hover{transform:translateY(-1px)}
/* 页面内联残留的天空蓝硬编码（user_detail / login / index）→ Indigo 系 */
.nav-here{background:linear-gradient(90deg,rgba(79,70,229,.15),rgba(124,58,237,.09)) !important;color:var(--accent) !important}
.qj-home{background:linear-gradient(135deg,#eef2ff,#e0e7ff) !important;color:#4338ca !important;border-color:#c7d2fe !important}
.qj-btn:hover,.back-link:hover{color:var(--accent) !important}
.login-card .btn,.box .btn{box-shadow:0 4px 14px rgba(79,70,229,.28) !important}
.hero::before,.nav-logo .mark{filter:none}
a.btn-primary,button.btn-primary{background:var(--grad) !important;box-shadow:0 6px 18px rgba(79,70,229,.32) !important}
