.page-refund-order-info{
  padding: 20px;
  .new-page-title {
    width: 100%;
    height: 62px;
    background: #F7F8FA;
    box-sizing: border-box;
    padding: 19px 20px;
    display: flex;
    align-items: center;
    margin-bottom: 20px;

    .line {
      width: 4px;
      height: 19px;
      background: #155BD4;
      opacity: 1;
      border-radius: 2px;
      margin-right: 10px;
    }

    .text {
      font-size: 18px;
      font-weight: bold;
      color: #333333;
      opacity: 1;
    }
  }
  .plat-intervene {
    font-size: 14px;
    color: #e6a23c;
    width: 100%;
    display: flex;
    align-items: center;
    background-color: #FDF6EC;
    padding: 20px;
    margin-bottom: 19px;
    &:deep(.el-icon) {
      font-size: 14px;
      margin-right: 2px;
    }
  }
  .order-refund-info{
    width: 100%;
    height: 100%;
    font: 14px Arial, "PingFang SC", "Hiragino Sans GB", STHeiti,
    "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
    color: #495060;
    .refundId {
      margin-bottom: 15px;
      margin-left: 20px;
    }

    .content {
      .order-number {
        .text {
          font-size: 14px;
          color: #8a8a8a;
        }
        .num-cont {
          width: 100%;
          display: flex;
          justify-content: flex-start;
          .state-title {
            width: 500px;
            box-sizing: border-box;
            padding: 20px 45px;
            border: 1px solid #E8E9EC;
            border-right: none;
            .item {
              display: flex;
              margin-bottom: 15px;
              &:last-child {
                margin-bottom: 0;
              }
              .text {
                color: #155BD4;
              }
            }
          }
          .refund-progress {
            width: 100%;
            border: 1px solid #E8E9EC;
            display: flex;
            justify-content: center;
            align-items: center;
            .item {
              width: 100%;
            }
          }
        }
      }
      .order-state {
        position: relative;
        margin-top: 15px;
        .order-info {
          width: 100%;
          border: 1px solid #E8E9EC;
          margin: 15px 0;
          display: flex;
          .detail-title {
            line-height: 19px;
            display: flex;
            align-items: center;
            font-weight: bold;
            color: #333333;
          }
          .logistics-box {
            height: 220px;
            overflow-y: auto;
            position: relative;
            margin-top: 15px;
            &::before {
              position: absolute;
              left: 0;
              top: 0;
              display: block;
              width: 10px;
              height: 10px;
              content: " ";
              font-size: 0;
              background: #fff;
              z-index: 1;
            }
            &::after {
              position: absolute;
              left: 6px;
              top: 0;
              display: block;
              height: 100%;
              content: " ";
              font-size: 0;
              background: #eee;
              z-index: 0;
            }
            .item {
              padding: 0 0 40px 25px;
              position: relative;
              margin-left: 6px;
              border-left: 1px solid #eee;
              &::before {
                position: absolute;
                left: -10px;
                top: 0;
                display: block;
                width: 19px;
                height: 19px;
                border-radius: 50%;
                content: " ";
                font-size: 0;
                background: #ccc;
                border: 5px solid #fff;
                z-index: 2;
              }
              &:first-child::before {
                background: #c00;
              }
              .time {
                color: #999;
              }
              .text {
                margin-top: 5px;
                width: 600px;
              }
            }
            .left-line {
              border-left: none;
            }
          }
          .order-details {
            width: 620px;
            padding-left: 45px;
            padding-top: 20px;
            padding-bottom: 20px;
            border-right: 1px solid #e9eaec;
            &.refund-record-left{
              min-height: 400px;
            }
            .detail-cont {
              position: relative;
              margin: 15px 20px 0 0;
              .detail01  {
                display: flex;
                align-items: center;
                .text-width {
                  margin-bottom: 10px;
                  .text-width-item {
                    line-height: 27px;
                    display: flex;
                    .title{
                      white-space: nowrap;
                    }
                    .text {
                      display: inline-block;
                      max-width: 250px;
                      line-height: 27px;
                      word-break: break-word;
                    }
                    .img-box{
                      width: 40px;
                      height: 40px;
                      margin-right: 8px;
                      margin-bottom: 8px;
                    }
                  }
                }
              }
            }
          }
          .buyers {
            width: 1030px;
            padding-left: 45px;
            padding-top: 20px;
            position: relative;
            .buyers-info {
              margin-top: 15px;
              position: relative;
              .img-box{
                width: 100px;
                height: 100px;
                margin-right: 12px;
                margin-bottom: 12px;
              }
            }
            .refund-record-title{
              justify-content: space-between;
              padding-right: 45px;
              padding-bottom: 15px;
              .proof-btn{
                color: #155BD4;
                display: flex;
                align-items: center;
                cursor: pointer;
                .txt{
                  margin-left: 3px;
                }
              }
            }
            .refund-record{
              width: 100%;
              height: calc(100% - 54px);
              overflow-y: auto;
              position: absolute;
              left: 0;
              padding-left: 45px;
            }
          }
        }
        .item-list {
          .prod-info {
            display: flex;
            justify-content: flex-start;
            align-items: center;
            .con {
              flex: 1;
              margin-left: 8px;
              overflow: hidden;
              text-overflow: ellipsis;
              display: -webkit-box;
              -webkit-line-clamp: 2;
              line-clamp: 2;
              -webkit-box-orient: vertical;
            }
            .gift-icon {
              display: inline-block;
              padding: 4px;
              border-radius: 4px;
              background: #e43130;
              color: #fff;
              font-size: 13px;
              margin-right: 5px;
              line-height: 1em;
            }
            .con .sku {
              margin-left: 8px;
              color: #999;
            }
          }
          // 赠品
          .gift-prod {
            width: 100%;
            box-sizing: border-box;
            padding: 10px 0 0 102px;
            .item {
              display: flex;
              margin-top: 5px;
              line-height: 1em;

              .giveaway-item-name {
                box-sizing: border-box;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 1;
                overflow: hidden;
              }
              .giveaway-item-sku-count {
                white-space: nowrap;
                margin-left: 10px;
                color: #999;
              }
            }
          }
        }
        .sellerRemark {
          margin-top: 20px;
          display: flex;
          .input-bar {
            display: inline-block;
            width: 100%;
            &.denial-reason{
              display: flex;
              div{
                flex: 1;
              }
              .right{
                margin-left: 100px;
                .tips{
                  font-size: 12px;
                  color: #999;
                }
              }
            }
            .remark-title {
              margin-bottom: 10px;
            }
          }
        }

        .btn-bar {
          margin-top: 15px;
        }
      }
      .order-log {
        .log-title {
          margin-top: 20px;
          width: 100%;
          line-height: 20px;
          font-weight: bold;
        }
        .log-cont {
          margin-top: 15px;
          color: #666666;
          & > div {
            margin-bottom: 10px;
          }
          & > div:last-child {
            margin-bottom: 0;
          }
        }
      }
    }
    .remark-title {
      min-width: 70px;
      display: flex;
      align-items: center;
    }
    .denial::before {
      content: '*';
      color: #F56C6C;
      margin-right: 4px;
    }
    .remark-content{
      flex: 1;
      display: flex;
      align-items: center;
      :deep(.el-input__inner){
        padding-right: 20px !important;
      }
    }
  }
}
