@charset "UTF-8";
dl,dd,ul,li {margin:0;padding:0;list-style:none;}
a {text-decoration:none;}
@font-face {
    font-family: "iconfont"; /* Project id 4175895 */
    src: url('../font/iconfont.woff2?t=1690162273896') format('woff2'),
         url('../font/iconfont.woff?t=1690162273896') format('woff'),
         url('../font/iconfont.ttf?t=1690162273896') format('truetype');
  }
 .iconfont{font-family:"iconfont" !important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.icon-chanpin:before{content:"\e622";}.icon-zixun:before{content:"\e708";}.icon-qq:before{content:"\e6b2";}.icon-weixin:before{content:"\e63f";}.icon-weibo:before{content:"\e608";}.icon-huiyuanzhongxin:before{content:"\e619";}.icon-bofang:before{content:"\e61a";}.icon-home:before{content:"\e636";}.icon-xiazai:before{content:"\e659";}.icon-shoucang1:before{content:"\e635";}.icon-dianhua:before{content:"\e603";}.icon-huiyuan:before{content:"\e604";}.icon-tongzhi:before{content:"\e60e";}.icon-youxiang:before{content:"\e610";}.icon-xiangqing:before{content:"\e639";}.icon-user:before{content:"\e76e";}.icon-shopping-cart:before{content:"\e63b";}.icon-back:before{content:"\e67e";}.icon-download:before{content:"\e67f";}.icon-edit:before{content:"\e680";}.icon-check:before{content:"\e681";}.icon-eye:before{content:"\e682";}.icon-bell:before{content:"\e683";}.icon-left:before{content:"\e684";}.icon-right:before{content:"\e685";}.icon-down:before{content:"\e686";}.icon-up-arrow-right:before{content:"\e687";}.icon-image:before{content:"\e688";}.icon-info-circle:before{content:"\e689";}.icon-up-arrow-left:before{content:"\e68a";}.icon-alert-circle:before{content:"\e68b";}.icon-menu:before{content:"\e68c";}.icon-plus-circle:before{content:"\e68d";}.icon-search:before{content:"\e68e";}.icon-pause-circle:before{content:"\e68f";}.icon-paperclip:before{content:"\e690";}.icon-loader:before{content:"\e691";}.icon-star:before{content:"\e692";}.icon-help-circle:before{content:"\e693";}.icon-play-circle:before{content:"\e694";}.icon-upload:before{content:"\e695";}.icon-list:before{content:"\e696";}.icon-rotate-cw:before{content:"\e697";}.icon-map-pin:before{content:"\e698";}.icon-plus:before{content:"\e699";}.icon-icon-up:before{content:"\e69a";}.icon-users:before{content:"\e69b";}.icon-zoom-in:before{content:"\e69c";}.icon-thumbs-up:before{content:"\e69d";}.icon-message:before{content:"\e69f";}.icon-x-circle:before{content:"\e6a0";}.icon-more:before{content:"\e6a1";}.icon-user-check:before{content:"\e6a2";}.icon-x:before{content:"\e6a3";}.icon-clock:before{content:"\e6a4";}.icon-trash:before{content:"\e6a5";}
/* 窗口 */
.ai-chat-box {position:fixed;bottom:20px;right:20px;width:400px;height:580px;background-color:#fff;border-radius:6px;box-shadow:0 5px 20px rgba(0,0,0,0.15);display:flex;flex-direction:column;z-index:9999;overflow:hidden;transition:all 0.3s ease;opacity:0;transform:translateY(20px);pointer-events:none;}
.ai-chat-box.active {opacity:1;transform:translateY(0);pointer-events:all;}
.chat-header {display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background-color:#ff6000;color:#fff;border-top-left-radius:6px;border-top-right-radius:6px;}
.chat-title {font-size:16px;font-weight:500;}
.chat-close {font-size:22px;cursor:pointer;line-height:20px;}
.chat-close:hover {opacity:0.8;}
.chat-body {flex:1;overflow-y:auto;padding:8px;background-color:#f5f5f5;}
.chat-messages {display:flex;flex-direction:column;}
.chat-message {margin-bottom:16px;max-width:100%;display:flex;flex-direction:column;}
.chat-message.user {align-items:flex-end;}
.chat-message.ai {align-items:flex-start;}
.message-wrapper {display:flex;max-width:100%;}
.chat-message.user .message-wrapper {flex-direction:row-reverse;}
.chat-message.user .avatar {margin-right:0;margin-left:8px;}
.chat-message.user .message-content {background-color:#ff6000;color:#fff;}
.chat-footer {display:flex;padding:12px 16px;background-color:#fff;border-top:1px solid #eee;}
#chatInput {flex:1;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;outline:none;transition:border-color 0.3s;}
#chatInput:focus {border-color:#ff6000;}
.chat-send {margin-left:8px;padding:8px 16px;background-color:#ff6000;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color 0.3s;}
.chat-send:hover {background-color:#e55a00;}
.chat-button {position:fixed;bottom:50px;right:60px;width:60px;height:60px;background-color:#ff6000;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,0.15);z-index:9998;transition:all 0.3s ease;}
.chat-button:hover {transform:scale(1.05);box-shadow:0 6px 16px rgba(0,0,0,0.2);}
.chat-button i {font-size:28px;color:#fff;}
/* 折叠列表样式*/
.faq-list {list-style:none;padding:0;margin:0;}
.faq-item {border-bottom:1px solid #eee;}
.faq-title {padding:5px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;background:#ffffff;}
.faq-title:hover {background:#f5f5f5;}
.faq-title::after {content:'+';font-size:18px;transition:transform 0.3s;}
.faq-item.active .faq-title::after {content:'-';}
.faq-content {padding:0;max-height:0;overflow:hidden;transition:max-height 0.3s ease-out;}
.faq-item.active .faq-content {padding:0;max-height:500px;background:#ffffff;}
.sub-item {padding:10px 15px;margin:5px 0;cursor:pointer;}
.sub-item:hover {background:#f9f9f9;}
.chat-message.ai {align-self:flex-start;margin-top:24px;position:relative;max-width:100%;}
.pc-service-left {display:inline-block;height:100%;vertical-align:top;width:38px;position:absolute;left:0;top:0;}
.pc-service-left>img {width:30px;height:30px;border-radius:20px;}
.pc-service-right {padding-left:38px;padding-right:8px;max-width:100%;}
.pc-service-right .message-info span {max-width:200px;overflow:hidden;display:inline-block;text-overflow:ellipsis;vertical-align:top;white-space:nowrap;}
.tl .message-info {text-align:left;}
.tr .message-info {text-align:right;}
.pc-service-right .message-info {font-size:12px;color:#62778C;margin-bottom:5px;height:18px;}
.message-content {display:inline-block;max-width:100%;padding:8px 12px;background-color:#ffffff;color:#28334B;border-radius:4px;white-space:normal;font-size:14px;word-break:break-word;word-wrap:break-word;}
.message-content a {color:#0000ee;}
.message-content p {margin:2px;}
.message-content li {line-height:24px;}
.pc-service-right .nickname {margin-right:10px;}
.common-qustion-title {font-size:14px;line-height:26px;padding:2px  0  0;align-items:center;color:rgba(0,0,0,.85);display:flex;}
.faq-bubble {margin-top:15px;border-top:1px solid #eee;padding-top:15px;}
.faq-bubble-list {list-style:none;}
.faq-bubble-item {margin-bottom:10px;}
.faq-bubble-item a {display:block;padding:8px 12px;background-color:#fff5ee;/* 非常浅的橙色背景*/    border-radius:4px;color:#e8855a;/* 淡橙红色*/    text-decoration:none;font-size:14px;transition:all 0.2s;}
.faq-bubble-item a:hover {background-color:#ffeee5;}
.faq-bubble-title {font-weight:500;margin-bottom:10px;color:#333;}
.common-wel-line {border-bottom:1px solid rgba(0,0,0,.1);padding:2px 0 9px;margin-bottom:10px;}
/* 添加呼吸灯效果 */
@keyframes breathing {
    0% { transform: scale(1); opacity: 0.8; }
    50% { transform: scale(1.1); opacity: 1; }
    100% { transform: scale(1); opacity: 0.8; }
}
.chat-button {animation: breathing 2s ease-in-out infinite;}
.message-content img {width:50%;}
/* 图片放大 */
.ai-image-overlay {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.8);display:flex;justify-content:center;align-items:center;z-index:9999;cursor:pointer;}
.ai-zoomed-image {max-width:90%;max-height:90%;object-fit:contain;}
.ai-zoomable {cursor:pointer;transition:transform 0.2s;}
.ai-zoomable:hover {transform:scale(1.05);}


.typing-indicator{display:flex;align-items:center;padding:10px;}
.typing-indicator span{height:8px;width:8px;background:#90949c;border-radius:50%;margin:0 2px;animation:typing 1s infinite ease-in-out;}
.typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
.typing-indicator span:nth-child(3) { animation-delay: 0.4s; }
@keyframes typing {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.5); }
}

/* 移动端响应式样式 */
@media (max-width: 768px) {
    .ai-chat-box {
        width: calc(100vw - 20px) !important;
        height: calc(100vh - 100px) !important;
        max-width: 350px;
        bottom: 10px !important;
        right: 10px !important;
        left: 10px !important;
        margin: 0 auto;
    }
    
    .chat-button {
        bottom: 20px !important;
        right: 20px !important;
        width: 50px !important;
        height: 50px !important;
    }
    
    .chat-button i {
        font-size: 24px !important;
    }
    
    .chat-header {
        padding: 10px 12px;
    }
    
    .chat-title {
        font-size: 14px;
    }
    
    .chat-footer {
        padding: 8px 12px;
    }
    
    #chatInput {
        font-size: 16px; /* 防止iOS自动缩放 */
    }
    
    .message-content {
        font-size: 13px;
        max-width: 85%;
        word-wrap: break-word;
        word-break: break-word;
    }
    
    .chat-message.user .message-content {
        max-width: 80%;
    }
    
    .chat-message.ai .message-content {
        max-width: 85%;
    }
    
    .pc-service-right .message-info span {
        max-width: 150px;
    }

    .chat-transfer {
        margin-right: 8px;
        font-size: 13px;
    }
}

/* 小屏幕移动端优化 */
@media (max-width: 480px) {
    .ai-chat-box {
        width: calc(100vw - 10px) !important;
        height: calc(100vh - 80px) !important;
        max-width: none;
        bottom: 5px !important;
        right: 5px !important;
        left: 5px !important;
    }
    
    .chat-button {
        bottom: 15px !important;
        right: 15px !important;
        width: 45px !important;
        height: 45px !important;
    }
    
    .chat-button i {
        font-size: 20px !important;
    }
    
    .chat-header {
        padding: 8px 10px;
    }
    
    .chat-title {
        font-size: 13px;
    }
    
    .chat-close {
        font-size: 18px;
    }
    
    .chat-footer {
        padding: 6px 10px;
    }
    
    .chat-send {
        padding: 6px 12px;
        font-size: 13px;
    }
    
    .message-content {
        font-size: 12px;
        padding: 6px 10px;
        max-width: 88%;
        word-wrap: break-word;
        word-break: break-word;
    }
    
    .chat-message.user .message-content {
        max-width: 82%;
    }
    
    .chat-message.ai .message-content {
        max-width: 88%;
    }
    
    .pc-service-right {
        padding-left: 32px;
        padding-right: 4px;
    }

    .chat-transfer {
        margin-right: 6px;
        font-size: 12px;
    }
}

/* 横屏适配 */
@media (max-width: 768px) and (orientation: landscape) {
    .ai-chat-box {
        height: calc(100vh - 60px) !important;
        max-height: 400px;
    }
}

/* 转人工按钮样式 */
.chat-transfer {
    cursor: pointer;
    color: #fff;
    margin-right: 10px;
    font-size: 14px;
}

.chat-transfer:hover {
    opacity: 0.8;
}

/* 客服状态指示器 */
.service-status {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 5px;
}

.service-online {
    background-color: #4CAF50;
}

.service-offline {
    background-color: #F44336;
}



/* 转接消息特殊样式 */
.transfer-message {
    margin: 10px 0;
}

.transfer-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.transfer-content {
    background: #ffffff;
    border-radius: 15px;
    padding: 4px 9px;
    display: flex;
    align-items: center;
    max-width: 300px;
}

.transfer-text {
    color: #666666;
    font-size: 12px;
    text-align: center;
    width: 100%;
}

/* 聊天记录分隔线样式 */
.chat-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 15px auto;
    color: #999;
    font-size: 12px;
    text-align: center;
    width: fit-content;
}

.chat-divider-line {
    width: 50px;
    height: 1px;
    background-color: #ddd;
}

.chat-divider-text {
    margin: 0 10px;
}