@charset "utf-8";
/* ============================================================
   问答页样式  /wenda/
   创建：2026-10-02
   说明：所有类名统一 qa- 前缀，避免与 skin/css/css.css 冲突
   容器宽度与站点一致（1180px）
   回滚：删除本文件 + template/pc/lists_wenda.htm
   ============================================================ */

.qa-wrap { width: 1180px; margin: 0 auto; }

/* ---------- 头部蓝色区 ---------- */
.qa-hero { background: #1787e0; padding: 26px 0 30px; color: #fff; }
.qa-hero h1 { font-size: 24px; font-weight: bold; color: #fff; margin: 0 0 8px; line-height: 1.4; }
.qa-hero p.qa-hero-s { margin: 0 0 18px; font-size: 14px; color: #d6ebfb; }
.qa-search { display: flex; max-width: 620px; }
.qa-search input { flex: 1; min-width: 0; height: 44px; border: 0; border-radius: 8px; padding: 0 14px; font-size: 14px; color: #333; background: #fff; outline: none; font-family: inherit; }
.qa-search button { flex: none; height: 44px; padding: 0 26px; margin-left: 8px; border: 0; border-radius: 8px; background: #ff8800; color: #fff; font-size: 15px; font-family: inherit; cursor: pointer; }
.qa-search button:hover { background: #e87c00; }
.qa-hot { margin-top: 14px; font-size: 13px; color: #d6ebfb; }
.qa-hot a { color: #fff; border-bottom: 1px solid #7fbde9; margin-right: 12px; }
.qa-hot a:hover { border-bottom-color: #fff; }

/* ---------- 主体两栏 ---------- */
.qa-main { display: block; padding: 20px 0 44px; overflow: hidden; }
.qa-left { float: left; width: 830px; }
.qa-right { float: right; width: 320px; }
.qa-main::after { content: ""; display: block; clear: both; }

/* ---------- 分类标签 ---------- */
.qa-chips { margin-bottom: 14px; overflow: hidden; }
.qa-chip { float: left; border: 1px solid #e6e6e6; background: #fff; color: #555; border-radius: 99px; padding: 6px 16px; font-size: 13px; cursor: pointer; font-family: inherit; margin: 0 8px 8px 0; }
.qa-chip:hover { border-color: #b5d4f4; color: #1787e0; }
.qa-chip.on { background: #1787e0; border-color: #1787e0; color: #fff; font-weight: bold; }

/* ---------- 问题列表 ---------- */
.qa-item { background: #fff; border: 1px solid #e6e6e6; border-radius: 12px; margin-bottom: 10px; overflow: hidden; }
.qa-item[data-open="1"] { border-color: #b5d4f4; }
.qa-q { display: block; padding: 15px 18px; cursor: pointer; position: relative; }
.qa-badge { position: absolute; left: 18px; top: 17px; width: 22px; height: 22px; border-radius: 5px; background: #e6f1fb; color: #1787e0; font-size: 12px; font-weight: bold; text-align: center; line-height: 22px; }
.qa-q-txt { display: block; padding-left: 34px; padding-right: 22px; }
.qa-title { display: block; font-size: 15px; font-weight: bold; line-height: 1.55; color: #333; }
.qa-q:hover .qa-title { color: #1787e0; }
.qa-meta { display: block; margin-top: 7px; font-size: 12px; color: #999; }
.qa-meta span { margin-right: 12px; }
.qa-tag { border-radius: 4px; padding: 1px 7px; font-size: 12px; margin-right: 12px; }
.qa-tag.zk { color: #185fa5; background: #e6f1fb; }
.qa-tag.ck { color: #993c1d; background: #faece7; }
.qa-tag.gk { color: #534ab7; background: #eeedfe; }
.qa-tag.dexl { color: #0f6e56; background: #e1f5ee; }
.qa-tag.xw { color: #854f0b; background: #faeeda; }
.qa-tag.bm { color: #993556; background: #fbeaf0; }
.qa-chev { position: absolute; right: 18px; top: 20px; color: #bbb; font-size: 11px; }
.qa-item[data-open="1"] .qa-chev { color: #1787e0; }
.qa-a { display: none; padding: 14px 18px 17px 52px; border-top: 1px dashed #e6e6e6; color: #555; font-size: 14px; line-height: 1.85; }
.qa-item[data-open="1"] .qa-a { display: block; }
.qa-a p { margin: 0 0 10px; }
.qa-a p:last-child { margin-bottom: 0; }
.qa-a b { color: #333; }
.qa-a .qa-note { font-size: 12px; color: #999; }
.qa-more { margin-top: 12px; font-size: 13px; }
.qa-more a { color: #1787e0; }
.qa-more a:hover { text-decoration: underline; }

.qa-empty { background: #fff; border: 1px dashed #e6e6e6; border-radius: 12px; padding: 48px 20px; text-align: center; color: #999; }
.qa-empty a { color: #1787e0; }

/* ---------- 分页 ---------- */
.qa-pager { text-align: center; margin-top: 22px; font-size: 13px; }
.qa-pager a, .qa-pager span { display: inline-block; border: 1px solid #e6e6e6; background: #fff; border-radius: 6px; padding: 7px 13px; margin: 0 3px 6px; color: #555; }
.qa-pager a:hover { border-color: #1787e0; color: #1787e0; }
.qa-pager span.on { background: #1787e0; border-color: #1787e0; color: #fff; font-weight: bold; }
.qa-pager span.dis { color: #ccc; cursor: not-allowed; }

/* ---------- 侧栏卡片 ---------- */
.qa-card { background: #fff; border: 1px solid #e6e6e6; border-radius: 12px; padding: 18px; margin-bottom: 16px; }
.qa-card h2 { font-size: 15px; font-weight: bold; color: #333; margin: 0 0 4px; }
.qa-card .qa-sub { font-size: 12px; color: #999; line-height: 1.7; margin: 0 0 14px; }
.qa-field { margin-bottom: 10px; }
.qa-field label { display: block; font-size: 12px; color: #555; margin-bottom: 5px; }
.qa-field label i { font-style: normal; color: #ff6600; }
.qa-field input, .qa-field select, .qa-field textarea { width: 100%; border: 1px solid #e6e6e6; border-radius: 8px; padding: 9px 11px; font-size: 13px; font-family: inherit; color: #333; background: #fff; outline: none; box-sizing: border-box; }
.qa-field textarea { height: 78px; resize: vertical; line-height: 1.6; }
.qa-field input:focus, .qa-field select:focus, .qa-field textarea:focus { border-color: #1787e0; }
.qa-submit { width: 100%; height: 42px; border: 0; border-radius: 8px; background: #1787e0; color: #fff; font-size: 14px; font-family: inherit; font-weight: bold; cursor: pointer; }
.qa-submit:hover { background: #0f6fbb; }
.qa-formtip { font-size: 11px; color: #999; margin: 8px 0 0; line-height: 1.7; }
.qa-formmsg { display: none; margin-top: 10px; background: #eaf3de; border: 1px solid #c0dd97; color: #3b6d11; border-radius: 8px; padding: 9px 11px; font-size: 12px; line-height: 1.6; }
.qa-formmsg.err { background: #fcebeb; border-color: #f09595; color: #a32d2d; }

/* 站点全局只重置了 ul，ol 需自行重置，否则默认序号会和自定义序号叠加 */
.qa-rank { margin: 0; padding: 0; list-style: none; counter-reset: qarank; }
.qa-rank li { position: relative; padding-left: 26px; margin-bottom: 9px; font-size: 13px; line-height: 1.6; }
.qa-rank li:last-child { margin-bottom: 0; }
.qa-rank li:before { counter-increment: qarank; content: counter(qarank); position: absolute; left: 0; top: 2px; width: 17px; height: 17px; border-radius: 4px; background: #f2f2f2; color: #999; font-size: 11px; font-weight: bold; text-align: center; line-height: 17px; font-family: Arial, sans-serif; }
.qa-rank li:nth-child(1):before { background: #fcebeb; color: #a32d2d; }
.qa-rank li:nth-child(2):before, .qa-rank li:nth-child(3):before { background: #faeeda; color: #854f0b; }
.qa-rank a { color: #555; }
.qa-rank a:hover { color: #1787e0; }

.qa-links { overflow: hidden; }
.qa-links a { float: left; border: 1px solid #e6e6e6; border-radius: 99px; padding: 4px 12px; font-size: 12px; color: #555; margin: 0 8px 8px 0; }
.qa-links a:hover { border-color: #1787e0; color: #1787e0; }

.qa-cta { background: #e6f1fb; border: 1px solid #b5d4f4; border-radius: 12px; padding: 18px; }
.qa-cta h2 { font-size: 15px; font-weight: bold; color: #0c447c; margin: 0 0 6px; }
.qa-cta p { font-size: 13px; color: #185fa5; line-height: 1.7; margin: 0 0 13px; }
.qa-cta a { display: inline-block; background: #1787e0; color: #fff; border-radius: 8px; padding: 9px 18px; font-size: 13px; }
.qa-cta a:hover { background: #0f6fbb; }