/* ============================================================
   前台官网化 v2 · 共享覆盖层
   适用页面：shop.php / query.php / agent.php（仅这三页引入）
   设计语言与 index.php 保持一致：
   环境光背景 · kicker 排版 · hero 去面板化 · 常驻购买栏
   注意：本文件在 style.css 之后加载，同名规则即覆盖
   ============================================================ */

/* ---------- 环境光背景：替代平铺底色，安静高级 ---------- */
.page-shop { position: relative; }
.page-shop .bg-glow {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(1100px 520px at 82% -8%, rgba(139, 92, 246, .16), transparent 62%),
    radial-gradient(900px 480px at -6% 12%, rgba(255, 46, 126, .13), transparent 58%),
    radial-gradient(700px 420px at 50% 118%, rgba(255, 122, 61, .07), transparent 60%);
}
.page-shop > main, .page-shop .site-footer { position: relative; z-index: 1; }

/* ---------- 顶部公告条（官网标配） ---------- */
.notice-bar { position: relative; z-index: 2; max-width: 1060px; margin: 12px auto 0; padding: 0 16px; }
.notice-bar > div {
  display: flex; align-items: center; gap: 8px;
  background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 12px; padding: 9px 14px; font-size: 12.5px; color: var(--sub);
}
.notice-bar .nb-tag {
  flex: none; font-size: 10.5px; font-weight: 900; letter-spacing: .18em; color: #ff8fb3;
  border: 1px solid rgba(255, 46, 126, .4); border-radius: 999px; padding: 2px 8px;
}
.notice-bar .nb-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- Hero：去面板化 + kicker 英文小字 ---------- */
.shop-hero { padding: 46px 0 4px; margin-bottom: 26px; }
.kicker {
  display: flex; align-items: center; justify-content: center; gap: 14px;
  font-size: 10.5px; font-weight: 800; letter-spacing: .42em; text-indent: .42em;
  color: rgba(255, 143, 179, .72); text-transform: uppercase; margin: 0 0 18px;
}
.kicker::before, .kicker::after { content: ''; width: 34px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 143, 179, .55)); }
.kicker::after { background: linear-gradient(90deg, rgba(255, 143, 179, .55), transparent); }
.shop-hero h1 {
  font-size: clamp(30px, 8vw, 42px); font-weight: 900; line-height: 1.24;
  letter-spacing: .01em; margin: 0 0 14px;
  background: none; -webkit-background-clip: initial; background-clip: initial;
  -webkit-text-fill-color: initial; color: var(--txt);
}
.shop-hero h1 em {
  font-style: normal;
  background: linear-gradient(120deg, #ff5c9d 0%, #ff2e7e 45%, #b827ff 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 4px 22px rgba(255, 46, 126, .28));
}
.shop-sub { color: var(--sub); font-size: 14.5px; line-height: 1.95; max-width: 480px; margin: 0 auto 8px; }

/* hero 胶囊徽章 → trust-line 单行分隔（更轻更官网） */
.page-shop .hero-badges {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 0;
  margin: 22px 0 0; background: none; border: 0; padding: 0;
}
.page-shop .hero-badge {
  background: none !important; border: 0 !important; padding: 0;
  font-size: 12px; color: var(--dim); font-weight: 600;
}
.page-shop .hero-badge + .hero-badge::before { content: '·'; margin: 0 10px; color: rgba(255, 255, 255, .22); }

/* ---------- 分区标题：英文 kicker + 大标题 + 小注 ---------- */
.page-shop .sec-head { margin: 46px 0 18px; text-align: center; }
.page-shop .sec-head .kicker-sm {
  font-size: 10px; font-weight: 800; letter-spacing: .4em; text-indent: .4em;
  text-transform: uppercase; color: rgba(255, 143, 179, .6); margin: 0 0 8px;
}
.page-shop .sec-head h2 { font-size: 21px; font-weight: 900; margin: 0 0 6px; }
.page-shop .sec-head p { font-size: 12.5px; color: var(--dim); margin: 0; }

/* ---------- 卡片精修：渐变薄面 + 细边 ---------- */
.shop-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .02));
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 22px; padding: 28px 26px; backdrop-filter: blur(14px);
}
.shop-card h2 { font-size: 20px; font-weight: 900; }

/* ---------- 套餐卡精修 ---------- */
.plan-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .018));
  border: 1px solid rgba(255, 255, 255, .09); border-radius: 20px; padding: 22px 20px 20px;
}
.plan-price { font-size: 30px; color: #ff8fb3; background: none; -webkit-text-fill-color: currentcolor; }
.plan-name { font-size: 16px; font-weight: 900; }
.plan-card .buy-btn { height: 44px; border-radius: 12px; font-weight: 900; letter-spacing: .04em; }
.plan-card.hot { border-color: rgba(255, 46, 126, .5); }
.plan-card.hot::before {
  content: '热卖'; position: absolute; top: 14px; right: -1px;
  background: var(--grad); color: #fff; font-size: 10px; font-weight: 900;
  letter-spacing: .14em; text-indent: .14em; padding: 3px 10px 3px 12px;
  border-radius: 8px 0 0 8px;
}

/* ---------- 输入框：统一高度 + 粉色 focus 光晕 ---------- */
.page-shop .code-input {
  height: 50px; border-radius: 13px; background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .14); padding: 0 18px; font-size: 15px;
  letter-spacing: .05em; text-align: center; transition: border-color .2s, box-shadow .2s;
}
.page-shop input[type="password"].code-input { text-align: left; letter-spacing: .1em; }
.page-shop .code-input::placeholder { color: var(--dim); letter-spacing: 0; }
.page-shop .code-input:focus {
  outline: none; border-color: rgba(255, 46, 126, .65);
  box-shadow: 0 0 0 4px rgba(255, 46, 126, .14);
}
.setup-full input, .pull-form input {
  border-radius: 13px; background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .14);
  transition: border-color .2s, box-shadow .2s;
}
.setup-full input:focus, .pull-form input:focus {
  outline: none; border-color: rgba(255, 46, 126, .65);
  box-shadow: 0 0 0 4px rgba(255, 46, 126, .14);
}

