/* ---------- 0. v0.4 量子主题语义别名 ----------
   收敛模板中遗留的 --c-primary / --c-surface 引用（原全站未定义，渲染失效）。
   值与 Quantum v0.4（宝塔绿 #20a53a）令牌 --gold / --glass-card 保持一致。 */
:root {
  --c-primary: #20a53a;
  --c-surface: #ffffff;
}

/* ============================================================
   theme-global.css — 全站统一视觉（与首页 home.css 的第 1、2 节同源）
   目的：让所有前台页面与首页保持完全一致的底色氛围与导航风格
   作用域：限定 body:not(.is-console)，控制台/后台布局不受影响
   依赖 v3.css 设计令牌：--gold / --gold-deep / --serif / --ink*
   ============================================================ */

/* ---------- 1. 氛围：去掉旧背景装饰，换纯净浅色 ---------- */
body:not(.is-console){background:#f4f5f8!important}
body:not(.is-console) .sky,
body:not(.is-console) .blob,
body:not(.is-console) .ticker{display:none!important}

/* ---------- 2. 导航：浅色圆角白条 + 金色 logo 块 + 胶囊按钮 ---------- */
body:not(.is-console) .nav{
  background:rgba(255,255,255,.94)!important;
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid rgba(32,36,44,.05)!important;
  border-radius:0 0 24px 24px;
  box-shadow:0 14px 34px -22px rgba(40,48,66,.22)!important;
}
/* 仅隐藏博客时代遗留搜索框 */
body:not(.is-console) .search{display:none!important}
/* 首页品牌：金色 bt 方块 + penl（由 layout 在 $isHome 时输出 .home-mark/.home-bt） */
body:not(.is-console) .brand .home-mark{
  width:38px;height:38px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(135deg,#c99a4d,#a9742a);border:none;
  color:#fff;font-family:var(--serif);font-weight:700;font-size:16px;
  box-shadow:0 8px 18px -6px rgba(143,100,32,.5);
}
body:not(.is-console) .brand .home-bt{font-family:var(--serif);font-size:21px;font-weight:700;letter-spacing:.04em;color:#1a1e26}
body:not(.is-console) .brand .home-bt .sub{display:none}
/* 右侧胶囊按钮组 */
.nav-login{
  display:inline-flex;align-items:center;padding:9px 20px;border-radius:999px;
  border:1px solid rgba(32,36,44,.12);background:#fff;color:#3a3f4a;
  font-size:14px;font-weight:600;
  transition:border-color .25s,color .25s,box-shadow .25s,transform .25s var(--ease);
}
.nav-login:hover{border-color:rgba(176,127,47,.45);color:var(--gold-deep);box-shadow:0 8px 18px -10px rgba(40,48,66,.25)}
.nav-register{
  display:inline-flex;align-items:center;padding:9px 22px;border-radius:999px;
  background:linear-gradient(135deg,#c99a4d,#a9742a);color:#fff;
  font-size:14px;font-weight:600;
  box-shadow:0 10px 22px -8px rgba(143,100,32,.55);
  transition:transform .25s var(--ease),box-shadow .25s,color .25s;
}
.nav-register:hover{transform:translateY(-1px);color:#fff;box-shadow:0 14px 28px -8px rgba(143,100,32,.65)}
.nav-register:active{transform:translateY(0)}
/* 移动端菜单里的注册入口 */
body:not(.is-console) .nav-mobile .nav-m-reg{color:var(--gold-deep);font-weight:700}


/* ============================================================
   通用工具类补齐（r32）
   背景：support / help / contact / host 页在 r22 美化时引用了一批
   v3.css 未编译进去的 Tailwind 工具类（max-w-5xl、gap-5、sm:px-6、
   animate-spin、space-y-8 等）。浏览器对未定义类名静默忽略、不报错，
   于是表现为：容器在大屏无限宽、表单两列紧贴无间距、提交按钮的加载
   小圈不旋转、必填星号不着色。
   放在本文件（由共享布局引入）以保证前台全站生效。
   ============================================================ */

/* —— 容器最大宽度 —— */
.max-w-5xl{max-width:1024px;margin-left:auto;margin-right:auto}
.max-w-3xl{max-width:768px;margin-left:auto;margin-right:auto}

/* —— 间距 —— */
.gap-5{gap:20px}
.space-y-8>*:not(:first-child){margin-top:32px}
.mt-0\.5{margin-top:2px}
.ml-auto{margin-left:auto}
.shrink-0{flex-shrink:0}

/* —— 过渡与排版 —— */
.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.25s}
.leading-relaxed{line-height:1.75}

/* —— 响应式：sm 断点（≥640px）—— */
@media (min-width:640px){
    .sm\:px-6{padding-left:24px;padding-right:24px}
}

/* —— 提交按钮加载动画 —— */
@keyframes pg-spin{to{transform:rotate(360deg)}}
.animate-spin{animation:pg-spin .8s linear infinite}
.border-white\/40{border-color:rgba(255,255,255,.4)}
.border-t-white{border-top-color:#fff}

/* —— 必填星号 —— */
/* 原有规则写作 .pg-user-hosts .text-red，作用域仅限用户主机页，
   其他页面引用 .text-red 时不生效，这里放开为全局并给兜底色。 */
.text-red{color:var(--c-red,#dc2626)}

/* ---------- 3. 移动端导航适配（源自 home.css，原先仅首页加载，
   导致其他页 .nav-register 在窄屏把导航撑宽、burger 被挤出屏幕点不到） ---------- */
@media (max-width:920px){
  body:not(.is-console) .nav{padding:12px clamp(16px,4vw,32px)}
}
@media (max-width:520px){
  body:not(.is-console) .nav-register{display:none} /* 极窄屏只保留登录，注册入口在移动菜单内 */
}

/* —— 帮助页：FAQ 展开箭头旋转 —— */
.group[open] .group-open\:rotate-180{transform:rotate(180deg)}

/* —— 帮助页：热门问题链接 —— */
.hp-link{display:block;padding:7px 0;font-size:13.5px;color:var(--ink-dim);text-decoration:none;transition:color .18s}
.hp-link:hover{color:var(--gold-deep)}
/* ============================================================
   TAB 标签组导航（方案A：浏览器标签组）
   桌面 ≥921px：.nav-center 由独立胶囊群改为浅灰圆角容器，
   当前页标签白底浮起 + 底部 2px 金线与容器底边咬合；
   窄屏 ≤920px 沿用 v3.css 既有规则（nav-center 隐藏 + burger），
   故本段全部规则包在 min-width:921px 内，防止误显。
   ============================================================ */
@media (min-width:921px){
  /* 标签组容器：浅灰底承载，上部圆角，贴导航条底边内侧 */
  body:not(.is-console) .nav-center{
    display:flex;align-items:stretch;gap:4px;
    height:50px;padding:0 6px;margin:0 auto;
    background:rgba(32,36,44,.055);
    border-radius:14px 14px 0 0;
  }
  /* 标签本体：撑满容器高度，上部圆角（浏览器标签形态） */
  body:not(.is-console) .nav-link{
    display:flex;align-items:center;
    padding:0 clamp(14px,1.6vw,20px);
    border-radius:10px 10px 0 0;
    font-size:14.5px;
  }
  body:not(.is-console) .nav-link:hover{
    color:var(--gold-deep);
    background:rgba(176,127,47,.08);
  }
  /* 当前页：白底浮起 + 底部金线（与容器底边咬合） */
  body:not(.is-console) .nav-link.active{
    background:#fff;
    color:var(--gold-deep);
    font-weight:600;
    border-bottom:2px solid #c99a4d;
  }
  /* v3 的 active::after 小金线在白底内重复，隐掉 */
  body:not(.is-console) .nav-link.active::after{display:none}
  /* 首尾标签与容器圆角对齐 */
  body:not(.is-console) .nav-center .nav-link:first-child{border-top-left-radius:13px}
  body:not(.is-console) .nav-center .nav-link:last-child{border-top-right-radius:13px}
}

/* ---------- 信任条（与首页 home.css 3.1 同源，全站通用） ---------- */
.hm-trust{
  display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap;
  padding:15px clamp(20px,6vw,90px);background:#fff;border-bottom:1px solid rgba(32,36,44,.06);
  font-size:13px;font-weight:600;color:#3a3f4a;letter-spacing:.04em;
}
.hm-trust i{width:4px;height:4px;border-radius:50%;background:#d3d7e0;flex-shrink:0}
.hm-trust .hl{color:var(--gold-deep)}
.hm-trust-ttl{font-size:11.5px;color:var(--ink-faint);letter-spacing:.2em}

/* ---------- 按钮点击反馈：呼吸光晕（方案4） ---------- */
/* 仅作用于 :active（按下瞬间），不影响 hover/常态；!important 确保覆盖各页面既有态 */
.hm-btn-gold:active,
.hm-plan .p-btn.gold:active,
.btn.gold:active,
.btn-submit:active,
.pg-user-pay_result .btn-primary:active,
.pg-user-hosts .btn-buy:active,
.pg-user-hosts .btn-primary-sm:active,
.pg-product-host_list .product-card .btn:active,
.verify-banner .btn:active{
  transform:translateY(-1px) scale(.97) !important;
  box-shadow:0 0 0 4px rgba(201,154,77,.22),0 8px 22px -8px rgba(176,127,47,.55) !important;
  transition:transform .12s ease,box-shadow .12s ease !important;
}
.hm-btn-ghost:active,
.hm-plan .p-btn.line:active,
.btn.ghost:active,
.pg-user-pay_result .btn-ghost:active{
  transform:translateY(-1px) scale(.97) !important;
  box-shadow:0 0 0 4px rgba(176,127,47,.16) !important;
  transition:transform .12s ease,box-shadow .12s ease !important;
}

/* 导航链接（首页/支持/主机/关于/帮助）点击呼吸光晕，与按钮同源 */
.nav-center .nav-link:active{
  transform:translateY(-1px) scale(.96) !important;
  box-shadow:0 0 0 3px rgba(176,127,47,.20),0 6px 16px -8px rgba(176,127,47,.5) !important;
  transition:transform .12s ease,box-shadow .12s ease !important;
}

/* 全站统一页脚白底（与 home.css 一致）2026-10-20 */
.foot{background:#fff;border-top:1px solid rgba(32,36,44,.06)}
