*{padding: 0; font-family: 微软雅黑;
    margin: 0;}
#app{
    display: flex;
}
.active {

    display: block;
  
   
}
.leftcla{
    width:100%;
    background: #ffffff;


    position: relative;
    display: flex;

}
.li{
    cursor:pointer;
    height: 60px;
    width: 258px;
    border: white 2px solid;
    border-radius: 10px;
    margin: 0 auto;
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px;
    background-color: white
}
    .li:hover {
        cursor: pointer;
        height: 60px;
        width: 258px;
        border: #066946 2px solid;
        border-radius: 10px;
        margin: 0 auto;
        margin-top: 20px;
        margin-left: 20px;
        margin-right: 20px;
        background-color: #f3f3f3
    }
.onli{
    cursor:pointer;
    height: 60px;
    width: 258px;
    border: #066946 2px solid;
    border-radius: 10px;
    margin: 0 auto;
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px;
    background-color: white
}
.xin {
    font-family: 微软雅黑;
    color: black;
    font-size: 14px;
    width: 30ch; /* 限制文本宽度为约 30 个字符 */
    word-wrap: break-word; /* 支持早期浏览器 */
    overflow-wrap: break-word; /* 现代浏览器推荐使用 */
    overflow: hidden; /* 超出部分隐藏 */
    text-overflow: ellipsis; /* 添加省略号 */
}
.yitiao{font-family: 微软雅黑;color:#b2b2b2;font-size: 10px; margin-top: 6px; margin-left: 12px;}
.time{font-family: 微软雅黑;color:#b2b2b2;font-size: 10px; margin-top: 6px; margin-left: 12px;margin-right: 10px}
.sz{
    font-family: 微软雅黑;
    color:black;
    font-size: 10px;
    width:74px;
    height: 38px;
    background-color: white;
    border-radius: 10px;
    text-align: center;
    margin-left: 1px;
    cursor:pointer;
    display: flex;

}
.sz:hover{
    font-family: 微软雅黑;
    color:black;
    font-size: 10px;
    width:74px;
    height: 38px;
    background-color: #dadada;
    border-radius: 10px;
    text-align: center;
    margin-left: 1px;
    cursor:pointer;
    display: flex;
}
.szupdate {
    font-family: 微软雅黑;
    color: black;
    font-size: 10px;
    width: 88px;
    height: 38px;
    background-color: white;
    border-radius: 10px;
    text-align: center;
    margin-left: 4px;
    cursor: pointer;
    display: flex;
}

.szupdate:hover {
    font-family: 微软雅黑;
    color: black;
    font-size: 10px;
    width: 88px;
    height: 38px;
    background-color: #dadada;
    border-radius: 10px;
    text-align: center;
    margin-left: 4px;
    cursor: pointer;
    display: flex;
}

.szdelete {
    font-family: 微软雅黑;
    color: black;
    font-size: 10px;
    width: 84px;
    height: 38px;
    background-color: white;
    border-radius: 10px;
    text-align: center;
    margin-left: 4px;
    cursor: pointer;
    display: flex;
}

.szdelete:hover {
    font-family: 微软雅黑;
    color: black;
    font-size: 10px;
    width: 84px;
    height: 38px;
    background-color: #dadada;
    border-radius: 10px;
    text-align: center;
    margin-left: 4px;
    cursor: pointer;
    display: flex;
}
.szlt{
    font-family: 微软雅黑;
    color:black;
    font-size: 10px;
    width:70px;
    height: 38px;
    background-color: white;
    border-radius: 10px;
    text-align: center;
    margin-left: 4px;
    cursor:pointer;
    display: flex;

}
.szlt:hover{
    font-family: 微软雅黑;
    color:black;
    font-size: 10px;
    width:70px;
    height: 38px;
    background-color: #dadada;
    border-radius: 10px;
    text-align: center;
    margin-left: 4px;
    cursor:pointer;
    display: flex;
}
.message{

    width:100%;
    background: #ffffff;



}
.tou{
    font-family: 微软雅黑;
    color:black;
    font-size: 10px;
    width:68px;
    height: 38px;
    background-color: #ffffff;
    border-radius: 10px;
    text-align: center;
    margin-right: 20px;
    margin-top: 20px;
    cursor:pointer;
    display: flex;
    border: #dadada 1px solid;

}
.tou:hover{
    font-family: 微软雅黑;
    color:black;
    font-size: 10px;
    width:68px;
    height: 38px;
    background-color: #dadada;
    border-radius: 10px;
    text-align: center;
    margin-left: 20px;
    cursor:pointer;
    display: flex;
}

.multi-line-input {
    display: block;
    width: 300px;
    height: 50px; /* 设置高度为两行 */
    line-height: 25px; /* 每行的高度 */
    white-space: pre-wrap; /* 模拟多行换行效果 */
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
    overflow-y: hidden; /* 禁止滚动条 */
}

.styled-textarea {
    width: 300px; /* 设置宽度 */
    height: auto; /* 高度自动根据行数调整 */
    resize: none; /* 禁止用户调整大小 */
    border: 1px solid #ccc; /* 边框样式 */
    padding: 5px; /* 内边距 */
    font-size: 14px; /* 字体大小 */
    border-radius: 4px; /* 圆角 */
    outline: none; /* 移除聚焦时的默认高亮 */
}

::-webkit-scrollbar {
    width: 7px;
}

::-webkit-scrollbar-track {
    background-color: #f3f3f3;
}

::-webkit-scrollbar-thumb {
    background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb:active {
    background-color: #f5f5f5;
}

.messagetop{
    width: 100%;background-color: #ffffff; height: 66px;display: flex !important;justify-content: space-between !important; border-bottom:1px #ecebeb solid;
}
.messagetoptitle {
    font-size: 20px;
    display: flex;
    justify-content: center; /* 替代 text-align */
    padding-top: 16px;
}
.messagetopnum{font-family: 微软雅黑;color:#b2b2b2;font-size: 10px; margin-top: 6px; margin-left: 12px;margin-left: 20px;}

.messageleftimg{margin-top:20px;margin-left:20px;border-radius: 10px; width:30px;height: 30px;background-color: #effcf6; border: #ecebeb 1px solid}
.messageleftct{display: inline-block;width: auto; height: auto;font-size:14px;padding:20px;margin-top:10px;margin-left:20px;border-radius: 10px;background-color: #f5f5f5; border: #ecebeb 1px solid}
.messagerightct{margin-right:20px;display: inline-block;width: auto; height: auto;font-size:14px;padding:20px;margin-top:10px;margin-left:20px;border-radius: 10px;background-color: #f5f5f5; border: #ecebeb 1px solid}
.answer{outline-color:#64a8b0;height: 136px; position: absolute;width: auto; bottom: 10px; right: 20px; left: 20px;border-radius: 10px; padding: 10px; border: #dadada 1px solid;}
.send{font-size:14px; color:white;padding-top:20px;text-align:center;position: absolute; cursor: pointer; z-index: 100;bottom: 30px; right: 40px;width:83px;height: 39px;background-color: #4e838b; border: #ecebeb 1px solid;border-radius: 10px;}