/* 快捷词候选浮层 —— 对齐输入法候选栏的观感
   贴在输入框上方，白底细边，选中项浅蓝。 */

.kefu-qc {
  position: fixed;
  z-index: 95;
  background: #fff;
  border: 1px solid #e5e6eb;
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0, 21, 41, .14);
  overflow: hidden;
  font-family: "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  max-height: 320px;
  overflow-y: auto;
}

.kefu-qc-hd {
  position: sticky;
  top: 0;
  padding: 6px 12px;
  font-size: 11px;
  color: #86909c;
  background: #fafbfc;
  border-bottom: 1px solid #f0f0f0;
  letter-spacing: .03em;
}

.kefu-qc-item {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 9px 12px;
  cursor: pointer;
  border-bottom: 1px solid #f7f8fa;
}
.kefu-qc-item:last-of-type { border-bottom: 0; }
.kefu-qc-item b {
  flex: none;
  font-size: 13px;
  font-weight: 600;
  color: #1d2129;
}
.kefu-qc-item span {
  min-width: 0;
  font-size: 12px;
  color: #86909c;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kefu-qc-item.on { background: #e8f3ff; }
.kefu-qc-item.on b { color: #2d8cf0; }
.kefu-qc-item.on span { color: #6b8cb8; }

.kefu-qc-ft {
  position: sticky;
  bottom: 0;
  padding: 5px 12px;
  font-size: 11px;
  color: #c0c4cc;
  background: #fafbfc;
  border-top: 1px solid #f0f0f0;
}

body[theme-mode="dark"] .kefu-qc { background: #23262b; border-color: #333942; }
body[theme-mode="dark"] .kefu-qc-hd { background: #1c1f24; border-bottom-color: #2a2e35; color: #8a929c; }
body[theme-mode="dark"] .kefu-qc-item { border-bottom-color: #2a2e35; }
body[theme-mode="dark"] .kefu-qc-item b { color: #e6e8eb; }
body[theme-mode="dark"] .kefu-qc-item.on { background: #1b3550; }
body[theme-mode="dark"] .kefu-qc-item.on b { color: #6cb2ff; }
body[theme-mode="dark"] .kefu-qc-ft { background: #1c1f24; border-top-color: #2a2e35; color: #6b727b; }