/* ============================================================
   AIHR 站内问答挂件 · widget.css
   作用域前缀 .qa- 避免与全站样式冲突；可直接注入任意页面。
   颜色全部走站点 CSS 变量（浅色 / 深色 data-theme 自动适配）。
   ============================================================ */
.qa-shell{max-width:760px;margin:var(--space-2xl) auto 0;}
.qa-page-head{max-width:760px;margin:var(--space-2xl) auto var(--space-lg);text-align:center;}
.qa-page-eyebrow{display:inline-block;font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--text-muted);margin-bottom:var(--space-md);}
.qa-page-head h1{font-size:2rem;font-weight:800;letter-spacing:-.01em;line-height:1.25;color:var(--text);margin:0 0 var(--space-md);}
.qa-page-lead{font-size:1.02rem;line-height:1.7;color:var(--text-secondary);margin:0 auto;max-width:600px;}
.qa-page-note{text-align:center;font-size:.9rem;color:var(--text-muted);margin:var(--space-xl) auto 0;}
.qa-page-note a{color:var(--text-link);}

/* ---------- 挂件主体 ---------- */
.qa{
  background:var(--surface);
  border:1px solid var(--line-strong);
  border-radius:16px;
  padding:var(--space-lg);
  box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 28px rgba(0,0,0,.05);
  display:flex;
  flex-direction:column;
  gap:var(--space-md);
  font-family:var(--font-sans);
  color:var(--text);
}
[data-theme="dark"] .qa{box-shadow:0 1px 2px rgba(0,0,0,.3),0 8px 28px rgba(0,0,0,.4);}

.qa-header{display:flex;align-items:center;gap:.6rem;padding-bottom:var(--space-sm);border-bottom:1px solid var(--line);}
.qa-header-dot{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:0 0 auto;box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent);}
.qa-header-title{font-size:1.05rem;font-weight:700;color:var(--text);margin:0;}
.qa-header-sub{font-size:.78rem;color:var(--text-muted);margin:0 0 0 auto;}

/* ---------- 对话区 ---------- */
.qa-conv{
  display:flex;flex-direction:column;gap:var(--space-md);
  max-height:460px;overflow-y:auto;padding:var(--space-xs);
  scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;
}
.qa-conv::-webkit-scrollbar{width:6px;}
.qa-conv::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:3px;}

.qa-turn{display:flex;flex-direction:column;gap:.5rem;}
.qa-q{align-self:flex-end;max-width:85%;background:var(--accent);color:#fff;
  padding:.5rem .85rem;border-radius:14px 14px 4px 14px;font-size:.94rem;line-height:1.5;
  word-break:break-word;}
[data-theme="dark"] .qa-q{color:#0B0C0E;}
.qa-a{align-self:flex-start;max-width:92%;}

.qa-a-text{
  font-size:.96rem;line-height:1.72;color:var(--text);
  white-space:pre-wrap;word-break:break-word;
  background:var(--bg-subtle);border:1px solid var(--line);
  border-radius:14px 14px 14px 4px;padding:.75rem .95rem;
}
.qa-a-text.is-streaming::after{content:"▋";display:inline-block;margin-left:1px;color:var(--accent);animation:qa-blink 1s steps(2) infinite;}
@keyframes qa-blink{0%,50%{opacity:1}50.01%,100%{opacity:0}}

.qa-a-text.is-empty{border-style:dashed;color:var(--text-muted);background:transparent;}

/* 引用来源 */
.qa-sources{margin-top:.6rem;display:flex;flex-direction:column;gap:.4rem;}
.qa-sources-label{font-size:.74rem;font-weight:600;letter-spacing:.04em;color:var(--text-muted);text-transform:uppercase;}
.qa-source{display:block;text-decoration:none;color:inherit;
  background:var(--bg-subtle);border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:8px;padding:.5rem .7rem;transition:border-color .2s var(--ease),transform .2s var(--ease);}
.qa-source:hover{border-color:var(--accent);transform:translateX(2px);}
.qa-source-idx{font-size:.82rem;color:var(--text-muted);font-variant-numeric:tabular-nums;}
.qa-source-title{font-size:.9rem;font-weight:600;color:var(--text-link);line-height:1.4;}
.qa-source-heading{display:block;font-size:.78rem;color:var(--text-muted);margin-top:.15rem;line-height:1.4;}

.qa-sources-empty{font-size:.82rem;color:var(--text-muted);font-style:italic;margin-top:.5rem;}

/* 正文内引用上标 */
.qa-cite{display:inline-block;margin-left:1px;}
.qa-cite-link{font-size:.72rem;line-height:1;text-decoration:none;color:var(--accent);font-weight:600;}
.qa-cite-link:hover{text-decoration:underline;}
[data-theme="dark"] .qa-cite-link{color:#9CC06A;}

/* 配置提示 / 错误提示 */
.qa-config-note,.qa-error{
  font-size:.86rem;line-height:1.6;border-radius:10px;padding:.7rem .9rem;
}
.qa-config-note{background:color-mix(in srgb,var(--accent) 10%,var(--bg-subtle));border:1px solid var(--line-strong);color:var(--text-secondary);}
.qa-config-note code{background:var(--bg);padding:.1rem .35rem;border-radius:4px;font-size:.82em;color:var(--accent);}
.qa-error{background:color-mix(in srgb,#C44536 12%,var(--bg-subtle));border:1px solid color-mix(in srgb,#C44536 35%,transparent);color:var(--text);}

/* ---------- 示例问题 ---------- */
.qa-examples{display:flex;flex-wrap:wrap;gap:.5rem;}
.qa-examples-label{width:100%;font-size:.78rem;color:var(--text-muted);margin-bottom:.1rem;}
.qa-chip{font-size:.84rem;line-height:1.3;color:var(--text-secondary);
  background:var(--bg-subtle);border:1px solid var(--line-strong);border-radius:999px;
  padding:.4rem .8rem;cursor:pointer;transition:all .18s var(--ease);font-family:inherit;}
.qa-chip:hover{color:var(--text);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--bg-subtle));}

/* ---------- 输入区 ---------- */
.qa-form{display:flex;gap:.6rem;align-items:flex-end;}
.qa-input{
  flex:1;resize:none;font-family:inherit;font-size:.96rem;line-height:1.5;
  color:var(--text);background:var(--bg);border:1px solid var(--line-strong);
  border-radius:12px;padding:.7rem .9rem;min-height:46px;max-height:160px;
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease);
}
.qa-input::placeholder{color:var(--text-muted);}
.qa-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent);}
.qa-send{
  flex:0 0 auto;font-family:inherit;font-size:.94rem;font-weight:600;
  background:var(--accent);color:#fff;border:1px solid var(--accent);border-radius:12px;
  padding:.7rem 1.2rem;min-height:46px;cursor:pointer;transition:all .18s var(--ease);
}
[data-theme="dark"] .qa-send{color:#0B0C0E;}
.qa-send:hover:not(:disabled){background:var(--text-link);border-color:var(--text-link);color:#fff;}
.qa-send:disabled{opacity:.5;cursor:not-allowed;}

.qa-foot{font-size:.76rem;line-height:1.5;color:var(--text-muted);text-align:center;}

@media(max-width:640px){
  .qa-shell{padding:0 var(--space-md);}
  .qa{padding:var(--space-md);border-radius:14px;}
  .qa-page-head{margin-top:var(--space-xl);}
  .qa-page-head h1{font-size:1.6rem;}
  .qa-q,.qa-a{max-width:92%;}
}