/* pages/MainTest/MainTest.wxss */
/* pages/wechat2/wechat2.wxss */
.slide{
  display: flex;
  width: 100%;
  height: 90%;
}
.tab {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #e8edf7;
}

.tab-item {
  flex: 1;
  text-align: center;
  padding: 10rpx;
  font-size: 50rpx;
  color: #1f1919;
  cursor: pointer;
}

.tab-item.active {
  color: #2eaa23;
  font-weight: bold;
  border-bottom: 2rpx solid #333333;
}

.show_information {
  width: 90%;
  margin: 20rpx auto;
  padding: 20rpx;
  background-color: #83acc4;
  border-radius: 25rpx;
  box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.1);
}

.search-wrapper {
  box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1); /* 设置阴影 */
  padding: 10px; /* 设置内边距 */
}

.search-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff; /* 设置背景色 */
  border-radius: 5px; /* 设置圆角 */
  padding: 10px; /* 设置内边距 */
}

.search-input {
  margin-right: 10px;
  border: none; /* 去掉输入框默认边框 */
  outline: none; /* 去掉获得焦点时的虚线框 */
}

.search-button {
  background-color: #838fa3; /* 设置按钮背景色 */
  color: #fff; /* 设置按钮文字颜色 */
  border: none; /* 去掉按钮默认边框 */
  border-radius: 5px; /* 设置按钮圆角 */
  padding: 1px 0px; /* 设置按钮内边距 */
  width: 2px;
}

.content-container {
  display: flex;
  align-items: center;
}

.image {
  width: 25%;
  height: 160rpx;
  object-fit: cover;
  border-radius: 10rpx 0 0 10rpx;
  align-self: flex-start;
  /* border: 2rpx solid #ccc; 添加框线样式  
  丑的一比，下次不要加了*/
}


.text-container {
  flex: 1;
  padding: 20rpx;
}

.title {
  font-size: 32rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 10rpx;
}

.description {
  font-size: 28rpx;
  color: #666;
  line-height: 1.5;
}

.button-container {
  display: flex;
  /* justify-content: space-between; */
  margin-top: 20rpx;
}

.button {
  /* flex: 1; */
  background-color: #48477c;
  color: #fff;
  font-size: 28rpx;
  padding: 10rpx;
  border-radius: 8rpx;
  text-align: center;
  /* margin-right: 10rpx; */
}

.button-wrapper {
  display: flex;
  justify-content: space-between;
}

button {
  background-color: #838fa3;
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 10px 20px;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); /* 设置阴影 */
}


.custom-button {
  padding: 10px 20px;
  background-color: #007bff;
  color: #fff;
  border: none;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
}

.custom-button:hover {
  background-color: #0056b3;
}

.cover{
  background-color: #f1f1f1;
  text-align: center;
  padding: 10rpx;
}
.app{
  width: 160rpx;
  height: 160rpx;
}
.title{
  font-weight: 500;
  color: #000;
  font-size: 44rpx;
  margin: 50rpx 32rpx;
}
.desc{
  font-weight: 500;
  color: #000;
  font-size: 44rpx;
  margin: 50rpx 32rpx;
}
.form-box {
  border: 1px solid #ccc;
  padding: 20rpx;
  box-shadow: 3 2rpx 4rpx rgba(0.5, 0.6, 0.6, 0.2);
}
.form-group {
  margin-bottom: 20rpx;
  box-shadow: 3 2rpx 4rpx rgba(0.5, 0.6, 0.6, 0.2);
}
.btn-submit {
  display: block;
  width: 200rpx;
  margin: 0 auto;
  padding: 10rpx 20rpx;
  background-color: #51d14c;
  color: #fff;
  border-radius: 4rpx;
  font-size: 32rpx;
  text-align: center;
}
.btn-back{
  display: block;
  width: 200rpx;
  margin: 0 auto;
  padding: 10rpx 20rpx;
  background-color: #2399f1;
  color: #fff;
  border-radius: 4rpx;
  font-size: 32rpx;
  text-align: center;
}
page { 
  background-color: #f3f3f4; 
 } 

.content {
  margin-top: 20rpx;
}

 .btn-choose {
  /* 选择按钮样式 */
  display: block;
  width: 200rpx;
  height: 60rpx;
  background-color: #4CAF50;
  color: #fff;
  border-radius: 6rpx;
  margin-top: 20rpx;
  text-align: center;
  line-height: 60rpx;
}

