/* 整体容器样式 */
.service-rating {
  width: 300px; background:#FFF; padding:10px;
  margin: 15px 5px 5px 5px ;  
  font-family: "Microsoft Yahei", sans-serif;
}

/* 综合服务区域样式 */
.overall {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.overall h2 {
  font-size: 20px;
  margin-right: 20px;
}

/* 星星样式 */
.stars {
  display: flex;
}

.star {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff5722' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") no-repeat center;
  background-size: contain;
  margin-right: 5px;
}

.star.full {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ff5722' stroke='%23ff5722' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") no-repeat center;
  background-size: contain;
}
.star.half {
  background: linear-gradient(
    to right, 
    #ff5722 50%, /* 左半部分红色 */
    #e0e0e0 50%  /* 右半部分灰色（与空心星一致） */
  );
  /* 保持星星形状（通过 mask 或背景图裁剪，这里复用 SVG 结构） */
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff5722' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") no-repeat center;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff5722' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") no-repeat center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
/* 描述文字样式 */
.desc {
  font-size: 14px;
  color: #666;
  margin-bottom: 15px;
}

/* 单项评分项样式 */
.item {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.label {
  display: inline-block;
  width: 80px;
  font-size: 14px;
  margin-right: 10px;
}

/* 进度条容器样式 */
.progress-bar {
  flex: 1;
  height: 10px;
  background-color: #e0e0e0;
  border-radius: 5px;
  overflow: hidden;
}

/* 进度条填充样式 */
.progress {
  height: 100%;
  background-color: #ff5722;
  border-radius: 5px;
}

/* 分值样式 */
.score {
  margin-left: 10px;
  font-size: 14px;
  color: #333;
}