@charset "UTF-8";
/* ==================== 详情页暗金主题（Bootstrap 4 覆盖层） ==================== */
/* 与新首页 home.css 变量同源；仅覆盖颜色/背景，不动 Bootstrap 栅格布局 */
:root {
  --bg-dark: #0b0d12;
  --bg-panel: #12151d;
  --gold: #d4af37;
  --text: #e8e2d0;
  --text-muted: #9a937f;
  --line: rgba(212, 175, 55, 0.25);
}

/* 全局底色与文字 */
body {
  background: var(--bg-dark);
  color: var(--text);
}
a { color: var(--gold); }

/* 主体背景：原浅色头图/底图区整体换暗底；padding 压 0 覆盖 common.css 的 42.2rem 大图留白（导航已改 in-flow 两层，内容紧贴导航） */
.main > .main-bg {
  background: var(--bg-dark);
  padding-top: 0;
}

/* 右侧内容卡片区 */
.main-content-right {
  background: var(--bg-panel) !important;
  border: 1px solid var(--line);
  color: var(--text);
}
.content {
  background: var(--bg-panel);
  border: 1px solid var(--line);
  color: var(--text);
}

/* 标题区 */
.content-right-title {
  border-bottom: 1px solid var(--line);
}
.title { color: var(--gold); }

/* 面包屑（您的位置） */
.right-location,
.right-location a {
  color: var(--text-muted) !important;
}
.right-location a:hover {
  color: var(--gold) !important;
}

/* 内容列表链接（富文本/列表兜底，各页专属 CSS 若自带配色则优先） */
.content ul li a { color: var(--text); }
.content ul li a:hover { color: var(--gold); }

/* 分页：ThinkPHP Bootstrap 驱动实际结构 ul.pagination > li > a / li.active > span */
.pagination > li > a {
  background: var(--bg-panel);
  color: var(--gold);
  border: 1px solid var(--line);
  margin: 0 0.3rem;
  padding: 0.3rem 0.7rem;
  text-decoration: none;
}
.pagination > li > a:hover {
  background: var(--gold);
  color: #0b0d12;
}
.pagination > li.active > span {
  background: var(--gold);
  color: #0b0d12;
  border: 1px solid var(--gold);
  margin: 0 0.3rem;
  padding: 0.3rem 0.7rem;
}
.pagination > li.disabled > span {
  background: transparent;
  color: var(--text-muted);
  border: 1px solid var(--line);
  margin: 0 0.3rem;
  padding: 0.3rem 0.7rem;
}

/* 富文本表格 */
.content table,
.content table th,
.content table td {
  color: var(--text);
  border-color: var(--line);
}

/* 按钮：Bootstrap .btn 统一 outline 风格（同首页 .btn-outline） */
.btn {
  background: rgba(11, 13, 18, 0.45);
  border: 1px solid var(--line);
  color: var(--gold-light);
}
.btn:hover {
  border-color: var(--gold);
  background: var(--gold-dim);
  color: var(--gold-light);
}
/* 补丁包下载按钮（原蓝色实底），换暗金描边 */
.download {
  background-color: transparent !important;
  color: var(--gold) !important;
  border: 1px solid var(--line) !important;
}

/* 页脚 */
.main-foot {
  background: var(--bg-panel) !important;
  color: var(--text-muted) !important;
}
.main-foot a {
  color: var(--gold) !important;
}
.main-footer {
  background: transparent;
  color: var(--text-muted);
  border-top: 1px solid var(--line);
}

/* 老站 common.css 强制外层/main-bg min-width 1517px（旧设计稿宽度），
   取消该限制让 Bootstrap 栅格按视口自适应（>1517 大屏仍 100% 撑满不受影响） */
body > div:first-child,
.main > .main-bg {
  min-width: 0 !important;
}

/* ==================== 全站风格统一（user/pay 前台） ==================== */
/* 金色阶变量与首页 home.css :root 对齐（btn-gold/btn-outline 同源色） */
:root {
  --gold-light: #f0d68a;
  --gold-dark: #8a6d2f;
  --gold-dim: rgba(212, 175, 55, 0.15);
}

/* ---------- 字体：正文系统栈，标题衬线（与首页 hero 同族） ---------- */
body {
  font-family: "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
}
.content-right-title > .right-title,
.modal > .modal-content > .content > .login-bg-zh > span {
  font-family: "STKaiti", "KaiTi", "Kaiti SC", "SimSun", serif;
}