/* ---------- 按钮精修 ---------- */
.page-shop .btn { border-radius: 12px; }
.page-shop .btn-primary { background: var(--grad); border: 0; font-weight: 900; letter-spacing: .04em; }
.page-shop .btn-ghost { border: 1px solid rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .04); }

/* ---------- 代理中心：统计卡 / 记录表 ---------- */
.agent-stats .stat {
  background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .02));
  border: 1px solid rgba(255, 255, 255, .09); border-radius: 16px; padding: 16px 14px;
}
.history-box { border-radius: 14px; background: rgba(255, 255, 255, .03); }

/* ---------- 常驻购买栏（手机官网标配） ---------- */
.m-cta { display: none; }
@media (max-width: 899px) {
  .m-cta {
    display: flex; align-items: center; gap: 12px; position: fixed; left: 0; right: 0; bottom: 0;
    z-index: 50; padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    background: rgba(10, 7, 16, .86); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid rgba(255, 255, 255, .09);
  }
  .m-cta-info { flex: 1; min-width: 0; line-height: 1.3; }
  .m-cta-info b { display: block; font-size: 15.5px; font-weight: 900; color: #ff8fb3; }
  .m-cta-info span { font-size: 10.5px; color: var(--dim); font-weight: 600; }
  .m-cta-btn {
    flex: none; display: inline-flex; align-items: center; justify-content: center;
    height: 44px; padding: 0 26px; border-radius: 13px; background: var(--grad); color: #fff;
    font-size: 14.5px; font-weight: 900; text-decoration: none; letter-spacing: .04em;
    box-shadow: 0 6px 22px rgba(255, 46, 126, .38);
  }
  .m-cta-btn:active { transform: scale(.97); }
  .site-footer { padding-bottom: calc(84px + env(safe-area-inset-bottom)) !important; }
}

/* ---------- 手机端整体减法 ---------- */
@media (max-width: 620px) {
  .shop-hero { padding: 34px 0 0; }
  .shop-hero h1 { font-size: clamp(29px, 8.6vw, 34px); }
  .shop-sub { font-size: 13.5px; }
  .page-shop .sec-head { margin: 36px 0 14px; }
  .shop-card { padding: 22px 18px; border-radius: 19px; }
  .plan-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .plan-card { padding: 17px 15px 15px; border-radius: 16px; }
  .plan-name { font-size: 14.5px; }
  .plan-price { font-size: 23px; margin: 8px 0 4px; }
  .plan-desc { font-size: 12px; margin-bottom: 14px; }
  .agent-stats { grid-template-columns: 1fr 1fr; gap: 9px; }
  .agent-stats .stat { padding: 13px 10px; }
  .agent-stats .stat b { font-size: 17.5px; }
  .trust-line { font-size: 11px; }
  .notice-bar { margin-top: 10px; }
  .notice-bar > div { padding: 8px 12px; font-size: 11.5px; border-radius: 10px; }
}
@media (max-width: 360px) {
  .plan-grid { grid-template-columns: 1fr; }
}

/* ---------- v9.4 「合作与代理」折叠区（代理套餐 + 分站开通合并） ---------- */
.page-shop .partner-fold { margin-top: 34px; }
.partner-details {
  border: 1px solid var(--line); border-radius: 18px;
  background: linear-gradient(150deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .012));
  overflow: hidden;
}
.partner-details > summary {
  list-style: none; cursor: pointer; padding: 17px 20px;
  display: flex; align-items: center; gap: 13px; transition: background .2s ease;
}
.partner-details > summary::-webkit-details-marker { display: none; }
.partner-details > summary:hover { background: rgba(255, 255, 255, .035); }
.partner-details .pf-ico { font-size: 19px; line-height: 1; flex: none; }
.partner-details .pf-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.partner-details .pf-txt b { font-size: 14.5px; font-weight: 900; color: var(--txt); }
.partner-details .pf-txt i { font-style: normal; font-size: 12px; color: var(--dim); }
.partner-details .pf-arrow {
  margin-left: auto; flex: none; font-size: 13px; color: var(--sub); transition: transform .25s ease;
}
.partner-details[open] .pf-arrow { transform: rotate(180deg); }
.partner-details .pf-body { padding: 6px 20px 24px; border-top: 1px solid var(--line); }
.partner-details .pf-body > .sec-head:first-child { margin-top: 24px; }
.partner-details .pf-body .plan-section { margin-top: 0; }
@media (max-width: 620px) {
  .partner-details > summary { padding: 15px; gap: 10px; }
  .partner-details .pf-txt b { font-size: 13.5px; }
  .partner-details .pf-txt i { font-size: 11.5px; }
  .partner-details .pf-body { padding: 4px 15px 20px; }
  .partner-details .pf-body > .sec-head:first-child { margin-top: 20px; }
}