/* ============================================================
   平台在线客服页 kefu.css  全屏单聊（复用 chat.css 气泡）
   ============================================================ */
.kefu-page{display:flex;flex-direction:column;height:100vh;height:100dvh;background:#f5f7fb;overflow:hidden}

/* 顶栏 */
.kf-head{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#fff;border-bottom:1px solid var(--border);position:-webkit-sticky;position:sticky;top:0;z-index:5;flex-shrink:0}
.kf-back{width:34px;height:34px;border-radius:50%;background:#f0f3f9;color:var(--primary);font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center;flex-shrink:0;text-decoration:none}
.kf-h-main{flex:1;min-width:0}
.kf-title{font-weight:700;font-size:16px;color:var(--primary);line-height:1.25}
.kf-status{font-size:12px;color:var(--text-2);margin-top:2px;display:flex;align-items:center}
.kf-status .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:5px}
.kf-status.manual .dot{background:var(--gold)}
.kf-human{flex-shrink:0;border:1.5px solid var(--primary);color:var(--primary);background:#fff;border-radius:18px;padding:6px 14px;font-size:13px;font-weight:600;font-family:inherit}
.kf-human:active{background:var(--primary);color:#fff}
.kf-human:disabled{border-color:var(--border);color:var(--text-3);background:#f5f6f8}

/* 消息区 */
.kf-msgs{flex:1;overflow-y:auto;padding:16px 14px;min-height:0}
.kf-msgs .m-row{max-width:86%}
.m-role.bot{background:linear-gradient(135deg,#4a7bd0,#2c4a8c)}
.m-ava.ai{background:linear-gradient(145deg,#3a63b8,#23407e)}

/* 正在输入 */
.kf-typing{display:flex;align-items:center;gap:4px;padding:10px 14px;background:#fff;border-radius:4px 12px 12px;box-shadow:0 1px 3px rgba(20,40,90,.06);width:fit-content}
.kf-typing i{width:6px;height:6px;border-radius:50%;background:#b7c0d2;animation:kfBlink 1.2s infinite}
.kf-typing i:nth-child(2){animation-delay:.2s}
.kf-typing i:nth-child(3){animation-delay:.4s}
@keyframes kfBlink{0%,80%,100%{opacity:.3}40%{opacity:1}}

/* 输入栏 */
.kf-input{display:flex;align-items:flex-end;gap:10px;padding:10px 12px;background:#fff;border-top:1px solid var(--border);padding-bottom:calc(10px + constant(safe-area-inset-bottom,0));padding-bottom:calc(10px + env(safe-area-inset-bottom,0));flex-shrink:0}
.kf-input textarea{flex:1;border:1px solid var(--border);border-radius:10px;padding:9px 13px;resize:none;max-height:110px;line-height:1.5;font-size:14px;background:#fafbfe;font-family:inherit;outline:none}
.kf-input textarea:focus{border-color:var(--primary);background:#fff}
.kf-input button{flex-shrink:0;height:40px;padding:0 22px;border-radius:10px;background:var(--orange-grad);color:#fff;font-weight:700;font-size:14px;border:none;font-family:inherit}
.kf-input button:disabled{opacity:.55}

/* 桌面端居中限宽 */
@media(min-width:769px){
  body{background:#dfe6f2}
  .kefu-page{max-width:760px;margin:0 auto;height:100vh;height:100dvh;box-shadow:0 0 36px rgba(27,48,104,.14)}
}