/* ═══════════ 客服 — 升级商务版 ═══════════ */
.chat-container{max-width:720px;margin:0 auto;background:#fff;border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;height:65vh;box-shadow:var(--shadow-card);border:1px solid rgba(10,42,94,.04)}
.chat-header{padding:18px 24px;background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;font-weight:600;display:flex;align-items:center;gap:12px;font-size:16px;letter-spacing:-.01em}
.chat-header .icon{font-size:20px}
.chat-messages{flex:1;overflow-y:auto;padding:24px 24px 40px;display:flex;flex-direction:column;gap:14px;background:linear-gradient(180deg,#f8fafc,#fff)}
.chat-msg{max-width:78%;padding:12px 18px;border-radius:var(--radius-md);font-size:14px;line-height:1.8;transition:all .2s var(--ease-out-quart)}
.chat-msg.user{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;align-self:flex-end;border-bottom-right-radius:4px;box-shadow:0 4px 16px rgba(10,42,94,.15)}
.chat-msg.bot{background:#fff;color:var(--text);align-self:flex-start;border-bottom-left-radius:4px;box-shadow:var(--shadow);border:1px solid rgba(10,42,94,.04)}
.chat-msg.bot:hover{box-shadow:var(--shadow-md)}
.chat-input-area{display:flex;padding:14px 20px;border-top:1px solid rgba(0,0,0,.04);gap:10px;background:#fff}
.chat-input-area input{flex:1;padding:12px 20px;background:#f8fafc;border:1.5px solid rgba(0,0,0,.06);border-radius:var(--radius-xl);color:var(--text);font-size:14px;outline:none;transition:all .2s var(--ease-out-quart)}
.chat-input-area input:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,175,55,.1);background:#fff}
.chat-input-area button{padding:12px 28px;background:linear-gradient(135deg,var(--gold),var(--gold2));border:none;border-radius:var(--radius-xl);color:var(--navy);font-weight:600;cursor:pointer;transition:all .2s var(--ease-out-quart);box-shadow:0 2px 8px rgba(212,175,55,.3)}
.chat-input-area button:hover{box-shadow:0 4px 16px rgba(212,175,55,.4);transform:translateY(-1px)}
.chat-input-area button:active{transform:translateY(0)}
/* ═══════════ 客服侧边栏 ═══════════ */
.chat-sidebar{width:360px;background:#fff;border-left:1px solid rgba(0,0,0,.04);display:flex;flex-direction:column;overflow-y:auto;flex-shrink:0}
.chat-sidebar-tabs{display:flex;border-bottom:2px solid rgba(0,0,0,.04);padding:0 4px}
.cstab{flex:1;padding:14px 12px;border:none;background:none;font-size:13px;cursor:pointer;color:var(--text2);border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s var(--ease-out-quart);font-weight:500}
.cstab:hover{color:var(--navy)}
.cstab.active{color:var(--navy);border-bottom-color:var(--gold);font-weight:600}
.chat-suggestions{display:flex;flex-wrap:wrap;gap:8px;padding:8px 0}
.chat-chip{padding:8px 16px;background:#fff;border:1.5px solid rgba(0,0,0,.06);border-radius:var(--radius-pill);font-size:12px;color:var(--blue);cursor:pointer;transition:all .2s var(--ease-out-quart);font-weight:500}
.chat-chip:hover{background:linear-gradient(135deg,var(--gold),var(--gold2));color:var(--navy);border-color:transparent;box-shadow:0 2px 8px rgba(212,175,55,.3);transform:translateY(-1px)}
@media(max-width:900px){
  .chat-sidebar{width:100%;border-left:none;border-top:1px solid rgba(0,0,0,.04)}
}