/* 晨幻AI ™ · 智能获客系统 v3.1 - 增强现有入口 + 裂变分享 */
:root {
  --c-ai: #00d4ff;
  --c-green: #00d26a;
  --c-gold: #ffd700;
  --c-dark: #0A0A0F;
  --c-card: rgba(10, 14, 25, 0.97);
}

/* ========== 一键复制提示 ========== */
.copy-toast {
  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
  background: rgba(0,210,106,0.95); color: white; padding: 12px 24px;
  border-radius: 10px; z-index: 1000001; font-size: 14px; font-weight: bold;
  box-shadow: 0 0 30px rgba(0,210,106,0.4);
  animation: copyPop 0.3s ease-out;
}
@keyframes copyPop {
  from{opacity:0;transform:translate(-50%,-50%) scale(0.8);}
  to{opacity:1;transform:translate(-50%,-50%) scale(1);}
}

/* ========== 浮动优惠条（顶部） ========== */
.promo-bar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 999998;
  background: linear-gradient(90deg, #ff6b35, #ff8c42, #ffd700);
  padding: 6px 15px; text-align: center; color: #1a1a1a; font-size: 12px;
  font-weight: bold; display: flex; align-items: center; justify-content: center; gap: 10px;
  box-shadow: 0 2px 10px rgba(255,107,53,0.3);
}
.promo-bar .countdown {
  background: rgba(0,0,0,0.2); padding: 2px 8px; border-radius: 4px; color: white;
  font-family: monospace; font-weight: bold;
}
.promo-bar-close {
  position: absolute; right: 10px; background: none; border: none;
  color: rgba(0,0,0,0.6); font-size: 16px; cursor: pointer; padding: 0 5px;
}
body.has-promo-bar { padding-top: 32px !important; }

/* ========== AI聊天窗口（从右下角弹出，在现有按钮上方） ========== */
.ai-chat-window {
  position: fixed;
  bottom: 100px;
  right: 20px;
  width: 350px;
  max-width: calc(100vw - 40px);
  height: 480px;
  max-height: calc(100vh - 140px);
  background: var(--c-dark);
  border: 1px solid var(--c-ai);
  border-radius: 20px;
  z-index: 999999;
  display: none;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 0 40px rgba(0,212,255,0.25), 0 10px 50px rgba(0,0,0,0.6);
  animation: chatPop 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.ai-chat-window.open { display: flex; }

.ai-chat-header {
  background: linear-gradient(135deg, rgba(0,212,255,0.12), rgba(0,150,200,0.08));
  padding: 12px 14px;
  border-bottom: 1px solid rgba(0,212,255,0.2);
  display: flex;
  align-items: center;
  gap: 10px;
}
.ai-chat-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--c-ai), #0099cc);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}
.ai-chat-header-info h4 { margin:0; color:white; font-size:14px; }
.ai-chat-header-info span {
  font-size:11px; color:var(--c-ai); display:flex; align-items:center; gap:4px;
}
.ai-chat-header-info span::before {
  content:''; width:6px; height:6px; background:var(--c-ai); border-radius:50%;
  animation: dotPulse 1.5s infinite;
}
.ai-chat-close {
  margin-left:auto; background:none; border:none; color:#888; font-size:20px; cursor:pointer; padding:0 6px;
}

.ai-chat-messages {
  flex:1; overflow-y:auto; padding:12px; display:flex; flex-direction:column; gap:10px;
}
.ai-chat-messages::-webkit-scrollbar { width:4px; }
.ai-chat-messages::-webkit-scrollbar-thumb { background:rgba(0,212,255,0.2); border-radius:2px; }

