/* 容器样式 */
.chat-prompt-container {
    background-color: #f5f5f5; 
    padding: 15px 20px;
    border-radius: 10px; 
    display: flex; 
    align-items: center; 
    max-width: 100%; 
    margin: 20px 0 30px 0; 
    font-family: sans-serif; 
    box-sizing: border-box;
 font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

/* 头像图片容器 */
.avatar-wrapper {
    margin-right: 15px; 
    flex-shrink: 0; 
}

/* 头像图片样式 - 已更新 */
.avatar {
    width: 70px; /* 头像宽度设置为 70px */
    height: 70px; /* 头像高度设置为 70px */
    border-radius: 50%; /* 实现圆形效果 */
    object-fit: cover; /* 确保图片完整覆盖区域 */
    display: block;
}

/* 文本内容样式 */
.message-content {
    font-size: 16px;
    line-height: 1.5;
    color: #333; 
    flex-grow: 1; 
    min-width: 0; 
}

/* 超链接样式 */
.message-content a {
    color: #0f403f; 
    text-decoration: underline; 
    white-space: nowrap; 
}

/* 移动端优化 (可选) */
@media (max-width: 600px) {
    .chat-prompt-container {
        padding: 10px 15px;
    }
    .avatar {
        width: 50px; /* 在小屏幕上头像可以适当缩小 */
        height: 50px;
    }
    .message-content {
        font-size: 14px; 
    }
}

/* 【新增】自定义样式以适应原始布局的调整 */
.story-image-with-caption {
    /* 确保图片和文字是垂直堆叠的 */
    display: flex;
    flex-direction: column;
    align-items: center; /* 确保内容居中 */
    text-align: center; /* 确保文字居中 */
}

.caption-text {
    /* 调整下方的文字样式，使其更贴近原图上的位置 */
    font-size: 16px; 
    line-height: 1.5;
    color: #333; /* 靠近黑色 */
    margin-top: 10px; /* 增加与图片的间距 */
    /* 关键：确保在 PC 布局下，这个文本块不会影响图片在 flex 容器中的宽度分配 */
    width: 100%; 
    max-width: 90%; 
    padding: 0 5%;
}

/* 覆盖 .story-image 样式以确保图片不会太大 */
.story-image {
    width: 85%;
    height: auto;
    object-fit: cover;
    /* 移除自动边距，让图片在它的容器中居中 */
    margin-left: auto;
    margin-right: auto;
    display: block;
}

/* 响应式调整 */
@media (max-width: 768px) {
    .story-image-with-caption {
        /* 在移动端，图片和描述文字的宽度都应是 100% */
        align-items: flex-start;
        text-align: left;
    }
    .caption-text {
        width: 100%;
        max-width: 100%;
        padding: 0;
        margin-bottom: 20px;
    }
    .story-image {
        width: 100%; /* 移动端图片 100% 宽度 */
        margin: 0;
    }
}