@charset "UTF-8";
.kf-service-icon{position:fixed;bottom:40px;right:40px;width:60px;height:60px;background-color:#0088ff;border-radius:50%;display:none;align-items:center;justify-content:center;color:#fff;font-size:24px;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,0.2);z-index:9999}
.kf-service-popup{position:fixed;bottom:60px;right:20px;width:400px;max-width:90vw;background:#fff;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.15);z-index:10001;overflow:hidden;display:none}
.kf-service-popup .popup-header{background:#0088ff;color:#fff;padding:12px 15px;display:flex;align-items:center;justify-content:space-between}
.kf-service-popup .popup-header-left{display:flex;align-items:center;gap:10px}
.kf-service-popup .header-avatar{width:36px;height:36px;border-radius:50%;overflow:hidden;border:2px solid #fff}
.kf-service-popup .header-avatar img{width:100%;height:100%;object-fit:cover}
.kf-service-popup .header-info{line-height:1.2}
.kf-service-popup .header-name{font-size:15px;font-weight:bold}
.kf-service-popup .header-job{font-size:12px;opacity:0.9}
.kf-service-popup .close-btn{width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background 0.2s}
.kf-service-popup .close-btn:hover{background:rgba(255,255,255,0.4)}
.kf-service-popup .chat-content{height:434px;padding:25px 15px;background:#f7f7f7;overflow-y:auto}
.kf-service-popup .message{margin-bottom:30px;max-width:80%;line-height:1.4}
.kf-service-popup .kf-service-message{display:flex;gap:8px}
.kf-service-popup .kf-service-avatar{width:32px;height:32px;border-radius:50%;overflow:hidden;flex-shrink:0}
.kf-service-popup .kf-service-avatar img{width:100%;height:100%;object-fit:cover}
.kf-service-popup .message-bubble{background:#fff;padding:8px 12px;border-radius:10px 10px 10px 0;box-shadow:0 1px 2px rgba(0,0,0,0.05)}
.kf-service-popup .user-message{margin-left:auto}
.kf-service-popup .user-message .message-bubble{background:#0088ff;color:#fff;border-radius:10px 10px 0 10px}
.kf-service-popup .input-area{display:flex;padding:10px;gap:8px;border-top:1px solid #eee}
.kf-service-popup #message-input{flex:1;border:1px solid #ddd;border-radius:20px;padding:8px 14px;outline:none;font-size:14px}
.kf-service-popup #message-input:focus{border-color:#0088ff}
.kf-service-popup #send-btn{padding:0 16px;background:#0088ff;color:#fff;border:none;border-radius:20px;cursor:pointer;font-size:14px;transition:background 0.2s}
.kf-service-popup #send-btn:hover{background:#0066cc}
@media (max-width:420px){.kf-service-popup{width:90vw}}