/* ============================================
   资料售卖系统 - 前台&后台共用样式
   移动优先，微信内打开友好
   ============================================ */

* { margin:0; padding:0; box-sizing:border-box; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  background:#f5f6f8; color:#1f2937; line-height:1.6;
}

.page { max-width:860px; margin:0 auto; padding:14px 14px 40px; }
.page.narrow { max-width:420px; }

/* ---------- 顶部 ---------- */
.site-head { text-align:center; padding:26px 10px 10px; }
.site-head h1 { font-size:22px; font-weight:700; }
.site-head .sub { color:#888; font-size:13px; margin-top:4px; }
.quota {
  display:inline-block; margin-top:10px; padding:4px 14px; background:#eef2ff; color:#4338ca;
  border-radius:20px; font-size:13px;
}
.quota b { color:#2563eb; }

/* ---------- 商品列表 ---------- */
.product-list { margin-top:18px; display:flex; flex-direction:column; gap:14px; }
.empty { text-align:center; color:#999; padding:50px 0; }
.card {
  display:flex; background:#fff; border:1px solid #eef0f3; border-radius:12px; overflow:hidden;
  text-decoration:none; color:inherit; box-shadow:0 1px 3px rgba(0,0,0,.04); transition:transform .12s;
}
.card:active { transform:scale(.99); }
.card-cover { width:96px; min-height:96px; flex-shrink:0; display:flex; align-items:center; justify-content:center; background:#f8fafc; }
.card-cover img { width:100%; height:100%; object-fit:cover; }
.cover-fallback { font-size:34px; opacity:.5; }
.cover-fallback.big { font-size:56px; }
.card-body { padding:12px 14px; flex:1; display:flex; flex-direction:column; justify-content:center; }
.card-body h2 { font-size:15px; font-weight:600; line-height:1.4; }
.meta { display:flex; justify-content:space-between; align-items:center; margin-top:8px; }
.files { color:#999; font-size:12px; }
.price { color:#e11d48; font-weight:700; font-size:15px; }
.price.big { font-size:24px; }

/* ---------- 详情页 ---------- */
.back { margin:6px 0 12px; }
.back a { color:#2563eb; text-decoration:none; font-size:14px; }
.detail-head { display:flex; gap:14px; background:#fff; border:1px solid #eef0f3; border-radius:12px; padding:14px; }
.detail-cover { width:110px; height:110px; flex-shrink:0; border-radius:8px; overflow:hidden; background:#f8fafc; display:flex; align-items:center; justify-content:center; }
.detail-cover img { width:100%; height:100%; object-fit:cover; }
.detail-info { flex:1; min-width:0; }
.detail-info h1 { font-size:17px; line-height:1.4; }
.intro { color:#666; font-size:13px; margin-top:6px; }
.price-row { display:flex; align-items:center; justify-content:space-between; margin-top:12px; }
.tip { color:#999; font-size:12px; margin-top:6px; }
.tip.pay-tip {
  color:#dc2626;           /* 红色 */
  font-size:13px;
  white-space:normal;      /* 允许换行，避免窄屏(手机)下文字溢出 */
  text-align:left;         /* 向左对齐 */
  margin-top:4px;
}

.btn-buy {
  display:inline-block; padding:8px 26px; background:#2563eb; color:#fff; border-radius:8px;
  text-decoration:none; font-size:15px; font-weight:600; text-align:center;
}
.btn-buy:active { background:#1d4ed8; }

/* ---------- 文件清单 ---------- */
.section { background:#fff; border:1px solid #eef0f3; border-radius:12px; padding:14px; margin-top:14px; }
.section h2 { font-size:15px; margin-bottom:10px; }
.file-table { width:100%; border-collapse:collapse; font-size:13px; }
.file-table th { text-align:left; color:#888; font-weight:600; padding:6px 4px; border-bottom:1px solid #f0f0f0; }
.file-table td { padding:8px 4px; border-bottom:1px solid #f6f6f6; vertical-align:middle; }
.fname { word-break:break-all; }
.fext { color:#666; width:44px; }
.fsize { color:#999; width:64px; white-space:nowrap; }
.fop { width:56px; text-align:right; }
.btn-preview { display:inline-block; padding:3px 12px; background:#eef2ff; color:#4338ca; border-radius:6px; text-decoration:none; font-size:12px; }
.no-preview { color:#ccc; }
.quota-note { color:#666; font-size:13px; }

/* ---------- 底部悬浮购买条 ---------- */
.buy-fixed {
  position:fixed; left:0; right:0; bottom:0; z-index:50;
  display:flex; justify-content:space-between; align-items:center;
  background:#fff; border-top:1px solid #eee; padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  box-shadow:0 -2px 8px rgba(0,0,0,.05);
}
.page { padding-bottom:80px; }
.buy-fixed .price { font-size:20px; }

/* ---------- 预览页 ---------- */
.preview-page { padding-bottom:40px; }
.preview-title { font-size:16px; font-weight:600; margin:6px 0 10px; word-break:break-all; }
.preview-note { text-align:center; color:#b45309; font-size:13px; margin-bottom:10px; }
.viewer { background:#111827; border-radius:12px; padding:12px; }
.viewer-stage { min-height:240px; display:flex; align-items:center; justify-content:center; background:#fff; border-radius:8px; overflow:hidden; }
.viewer-img { display:none; max-width:100%; max-height:70vh; }
.viewer-img.active { display:block; }
.viewer-nav { display:flex; align-items:center; justify-content:center; gap:16px; margin-top:12px; color:#e5e7eb; font-size:14px; }
.nav-btn { padding:6px 18px; background:#374151; color:#fff; border:0; border-radius:6px; font-size:14px; cursor:pointer; }
.nav-btn:active { background:#4b5563; }
.viewer-cta { text-align:center; margin-top:14px; }
.viewer-cta p { color:#666; font-size:13px; margin-bottom:10px; }

.limit-box { text-align:center; background:#fff; border:1px solid #eef0f3; border-radius:12px; padding:34px 20px; margin-top:14px; }
.limit-box h2 { font-size:18px; margin-bottom:10px; }
.limit-box p { color:#666; font-size:14px; margin-bottom:8px; }
.limit-box .btn-buy { margin-top:8px; }
.limit-box.warn h2 { color:#b45309; }

/* ---------- 结果/下载页 ---------- */
.result-box { background:#fff; border:1px solid #eef0f3; border-radius:12px; padding:24px 18px; text-align:center; margin-top:14px; }
.result-box.ok { border-color:#b7e6c9; }
.result-box .icon { width:52px; height:52px; line-height:52px; border-radius:50%; background:#16a34a; color:#fff; font-size:26px; margin:0 auto 10px; }
.result-box h2 { font-size:18px; margin-bottom:8px; }
.result-box p { color:#555; font-size:14px; }
.download-box { background:#fff; border:1px solid #b7e6c9; border-radius:12px; padding:18px; margin-top:14px; }
.download-box h2 { font-size:16px; margin-bottom:12px; }
.dl-row { display:flex; margin-bottom:10px; font-size:14px; }
.dl-label { flex-shrink:0; width:76px; color:#888; }
.dl-value { word-break:break-all; }
.dl-link { color:#2563eb; }
.dl-code { font-weight:700; color:#e11d48; font-size:17px; letter-spacing:1px; }
.btn-copy { display:block; width:100%; margin-top:6px; padding:11px; background:#2563eb; color:#fff; border:0; border-radius:8px; font-size:15px; cursor:pointer; }
.result-box.warn { border-color:#ffd9a0; }

/* ---------- 多网盘展示块 ---------- */
.dl-block { border:1px solid #eef0f3; border-radius:10px; padding:12px 14px; margin-bottom:12px; background:#fafbfc; }
.dl-block:last-of-type { margin-bottom:0; }
.dl-block-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.dl-platform { font-size:14px; font-weight:700; color:#111; }
.dl-platform::before { content:''; display:inline-block; width:8px; height:8px; border-radius:50%; background:#2563eb; margin-right:6px; vertical-align:1px; }
.dl-block .btn-copy { width:auto; display:inline-block; padding:7px 14px; font-size:13px; margin-top:0; }

/* ---------- 后台：网盘输入分组 ---------- */
.disk-group { border:1px dashed #dbe3ee; border-radius:10px; padding:10px 12px; margin-bottom:10px; background:#f8fafc; }
.disk-group:last-child { margin-bottom:0; }
.disk-group-title { font-size:13px; font-weight:700; color:#1e3a8a; margin-bottom:6px; }
.disk-group input { display:block; width:100%; box-sizing:border-box; margin-bottom:6px; }
.disk-group input:last-child { margin-bottom:0; }

/* ---------- 侧边栏客服弹窗 ---------- */
.help-fab { position:fixed; right:18px; top:75%; z-index:998; width:56px; height:56px; border-radius:50%; background:#2563eb; color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 14px rgba(37,99,235,.35); cursor:grab; font-size:14px; overflow:hidden; touch-action:none; user-select:none; -webkit-user-select:none; }
.help-fab:active { cursor:grabbing; }
.help-fab img { width:100%; height:100%; object-fit:cover; }
.help-mask { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.45); z-index:1200; align-items:center; justify-content:center; }
.help-dialog { position:relative; width:82%; max-width:340px; background:#fff; border-radius:16px; padding:26px 22px 22px; text-align:center; }
.help-close { position:absolute; top:10px; right:12px; width:30px; height:30px; border:0; background:#f1f3f5; color:#666; font-size:20px; line-height:30px; border-radius:50%; cursor:pointer; }
.help-title { font-size:17px; font-weight:700; color:#111; margin-bottom:10px; }
.help-text { font-size:14px; color:#555; line-height:1.6; margin-bottom:14px; word-break:break-all; }
.help-img img { max-width:100%; width:200px; border-radius:10px; border:1px solid #eef0f3; }

/* ---------- 已购标识 ---------- */
.bought-badge { display:inline-block; padding:8px 16px; background:#16a34a; color:#fff; border-radius:8px; font-size:14px; }
.bought-tip { margin-top:8px; color:#16a34a; font-size:13px; }
.tip.small { font-size:13px; margin-top:4px; }
.tip.small a { color:#2563eb; text-decoration:none; }

/* ---------- 预览页总页数徽标 ---------- */
.preview-note-wrap { margin-bottom:12px; }
.page-badge { background:#eff6ff; border:1px solid #bfdbfe; border-radius:10px; padding:10px 14px; text-align:center; margin-bottom:10px; }
.page-badge-num { font-size:22px; font-weight:800; color:#1d4ed8; }
.page-badge-sub { display:block; margin-top:4px; font-size:13px; color:#64748b; }

/* ---------- 支付方式选择弹层 ---------- */
.pay-mask { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.45); z-index:999; align-items:center; justify-content:center; }
.pay-dialog { width:86%; max-width:320px; background:#fff; border-radius:14px; padding:22px 18px; text-align:center; }
.pay-title { font-size:16px; font-weight:600; margin-bottom:16px; color:#111; }
.pay-option { display:block; padding:13px 0; border-radius:10px; margin-bottom:10px; color:#fff; font-size:15px; text-decoration:none; }
.pay-alipay { background:#1677ff; }
.pay-wxpay { background:#07c160; }
.pay-cancel { width:100%; padding:11px; border:1px solid #e5e7eb; background:#fff; border-radius:10px; color:#666; font-size:14px; cursor:pointer; margin-top:2px; }

/* ---------- 联系方式弹层 ---------- */
.contact-mask { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.45); z-index:999; align-items:center; justify-content:center; }
.contact-dialog { width:88%; max-width:340px; background:#fff; border-radius:14px; padding:24px 18px; text-align:center; }
.contact-title { font-size:16px; font-weight:600; color:#111; }
.contact-sub { font-size:13px; color:#888; margin:6px 0 16px; }
.contact-input { width:100%; box-sizing:border-box; padding:12px; border:1px solid #ddd; border-radius:10px; font-size:15px; margin-bottom:14px; text-align:center; }
.contact-input:focus { outline:none; border-color:#2563eb; }
.btn-submit-buy { width:100%; padding:12px; background:#2563eb; color:#fff; border:0; border-radius:10px; font-size:15px; cursor:pointer; }
.btn-direct-buy { width:100%; padding:12px; background:#07c160; color:#fff; border:0; border-radius:10px; font-size:15px; cursor:pointer; margin-top:8px; }

/* ---------- 文件详情弹层 ---------- */
.info-mask { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.45); z-index:1000; align-items:center; justify-content:center; }
.info-dialog { width:88%; max-width:360px; background:#fff; border-radius:14px; padding:20px 18px; }
.info-head { font-size:16px; font-weight:600; margin-bottom:14px; color:#111; text-align:center; }
.info-body { font-size:14px; }
.info-row { display:flex; gap:10px; padding:8px 0; border-bottom:1px dashed #eef0f3; }
.info-row:last-child { border-bottom:0; }
.info-label { flex-shrink:0; width:56px; color:#888; }
.info-value { flex:1; word-break:break-all; color:#1f2937; line-height:1.5; }

/* ---------- 目录树文件清单 ---------- */
.dir-head { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.dir-head h2 { margin:0; font-size:17px; }
.dir-back { display:inline-block; padding:6px 14px; background:#fff; border:1px solid #dbe3ee; border-radius:8px; color:#2563eb; font-size:13px; cursor:pointer; }
.dir-back:hover { background:#eff6ff; }
.dir-crumb { width:100%; color:#9ca3af; font-size:12px; word-break:break-all; }
.ftree { list-style:none; padding:0; margin:0; }
.ftree .fdir { margin:2px 0; }
.ftree .fdir .fdir-row { cursor:pointer; display:flex; align-items:center; gap:6px; padding:8px 10px; background:#f3f4f6; border-radius:8px; font-weight:600; font-size:14px; color:#374151; }
.ftree .fdir .fdir-row:hover { background:#e5e7eb; }
.ftree .fdir .fdir-row::before { content:"▸"; color:#9ca3af; font-size:12px; }
.ftree .fdir > summary:hover { background:#e5e7eb; }
.ftree .fdir .fd-count { color:#9ca3af; font-weight:400; font-size:12px; }
.ftree .fdir > details > ul { padding-left:14px; margin:6px 0 6px 8px; border-left:2px solid #e5e7eb; }
.ftree .ffile { display:flex; align-items:center; gap:8px; padding:7px 10px; border-radius:8px; font-size:14px; }
.ftree .ffile:hover { background:#f9fafb; }
.ftree .ffile .fext-tag { flex-shrink:0; min-width:44px; text-align:center; font-size:11px; font-weight:700; color:#fff; background:#64748b; border-radius:4px; padding:2px 6px; }
.ftree .ffile .fname { flex:1; word-break:break-all; color:#1f2937; cursor:pointer; }
.ftree .ffile .fname:hover { color:#2563eb; }
.ftree .ffile .fsize { flex-shrink:0; color:#9ca3af; font-size:12px; }
.ftree .ffile .fop { flex-shrink:0; }
.ftree .ffile .btn-preview { display:inline-block; padding:4px 12px; background:#2563eb; color:#fff; border-radius:6px; font-size:12px; text-decoration:none; }
.ftree .ffile .no-preview { color:#d1d5db; font-size:12px; }
.ftree .fdir .fd-icon { width:18px; height:18px; vertical-align:middle; flex-shrink:0; }
.ftree .ffile .file-icon { width:22px; height:22px; flex-shrink:0; vertical-align:middle; }

/* ---------- 手机端：资料目录适配（隐藏大小、收紧边距、文件名最多2行） ---------- */
@media (max-width: 640px) {
  .ftree { padding:0 2px; }
  .ftree .fdir .fdir-row { padding:9px 8px; font-size:13px; gap:5px; }
  .ftree .fdir .fd-icon { width:17px; height:17px; }
  .ftree .ffile { padding:9px 6px; gap:7px; }
  .ftree .ffile .fsize { display:none; } /* 手机端隐藏文件大小 */
  .ftree .ffile .file-icon { width:20px; height:20px; }
  .ftree .ffile .fext-tag { min-width:34px; font-size:10px; padding:2px 4px; }
  .ftree .ffile .fname {
    flex:1; font-size:13px; line-height:1.45; color:#1f2937;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .ftree .ffile .btn-preview { padding:5px 13px; font-size:13px; white-space:nowrap; }
}

/* ---------- 订单查询 ---------- */
.order-query { background:#fff; border:1px solid #eef0f3; border-radius:12px; padding:18px; margin-top:14px; }
.order-query h1 { font-size:17px; margin-bottom:12px; }
.order-query form { display:flex; gap:8px; }
.order-query input { flex:1; padding:10px 12px; border:1px solid #ddd; border-radius:8px; font-size:14px; }
.order-query button { padding:10px 20px; background:#2563eb; color:#fff; border:0; border-radius:8px; cursor:pointer; }
.order-item { border-bottom:1px dashed #eef0f3; padding:10px 0; text-align:left; }
.order-item:last-child { border-bottom:0; }
.order-item-row { display:flex; align-items:center; gap:8px; font-size:13px; margin-bottom:4px; }
.order-item-no { font-weight:600; color:#111; }
.order-item-st { font-size:12px; padding:2px 8px; border-radius:4px; }
.st-ok { background:#dcfce7; color:#15803d; }
.st-wait { background:#fef3c7; color:#b45309; }
.order-item-link { color:#2563eb; text-decoration:none; }

/* ---------- 后台登录 ---------- */
.admin-login { background:#fff; border:1px solid #eef0f3; border-radius:12px; padding:28px; margin-top:40px; }
.admin-login h1 { font-size:19px; margin-bottom:16px; text-align:center; }
.admin-login input { width:100%; padding:11px 12px; border:1px solid #ddd; border-radius:8px; margin-bottom:12px; font-size:15px; box-sizing:border-box; }
.admin-login button { width:100%; padding:11px; background:#2563eb; color:#fff; border:0; border-radius:8px; font-size:15px; cursor:pointer; }
.admin-login .tip { text-align:center; margin-top:12px; }
.admin-login .tip a { color:#2563eb; text-decoration:none; }

/* ---------- 通用 ---------- */
.site-foot { text-align:center; color:#aaa; font-size:12px; margin-top:26px; padding-top:14px; border-top:1px dashed #e5e7eb; }
.alert { background:#fff4e5; border:1px solid #ffd9a0; color:#9a5b00; padding:10px 14px; border-radius:8px; margin-bottom:12px; font-size:14px; }
code { background:#f3f4f6; padding:1px 6px; border-radius:4px; font-size:12px; }
a { color:#2563eb; }