/* ===== 在线客服卡通形象（移植自原站 aoyun.css，2026-10-21） ===== */
.pc-kefu,
.mobile-kefu {
  display: none;
  position: fixed;
  left: 0;
  z-index: 9999;
  align-items: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.mobile-kefu { bottom: 150px; }
.pc-kefu { bottom: 80px; z-index: 1000002; }

.pc-kefu .kefu-mascot,
.mobile-kefu .kefu-mascot {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2fb3ef, #1790d0);
  color: #fff;
  font-size: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(23, 144, 208, 0.45);
  position: relative;
  flex-shrink: 0;
  margin-left: 8px;
  z-index: 0;
  transition: transform 0.2s ease;
}
.kefu-mascot svg { width: 26px; height: 26px; }

/* 未读消息红点 */
.pc-kefu .kefu-mascot .kefu-unread,
.mobile-kefu .kefu-mascot .kefu-unread {
  display: none;
  position: absolute;
  top: -2px;
  right: -2px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 10px;
  background: #ff3b30;
  color: #fff;
  font-size: 11px;
  line-height: 14px;
  font-weight: bold;
  text-align: center;
  box-sizing: border-box;
  border: 2px solid #fff;
  z-index: 2;
  box-shadow: 0 1px 4px rgba(255, 59, 48, 0.4);
}
.pc-kefu .kefu-mascot .kefu-unread.show,
.mobile-kefu .kefu-mascot .kefu-unread.show { display: block; }

/* 第三方客服悬浮球：隐藏自带角标与通知气泡，改由本地红点接管 */
.launchButtonBox .launchButton #launchIcon,
.launchButtonBox .launchButton .launchIcon { display: none !important; }
.launchButtonBox .launchButtonNotice,
.launchButtonBox #launchButtonNotice,
.launchButtonBox .launchNoticeContent { display: none !important; }
.launchButtonBox .launchButton .pc-kefu-unread {
  display: none;
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 10px;
  background: #ff3b30;
  color: #fff;
  font-size: 11px;
  line-height: 14px;
  font-weight: bold;
  text-align: center;
  box-sizing: border-box;
  border: 2px solid #fff;
  z-index: 10000000000001;
  box-shadow: 0 1px 4px rgba(255, 59, 48, 0.4);
}
.launchButtonBox .launchButton .pc-kefu-unread.show { display: block; }

/* 脉冲光环 */
.pc-kefu .kefu-mascot::before,
.mobile-kefu .kefu-mascot::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: rgba(47, 179, 239, 0.35);
  z-index: -1;
  transform: translate(-50%, -50%) scale(1);
  animation: kefuPulse 2s ease-out infinite;
}
@keyframes kefuPulse {
  0% { transform: translate(-50%, -50%) scale(1); opacity: 0.7; }
  70% { transform: translate(-50%, -50%) scale(1.6); opacity: 0; }
  100% { transform: translate(-50%, -50%) scale(1.6); opacity: 0; }
}
/* 点击弹跳 */
@keyframes kefuBounce {
  0% { transform: scale(1); }
  30% { transform: scale(1.15); }
  50% { transform: scale(0.95); }
  70% { transform: scale(1.05); }
  100% { transform: scale(1); }
}
.pc-kefu.open .kefu-mascot,
.mobile-kefu.open .kefu-mascot { animation: kefuBounce 0.5s ease; }

/* 说话气泡（微信风格绿色） */
.pc-kefu .kefu-bubble,
.mobile-kefu .kefu-bubble {
  background: #95ec69;
  border-radius: 14px;
  padding: 10px 14px;
  font-size: 13px;
  color: #333;
  line-height: 1.5;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  position: relative;
  max-width: 160px;
  margin-left: 10px;
  white-space: normal;
  opacity: 0;
  transform: translateX(14px);
  transition: opacity 0.35s ease 0.18s, transform 0.35s ease 0.18s;
}
.pc-kefu .kefu-bubble::before,
.mobile-kefu .kefu-bubble::before {
  content: '';
  position: absolute;
  left: -6px;
  top: 50%;
  margin-top: -6px;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-right: 7px solid #95ec69;
}
.pc-kefu.open .kefu-bubble,
.mobile-kefu.open .kefu-bubble { opacity: 1; transform: translateX(0); }

/* 分端显示 */
@media only screen and (max-width: 767.98px) {
  .mobile-kefu { display: flex; }
}
@media only screen and (min-width: 768px) {
  .pc-kefu { display: flex; }
}