/* AI选型助手 - 浮动聊天窗口 - 全站通用 */
.ai-chat-fab{
  position:fixed;right:24px;bottom:24px;z-index:9999;
  width:64px;height:64px;border-radius:50%;
  background:linear-gradient(135deg,#00a0a0,#2563eb);
  color:#fff;border:none;cursor:pointer;
  box-shadow:0 8px 28px rgba(0,160,160,.45);
  display:flex;align-items:center;justify-content:center;
  transition:all .3s cubic-bezier(.4,0,.2,1);
}
.ai-chat-fab:hover{transform:scale(1.08);box-shadow:0 12px 36px rgba(0,160,160,.55)}
.ai-chat-fab svg{width:30px;height:30px;fill:#fff}
.ai-chat-fab .fab-badge{
  position:absolute;top:-4px;right:-4px;
  background:#d63031;color:#fff;
  font-size:11px;font-weight:700;
  width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  animation:pulse 2s infinite;
}
@keyframes pulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.15)}
}

/* 引导气泡 */
.ai-chat-tooltip{
  position:fixed;right:96px;bottom:32px;z-index:9998;
  background:#fff;border-radius:14px;
  padding:12px 18px 12px 14px;
  box-shadow:0 6px 24px rgba(0,0,0,.15);
  display:flex;align-items:center;gap:10px;
  max-width:240px;
  animation:tooltipFloat 3s ease-in-out infinite;
}
.ai-chat-tooltip.hidden{opacity:0;pointer-events:none;transform:translateX(20px)}
.ai-chat-tooltip::after{
  content:'';position:absolute;right:-8px;top:50%;
  transform:translateY(-50%);
  border:8px solid transparent;
  border-left-color:#fff;
}
.ai-chat-tooltip .tt-icon{
  width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg,rgba(0,160,160,.1),rgba(37,99,235,.1));
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.ai-chat-tooltip .tt-icon svg{width:20px;height:20px;fill:#00a0a0}
.ai-chat-tooltip .tt-text{font-size:13px;color:#333;line-height:1.5;font-weight:500}
.ai-chat-tooltip .tt-close{
  position:absolute;top:6px;right:8px;
  background:none;border:none;cursor:pointer;
  font-size:16px;color:#999;padding:2px;line-height:1;
}
@keyframes tooltipFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}

/* 遮罩层 */
.ai-chat-overlay{
  position:fixed;inset:0;z-index:9998;
  background:rgba(10,25,41,.5);
  opacity:0;pointer-events:none;
  transition:opacity .3s;
  backdrop-filter:blur(2px);
}
.ai-chat-overlay.show{opacity:1;pointer-events:auto}

/* 聊天面板 - 居中放大版 */
.ai-chat-panel{
  position:fixed;left:50%;top:50%;z-index:9999;
  transform:translate(-50%,-45%) scale(.95);
  width:520px;height:680px;max-height:88vh;max-width:92vw;
  background:#fff;border-radius:20px;
  box-shadow:0 24px 64px rgba(10,25,41,.3);
  display:flex;flex-direction:column;overflow:hidden;
  opacity:0;pointer-events:none;
  transition:all .35s cubic-bezier(.4,0,.2,1);
}
.ai-chat-panel.open{
  transform:translate(-50%,-50%) scale(1);
  opacity:1;pointer-events:auto;
}

.ai-chat-header{
  background:linear-gradient(135deg,#00a0a0,#2563eb);
  color:#fff;padding:20px 24px;
  display:flex;align-items:center;gap:14px;
  flex-shrink:0;
}
.ai-chat-avatar{
  width:50px;height:50px;border-radius:50%;
  background:rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.ai-chat-avatar svg{width:26px;height:26px;fill:#fff}
.ai-chat-header-info{flex:1}
.ai-chat-header-info h4{font-size:17px;font-weight:700;margin:0 0 3px}
.ai-chat-header-info span{font-size:12px;opacity:.85;display:flex;align-items:center;gap:6px}
.ai-chat-header-info .dot{width:9px;height:9px;border-radius:50%;background:#10b981;display:inline-block;animation:blink 2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.5}}
.ai-chat-close{
  background:none;border:none;color:#fff;cursor:pointer;
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s;flex-shrink:0;
}
.ai-chat-close:hover{background:rgba(255,255,255,.2)}
.ai-chat-close svg{width:20px;height:20px;fill:#fff}

.ai-chat-messages{
  flex:1;overflow-y:auto;padding:24px;
  background:#f5f7fa;
  display:flex;flex-direction:column;gap:16px;
}
.chat-msg{display:flex;gap:10px;max-width:85%}
.chat-msg.ai{align-self:flex-start}
.chat-msg.user{align-self:flex-end;flex-direction:row-reverse}
.chat-msg-avatar{
  width:34px;height:34px;border-radius:50%;
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:600;
}
.chat-msg.ai .chat-msg-avatar{background:linear-gradient(135deg,#00a0a0,#2563eb);color:#fff}
.chat-msg.user .chat-msg-avatar{background:#0a1929;color:#fff}
.chat-msg-bubble{
  padding:12px 16px;border-radius:14px;
  font-size:14px;line-height:1.75;
}
.chat-msg.ai .chat-msg-bubble{
  background:#fff;color:#555;
  border-bottom-left-radius:4px;
  box-shadow:0 1px 3px rgba(0,0,0,.06);
}
.chat-msg.user .chat-msg-bubble{
  background:linear-gradient(135deg,#00a0a0,#2563eb);
  color:#fff;border-bottom-right-radius:4px;
}
.chat-msg-bubble strong{color:#0a1929;font-weight:700}
.chat-msg.user .chat-msg-bubble strong{color:#fff}
.chat-msg-bubble ul{margin:8px 0;padding-left:20px}
.chat-msg-bubble li{margin-bottom:4px}
.chat-msg-bubble a{color:#00a0a0;text-decoration:underline;font-weight:600}
.chat-msg.user .chat-msg-bubble a{color:#fff}
.chat-msg-time{font-size:11px;color:#999;margin-top:4px}
.chat-msg.ai .chat-msg-time{text-align:left}
.chat-msg.user .chat-msg-time{text-align:right}

.typing-indicator{display:flex;gap:5px;padding:12px 16px}
.typing-indicator span{
  width:8px;height:8px;border-radius:50%;
  background:#bbb;
  animation:typing 1.4s infinite;
}
.typing-indicator span:nth-child(2){animation-delay:.2s}
.typing-indicator span:nth-child(3){animation-delay:.4s}
@keyframes typing{
  0%,60%,100%{transform:translateY(0);opacity:.4}
  30%{transform:translateY(-6px);opacity:1}
}

.ai-chat-quick{
  padding:12px 20px;background:#fff;border-top:1px solid #eef1f5;
  display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0;
}
.ai-chat-quick span{
  font-size:12px;padding:6px 14px;
  background:#f5f7fa;color:#666;
  border-radius:18px;cursor:pointer;
  transition:all .2s;border:1px solid transparent;
  font-weight:500;
}
.ai-chat-quick span:hover{
  background:rgba(0,160,160,.08);
  color:#00a0a0;border-color:#00a0a0;
}

.ai-chat-input{
  padding:14px 20px;background:#fff;border-top:1px solid #eef1f5;
  display:flex;gap:12px;flex-shrink:0;
}
.ai-chat-input textarea{
  flex:1;border:1px solid #e0e4e8;border-radius:12px;
  padding:10px 14px;font-size:14px;resize:none;
  max-height:100px;min-height:44px;
  font-family:inherit;line-height:1.5;
  transition:border-color .2s;
}
.ai-chat-input textarea:focus{outline:none;border-color:#00a0a0}
.ai-chat-input button{
  width:46px;height:46px;border-radius:50%;
  background:linear-gradient(135deg,#00a0a0,#2563eb);
  color:#fff;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:all .2s;align-self:flex-end;
}
.ai-chat-input button:hover:not(:disabled){transform:scale(1.05);box-shadow:0 4px 12px rgba(0,160,160,.3)}
.ai-chat-input button:disabled{opacity:.5;cursor:not-allowed}
.ai-chat-input button svg{width:18px;height:18px;fill:#fff}

/* AI回复中的产品卡片 */
.ai-product-card{
  margin:12px 0;padding:14px;
  border:1px solid #eef1f5;
  border-radius:12px;
  background:#fafbfc;
  display:flex;gap:12px;
  transition:all .25s;
  cursor:pointer !important;
  position:relative;
  z-index:10;
  pointer-events:auto !important;
}
.ai-product-card:hover{
  border-color:#00a0a0;
  background:#fff;
  transform:translateX(4px);
  box-shadow:0 4px 12px rgba(0,160,160,.12);
}
.ai-product-card .pcard-img{
  width:70px;height:70px;flex-shrink:0;
  border-radius:10px;
  background:linear-gradient(135deg,#e6f7f7,#e8f0fe);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.ai-product-card .pcard-img img{width:100%;height:100%;object-fit:cover}
.ai-product-card .pcard-info{flex:1;min-width:0}
.ai-product-card .pcard-name{
  font-size:13px;font-weight:700;color:#0a1929;
  margin-bottom:4px;line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden;
}
.ai-product-card .pcard-desc{
  font-size:12px;color:#999;
  line-height:1.5;margin-bottom:6px;
  display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden;
}
.ai-product-card .pcard-tags{display:flex;flex-wrap:wrap;gap:4px}
.ai-product-card .pcard-tag{
  font-size:10px;padding:2px 7px;
  background:rgba(0,160,160,.1);color:#00a0a0;
  border-radius:6px;font-weight:600;
}
.ai-product-card .pcard-arrow{
  display:flex;align-items:center;
  color:#00a0a0;font-size:11px;font-weight:700;
  flex-shrink:0;
}
.ai-product-card .pcard-arrow svg{width:14px;height:14px;fill:#00a0a0;margin-left:2px}

/* 手机端 */
@media(max-width:600px){
  .ai-chat-fab{width:56px;height:56px;right:16px;bottom:16px}
  .ai-chat-panel{
    left:0;right:0;top:0;bottom:0;
    width:100%;height:100%;
    max-width:100%;max-height:100%;
    border-radius:0;
    transform:translateY(100%) scale(1);
  }
  .ai-chat-panel.open{
    transform:translateY(0) scale(1);
  }
  .ai-chat-tooltip{display:none}
  .ai-product-card{padding:10px;gap:10px}
  .ai-product-card .pcard-img{width:56px;height:56px}
  .ai-product-card .pcard-name{font-size:12px}
  .ai-product-card .pcard-desc{font-size:11px}
}
