/* widget.css — 鸿信PLC智仿实训平台 AI助教挂件 */
#xh-ai-fab {
  position: fixed; right: 22px; bottom: 22px; z-index: 99999;
  width: 56px; height: 56px; border-radius: 50%;
  background: linear-gradient(135deg, #0a4d8f, #00a8e8);
  box-shadow: 0 6px 20px rgba(10,77,143,.35);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: #fff; font-size: 26px; user-select: none;
  transition: transform .2s, box-shadow .2s;
}
#xh-ai-fab:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(10,77,143,.45); }
#xh-ai-fab .xh-ai-dot {
  position: absolute; top: -2px; right: -2px; width: 14px; height: 14px;
  background: #ff5a4d; border: 2px solid #fff; border-radius: 50%;
  font-size: 0;
}

#xh-ai-panel {
  position: fixed; right: 22px; bottom: 90px; z-index: 99998;
  width: 360px; max-width: calc(100vw - 32px); height: 520px; max-height: calc(100vh - 120px);
  background: #fff; border-radius: 14px; overflow: hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,.18);
  display: none; flex-direction: column; font-family: "Microsoft YaHei","PingFang SC",Arial,sans-serif;
}
#xh-ai-panel.xh-open { display: flex; }

.xh-ai-header {
  background: linear-gradient(135deg, #0a4d8f, #1a6fc4); color: #fff;
  padding: 12px 14px; display: flex; align-items: center; gap: 10px;
}
.xh-ai-avatar {
  width: 34px; height: 34px; border-radius: 50%; background: #fff; color: #0a4d8f;
  display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 700; flex: none;
}
.xh-ai-title { font-size: 15px; font-weight: 700; line-height: 1.2; }
.xh-ai-sub { font-size: 11px; opacity: .85; }
.xh-ai-close {
  margin-left: auto; cursor: pointer; font-size: 20px; line-height: 1; opacity: .9; padding: 2px 6px;
}
.xh-ai-close:hover { opacity: 1; }

.xh-ai-body {
  flex: 1; overflow-y: auto; padding: 14px; background: #f5f7fa;
  display: flex; flex-direction: column; gap: 12px; font-size: 14px; line-height: 1.6;
}
.xh-msg { max-width: 88%; padding: 9px 12px; border-radius: 12px; white-space: pre-wrap; word-break: break-word; }
.xh-msg.user { align-self: flex-end; background: #0a4d8f; color: #fff; border-bottom-right-radius: 3px; }
.xh-msg.bot { align-self: flex-start; background: #fff; color: #1a1a2e; border: 1px solid #e0e6ed; border-bottom-left-radius: 3px; }
.xh-msg.bot code { background: #eef2f7; padding: 1px 5px; border-radius: 4px; font-family: Consolas,Menlo,monospace; font-size: 13px; }
.xh-msg.bot .xh-cite { color: #0a4d8f; font-size: 12px; margin-top: 6px; display: block; }
.xh-typing { align-self: flex-start; color: #999; font-size: 13px; padding: 4px 2px; }

.xh-ai-foot { border-top: 1px solid #e0e6ed; padding: 10px; background: #fff; }
.xh-ai-input-row { display: flex; gap: 8px; }
.xh-ai-input {
  flex: 1; resize: none; border: 1px solid #d4dbe4; border-radius: 10px; padding: 9px 11px;
  font-size: 14px; font-family: inherit; outline: none; max-height: 90px; line-height: 1.4;
}
.xh-ai-input:focus { border-color: #0a4d8f; }
.xh-ai-send {
  flex: none; width: 64px; border: none; border-radius: 10px; cursor: pointer;
  background: linear-gradient(135deg, #0a4d8f, #1a6fc4); color: #fff; font-size: 14px; font-weight: 600;
}
.xh-ai-send:disabled { opacity: .5; cursor: not-allowed; }
.xh-ai-hint { font-size: 11px; color: #999; text-align: center; margin-top: 6px; }
