/**
 * ================================================
 * 法律提示：本程序/代码仅限合法用途使用，您可以修改自用，请保留版权
 * ================================================
 * 使用限制：禁止用于非法用途，作者不承担任何使用责任
 * ================================================
 * Copy right 2026 网博士网络工作室， 保留所有权利。
 * ================================================
 * 官方网址: www.网博士.com   联系：QQ: 570830288
 * ================================================
 */
/* 兑换页那一块：券信息、规格、表单，跟订单查询页同一套色板 */
.service-page--cash .cs-empty {
  text-align:center;color:var(--service-muted);font-size:15px;padding:18px 0 6px;line-height:1.9;
}
.service-page--cash .cs-goods {
  display:flex;gap:14px;align-items:flex-start;
  background:var(--service-paper);border:1px solid var(--service-line);
  border-radius:12px;padding:14px;
}
/* 默认不写在 CSS 里隐藏：display 交给 JS 切（写在 CSS 里的话，
   JS 把 style.display 清空就等于回到这里的 none，图片永远出不来） */
.service-page--cash .cs-img {
  width:110px;height:110px;flex:0 0 110px;border-radius:12px;object-fit:cover;
  background:var(--service-blush);border:1px solid var(--service-line);
}
.service-page--cash .cs-name { font-size:16px;font-weight:750;color:var(--service-ink);line-height:1.5; }
.service-page--cash .cs-meta { font-size:13px;color:var(--service-muted);margin-top:5px;line-height:1.8; }
/* 同 .cs-img：隐藏只由 JS 的内联 display 控制，这里不再写 display:none */
.service-page--cash .cs-notice {
  font-size:13px;color:var(--service-muted);line-height:1.8;margin-top:9px;
  padding-top:9px;border-top:1px dashed var(--service-line);
  white-space:pre-line;   /* 简介里的换行要照原样断行 */
}
.service-page--cash .cs-label {
  font-size:13.5px;font-weight:700;color:var(--service-ink);margin:18px 0 8px;
}
.service-page--cash .cs-skus { display:flex;flex-wrap:wrap;gap:8px; }
.service-page--cash .cs-sku {
  padding:8px 16px;border-radius:9px;cursor:pointer;font-size:13.5px;
  border:1px solid var(--service-line);background:#fff;color:var(--service-muted);
  transition:all .18s ease;
}
.service-page--cash .cs-sku:hover { border-color:var(--service-rose); }
/* 点一下会拿到焦点，浏览器默认的黑色 outline 会盖在选中态的玫瑰色边框上，
   所以鼠标点的不画轮廓；键盘 Tab 过去的（focus-visible）还是要看得出来 */
.service-page--cash .cs-sku:focus { outline:none; }
.service-page--cash .cs-sku:focus-visible {
  outline:2px solid var(--service-rose);outline-offset:2px;
}
.service-page--cash .cs-sku.on {
  border-color:var(--service-rose);background:var(--service-blush);
  color:var(--service-rose);font-weight:700;
}
.service-page--cash .cs-sku[disabled] { opacity:.45;cursor:not-allowed; }
.service-page--cash .cs-sku em { font-style:normal;font-size:12px;opacity:.8;margin-left:5px; }
.service-page--cash .cs-row { margin-bottom:12px; }
.service-page--cash .cs-row > span {
  display:block;font-size:13px;color:var(--service-muted);margin-bottom:5px;
}
.service-page--cash .cs-row input,
.service-page--cash .cs-row select,
.service-page--cash .cs-row textarea {
  width:100%;padding:10px 12px;font-size:14px;border-radius:9px;
  border:1px solid var(--service-line);background:#fff;color:var(--service-ink);
  outline:none;transition:border-color .18s ease;
}
.service-page--cash .cs-row textarea { resize:vertical;min-height:62px;line-height:1.7; }
.service-page--cash .cs-row input:focus,
.service-page--cash .cs-row select:focus,
.service-page--cash .cs-row textarea:focus { border-color:var(--service-rose); }
.service-page--cash .cs-tip { font-size:12.5px;color:var(--service-muted);margin-top:5px;line-height:1.7; }
.service-page--cash .cs-submit {
  width:100%;margin-top:20px;padding:12px;border:0;border-radius:10px;cursor:pointer;
  font-size:15px;font-weight:700;color:#fff;background:var(--service-rose);
  transition:filter .18s ease;
}
.service-page--cash .cs-submit:hover { filter:brightness(1.06); }
.service-page--cash .cs-submit.disabled { opacity:.6;cursor:default; }
.service-page--cash .cs-card-pre {
  background:#0F212C;color:#D7E4EC;border-radius:8px;padding:14px;margin:0;
  font-family:Consolas,Menlo,monospace;font-size:13px;line-height:1.9;
  white-space:pre-wrap;word-break:break-all;max-height:260px;overflow:auto;
}
.service-page--cash .cs-ok { text-align:center;font-size:16px;font-weight:750;color:#2E7D5B; }
.service-page--cash .cs-ok-no { font-size:12.5px;color:var(--service-muted);margin-top:6px;font-weight:400; }
.service-page--cash .cs-copy {
  padding:5px 12px;border-radius:7px;cursor:pointer;font-size:12.5px;
  border:1px solid var(--service-line);background:#fff;color:var(--service-rose);
}
.service-page--cash .cs-actions { display:flex;gap:10px;margin-top:16px; }
.service-page--cash .cs-actions a {
  flex:1;text-align:center;padding:10px;border-radius:9px;font-size:13.5px;
  border:1px solid var(--service-line);color:var(--service-rose);
}
.service-page--cash .cs-actions a.cs-primary { background:var(--service-rose);border-color:var(--service-rose);color:#fff; }
.service-page--cash .cs-alert {
  padding:13px 15px;border-radius:10px;font-size:13.5px;line-height:1.8;
  background:var(--service-blush);color:var(--service-rose);
}
.service-page--cash .cs-alert a { color:var(--service-rose);font-weight:700; }
.service-page--cash .cs-tips { font-size:13px;color:var(--service-muted);line-height:1.95; }
@media (max-width:767px) {
  .service-page--cash .cs-goods { padding:12px;gap:11px; }
  .service-page--cash .cs-img { width:84px;height:84px;flex:0 0 84px; }
}