/* ---------- 认证卡片：暗底面板 + 金边（替换 login-bg.png 浅色位图） ---------- */
/* Bootstrap .modal{display:none} 与登录卡片 .modal 类名冲突（login.css 靠 JS 摘 .hide 显示，
   页面内静态卡片无此流程）→ 恢复显示；.modal.hide{display:none!important} 不受影响 */
.modal.uc-static {
  display: block;
}
.modal > .modal-content {
  background-image: none !important;
  background-color: var(--bg-panel);
  border: 1px solid var(--gold);
  border-radius: 0.6rem;
  box-shadow: 0 0 40px rgba(212, 175, 55, 0.25);
}
.modal > .modal-content > .content > .login-bg-zh > span {
  color: var(--gold);
  font-size: 1.5rem;
  letter-spacing: 0.4rem;
}
.modal > .modal-content > .content > .close {
  color: var(--text-muted);
}
.modal > .modal-content > .content > .loginList > div > span {
  color: var(--text);
}
/* 登录输入框：暗底金边 + 聚焦金色高亮 */
.modal > .modal-content > .content > .loginList > div > .name,
.modal > .modal-content > .content > .loginList > div > .password,
.modal > .modal-content > .content > .loginList > div > .captcha {
  background-color: var(--bg-dark);
  border-color: var(--line);
  color: var(--text);
}
.modal > .modal-content > .content > .loginList > div > .name:focus,
.modal > .modal-content > .content > .loginList > div > .password:focus {
  border-color: var(--gold);
  outline: none;
  box-shadow: 0 0 0.4rem rgba(212, 175, 55, 0.35);
}
.modal > .modal-content > .content > .loginList input::placeholder {
  color: var(--text-muted);
}
/* 协议勾选：暗底圆点，选中金色 */
.modal > .modal-content > .content > .loginList > .regProtocol > span:first-child,
.modal > .modal-content > .content > .loginList > .regProtocol > span > .title {
  color: var(--text-muted);
}
.modal > .modal-content > .content > .loginList > .regProtocol > span > input[type="checkbox"] {
  background-color: var(--bg-dark);
  border-color: var(--line);
}
.modal > .modal-content > .content > .loginList > .regProtocol > span > input:checked {
  background-color: var(--gold);
  border-color: var(--gold);
}
.modal > .modal-content > .content > .loginList > .regProtocol > span > a,
.modal > .modal-content > .content > .loginList > .but,
.modal > .modal-content > .content > .loginList > .but > a {
  color: var(--gold);
}
.modal > .modal-content > .content > .loginList a:hover {
  color: var(--gold-light);
}
/* 登录卡的 .btn 是布局容器（内放提交按钮），排除 .btn 全局 outline 规则 */
.modal > .modal-content > .content > .loginList > .btn {
  background: none;
  border: 0;
}

/* ---------- 主按钮：金渐变 + 深色字（同首页 .btn-gold，替换位图按钮） ----------
   登录 / 注册 / 找密码 / 换绑 / 改密 / 充值提交 / 结果页操作 共 7 个位图按钮，
   模板已补文字（Task 2/3），此处只换视觉（尺寸由各 css 原规则保留） */
