/* 智能客服挂件。右下角固定，不遮挡正文，窄屏铺满。 */

.ai-chat {
    position: fixed;
    /* 原来这里让开 78px，是为了躲右侧那条漂浮客服栏。那条栏撤掉了，位置收回来。 */
    right: 18px;
    bottom: 90px;   /* 让开「回到顶部」那一列 */
    z-index: 900;   /* 低于弹窗（modal 是 1050），别盖住「我有类似需求」 */
}

.ai-chat-toggle {
    display: block;
    padding: 10px 16px;
    border: none;
    border-radius: 22px;
    background: #40c641;
    color: #fff;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
}

    .ai-chat-toggle:hover { background: #35ad36; }
    .ai-chat-toggle i { margin-right: 6px; }

.ai-chat-panel {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 340px;
    background: #fff;
    border: 1px solid #e3e8ee;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .16);
    overflow: hidden;
}

.ai-chat-head {
    padding: 10px 12px;
    background: #40c641;
    color: #fff;
}

.ai-chat-title { font-size: 14px; }

.ai-chat-close {
    float: right;
    border: none;
    background: none;
    color: #fff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    padding: 0 2px;
}

/* 详情页里提示「正在就哪个项目提问」——不写清楚的话，
   用户不知道机器人到底知不知道他在看什么 */
.ai-chat-context {
    padding: 6px 12px;
    background: #f3faf3;
    border-bottom: 1px solid #e6f2e6;
    font-size: 12px;
    color: #4a6b4a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ai-chat-body {
    height: 300px;
    overflow-y: auto;
    padding: 12px;
    background: #fafbfc;
}

.ai-chat-msg {
    margin-bottom: 10px;
    padding: 8px 10px;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.6;
    word-break: break-word;
    white-space: pre-wrap;   /* 模型回答里的换行要保留 */
}

.ai-chat-bot { background: #fff; border: 1px solid #eceff3; color: #333; }

.ai-chat-me {
    background: #40c641;
    color: #fff;
    margin-left: 40px;
}

.ai-chat-err { background: #fff4f4; border: 1px solid #f3d6d6; color: #a94442; }

/* 引导问题气泡。
   在输入框上方、聊天区下方，不跟着聊天区滚 —— 它是「下一步可以问什么」，
   往回翻历史的时候它得还在原地。 */
.ai-chat-tips {
    padding: 0 8px;
    line-height: 0;
}

    .ai-chat-tips:not(:empty) { padding-top: 8px; }

.ai-chat-tipbtn {
    display: inline-block;
    max-width: 100%;
    margin: 0 6px 6px 0;
    padding: 5px 10px;
    border: 1px solid #d7e8d7;
    border-radius: 12px;
    background: #f6fbf6;
    color: #2f8f30;
    font-size: 12px;
    line-height: 1.4;
    cursor: pointer;
    /* 问题偶尔会比气泡宽，让它换行而不是横向撑破面板 */
    white-space: normal;
    text-align: left;
    box-sizing: border-box;
}

    .ai-chat-tipbtn:hover { background: #ecf7ec; border-color: #bcdcbc; }

    /* 「找真人」不是又一个问题，别让它和问题气泡长得一样 */
    .ai-chat-tipbtn-human {
        border-color: #e2d8bd;
        background: #fdf9ee;
        color: #96721f;
    }

        .ai-chat-tipbtn-human:hover { background: #f8f0dc; border-color: #d9c99f; }

/* 项目卡片。整块都是服务端查库查出来的真项目，点进去就是详情页 */
.ai-chat-codes { margin: 0 0 8px; }

.ai-chat-code {
    display: block;
    margin-bottom: 6px;
    padding: 8px 10px;
    border: 1px solid #e3e8ee;
    border-radius: 6px;
    background: #fff;
    text-decoration: none;
    color: #333;
}

    .ai-chat-code:hover { border-color: #bcdcbc; background: #f8fcf8; text-decoration: none; }

    .ai-chat-code b {
        display: block;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.4;
        color: #2f6f2f;
    }

    .ai-chat-code span {
        display: block;
        margin-top: 2px;
        font-size: 12px;
        color: #889;
        line-height: 1.4;
    }

    .ai-chat-code em {
        display: inline-block;
        margin-top: 4px;
        padding: 1px 6px;
        border-radius: 8px;
        background: #f0f5f0;
        font-size: 11px;
        font-style: normal;
        color: #5a8f5a;
    }

/* 对话里的留资表单 */
.ai-chat-lead {
    margin-bottom: 8px;
    padding: 10px;
    border: 1px solid #e0e6ee;
    border-radius: 8px;
    background: #fafbfc;
}

.ai-chat-lead-row { display: flex; gap: 6px; margin-bottom: 6px; }

    .ai-chat-lead-row > input,
    .ai-chat-lead-row > select,
    .ai-chat-lead-row > textarea {
        flex: 1 1 auto;
        min-width: 0;   /* 不写这条，flex 子项会被内容撑出容器 */
        border: 1px solid #dfe4ea;
        border-radius: 4px;
        padding: 5px 7px;
        font-size: 12px;
        box-sizing: border-box;
    }

    .ai-chat-lead-row > select.lead-honorific { flex: 0 0 72px; }

    .ai-chat-lead-row > textarea { resize: none; line-height: 1.5; }

    .ai-chat-lead-row > .lead-sendsms {
        flex: 0 0 auto;
        border: 1px solid #d7e8d7;
        border-radius: 4px;
        background: #f6fbf6;
        color: #2f8f30;
        font-size: 12px;
        padding: 0 8px;
        cursor: pointer;
    }

        .ai-chat-lead-row > .lead-sendsms[disabled] { background: #f2f4f6; color: #aab; cursor: not-allowed; }

.ai-chat-lead .lead-submit {
    display: block;
    width: 100%;
    padding: 7px 0;
    border: none;
    border-radius: 4px;
    background: #40c641;
    color: #fff;
    font-size: 13px;
    cursor: pointer;
}

    .ai-chat-lead .lead-submit[disabled] { background: #f2f4f6; color: #aab; cursor: not-allowed; }

/* 报错默认藏起来，不然表单顶上永远空着一行 */
.ai-chat-lead-err {
    display: none;
    margin-bottom: 6px;
    padding: 5px 7px;
    border-radius: 4px;
    background: #fff4f4;
    color: #a94442;
    font-size: 12px;
    line-height: 1.5;
}

.ai-chat-lead-tip { margin: 6px 0 0; font-size: 11px; color: #99a; line-height: 1.5; }

.ai-chat-foot { padding: 8px; border-top: 1px solid #eceff3; }

.ai-chat-input {
    width: 100%;
    border: 1px solid #dfe4ea;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 13px;
    resize: none;
    box-sizing: border-box;
}

.ai-chat-send {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 7px 0;
    border: none;
    border-radius: 4px;
    background: #40c641;
    color: #fff;
    font-size: 13px;
    cursor: pointer;
}

    .ai-chat-send[disabled] {
        background: #f2f4f6;
        color: #aab;
        cursor: not-allowed;
    }

/* AI 生成的免责说明必须一直看得见，不能折叠起来 */
.ai-chat-tip {
    padding: 0 8px 8px;
    font-size: 11px;
    color: #99a;
    line-height: 1.5;
}

    /* 「转人工」跟免责说明放一行：那句话说「以人工确认为准」，
       紧接着就得给得出人工在哪，否则它只是一句免责 */
    .ai-chat-human {
        float: right;
        margin-left: 8px;
        color: #2f8f30;
        text-decoration: none;
    }

        .ai-chat-human:hover { text-decoration: underline; }

.ai-chat-tip::after { content: ""; display: block; clear: both; }

@media (max-width: 640px) {
    /* 窄屏上那条竖栏本来就挤，铺满时不用再给它让位 */
    .ai-chat { right: 10px; bottom: 70px; left: 10px; }

    .ai-chat-panel { width: auto; left: 0; right: 0; }

    .ai-chat-toggle { float: right; }

    .ai-chat-body { height: 46vh; }
}
