/* 问答插件前台样式（主题无关：文字跟随主题色、面板用中性半透明底，浅色/深色主题都可读）
   Author: 023.ink */

/* ---------- 主题适配变量：不在浅色主题上写死白底，也不跟随系统深色 ---------- */
:root {
    --qa-surface: rgba(128, 128, 128, .07);      /* 卡片/容器底：中性灰叠加，深浅主题通吃 */
    --qa-surface-strong: rgba(128, 128, 128, .13); /* 输入框底 */
    --qa-line: rgba(128, 128, 128, .26);         /* 描边 */
    --qa-line-soft: rgba(128, 128, 128, .18);    /* 分割线 */
    --qa-accent: #e8590c;                        /* 插件主色（提问入口） */
    --qa-accent-blue: #2f6fed;                   /* 操作按钮主色 */
}

.qa-page,
.qa-ask-wrap {
    font-family: inherit;
    color: inherit;
}
/* 次要文字统一用透明度表达，自动继承主题正文字色 */
.qa-muted { color: inherit; opacity: .62; }
.qa-page {
    max-width: min(900px, calc(100% - 32px));
    width: auto;
    margin: 0 auto;
    padding: 18px 16px 40px;
    box-sizing: border-box;
    line-height: 1.7;
    color: inherit;
}
.qa-page a { text-decoration: none; }
.qa-page img { max-width: 100%; height: auto; }

/* ---------- 页头 ---------- */
.qa-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 16px;
}
.qa-head h1 {
    font-size: 22px;
    margin: 0;
    line-height: 1.4;
    color: inherit;
}
.qa-sub {
    color: inherit;
    opacity: .62;
    font-size: 13px;
    margin: 4px 0 0;
}

