/* CrediVita Live Chat - widget styles (v2)
   v2: 修复消息区滚动(min-height:0) + 新增放大模式 + Firefox滚动条 + iOS惯性滚动 */
#cv_chat_root { font-family: "Segoe UI", Arial, sans-serif; }

/* 右下角浮动按钮 */
#cv_chat_btn {
    position: fixed; right: 20px; bottom: 20px; z-index: 9999;
    width: 56px; height: 56px; border-radius: 50%;
    background: #1a6dd4; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 16px rgba(26, 109, 212, .45);
    transition: transform .15s ease;
}
#cv_chat_btn:hover { transform: scale(1.08); }

/* 未读红点 */
#cv_chat_badge {
    position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px;
    background: #dc2626; color: #fff; border-radius: 10px;
    font-size: 12px; line-height: 20px; text-align: center; padding: 0 5px;
    box-shadow: 0 0 0 2px #fff; box-sizing: border-box;
}

/* 聊天面板 */
#cv_chat_panel {
    position: fixed; right: 20px; bottom: 90px; z-index: 9998;
    width: 320px; max-width: calc(100vw - 30px);
    height: 440px; max-height: calc(100vh - 120px);
    background: #fff; border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, .22);
    display: flex; flex-direction: column; overflow: hidden;
}
/* 放大模式（桌面：大窗口） */
#cv_chat_panel.cv_chat_expanded {
    width: min(560px, 94vw);
    height: min(720px, calc(100vh - 110px));
}

/* 头部 */
#cv_chat_header {
    background: #1a6dd4; color: #fff; padding: 12px 14px;
    display: flex; justify-content: space-between; align-items: center;
}
#cv_chat_header_txt { display: flex; flex-direction: column; }
#cv_chat_header strong { font-size: 15px; }
#cv_chat_header span { font-size: 12px; opacity: .85; margin-top: 2px; }
#cv_chat_actions { display: flex; align-items: center; gap: 2px; flex-shrink: 0; }
#cv_chat_expand, #cv_chat_close {
    font-size: 22px; line-height: 1; cursor: pointer; padding: 2px 6px; opacity: .9;
}
#cv_chat_expand svg, #cv_chat_close { display: block; }
#cv_chat_expand:hover, #cv_chat_close:hover { opacity: 1; }

/* 消息区
   v2 关键修复：flex 子项默认 min-height:auto 无法收缩，消息多时会被面板
   overflow:hidden 裁掉且无法滚动；min-height:0 才允许 flex 收缩出滚动条 */
#cv_chat_body {
    flex: 1; min-height: 0; overflow-y: auto; padding: 12px;
    background: #f6f8fb;
    scrollbar-width: thin; scrollbar-color: #d0d7e0 transparent;
    -webkit-overflow-scrolling: touch;
}
#cv_chat_body::-webkit-scrollbar { width: 6px; }
#cv_chat_body::-webkit-scrollbar-thumb { background: #d0d7e0; border-radius: 3px; }

/* 消息气泡 */
.cv_msg { margin-bottom: 10px; max-width: 82%; }
.cv_msg_customer { margin-left: auto; text-align: right; }
.cv_msg_admin { margin-right: auto; text-align: left; }
.cv_msg_bubble {
    display: inline-block; padding: 8px 12px; border-radius: 12px;
    font-size: 13px; line-height: 1.45; word-break: break-word; text-align: left;
    white-space: pre-wrap;
}
.cv_msg_customer .cv_msg_bubble { background: #1a6dd4; color: #fff; border-bottom-right-radius: 4px; }
.cv_msg_admin .cv_msg_bubble { background: #fff; color: #333; border: 1px solid #e5e9ef; border-bottom-left-radius: 4px; }
.cv_msg_time { font-size: 11px; color: #99a1ab; margin-top: 3px; }
.cv_msg_customer .cv_msg_time { text-align: right; }

/* 输入区 */
#cv_chat_inputbar {
    display: flex; gap: 8px; padding: 10px;
    border-top: 1px solid #eef1f5; background: #fff;
}
#cv_chat_input {
    flex: 1; min-width: 0; height: 36px; border: 1px solid #d0d7e0; border-radius: 18px;
    padding: 0 14px; font-size: 13px; outline: none; box-sizing: border-box;
}
#cv_chat_input:focus { border-color: #1a6dd4; }
#cv_chat_send {
    height: 36px; padding: 0 16px; border: 0; border-radius: 18px;
    background: #1a6dd4; color: #fff; font-size: 13px; cursor: pointer;
}
#cv_chat_send:hover { background: #155bb0; }

/* 移动端适配：按钮略小、面板全宽；放大 = 真全屏 */
@media (max-width: 480px) {
    #cv_chat_btn { right: 14px; bottom: 70px; width: 50px; height: 50px; }
    #cv_chat_panel { right: 10px; left: 10px; bottom: 130px; width: auto; height: 420px; }
    #cv_chat_panel.cv_chat_expanded {
        right: 0; left: 0; bottom: 0; width: 100vw; height: 100vh;
        max-width: none; max-height: none; border-radius: 0;
    }
}