/* 移动端聊天界面样式 */
@media screen and (max-width: 768px) {
    /* 聊天区域容器 */
    .chat-area {
        padding: 15px 10px;  /* 减小容器内边距 */
        margin: 5px;
        border: 1px solid #8B4513;
        border-radius: 8px;
        position: relative;
        overflow: hidden;
        background-color: #2C1810;
    }

    /* 聊天区域装饰边框 */
    .chat-area::before {
        content: '';
        position: absolute;
        top: 8px;
        left: 8px;
        right: 8px;
        bottom: 8px;
        border: 1px solid #D2B48C;
        pointer-events: none;
        z-index: 0;
        border-radius: 6px;
    }

    /* 消息容器 */
    #messageContainer {
        padding: 5px;  /* 减小内边距 */
        margin: 0;
        height: calc(100% - 10px);
        overflow-y: auto;
        overflow-x: hidden;
        position: relative;
        z-index: 1;
    }

    /* AI消息气泡（包括思考过程和回复） */
    .ai-message,
    .reasoning-message {
        width: 85%;
        margin: 8px 8px;  /* 修改为8px的左右边距 */
        padding: 10px 12px;
        box-sizing: border-box;
        max-width: calc(100% - 16px);  /* 调整最大宽度以适应新的边距 */
        position: relative;
        left: 0;
        background-color: rgba(255, 245, 230, 0.95);
        border: 1px solid #D2B48C;
        border-radius: 0 8px 8px 8px;
    }

    /* 用户消息气泡 */
    .user-message {
        width: 85%;
        margin: 8px 8px 8px auto;  /* 修改为8px的左右边距，保持右对齐 */
        padding: 10px 12px;
        box-sizing: border-box;
        max-width: calc(100% - 16px);  /* 调整最大宽度以适应新的边距 */
        position: relative;
        right: 0;
        background-color: rgba(245, 222, 179, 0.9);
        border: 1px solid #D2B48C;
        border-radius: 8px 0 8px 8px;
    }

    /* 消息内容样式 */
    .message-content {
        padding: 2px 4px;
        font-size: 0.95em;
        line-height: 1.5;
        color: #5C3317;
        text-indent: 2em;  /* 添加首行缩进，2em相当于两个汉字的宽度 */
    }

    /* 输入区域调整 */
    .input-area {
        margin-top: 10px;
        padding: 10px;
        border-top: 1px solid #D2B48C;
        background: #FFF5E6;
        position: relative;
        z-index: 2;
    }

    /* 确保滚动条不影响布局 */
    #messageContainer::-webkit-scrollbar {
        width: 4px;
    }

    #messageContainer::-webkit-scrollbar-track {
        background: transparent;
    }

    #messageContainer::-webkit-scrollbar-thumb {
        background-color: rgba(210, 180, 140, 0.5);
        border-radius: 2px;
    }

    /* 医生介绍卡片样式 */
    .doctor-intro {
        padding: 15px;
        background: rgba(255, 245, 230, 0.95);
        border-radius: 8px;
        margin: 10px 0;
    }

    .doctor-intro p,
    .member-description p {
        text-indent: 2em;  /* 段落首行缩进两个汉字的宽度 */
        line-height: 1.6;
        color: #5C3317;
        margin: 8px 0;
    }

    .member-description ul {
        margin-left: 2em;  /* 列表缩进 */
    }
}