/* ===========================================================================
 *  AI 客服 · 聊天悬浮窗样式
 *  配色和网站一致（深色底 + 品牌橙）
 * =========================================================================== */

/* ---------------- 悬浮按钮 ---------------- */
.aikf-btn{
  position:fixed; right:22px; bottom:22px; z-index:900;
  width:58px; height:58px; border-radius:50%;
  background:linear-gradient(135deg,#ffb020,#ff7a18);
  box-shadow:0 8px 26px rgba(255,130,20,.42);
  display:grid; place-items:center; cursor:pointer; border:none;
  transition:transform .18s, box-shadow .18s;
  font-size:26px; line-height:1;
}
.aikf-btn:hover{ transform:scale(1.08); box-shadow:0 10px 32px rgba(255,130,20,.55); }
.aikf-btn:active{ transform:scale(.96); }
.aikf-btn.hide{ transform:scale(0); opacity:0; pointer-events:none; }

/* 未读小红点 */
.aikf-dot{
  position:absolute; top:2px; right:2px; width:13px; height:13px;
  background:#ff4d4f; border:2px solid #0b0d12; border-radius:50%;
}
.aikf-dot.hide{ display:none; }

/* ---------------- 面板 ---------------- */
.aikf{
  position:fixed; right:22px; bottom:92px; z-index:901;
  width:374px; height:552px; max-height:calc(100vh - 120px);
  background:#12151d; border:1px solid #262c3a; border-radius:16px;
  box-shadow:0 24px 60px rgba(0,0,0,.6);
  display:none; flex-direction:column; overflow:hidden;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}
.aikf.on{ display:flex; animation:aikfIn .2s ease-out; }
@keyframes aikfIn{ from{opacity:0; transform:translateY(14px) scale(.98);} to{opacity:1; transform:none;} }

/* ---------------- 头部 ---------------- */
.aikf-head{
  display:flex; align-items:center; gap:10px; flex:0 0 auto;
  padding:13px 15px;
  background:linear-gradient(135deg,rgba(255,176,32,.16),rgba(255,122,24,.06));
  border-bottom:1px solid #262c3a;
}
.aikf-avatar{
  width:34px; height:34px; border-radius:10px; flex:0 0 auto;
  background:linear-gradient(140deg,#ffb020,#ff7a18);
  display:grid; place-items:center; font-size:17px;
}
.aikf-title{ flex:1; min-width:0; }
.aikf-title b{ display:block; font-size:14.5px; color:#e8ebf2; }
.aikf-title span{ font-size:11.5px; color:#5f6879; }
.aikf-close{
  width:30px; height:30px; border-radius:8px; border:none; cursor:pointer;
  background:none; color:#8b93a7; font-size:19px; line-height:1;
  display:grid; place-items:center; transition:.15s;
}
.aikf-close:hover{ background:#1e2330; color:#e8ebf2; }

/* ---------------- 消息区 ---------------- */
.aikf-body{
  flex:1; overflow-y:auto; padding:16px 15px 8px;
  display:flex; flex-direction:column; gap:12px;
  scrollbar-width:thin; scrollbar-color:#2a3040 transparent;
}
.aikf-body::-webkit-scrollbar{ width:6px; }
.aikf-body::-webkit-scrollbar-thumb{ background:#2a3040; border-radius:3px; }

.aikf-msg{ display:flex; gap:9px; max-width:100%; }
.aikf-msg.me{ flex-direction:row-reverse; }

.aikf-av{
  width:28px; height:28px; border-radius:9px; flex:0 0 auto;
  display:grid; place-items:center; font-size:14px;
}
.aikf-msg.bot .aikf-av{ background:linear-gradient(140deg,#ffb020,#ff7a18); }
.aikf-msg.me  .aikf-av{ background:#262c3a; color:#8b93a7; }

.aikf-bubble{
  padding:10px 13px; border-radius:13px; font-size:13.5px; line-height:1.72;
  max-width:calc(100% - 46px); word-break:break-word; white-space:pre-wrap;
}
.aikf-msg.bot .aikf-bubble{
  background:#1e2330; color:#e8ebf2;
  border-top-left-radius:4px;
}
.aikf-msg.me .aikf-bubble{
  background:linear-gradient(135deg,#ffb020,#ff7a18); color:#1a1206;
  border-top-right-radius:4px; font-weight:500;
}
.aikf-msg.err .aikf-bubble{
  background:rgba(255,92,92,.12); border:1px solid rgba(255,92,92,.3); color:#ffb3b3;
}

/* 打字动画 */
.aikf-typing{ display:flex; gap:4px; padding:4px 2px; }
.aikf-typing i{
  width:6px; height:6px; border-radius:50%; background:#5f6879;
  animation:aikfBlink 1.3s infinite both;
}
.aikf-typing i:nth-child(2){ animation-delay:.18s; }
.aikf-typing i:nth-child(3){ animation-delay:.36s; }
@keyframes aikfBlink{ 0%,80%,100%{opacity:.25;} 40%{opacity:1;} }

/* ---------------- 快捷问题 ---------------- */
.aikf-chips{
  display:flex; flex-wrap:wrap; gap:7px; padding:0 15px 10px; flex:0 0 auto;
}
.aikf-chip{
  background:#1a1f2b; border:1px solid #2a3040; color:#8b93a7;
  font-size:12px; padding:6px 11px; border-radius:99px; cursor:pointer;
  transition:.15s; font-family:inherit;
}
.aikf-chip:hover{ border-color:#ffb020; color:#ffb020; background:#222836; }
.aikf-chips.hide{ display:none; }

/* ---------------- 输入区 ---------------- */
.aikf-foot{
  flex:0 0 auto; padding:10px 12px 12px;
  border-top:1px solid #262c3a; background:#12151d;
}
.aikf-inputrow{
  display:flex; gap:8px; align-items:flex-end;
  background:#1a1f2b; border:1px solid #2a3040; border-radius:12px;
  padding:6px 6px 6px 13px; transition:.15s;
}
.aikf-inputrow:focus-within{ border-color:#ffb020; }
.aikf-inputrow textarea{
  flex:1; background:none; border:none; outline:none; resize:none;
  color:#e8ebf2; font-size:13.5px; line-height:1.6; font-family:inherit;
  max-height:96px; padding:6px 0;
}
.aikf-inputrow textarea::placeholder{ color:#5f6879; }
.aikf-send{
  width:34px; height:34px; border-radius:9px; border:none; cursor:pointer;
  background:linear-gradient(135deg,#ffb020,#ff7a18); color:#1a1206;
  display:grid; place-items:center; font-size:16px; flex:0 0 auto;
  transition:.15s;
}
.aikf-send:disabled{ opacity:.4; cursor:not-allowed; }
.aikf-send:not(:disabled):hover{ filter:brightness(1.1); }
.aikf-tip{
  text-align:center; font-size:11px; color:#4a5262; margin-top:8px;
}

/* ---------------- 发图 ---------------- */
.aikf-attach{
  width:34px; height:34px; border-radius:9px; border:none; cursor:pointer;
  background:#222836; color:#8b93a7; display:grid; place-items:center;
  font-size:15px; line-height:1; flex:0 0 auto; transition:.15s;
}
.aikf-attach:hover{ background:#2a3040; color:#ffb020; }
.aikf-attach:disabled{ opacity:.4; cursor:not-allowed; }

/* 选好图、还没发出去的预览条 */
.aikf-preview{
  display:flex; align-items:center; gap:9px;
  background:#1a1f2b; border:1px solid #2a3040; border-radius:10px;
  padding:7px 9px; margin-bottom:8px;
}
.aikf-preview.hide{ display:none; }
.aikf-preview img{
  width:46px; height:46px; object-fit:cover; border-radius:7px;
  background:#0b0d12; flex:0 0 auto;
}
.aikf-preview .aikf-pv-txt{
  flex:1; min-width:0; font-size:11.5px; color:#8b93a7; line-height:1.5;
  word-break:break-all;
}
.aikf-preview .aikf-pv-x{
  width:24px; height:24px; border-radius:7px; border:none; cursor:pointer;
  background:none; color:#8b93a7; font-size:16px; line-height:1;
  flex:0 0 auto; display:grid; place-items:center; transition:.15s;
}
.aikf-preview .aikf-pv-x:hover{ background:#262c3a; color:#ff8a8a; }

/* 消息气泡里的图片 */
.aikf-bubble .aikf-img{
  display:block; max-width:100%; max-height:210px;
  border-radius:9px; margin-bottom:6px; background:#0b0d12;
}
.aikf-bubble .aikf-img:only-child{ margin-bottom:0; }

/* ---------------- 转人工卡片 ---------------- */
.aikf-ho{
  background:#1a2330; border:1px solid rgba(255,176,32,.35);
  border-top-left-radius:4px;
}
.aikf-ho .aikf-ho-t{
  font-size:12.5px; color:#c8cede; margin-bottom:9px;
}
.aikf-ho .aikf-ho-btn{
  display:block; text-align:center; text-decoration:none;
  background:linear-gradient(135deg,#ffb020,#ff7a18); color:#1a1206;
  font-weight:700; font-size:13.5px; padding:10px 12px; border-radius:10px;
  transition:.15s;
}
.aikf-ho .aikf-ho-btn:hover{ filter:brightness(1.08); }
.aikf-ho .aikf-ho-qq{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  margin-top:9px; font-size:12px; color:#8b93a7;
}
.aikf-ho .aikf-ho-qq b{ color:#e8ebf2; font-size:13px; letter-spacing:.4px; }
.aikf-ho .aikf-copy{
  background:#222836; border:1px solid #2a3040; color:#8b93a7;
  font-size:11px; padding:3px 9px; border-radius:6px; cursor:pointer;
  font-family:inherit; transition:.15s;
}
.aikf-ho .aikf-copy:hover{ border-color:#ffb020; color:#ffb020; }

/* ---------------- 手机上全屏 ---------------- */
@media (max-width:560px){
  .aikf{
    right:0; bottom:0; left:0; top:0; width:auto; height:auto;
    max-height:none; border-radius:0; border:none;
  }
  .aikf-btn{ right:16px; bottom:16px; width:52px; height:52px; font-size:23px; }
}