werun-wxapp/common-page/pages/myOrder/order-detail/index.wxss

.pay_wrap {
  background-color: #e6e6e6;
  height: 100%;
  padding-bottom: 20rpx;
}
.pay_wrap .line {
  width: 100%;
  height: 20rpx;
  background-color: #e6e6e6;
}
.pay_wrap .address {
  background-color: #fff;
  margin: 0 auto;
  padding: 10rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 94%;
  height: 240rpx;
  border-radius: 16rpx;
}
.pay_wrap .address .address_info {
  margin-left: 6rpx;
}
.pay_wrap .address .address_info .info_top {
  display: flex;
  align-items: center;
  justify-content: start;
  margin-bottom: 10rpx;
}
.pay_wrap .address .address_info .info_top .name {
  font-size: 32rpx;
  font-weight: 700;
}
.pay_wrap .address .address_info .info_top .mobile {
  font-size: 28rpx;
  color: #B0ADAD;
  margin-left: 12rpx;
}
.pay_wrap .address .address_info .info_content {
  font-size: 30rpx;
  margin-bottom: 10rpx;
}
.pay_wrap .address .address_info .tips {
  font-size: 30rpx;
  color: #ee0a24;
}
.pay_wrap .address .address_select {
  font-size: 36rpx;
  font-weight: 700;
  color: #ffca28;
}
.pay_wrap .goods_box {
  background-color: #fff;
  margin: 20rpx auto;
  padding: 10rpx;
  align-items: center;
  width: 94%;
  border-radius: 16rpx;
}
.pay_wrap .goods_box .title {
  display: flex;
  align-items: center;
  justify-content: start;
  margin-bottom: 30rpx;
}
.pay_wrap .goods_box .title .logo {
  margin-right: 10rpx;
}
.pay_wrap .goods_box .goods_info {
  display: flex;
  align-items: flex-start;
}
.pay_wrap .goods_box .goods_info .goods_image {
  width: 200rpx;
  height: 200rpx;
  margin-right: 10rpx;
}
.pay_wrap .goods_box .goods_info .goods_detail .goods_name {
  font-size: 32rpx;
  font-weight: 700;
  margin-bottom: 10rpx;
}
.pay_wrap .goods_box .goods_info .goods_detail .goods_desc {
  font-size: 30rpx;
  color: #ccc;
}
.pay_wrap .goods_box .goods_info .goods_detail .goods_tips {
  font-size: 30rpx;
  color: #ffca28;
}
.pay_wrap .goods_box .goods_count {
  display: flex;
  align-items: center;
  margin-top: 20rpx;
  justify-content: space-between;
  padding: 10rpx;
}
.pay_wrap .goods_box .goods_remark {
  margin-top: 20rpx;
  padding: 10rpx;
}
.pay_wrap .pay_address {
  width: 100%;
  padding: 30rpx;
  margin-top: 30rpx;
  height: 90rpx;
  display: flex;
  background-color: #fff;
  align-items: center;
  border-radius: 10rpx;
}
.pay_wrap .pay_address .pay_address_left {
  background-color: red;
  color: white;
  flex: 2;
  text-align: center;
  border-radius: 10rpx;
}
.pay_wrap .pay_address .pay_address_right {
  flex: 8;
  display: flex;
  justify-content: space-between;
}
.pay_wrap .pay_goods {
  margin: 30rpx 0;
  border: 1px solid #ececec;
  border-radius: 15rpx;
}
.pay_wrap .pay_goods .footer_wrap {
  display: flex;
  flex-direction: column;
}
.pay_wrap .pay_goods .footer_wrap .checkbox {
  width: 100%;
  height: 70rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pay_wrap .pay_goods .footer_wrap .checkbox .text {
  font-size: 28rpx;
  font-weight: 600;
  color: red;
}
.pay_wrap .user_info {
  background-color: #fff;
  margin: 20rpx 0;
  padding: 0 20rpx;
}
.pay_wrap .user_info .user_info_name {
  height: 90rpx;
  display: flex;
  align-items: center;
}
.pay_wrap .user_info .user_info_num {
  height: 90rpx;
  display: flex;
  align-items: center;
}
.pay_wrap .pay_discount {
  width: 100%;
  background-color: #fff;
}
.pay_wrap .pay_discount .pay_discount_title {
  padding: 20rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.van-cell {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  justify-content: space-between;
  box-sizing: border-box;
  width: 100%;
  padding: 10px 16px;
  overflow: hidden;
  color: #323233;
  font-size: 14px;
  line-height: 24px;
  background-color: #fff;
}
.discount .discount_text {
  width: 100%;
  height: 90rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}
.discount .discount_text text {
  font-size: 36rpx;
  font-weight: 700;
}
checkbox .wx-checkbox-input {
  width: 44rpx;
  height: 44rpx;
  border-radius: 50%;
}
checkbox .wx-checkbox-input.wx-checkbox-input-checked {
  background: #ee0a24;
  border-color: #ee0a24;
  /* color: #ffffff; */
}
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
  width: 30rpx;
  height: 30rpx;
  line-height: 30rpx;
  text-align: center;
  font-size: 34rpx;
  color: #fff;
  background: transparent;
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
}
.tabs_title {
  display: flex;
}
.tabs_title .title_item {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
  padding: 15rpx 0;
}
.active {
  color: red;
  border-bottom: 5rpx solid currentColor;
}
.tabs_content {
  background-color: #fff;
  padding-top: 40rpx;
}
.tabs_content .coupon {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10rpx 20rpx;
}
.coupon_img {
  width: 95%;
  height: 220rpx;
  margin: 0 auto;
  background-color: #ccc;
}
.coupon_item_wrap {
  width: 90%;
  height: 180rpx;
  margin: 20rpx auto;
  display: flex;
  background-image: url('http://cloud.file.futurestack.cn/1AiWpTEDH9/20201207/qf19km053654.png?imageView2');
  background-size: 100%;
  background-repeat: no-repeat;
}
.coupon_item_wrap .coupon_item_left {
  flex: 7.5;
  padding: 15rpx;
  display: flex;
}
.coupon_item_wrap .coupon_item_left .coupon_left_price_wrap {
  flex: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.coupon_item_wrap .coupon_item_left .coupon_left_price_wrap .coupon_left_price {
  color: #DB432E;
  font-size: 20rpx;
}
.coupon_item_wrap .coupon_item_left .coupon_left_price_wrap .coupon_left_price .text1 {
  color: #DB432E;
  font-size: 48rpx;
  font-weight: 800;
}
.coupon_item_wrap .coupon_item_left .coupon_left_price_wrap .coupon_price_text {
  font-size: 24rpx;
}
.coupon_item_wrap .coupon_item_left .coupon_left_cnt {
  flex: 7;
  display: flex;
  padding-left: 10rpx;
  flex-direction: column;
  justify-content: space-around;
}
.coupon_item_wrap .coupon_item_left .coupon_left_cnt .left_cnt_title {
  margin: 15rpx 0;
}
.coupon_item_wrap .coupon_item_left .coupon_left_cnt .left_cnt_btm {
  display: flex;
  flex-direction: column;
}
.coupon_item_wrap .coupon_item_left .coupon_left_cnt .left_cnt_btm text {
  font-size: 22rpx;
  color: #B0ADAD;
}
.coupon_item_wrap .coupon_item_right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex: 2.5;
  position: relative;
  overflow: hidden;
}
.coupon_item_wrap .coupon_item_right button {
  width: 120rpx;
  background-color: #DB432E;
  color: #fff;
  border-radius: 40px;
  font-size: 20rpx;
}
.coupon_item_wrap .coupon_item_right .active image {
  width: 100rpx;
  height: 100rpx;
  position: absolute;
  right: -10rpx;
  top: -25rpx;
}
.coupon_item_wrap .coupon_item_right .active button {
  width: 120rpx;
  background-color: #f5e054;
  color: #ed6d69;
  border-radius: 40px;
  font-size: 20rpx;
  margin-top: 40rpx;
}
.has-info {
  display: flex;
  flex-direction: column;
  padding: 0;
  margin: 30rpx 0;
  width: 100%;
  background-color: #fff;
}
.has-info .info-item {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border-radius: 10rpx;
  box-shadow: 2rpx 8rpx 18rpx #f1f1f1;
  position: relative;
}
.has-info .info-item .edit-wrap {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.has-info .info-item .edit-wrap .img {
  width: 42rpx;
  height: 42rpx;
}
.has-info .info-item .selected {
  display: flex;
  justify-content: center;
  align-items: center;
}
.has-info .info-item .selected .img {
  width: 40rpx;
  height: 40rpx;
}
.has-info .info-item .info-wrap {
  display: flex;
  flex-direction: column;
  padding-left: 30rpx;
}
.has-info .info-item .info-wrap .addr {
  display: flex;
  flex-direction: column;
  margin-bottom: 10rpx;
}
.has-info .info-item .info-wrap .addr .top {
  font-size: 30rpx;
  font-weight: 500;
  margin-bottom: 4rpx;
}
.has-info .info-item .info-wrap .addr .text {
  font-size: 24rpx;
  color: #777;
}
.has-info .info-item .info-wrap .addr .img-wrap {
  width: 44rpx;
  height: 44rpx;
  margin-right: 10rpx;
}
.has-info .info-item .info-wrap .name {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.has-info .info-item .info-wrap .name .img-wrap {
  width: 44rpx;
  height: 44rpx;
  margin-right: 10rpx;
}
.has-info .info-item .info-wrap .name .img {
  width: 42rpx;
  height: 42rpx;
}
.has-info .info-item .info-wrap .name .default {
  font-size: 22rpx;
  color: #ff3456;
  background: #faedef;
  text-align: center;
  padding: 2rpx 10rpx;
  border-radius: 4rpx;
}
.has-info .info-item .info-wrap .name .text {
  font-size: 26rpx;
  margin-right: 10rpx;
}
.fetchTime {
  background-color: #fff;
  font-size: 26rpx;
  padding: 30rpx;
}
.btn {
  display: flex;
  justify-content: space-between;
  margin: 20rpx auto;
  padding: 0 20rpx;
  align-items: center;
}
.btn .status {
  text-align: center;
  font-size: 34rpx;
  font-weight: 800;
  line-height: 1.5;
  color: #6d6d6d;
}
.btn .refund {
  padding: 14rpx 60rpx;
  border: 1rpx solid #fd5f5f;
  border-radius: 50rpx;
  color: #fd5f5f;
}