/* ---------- 按钮 / 表单控件 ---------- */
.qa-btn {
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid var(--qa-line);
    border-radius: 6px;
    background: var(--qa-surface-strong);
    color: inherit;
    font-size: 14px;
    cursor: pointer;
    line-height: 1.4;
    font-family: inherit;
}
.qa-btn-primary {
    background: #2f6fed;
    border-color: #2f6fed;
    color: #fff;
}
.qa-btn-success {
    background: #0a9d58;
    border-color: #0a9d58;
    color: #fff;
}
.qa-btn-sm { padding: 4px 10px; font-size: 13px; border-radius: 4px; }
.qa-btn-danger {
    background: var(--qa-surface-strong);
    border-color: rgba(229,72,77,.55);
    color: #e56065;
}
.qa-btn-danger:hover { background: #e5484d; border-color: #e5484d; color: #fff; }
.qa-btn:hover { opacity: .88; }

.qa-input {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid var(--qa-line);
    border-radius: 6px;
    background: var(--qa-surface-strong);
    color: inherit;
    font-size: 14px;
    font-family: inherit;
}
.qa-input::placeholder { color: inherit; opacity: .5; }
.qa-input:focus {
    outline: none;
    border-color: var(--qa-accent-blue);
    box-shadow: 0 0 0 3px rgba(47,111,237,.18);
}
.qa-label {
    display: block;
    font-size: 14px;
    margin: 0 0 6px;
    color: inherit;
}
.qa-field { margin-bottom: 14px; }

.qa-msg {
    padding: 10px 14px;
    border-radius: 6px;
    font-size: 14px;
    margin-bottom: 14px;
}
.qa-msg-error { background: rgba(229,72,77,.1); color: #e56065; border: 1px solid rgba(229,72,77,.32); }
/* 登录提示（游客访问提问页） */
.qa-msg-login { background: rgba(52,119,235,.1); color: #6ea3e8; border: 1px solid rgba(52,119,235,.32); }
.qa-msg-login a { color: #6ea3e8; font-weight: 600; text-decoration: underline; }

/* ---------- 问题列表 ---------- */
.qa-title {
    font-size: 17px;
    margin: 0 0 6px;
    line-height: 1.45;
    font-weight: 600;
    overflow-wrap: anywhere;
}
.qa-title a { color: inherit; }
.qa-title a:hover { color: var(--qa-accent-blue); }
.qa-excerpt {
    font-size: 14px;
    color: inherit;
    opacity: .7;
    margin: 0 0 8px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.qa-meta {
    font-size: 12.5px;
    color: inherit;
    opacity: .62;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.qa-meta .qa-meta-item { display: inline-flex; align-items: center; }
.qa-badge {
    display: inline-block;
    font-size: 12px;
    line-height: 1;
    padding: 3px 8px;
    border-radius: 10px;
    margin-left: 6px;
    vertical-align: 2px;
}
.qa-badge-best { background: rgba(10,157,88,.16); color: #3fa06a; border: 1px solid rgba(10,157,88,.4); }
.qa-badge-wait { background: rgba(240,173,78,.16); color: #d3a032; border: 1px solid rgba(240,173,78,.42); }
/* 悬赏徽章：金色 */
.qa-reward-badge {
    background: rgba(184,134,11,.16);
    color: #d9a441;
    border: 1px solid rgba(184,134,11,.4);
}
/* 最佳答案获奖提示 */
.qa-reward-earned {
    display: inline-block;
    font-size: 12px;
    color: #d9a441;
    background: rgba(184,134,11,.16);
    border: 1px solid rgba(184,134,11,.4);
    border-radius: 4px;
    padding: 2px 8px;
    margin-left: 6px;
    vertical-align: middle;
}
/* 表单提示 */
.qa-tip {
    font-size: 12px;
    color: inherit;
    opacity: .62;
    margin: 4px 0 0;
}
/* 站内通知条（违规删除原因等） */
.qa-notices {
    margin-bottom: 14px;
}
.qa-notice-item {
    background: rgba(184,134,11,.14);
    border: 1px solid rgba(184,134,11,.38);
    color: #d9a441;
    border-radius: 6px;
    padding: 8px 12px;
    margin-bottom: 6px;
    font-size: 13px;
    line-height: 1.5;
}
.qa-notice-icon { margin-right: 4px; }
.qa-notice-time {
    float: right;
    color: inherit;
    opacity: .6;
    font-size: 12px;
}

/* ---------- 问答列表（front_list，qa-list-index） ---------- */
.qa-card {
    background: var(--qa-surface);
    border: 1px solid var(--qa-line);
    border-radius: 10px;
    padding: 20px 20px 18px;
    box-sizing: border-box;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
    max-width: 100%;
}
/* 问答列表页外层卡片 */
.qa-card.qa-card-index {
    background: var(--qa-surface);
}
.qa-card .qa-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 14px;
}
.qa-card .qa-head h1 { margin: 0; font-size: 20px; }
.qa-card .qa-head-right {
    display: flex;
    align-items: center;
    gap: 12px;
}
.qa-card .qa-sub-bar {
    text-align: right;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--qa-line-soft);
    margin-bottom: 2px;
}
.qa-card .qa-sub-count {
    font-size: 13px;
    color: inherit;
    opacity: .62;
    white-space: nowrap;
}
/* 最佳答案页：计数上移、取消下方分割线 */
.qa-card .qa-sub-bar-best {
    text-align: right;
    padding-bottom: 2px;
    border-bottom: none;
    margin-bottom: 8px;
}
.qa-list-index {
    padding: 4px 0 0;
}
.qa-list-index .qa-item {
    padding: 18px 0;
    border-bottom: 1px solid var(--qa-line-soft);
}
.qa-list-index .qa-item:last-child { border-bottom: none; }
.qa-list-index .qa-item-top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}
.qa-list-index .qa-item-top .qa-badge { margin-left: 0; flex-shrink: 0; }
.qa-list-index .qa-title { margin: 0; font-size: 16px; }
.qa-list-index .qa-item-body {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.qa-list-index .qa-avatar {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--qa-surface-strong);
}
.qa-list-index .qa-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.qa-list-index .qa-main {
    flex: 1;
    min-width: 0;
}
.qa-list-index .qa-meta { margin-bottom: 6px; }
.qa-list-index .qa-meta-author {
    color: inherit;
    font-weight: 500;
}
.qa-list-index .qa-meta-last::before {
    content: '';
    display: inline-block;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--qa-line);
    margin: 0 6px 2px;
    vertical-align: middle;
}
.qa-list-index .qa-excerpt {
    margin-bottom: 0;
    -webkit-line-clamp: 1;
}
.qa-list-index .qa-stats {
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    padding: 8px 0 0 8px;
    font-size: 12.5px;
    color: inherit;
    opacity: .62;
}
.qa-list-index .qa-stat {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 42px;
    justify-content: flex-start;
}
.qa-list-index .qa-stat svg { color: inherit; opacity: .8; }

/* 窄屏（手机）下隐藏回复/浏览/点赞统计 */
@media (max-width: 640px) {
    .qa-list-index .qa-stats { display: none; }
}

/* 详情页点赞按钮 */
.qa-like-form { display: inline-block; margin: 0; }
.qa-like-btn {
    border: none;
    background: none;
    padding: 0;
    font-size: 12.5px;
    color: inherit;
    opacity: .62;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-family: inherit;
}
.qa-like-btn:hover { color: var(--qa-accent-blue); opacity: 1; }

/* ---------- 最佳答案列表（front_best） ---------- */
/* 最佳答案页外层卡片 */
.qa-card-best {
    background: var(--qa-surface);
}
.qa-list .qa-best-item {
    background: var(--qa-surface);
    border: 1px solid var(--qa-line-soft);
    border-radius: 8px;
    padding: 16px 18px;
    margin-bottom: 14px;
    box-shadow: none;
    box-sizing: border-box;
    max-width: 100%;
}
.qa-list .qa-best-item:last-child { margin-bottom: 0; }
.qa-best-item .qa-title { margin-bottom: 8px; }
/* 提问者与提问时间间距 */
.qa-best-item .qa-meta { gap: 18px; }
/* 最佳答案头部（front_best 的“最佳答案（回答者）”徽章行 + 详情页置顶最佳回答行） */
.qa-best-head {
    margin: 14px 0 6px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #3fa06a;
    font-weight: 600;
}
.qa-best-head .qa-badge-best {
    font-size: 13px;
    padding: 5px 12px;
    border-radius: 12px;
    margin-left: 0;
    font-weight: 600;
}
/* 答案引用样式 */
.qa-quote {
    margin: 10px 0 0;
    padding: 12px 16px;
    border-left: 4px solid rgba(10,157,88,.5);
    background: var(--qa-surface-strong);
    border-radius: 0 6px 6px 0;
    box-sizing: border-box;
    max-width: 100%;
}
.qa-quote p:last-child { margin-bottom: 0; }
/* 查看问题链接：左下 */
.qa-view-more {
    margin-top: 10px;
    text-align: left;
}
.qa-view-more a {
    color: var(--qa-accent);
    font-size: 13.5px;
    font-weight: 500;
    text-decoration: none;
}
.qa-view-more a:hover { opacity: .8; text-decoration: underline; }

/* 分页 */
.qa-pagination { margin: 18px 0 0; text-align: center; }
.qa-pagination a,
.qa-pagination span {
    display: inline-block;
    min-width: 32px;
    padding: 6px 10px;
    margin: 0 3px;
    border: 1px solid var(--qa-line);
    border-radius: 6px;
    font-size: 13px;
    color: inherit;
    background: transparent;
}
.qa-pagination a:hover { border-color: var(--qa-accent-blue); color: var(--qa-accent-blue); }
.qa-pagination span { background: var(--qa-accent-blue); border-color: var(--qa-accent-blue); color: #fff; }
.qa-pagination em { font-style: normal; color: inherit; opacity: .62; margin: 0 2px; }

/* ---------- 问题详情 ---------- */
.qa-question {
    padding: 8px 0 20px;
    border-bottom: 1px solid var(--qa-line-soft);
    margin-bottom: 20px;
}
.qa-question h1 {
    font-size: 24px;
    margin: 0 0 10px;
    line-height: 1.4;
    color: inherit;
    overflow-wrap: anywhere;
}
.qa-content {
    font-size: 15px;
    word-break: break-word;
    overflow-wrap: anywhere;
    margin-top: 14px;
    max-width: 100%;
}
.qa-content h1,.qa-content h2,.qa-content h3,.qa-content h4,.qa-content h5,.qa-content h6 { margin: 18px 0 10px; line-height: 1.4; color: inherit; }
.qa-content h1 { font-size: 22px; }
.qa-content h2 { font-size: 19px; }
.qa-content h3 { font-size: 17px; }
.qa-content p { margin: 0 0 12px; }
.qa-content ul, .qa-content ol { margin: 0 0 12px; padding-left: 24px; }
.qa-content li { margin: 3px 0; }
.qa-content img { max-width: 100%; height: auto; }
.qa-content blockquote {
    margin: 0 0 12px;
    padding: 8px 14px;
    border-left: 3px solid var(--qa-accent-blue);
    background: var(--qa-surface-strong);
    border-radius: 4px;
    color: inherit;
}
.qa-content pre {
    margin: 0 0 12px;
    padding: 12px;
    background: rgba(20,20,20,.92);
    color: #eaeaea;
    border-radius: 6px;
    overflow-x: auto;
    max-width: 100%;
    box-sizing: border-box;
    font-size: 13px;
    line-height: 1.5;
}
.qa-content code {
    font-family: Consolas, Menlo, Monaco, "Courier New", monospace;
    background: var(--qa-surface-strong);
    color: inherit;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 13px;
}
.qa-content pre code { background: none; padding: 0; color: inherit; }
/* 宽表格在窄容器（带侧边栏的主题、手机）里横向滚动，不撑破布局 */
.qa-content table {
    border-collapse: collapse;
    margin: 0 0 12px;
    max-width: 100%;
    display: block;
    overflow-x: auto;
    white-space: initial;
}
.qa-content th, .qa-content td { border: 1px solid var(--qa-line); padding: 6px 10px; }
.qa-content th { background: var(--qa-surface-strong); }
.qa-content hr { border: none; border-top: 1px solid var(--qa-line-soft); margin: 16px 0; }
.qa-content a { color: var(--qa-accent-blue); }

/* ---------- 回答列表 ---------- */
.qa-answers-title {
    font-size: 18px;
    margin: 0 0 12px;
    color: inherit;
}
.qa-answer {
    display: flex;
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid var(--qa-line-soft);
}
.qa-answer:last-child { border-bottom: none; }
.qa-answer-avatar img {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: block;
}
.qa-answer-body { flex: 1; min-width: 0; }
.qa-answer-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 6px;
    font-size: 13px;
}
.qa-answer-author { font-weight: 600; color: inherit; }
.qa-vote-form { display: inline-block; margin: 0; }
.qa-vote-form .qa-btn { margin-left: 2px; }
.qa-btn-best { background: #f59e0b; border-color: #f59e0b; color: #fff; }
.qa-del-form { display: inline-block; margin: 0; }
.qa-del-form .qa-btn { margin-left: 2px; }
.qa-btn-del { background: var(--qa-surface-strong); border-color: rgba(229,72,77,.55); color: #e56065; }
.qa-btn-del:hover { background: #e5484d; border-color: #e5484d; color: #fff; }
.qa-answer-time { color: inherit; opacity: .62; }
.qa-answer-content { font-size: 14px; word-break: break-word; overflow-wrap: anywhere; }
.qa-answer-best {
    border: 1px solid rgba(10,157,88,.45);
    border-radius: 8px;
    padding: 12px 14px;
    background: rgba(10,157,88,.08);
}
.qa-answer-best .qa-answer-content { font-size: 14.5px; }

/* ---------- 回答 / 提问表单 ---------- */
.qa-form-box {
    margin-top: 24px;
    padding: 16px;
    border: 1px solid var(--qa-line-soft);
    border-radius: 10px;
    background: var(--qa-surface);
}
.qa-form-box h2 { font-size: 17px; margin: 0 0 14px; color: inherit; }
.qa-form-row { display: flex; gap: 12px; flex-wrap: wrap; }
.qa-form-row .qa-field { flex: 1; min-width: 200px; }

/* Markdown 编辑器 */
.qa-md-editor { border: 1px solid var(--qa-line); border-radius: 6px; overflow: hidden; background: var(--qa-surface); }
.qa-md-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    padding: 6px;
    background: var(--qa-surface-strong);
    border-bottom: 1px solid var(--qa-line-soft);
}
.qa-md-toolbar button {
    min-width: 30px;
    height: 28px;
    padding: 0 7px;
    border: none;
    background: transparent;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    color: inherit;
    font-family: inherit;
}
.qa-md-toolbar button:hover { background: var(--qa-line-soft); }
.qa-md-toolbar .qa-md-sep { width: 1px; background: var(--qa-line); margin: 2px 4px; }
.qa-md-toolbar .qa-md-toggle {
    margin-left: auto;
    font-size: 12px;
    border: 1px solid var(--qa-line);
    border-radius: 4px;
    padding: 0 10px;
}
.qa-md-toolbar .qa-md-toggle.active { background: var(--qa-accent-blue); color: #fff; border-color: var(--qa-accent-blue); }
.qa-md-input {
    display: block;
    width: 100%;
    min-height: 140px;
    box-sizing: border-box;
    border: none;
    padding: 10px 12px;
    background: transparent;
    color: inherit;
    font-size: 14px;
    font-family: Consolas, Menlo, Monaco, "Courier New", monospace;
    resize: vertical;
}
.qa-md-input::placeholder { color: inherit; opacity: .5; }
.qa-md-input:focus { outline: none; }
.qa-md-preview {
    display: none;
    min-height: 140px;
    padding: 10px 14px;
    font-size: 14px;
    word-break: break-word;
    overflow-wrap: anywhere;
}
.qa-md-preview.show { display: block; }
.qa-md-preview .qa-content { margin: 0; }

/* 验证码 */
.qa-captcha { display: flex; align-items: center; gap: 10px; }
.qa-captcha img { height: 34px; cursor: pointer; border-radius: 4px; }
.qa-captcha .qa-input { width: 120px; }

/* 登录提示 */
.qa-login-tip { font-size: 13px; color: inherit; opacity: .62; }

/* 空状态 */
.qa-empty {
    padding: 40px 0;
    text-align: center;
    color: inherit;
    opacity: .62;
    font-size: 14px;
}

/* ---------- 我要提问 / 发文入口页（qa_ask.php） ---------- */
/* 宽度交给主题的正文容器：不再用 100vw 视口硬算，带侧边栏/不同容器宽度的主题都能贴合 */
.qa-ask-wrap {
    max-width: min(900px, calc(100% - 32px));
    width: auto;
    margin: 18px auto;
    padding: 0 14px;
    box-sizing: border-box;
}
.qa-ask-box {
    background: var(--qa-surface);
    border: 1px solid var(--qa-line-soft);
    border-radius: 10px;
    padding: 22px 24px;
    box-sizing: border-box;
    max-width: 100%;
}
.qa-ask-title { font-size: 20px; font-weight: 700; margin: 0 0 16px; color: inherit; }
.qa-ask-field { margin-bottom: 16px; }
.qa-ask-label { display: block; font-size: 14px; font-weight: 600; color: inherit; margin-bottom: 6px; }
.qa-ask-input,
.qa-ask-select,
.qa-ask-textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--qa-line);
    border-radius: 6px;
    padding: 9px 12px;
    font-size: 14px;
    color: inherit;
    background: var(--qa-surface-strong);
    line-height: 1.6;
    font-family: inherit;
}
.qa-ask-input::placeholder,
.qa-ask-textarea::placeholder { color: inherit; opacity: .5; }
.qa-ask-input:focus,
.qa-ask-select:focus,
.qa-ask-textarea:focus {
    border-color: var(--qa-accent);
    outline: none;
    box-shadow: 0 0 0 3px rgba(232,89,12,.18);
}
.qa-ask-select { appearance: auto; cursor: pointer; }
.qa-ask-select option { color: #333; background: #fff; }
.qa-ask-textarea { resize: vertical; }
.qa-ask-sort-tip { font-size: 12px; color: inherit; opacity: .62; margin-top: 6px; }
.qa-ask-reward-input { width: 220px; max-width: 100%; }
.qa-ask-submit {
    background: var(--qa-accent);
    border: none;
    color: #fff;
    font-size: 15px;
    padding: 9px 26px;
    border-radius: 6px;
    cursor: pointer;
    font-family: inherit;
}
.qa-ask-submit:hover { opacity: .88; }
.qa-ask-muted { font-size: 12px; color: inherit; opacity: .62; margin-left: 10px; display: inline-block; }
.qa-ask-tip { font-size: 14px; color: inherit; opacity: .8; line-height: 1.9; }
.qa-ask-tip a { color: var(--qa-accent); }
.qa-ask-guest-list { margin-top: 26px; border-top: 1px dashed var(--qa-line); padding-top: 18px; }
.qa-ask-guest-title { font-size: 15px; font-weight: 600; color: inherit; margin: 0 0 12px; }
.qa-guest-item { padding: 10px 0; border-bottom: 1px solid var(--qa-line-soft); }
.qa-guest-item:last-child { border-bottom: none; }
.qa-guest-link { font-size: 14px; color: inherit; text-decoration: none; line-height: 1.6; }
.qa-guest-link:hover { color: var(--qa-accent); }
.qa-guest-meta { display: block; font-size: 12px; color: inherit; opacity: .62; margin-top: 3px; }
.qa-guest-meta a { color: inherit; text-decoration: none; }
.qa-guest-meta a:hover { color: var(--qa-accent); }

@media (max-width: 640px) {
    .qa-page { padding: 12px 12px 30px; }
    .qa-question h1 { font-size: 20px; }
    .qa-head h1 { font-size: 19px; }
    .qa-ask-wrap { padding: 0 10px; margin: 12px auto; }
    .qa-ask-box { padding: 16px 14px; }
    .qa-ask-reward-input { width: 100%; }
    .qa-ask-submit { width: 100%; }
    .qa-list .qa-best-item { padding: 14px 12px; }
    .qa-best-item .qa-meta { gap: 6px 14px; }
    .qa-content pre, .qa-content table { font-size: 12.5px; }
}