.btn-next {
  /* 下一个按钮样式 */
  display: block;
  width: 200rpx;
  height: 60rpx;
  background-color: #2196F3;
  color: #fff;
  border-radius: 6rpx;
  margin-top: 10rpx;
  text-align: center;
  line-height: 60rpx;
}
 /* 新增样式 */
 .chat-header {
   display: flex;
   align-items: center;
   justify-content: flex-start;
   height: 88px;
   padding: 0 12px;
   background-color: #fff;
   border-radius: 0px 0px 10px 10px;
 }

 .header-image-box {
   width: 64px;
   height: 64px;
   border-radius: 50%;
   margin-right: 12px;
 }

 .header-image {
   width: 100%;
   height: 100%;
   border-radius: 50%;
 }

 .chat-name {
   color: #333;
   font-size: 16px;
   font-weight: 700;
 }

 .chat-company {
  font-size: 14px;
  color: rgba(81, 81, 81, 100);
 }
 .jia_img{ 
  height: 80rpx; 
  width: 90rpx; 
 } 
 .new_imgtent{ 
  height: 180rpx; 
  width: 190rpx; 
 } 

 
 .xiahuaxia { 
  width: 80%; 
  text-align: center; 
  margin: 0 auto; 
  position: relative; 
  top: 60rpx; 
 } 
 
 .chat-time { 
  text-align: center; 
  padding: 5rpx 20rpx 5rpx 20rpx; 
  width: 200rpx; 
  font-size: 26rpx; 
  background-color: #e6e6e6; 
 } 
 
 .new_top_txt { 
  width: 50%; 
  position: relative; 
  top: 38rpx; 
  text-align: center; 
  margin: 0 auto; 
  font-size: 30rpx; 
  color: #787878; 
  background-color: #f7f7f7; 
 } 
 
 /* 聊天内容 */ 
 
 .news { 
  margin-top: 30px; 
  text-align: center; 
  margin-bottom: 98px; 
 } 
 
 .img_null { 
  height: 60rpx; 
 } 
 
 .l { 
  height: 5rpx; 
  width: 20%; 
  margin-top: 30rpx; 
  color: #000; 
 } 
 
 /* 聊天 */ 
 
 .my_right { 
  float: right; 
  position: relative; 
  right: 40rpx; 
 } 
 
 .you_left { 
  float: left; 
  position: relative; 
  left: 5rpx; 
 } 
 
 .new_img { 
  width: 100rpx; 
  height: 100rpx; 
  border-radius: 50%; 
 } 
 
 .sanjiao { 
  top: 20rpx; 
  position: relative; 
  width: 0px; 
  height: 0px; 
  border-width: 10px; 
  border-style: solid; 
 } 
 
 .my { 
  border-color: transparent transparent transparent #95d4ff; 
 } 
 
 .you { 
  border-color: transparent #95d4ff transparent transparent; 
 } 
 
 .sendmessage { 
   /* display: flex;
   align-items: center;
  flex-direction: row; */
  width: 100%; 
  min-height: 60px;
  position: fixed; 
  bottom: 0px; 
  padding: 0 16px;
  background-color: rgba(242, 242, 242, 100); 
  box-shadow: 0px -1px 5px 1px rgba(57, 57, 57, 0.1);
 } 

 .send-message {
  display: flex;
  align-items: center;
  padding: 16px;
 }
 
 .sendmessage input { 
  height: 80rpx; 
  background-color: white; 
  line-height: 80rpx; 
  font-size: 28rpx; 
  padding-left: 20rpx; 
 } 
 
 .sendmessage button { 
  width: 52px !important; 
  height: 32px; 
  line-height: 32px;
  background: #169171 !important; 
  color: #fff !important; 
  font-size: 14px !important;
  text-align: center;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
 } 
 
 .historycon { 
  height: 90%; 
  /* background-color: pink; */
  width: 100%; 
  flex-direction: column; 
  display: flex; 
  /* margin-top: 100rpx;  */
  border-top: 0px; 
 } 
 .hei{ 
  margin-top: 50px; 
  height: 20rpx; 
 } 
 .history { 
  /* height: 300px;  */
  margin-top: 30rpx; 
  margin: 20rpx; 
  font-size: 28rpx; 
  line-height: 80rpx; 
  word-break: break-all; 
 } 
 .chat-input{
   width: 60%;
   height: 40px;
   border: 0;
   border-radius: 8px;
   margin-left: 5rpx;
 }

 .back-icon{
  margin-top: 25rpx;
  margin-left: 25rpx; 
  width:40rpx;
  height:40rpx;
 }
 .other-record-content{
  background-color: #fff;
  width: 180px; 
  border-radius: 7px; 
  padding: 0 20px;
  text-align: left;
  margin: 6px 0;
 }
 .other-record{
 
  display: flex;
  justify-content:flex-start;
 }
 .other-head-img{
  width:70rpx;
  height:70rpx;
  border-radius: 50%;
  margin: 10rpx 10rpx 10rpx 10rpx;
 }
 .other-record-content-triangle{ 
 width: 0; 
 height: 0; 
 border-top: 10rpx solid transparent; 
 border-right: 15rpx solid #fff; 
 border-bottom: 10rpx solid transparent;
 margin-top: 36rpx; 
 }
 .own-record{
  display: flex;
  justify-content:flex-end;
  padding-right:30rpx; 
 }
 .own-record-content{
  background-color: #209072;
  width: 180px; 
  border-radius: 8px; 
  padding: 0 20px;
  color: #fff;
  text-align: left;
  margin: 6px 0;
 }
 .own-record-content-triangle { 
 width: 0; 
 height: 0; 
 /* border-top: 20rpx solid transparent; 
 border-left: 40rpx solid #F0F0F0; 
 border-bottom: 20rpx solid transparent;  */
 border-top: 10rpx solid transparent; 
 border-left: 15rpx solid #209072; 
 border-bottom: 10rpx solid transparent; 
 margin-top: 36rpx; 
 }
 .own-head-img{
  width:70rpx;
  height:70rpx;
  border-radius: 50%;
  margin: 10rpx 10rpx 10rpx 10rpx;
 }
 ::-webkit-scrollbar{
  width: 0;
  height: 0;
  color: transparent;
 }

 .chat-emotion {
   width: 28px;
   height: 28px;
   margin: 0 12px;
 }

 .emotions {
   display: flex;
   align-items: flex-start;
   justify-content: flex-start;
   width: 200px;
   height: 36px;
   margin: 6px;
 }

 .emotions-item {
   width: 24px;
   height: 24px;
   margin: 0 8px;
 }

 .historyText {
   color: #ccc;
 }

 .add-button {
  position: fixed;
  bottom: 20rpx;
  right: 20rpx;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: #8a727a;
  z-index: 999; 
}

.add-button image {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.popup {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 20rpx;
  border-radius: 10rpx;
}