/* 在线咨询悬浮窗：PC 与移动端共用，无依赖 */
/* 电脑版首页右下角有「📱 手机版」标签（right:14 bottom:14，高约 24px），
   按钮与面板整体上移，避免压住它 */
.zhkd-chat-btn {
  position: fixed; right: 22px; bottom: 58px; z-index: 9998;
  width: 56px; height: 56px; border: 0; border-radius: 50%;
  background: linear-gradient(135deg, #1b6ef3, #0f4fc0); color: #fff;
  font-size: 24px; line-height: 1; cursor: pointer;
  box-shadow: 0 6px 18px rgba(15, 79, 192, .35);
  display: flex; align-items: center; justify-content: center;
  transition: transform .18s ease, box-shadow .18s ease;
}
.zhkd-chat-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(15, 79, 192, .45); }
.zhkd-chat-btn .dot {
  position: absolute; top: -1px; right: -1px; width: 12px; height: 12px;
  border-radius: 50%; background: #ff5b5b; border: 2px solid #fff; display: none;
}
.zhkd-chat-btn.has-new .dot { display: block; }

.zhkd-chat {
  position: fixed; right: 22px; bottom: 126px; z-index: 9999;
  width: 360px; max-width: calc(100vw - 32px); height: 520px; max-height: calc(100vh - 190px);
  background: #fff; border-radius: 14px; overflow: hidden;
  box-shadow: 0 18px 48px rgba(16, 38, 76, .24);
  display: none; flex-direction: column; font-size: 14px; color: #243b5a;
}
.zhkd-chat.on { display: flex; }

.zhkd-chat-hd {
  padding: 12px 14px; background: linear-gradient(135deg, #1b6ef3, #0f2544);
  color: #fff; display: flex; align-items: center; gap: 8px;
}
.zhkd-chat-hd .t { font-weight: 600; font-size: 15px; flex: 1; }
.zhkd-chat-hd .x { border: 0; background: transparent; color: #fff; font-size: 20px; cursor: pointer; line-height: 1; padding: 0 2px; }

.zhkd-chat-tip {
  padding: 6px 14px; background: #fff7e6; color: #92620a; font-size: 12px; line-height: 1.6;
  border-bottom: 1px solid #f2e4c4;
}

.zhkd-chat-bd { flex: 1; overflow-y: auto; padding: 14px; background: #f5f8fd; }
.zhkd-msg { margin-bottom: 12px; display: flex; }
.zhkd-msg.me { justify-content: flex-end; }
.zhkd-msg .b {
  max-width: 78%; padding: 9px 12px; border-radius: 10px; line-height: 1.7;
  white-space: pre-wrap; word-break: break-word; font-size: 13.5px;
}
.zhkd-msg.bot .b { background: #fff; border: 1px solid #e3ecf9; border-top-left-radius: 3px; }
.zhkd-msg.me .b { background: #1b6ef3; color: #fff; border-top-right-radius: 3px; }
.zhkd-msg.sys .b { background: #eef4ff; color: #2b5da8; font-size: 12.5px; border: 1px solid #d6e4fb; }
.zhkd-msg.err .b { background: #fff1f0; color: #a63b3b; border: 1px solid #f5d0d0; }
.zhkd-msg .b a { color: #1b6ef3; text-decoration: underline; }
.zhkd-msg.me .b a { color: #fff; }
.zhkd-caret::after { content: '▌'; animation: zhkdbk .9s steps(1) infinite; }
@keyframes zhkdbk { 50% { opacity: 0; } }

.zhkd-quick { padding: 8px 12px; border-top: 1px solid #eef2f9; display: flex; flex-wrap: wrap; gap: 6px; background: #fff; }
.zhkd-quick button {
  border: 1px solid #cfe0fb; background: #f4f8ff; color: #1b6ef3;
  border-radius: 14px; padding: 5px 10px; font-size: 12.5px; cursor: pointer;
}
.zhkd-quick button:hover { background: #e8f1ff; }

.zhkd-chat-ft { border-top: 1px solid #eef2f9; padding: 10px 12px; background: #fff; }
.zhkd-inp { display: flex; gap: 8px; align-items: flex-end; }
.zhkd-inp textarea {
  flex: 1; resize: none; border: 1px solid #dde5f2; border-radius: 8px; padding: 8px 10px;
  font: inherit; font-size: 13.5px; line-height: 1.5; max-height: 90px; outline: none; color: #243b5a;
}
.zhkd-inp textarea:focus { border-color: #1b6ef3; }
.zhkd-inp .send {
  border: 0; border-radius: 8px; background: #1b6ef3; color: #fff; padding: 8px 14px;
  font-size: 13.5px; cursor: pointer; height: 36px;
}
.zhkd-inp .send:disabled { background: #b9c8e0; cursor: default; }
.zhkd-lead-link {
  margin-top: 8px; text-align: center; font-size: 12.5px; color: #1b6ef3; cursor: pointer;
}

.zhkd-lead { padding: 14px; background: #fff; border-top: 1px solid #eef2f9; }
.zhkd-lead label { display: block; font-size: 12.5px; color: #5b7ba8; margin: 8px 0 4px; }
.zhkd-lead input, .zhkd-lead textarea {
  width: 100%; box-sizing: border-box; border: 1px solid #dde5f2; border-radius: 8px;
  padding: 8px 10px; font: inherit; font-size: 13.5px; outline: none; color: #243b5a;
}
.zhkd-lead input:focus, .zhkd-lead textarea:focus { border-color: #1b6ef3; }
.zhkd-lead .acts { display: flex; gap: 8px; margin-top: 12px; }
.zhkd-lead .acts button { flex: 1; height: 38px; border-radius: 8px; font-size: 14px; cursor: pointer; }
.zhkd-lead .pri { border: 0; background: #1b6ef3; color: #fff; }
.zhkd-lead .sec { border: 1px solid #dde5f2; background: #fff; color: #5b7ba8; }

@media (max-width: 720px) {
  .zhkd-chat-btn { right: 14px; bottom: 78px; width: 52px; height: 52px; }
  .zhkd-chat {
    right: 0; left: 0; bottom: 0; width: auto; max-width: none;
    height: 76vh; max-height: none; border-radius: 14px 14px 0 0;
  }
}