.modal > .modal-content > .content > .loginList > .btn > .login,
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regButton > button,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recButton > button,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recButton > a > button {
  background-image: none !important;
  background: linear-gradient(180deg, #f0d68a 0%, #d4af37 45%, #a87e22 100%) !important;
  color: #1a1408;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.25rem;
  border: 0;
  border-radius: 0.4rem;
  box-shadow: 0 0 22px rgba(212, 175, 55, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.5);
}
.modal > .modal-content > .content > .loginList > .btn > .login:hover,
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regButton > button:hover,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recButton > button:hover,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recButton > a > button:hover {
  box-shadow: 0 6px 30px rgba(212, 175, 55, 0.55);
}

/* ---------- 次按钮：暗底 + 金描边 + 金字（同首页 .btn-outline） ---------- */
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regField > .captcha > span > .btn-cap,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > .rechargeAmount > .limit > button {
  background: rgba(11, 13, 18, 0.45);
  background-image: none;
  border: 1px solid var(--line);
  color: var(--gold-light);
}
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regField > .captcha > span > .btn-cap:hover,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > .rechargeAmount > .limit > button:hover {
  border-color: var(--gold);
  background: var(--gold-dim);
  color: var(--gold-light);
}
/* 获取验证码倒计时禁用态（模板用 disabled 属性控制） */
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regField > .captcha > span > .btn-cap:disabled {
  background: rgba(154, 147, 127, 0.15);
  border-color: rgba(154, 147, 127, 0.35);
  color: var(--text-muted);
}

/* ---------- 表单输入框：暗底金边（register/findpwd/mobile/password 共用 register.css 链） ---------- */
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regField > div > span > input {
  background-color: var(--bg-dark);
  border-color: var(--line);
  color: var(--text);
}
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regField > div > span > input:focus {
  border-color: var(--gold);
  outline: none;
  box-shadow: 0 0 0.4rem rgba(212, 175, 55, 0.35);
}
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regField > div > span > input::placeholder {
  color: var(--text-muted);
}
/* 禁用输入框（换绑页当前手机号只读展示） */
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regField > div > span > input:disabled {
  background-color: var(--bg-panel);
  color: var(--text-muted);
}
/* 充值表单（recharge.css 链） */
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > div > .text > input,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > div > .text > select,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > .rechargeAmount > .reveal > .amount > .amount {
  background-color: var(--bg-dark);
  border-color: var(--line);
  color: var(--text);
}
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > div > .text > select:focus,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > .rechargeAmount > .reveal > .amount > .amount:focus {
  border-color: var(--gold);
  outline: none;
  box-shadow: 0 0 0.4rem rgba(212, 175, 55, 0.35);
}
/* select 原文案强制黑色（recharge.css color:#000!important）→ 同特异性链 + 后加载胜出改亮色 */
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > div > .text > select {
  color: var(--text) !important;
}

/* ---------- 表单标签与提示文字 ---------- */
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regField > div > span,
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regProtocol,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > div > .recLabel,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > .rechargeAmount > .reveal > .yuan,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recField > .rechargeAmount > .reveal > .currency,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recProtocol {
  color: var(--gold-light);
}
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regField > .prompt > .prompt,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .prompt {
  color: var(--text-muted);
}
/* 协议链接（register.css 蓝色 #75b4ff → 金色） */
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regProtocol > span > a {
  color: var(--gold);
}
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regProtocol > span > a:hover {
  color: var(--gold-light);
}
/* 单选/复选圆点统一金色选中态（注册协议 + 支付方式） */
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regProtocol > span > input[type="checkbox"],
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recProtocol > .paymentBox > span > label > input {
  background-color: var(--bg-dark);
  border-color: var(--line);
}
.main > .main-bg > .main-content > .main-content-right > .content > .register > .content > div > .regProtocol > span > input:checked,
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > div > .recProtocol > .paymentBox > span > label > input:checked {
  background-color: var(--gold);
  border-color: var(--gold);
}

/* ---------- 充值表单面板（recharge.css 灰底 #9c9c9c → 暗面板） ---------- */
.main > .main-bg > .main-content > .main-content-right > .recharge > .content > .rechargeContent {
  background-color: var(--bg-panel);
  border-color: var(--line);
}

/* ---------- 个人中心资料卡片（center.html 白底蓝边 → 暗面板金边） ---------- */
.uc-card {
  background: var(--bg-panel);
  border-color: var(--line);
}
.uc-card .uc-row {
  border-bottom-color: var(--line);
}
.uc-card .uc-label {
  color: var(--gold-light);
}
.uc-card .uc-value {
  color: var(--text);
}
.uc-badge.ok {
  background: var(--gold);
  color: #1a1408;
}
.uc-badge.no {
  background: rgba(154, 147, 127, 0.3);
  color: var(--text-muted);
}
.uc-actions a {
  background: rgba(11, 13, 18, 0.45);
  border-color: var(--line);
  color: var(--gold-light);
}
.uc-actions a:hover {
  background: var(--gold-dim);
  border-color: var(--gold);
  color: var(--gold-light);
}

/* ---------- 表格：表头金字、行间金线、hover 微亮 ---------- */
.content table th {
  background: var(--bg-panel);
  color: var(--gold);
  border-color: var(--line);
}
.content table tbody tr:hover {
  background: var(--gold-dim);
}
/* 金额金色突出（收银台/结果页兜底） */
.money {
  color: var(--gold);
}
