/* pages/consumptionDetails.wxss */
.consumption {
 margin: 46rpx;
 box-shadow: 0 0 10px #eee;
 padding:40rpx;
 position: relative;
}
.top-ract {
  width: 20rpx;
  height: 60rpx;
  background: rgb(5, 195, 90);
  border-radius:20rpx;
  position: absolute;
  top: 50rpx;
  left: 0;
}
.consumption-top {
  border-bottom: 1px solid #cbcbcb;
  display: flex;
  padding-bottom: 20rpx;
}
.top-order {
  line-height: 50rpx;
  font-size: 28rpx;
  color: #333;
}
.consumption-tips {
  font-size: 21rpx;
  color: #bfbfbf;
  position: absolute;
  bottom: 32rpx;
  left: 35%;
}
.consumption-table {
  min-height: 450rpx;
  padding-bottom: 20rpx;
  box-sizing: border-box;
}
.consumption-img {
  width: 100%;
}

.top-statsu{
  color: rgb(5, 195, 90);
  font-size: 22rpx;
  position: absolute;
  right: 48rpx;
}

.consumption-bottom {
  margin-top: 20rpx;
  height: 300rpx;
  display: flex;
  justify-content: space-between;
  font-size: 28rpx;
}
.bottom-left {
  padding-left: 62rpx;
  color: #333;
}
.bottom-point-total {
  margin-top: 30rpx;
}
.bottom-order-total {
  color: #a9a9a9;
  text-decoration: line-through;
}
.bottom-coupon-payment {
  color: rgb(5, 195, 90);
}
.bottom-point-payment {
  color: #333;
}
.bottom-order-total,.bottom-point-payment,.bottom-point-num,.bottom-coupon-payment {
  padding-left: 20rpx;
}
.semi-circle3{
  width: 30rpx;
  height: 60rpx; 
  box-shadow: 5rpx 0rpx 10rpx -2rpx #eee inset;
  border-radius: 100rpx 0 0 100rpx; /* 左上、右上、右下、左下 */
  position: absolute;
  right: 0;
  bottom: 35%;
}

.semi-circle4{
  width: 30rpx;
  height: 60rpx; 
  box-shadow: -4rpx 0rpx 8rpx -2rpx #eee inset;
  border-radius:0 100rpx 100rpx 0; 
  position: absolute;
  left: 0;
  bottom: 35%;
}

.consumption-line {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px dashed #ccc;
  margin-bottom:60rpx;
}
.no-speed {
  color: #ccc;
  font-size: 28rpx;
  text-align: center;
  padding-top: 200rpx;
}