.ai-msg { display:flex; gap:6px; max-width:85%; }
.ai-msg.bot { align-self:flex-start; }
.ai-msg.user { align-self:flex-end; flex-direction:row-reverse; }
.ai-msg-avatar {
  width:26px; height:26px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:13px;
}
.ai-msg.bot .ai-msg-avatar { background:linear-gradient(135deg,var(--c-ai),#0099cc); }
.ai-msg.user .ai-msg-avatar { background:rgba(255,255,255,0.15); }
.ai-msg-bubble {
  padding:9px 12px; border-radius:14px; font-size:13px; line-height:1.5; word-break:break-word;
}
.ai-msg.bot .ai-msg-bubble {
  background:rgba(255,255,255,0.06); color:#e0e0e0; border-bottom-left-radius:4px;
}
.ai-msg.user .ai-msg-bubble {
  background:linear-gradient(135deg,rgba(0,212,255,0.15),rgba(0,212,255,0.08));
  color:white; border:1px solid rgba(0,212,255,0.2); border-bottom-right-radius:4px;
}
.ai-msg-bubble a { color:var(--c-ai); text-decoration:underline; }

.ai-quick-replies { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.ai-quick-reply {
  background:rgba(0,212,255,0.1); border:1px solid rgba(0,212,255,0.25); color:var(--c-ai);
  padding:5px 11px; border-radius:16px; font-size:12px; cursor:pointer; white-space:nowrap;
  transition:all 0.2s;
}
.ai-quick-reply:hover { background:rgba(0,212,255,0.2); }

.ai-lead-form {
  background:rgba(0,212,255,0.07); border:1px solid rgba(0,212,255,0.2);
  border-radius:10px; padding:10px; margin-top:6px;
}
.ai-lead-form h5 { margin:0 0 6px; color:var(--c-ai); font-size:12px; }
.ai-lead-form input, .ai-lead-form select {
  width:100%; padding:8px; margin-bottom:6px; background:rgba(0,0,0,0.35);
  border:1px solid rgba(255,255,255,0.1); border-radius:6px; color:white; font-size:12px; box-sizing:border-box;
}
.ai-lead-form input:focus, .ai-lead-form select:focus { outline:none; border-color:var(--c-ai); }
.ai-lead-form button {
  width:100%; padding:9px; background:linear-gradient(135deg,var(--c-ai),#0099cc);
  border:none; border-radius:6px; color:white; font-size:13px; font-weight:bold; cursor:pointer;
}
.ai-lead-form button:hover { box-shadow:0 4px 12px rgba(0,212,255,0.4); }

.ai-chat-input-area {
  padding:8px 10px; border-top:1px solid rgba(0,212,255,0.15); display:flex; gap:6px;
}
.ai-chat-input {
  flex:1; padding:8px 12px; background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.1); border-radius:20px; color:white; font-size:13px;
}
.ai-chat-input:focus { outline:none; border-color:var(--c-ai); }
.ai-chat-send {
  width:34px; height:34px; border-radius:50%; background:linear-gradient(135deg,var(--c-ai),#0099cc);
  border:none; cursor:pointer; color:white; font-size:14px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
}

/* 人工客服切换按钮 */
.ai-to-human {
  text-align:center; padding:6px; font-size:11px; color:#888;
  border-top:1px solid rgba(255,255,255,0.05);
}
.ai-to-human a { color:var(--c-green); cursor:pointer; text-decoration:underline; }

/* ========== 社会证明通知（左下角） ========== */
.social-proof-notif {
  position:fixed; bottom:90px; left:14px;
  background:var(--c-card); border:1px solid rgba(0,212,255,0.2); border-left:3px solid var(--c-ai);
  border-radius:10px; padding:10px 12px; z-index:999997;
  display:flex; align-items:center; gap:8px; max-width:250px;
  box-shadow:0 4px 20px rgba(0,0,0,0.5);
  animation: slideInLeft 0.4s ease-out; cursor:pointer;
}
.social-proof-notif.hide { animation: slideOutLeft 0.3s ease-out forwards; }
.sp-icon {
  width:32px; height:32px; border-radius:50%;
  background:linear-gradient(135deg,var(--c-ai),#0099cc);
  display:flex; align-items:center; justify-content:center; font-size:15px; flex-shrink:0;
}
.sp-text { font-size:11px; color:#c0c0c0; line-height:1.4; }
.sp-text strong { color:var(--c-ai); }
.sp-time { color:#666; font-size:10px; display:block; margin-top:2px; }

/* ========== 退出挽留弹窗 ========== */
.exit-intent-modal {
  position:fixed; inset:0; background:rgba(0,0,0,0.85); z-index:1000000;
  display:none; align-items:center; justify-content:center; padding:20px; backdrop-filter:blur(8px);
}
.exit-intent-modal.show { display:flex; animation:fadeIn 0.3s; }
.exit-intent-box {
  background:var(--c-dark); border:1px solid var(--c-gold); border-radius:18px;
  max-width:400px; width:100%; padding:24px 20px; text-align:center; position:relative;
  box-shadow:0 0 40px rgba(255,215,0,0.15);
  animation:popIn 0.4s cubic-bezier(0.175,0.885,0.32,1.275);
}
.exit-intent-close { position:absolute; top:8px; right:12px; background:none; border:none; color:#666; font-size:22px; cursor:pointer; }
.exit-intent-icon { font-size:40px; margin-bottom:8px; }
.exit-intent-box h3 { color:white; font-size:19px; margin:0 0 8px; }
.exit-intent-box p { color:#a0a0a0; font-size:13px; line-height:1.5; margin:0 0 14px; }
.exit-coupon {
  background:linear-gradient(135deg,rgba(255,215,0,0.08),rgba(255,215,0,0.03));
  border:1px dashed var(--c-gold); border-radius:10px; padding:12px; margin-bottom:14px;
}
.exit-coupon .coupon-label { color:var(--c-gold); font-size:11px; font-weight:bold; }
.exit-coupon .coupon-val { color:white; font-size:26px; font-weight:bold; }
.exit-coupon .coupon-cond { color:#888; font-size:10px; margin-top:2px; }
.exit-cta {
  width:100%; padding:12px; background:linear-gradient(135deg,var(--c-gold),#e6c200);
  border:none; border-radius:10px; color:#1a1a1a; font-size:14px; font-weight:bold;
  cursor:pointer; margin-bottom:8px;
}
.exit-stay { background:none; border:none; color:#666; font-size:12px; cursor:pointer; text-decoration:underline; }

/* ========== 动画 ========== */
@keyframes chatPop { from{opacity:0;transform:scale(0.85)translateY(20px);} to{opacity:1;transform:scale(1)translateY(0);} }
@keyframes slideInLeft { from{opacity:0;transform:translateX(-20px);} to{opacity:1;transform:translateX(0);} }
@keyframes slideOutLeft { to{opacity:0;transform:translateX(-20px);} }
@keyframes fadeIn { from{opacity:0;} to{opacity:1;} }
@keyframes popIn { from{opacity:0;transform:scale(0.8);} to{opacity:1;transform:scale(1);} }
@keyframes dotPulse { 0%,100%{opacity:1;} 50%{opacity:0.4;} }

/* ========== 移动端 ========== */
@media (max-width:768px) {
  .ai-chat-window {
    width:calc(100vw - 20px); right:10px; bottom:80px;
    height:70vh; max-height:calc(100vh - 100px); border-radius:16px;
  }
  .social-proof-notif {
    left:10px; right:80px; bottom:160px; max-width:none;
  }
  .promo-bar { font-size: 11px; padding: 5px 30px 5px 10px; }
}

/* ========== 一键复制微信号按钮 ========== */
.copy-wechat-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(135deg, #07c160, #06ad56);
  color: white; border: none; padding: 8px 14px; border-radius: 8px;
  font-size: 13px; font-weight: bold; cursor: pointer; margin-top: 8px;
  transition: all 0.2s;
}
.copy-wechat-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(7,193,96,0.4); }

/* ========== 分享裂变按钮 ========== */
.share-area {
  display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap;
}
.share-btn {
  flex: 1; min-width: 80px; padding: 7px; text-align: center; border-radius: 6px;
  font-size: 11px; cursor: pointer; border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.05); color: #ccc; transition: all 0.2s;
}
.share-btn:hover { background: rgba(0,212,255,0.1); border-color: var(--c-ai); color: var(--c-ai); }