@media screen and (max-width: 768px) {
  .container{
    width: 87% !important;
  }
  .service-container{
    width: 85% !important; 
    margin-bottom: 0px !important;
  }
  .aftersale-container{
    width: 84% !important;
  }
  .logistics-container{
    width: 84% !important;
  }
  .comment{
    -webkit-line-clamp: 2 !important;
  }
}
/* 查看状态下 label跟text的颜色对调 */
.view ::v-deep .el-form-item__label {
  color:var(--el-disabled-text-color);
}
.view ::v-deep .el-input.is-disabled .el-input__inner{
  color:  var(--el-text-color-regular);
  -webkit-text-fill-color :var(--el-text-color-regular);
}
.el-row {
  border: 1px solid #ebeef5;
  border-bottom: unset;
}
.el-row:last-child{
  border-bottom: 1px solid #ebeef5;
}

.el-col {
  border-right: 1px solid #ebeef5;
}

.el-form-item {
  margin-bottom: 0;
  height: 100%;
}
::v-deep(.el-form-item--default .el-form-item__label) {
  height: auto;
  min-height: 47px;
  display: flex;
  align-items: center;
  border-right: 1px solid #ebeef5;
}
::v-deep(.el-form-item--default .el-form-item__content) {
  line-height: 47px;
  padding-left: 10px;
  word-break: break-word;
}
.el-descriptions {
  /* margin-top: 30px; */
  overflow-x: auto;
}
.container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 21.1875rem;
  border: 1px solid #ebeef5;
  height: auto;
  padding: 0 16px 16px;
  border-radius: 4px;
  float: left;
  margin: 10px;
  background: white;
}
.rating-title {
    font-weight: bold;
    margin-bottom: 10px;
}
.content {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  align-items: stretch;
}

.content-image {
  border-radius: 4px;
  border: 1px solid #ebeef5;
  margin-right: 10px;
  align-items: center;
  display: flex;
  overflow: hidden; /* 防止图片溢出容器 */
  flex: 1;
}

.image {
  display: flex;
  justify-content: center; /* 水平居中图片 */
  align-items: center; /* 垂直居中图片 */
  overflow: hidden; /* 隐藏超出部分 */
}

.image img {
  display: block; /* 防止图片下方有空隙 */
  max-width: 100%; /* 最大宽度为容器宽度，保持原始比例 */
  max-height: 100%; /* 最大高度为容器高度，保持原始比例 */
  object-fit: contain; /* 保证图片按比例缩放填充，可能会有空白 */
}
.details{
  flex: 2;
}
.details p {
    margin: 5px 0;
}
.comment{
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.service-comment{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.service-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid #ebeef5;
  width: 15rem;
  height: 7.5rem;
  padding: 0 1rem;
  border-radius: 4px;
  float: left;
  margin: 10px;
  background: white;
}
.service-image{margin-right: 10px;}
.service-image img {
  width: 60px;
  height: auto;
  border: 1px solid #ebeef5;
  border-radius: 50%;
}

.aftersale-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 355px;
  border: 1px solid #ebeef5;
  padding: 0 16px 16px;
  border-radius: 4px;
  float: left;
  margin: 10px;
  background: white;

}


.aftersale-comment{
  margin-top:12px !important;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;

}
.logistics-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 15rem;
  padding: 0 16px 16px;
  border: 1px solid #ebeef5;
  height: 180px;
  border-radius: 4px;
  float: left;
  margin: 10px;
  background: white;

}
.logistics-image {
  margin-right: 10px;
}
.logistics-image img {
  width: 100px;
  /* 根据实际情况调整评价图片宽度 */
  height: auto;
  border: 1px solid #ebeef5;
  border-radius: 10px;
}

.logistics-comment {
  margin-top: 12px !important;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* 日志显示 */
::v-deep .el-timeline{
  margin: unset !important;
}
::v-deep .el-timeline-item{
  padding-bottom: 0;
}
::v-deep .el-timeline-item__tail{
  position: absolute;
  left: 21px !important;
  top: -19px !important;
  height: 150% !important;
}
::v-deep .dot-node-style{
  left: 12px !important;
  top: -39px !important;
  position: absolute !important;
}
::v-deep .el-timeline-item__timestamp{
  left: 35px !important;
  top: -22px !important;
}
::v-deep .el-timeline-item__content{
  margin-top: 42px;
  margin-left: 6px;
  padding-right: 15px;
}
::v-deep .el-timeline .el-timeline-right-content::before{
  top: 0px !important;
  left: 18px !important;
}

/* 卡片 */
.mobile-card{
  background-color: white; 
  margin: 1rem;
  padding: 0 1rem;
  border-radius: 0.5rem;
  & ::v-deep .el-row:last-child .el-col:last-child .el-form-item{
    border-bottom: none;
  }
  & ::v-deep .el-form{
    border-bottom: 1px solid #ebeef5;
  }
  & ::v-deep .el-form:last-child{
    border-bottom: none;
  }
  .upload-box{
    display: flex;
    align-items: center;
    padding: .5rem 0;
  }
  .mobile-card-title{
    font-size: 1rem;
    font-weight: 600;
    padding: 1rem 0;
    border-bottom: 1px solid #ebeef5;
  }
}