/* pages/write-offs-records/write-offs-records.wxss */
.page-write-offs-records {
  height: calc(100vh - env(safe-area-inset-bottom));
  background: #f4f4f4;
  overflow: auto;
  .write-offs-records {
    .write-offs-box {
      position: relative;
      width: 700rpx;
      background: #FFFFFF;
      border-radius: 12rpx 12rpx 12rpx 12rpx;
      opacity: 1;
      margin: 24rpx 24rpx 0 24rpx;
      padding: 32rpx 24rpx;
      box-sizing: border-box;

      .tit {
        display: flex;
        justify-content: space-between;
        padding-bottom: 24rpx;
        border-bottom: 1px dashed #E1E1E1;
      }

      .tit.no-border {
        border-bottom: 0;
        padding-bottom: 0;
      }

      .certificate-code {
        font-size: 28rpx;
        font-weight: bold;
        color: #333333;
        line-height: 39rpx;
        display: flex;

        .write-text {
          font-family: Alibaba PuHuiTi, Alibaba PuHuiTi;
        }
      }

      .used {
        color: #999999;

        .write-text {
          text-decoration: line-through;
        }
      }

      .out-of-date {
        color: #999999;
      }

      .pickup {
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 24rpx;
        line-height: 28rpx;
        font-weight: 400;
        color: #5B5B5B;
        padding-top: 24rpx;

        .pickup-name {
          position: relative;
          display: flex;
          align-items: center;

          .txt {
            width: 400rpx;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
          }
        }

        .circle {
          width: 6rpx;
          height: 6rpx;
          background: #5B5B5B;
          border-radius: 50%;
          top: 14rpx;
          margin-right: 8rpx;
        }
      }

      .write-offs-icon {
        position: absolute;
        width: 100rpx;
        height: 100rpx;
        right: 20rpx;
      }

      .write-offs-icon.top {
        top: 0;
      }

      .write-offs-icon.twenty {
        top: 20rpx;
      }

      .write-offs-icon.bottom {
        top: 72rpx;
      }
    }

    .no-record {
      padding-top: 120rpx;
      display: flex;
      justify-content: center;

      img {
        width: 500rpx;
        height: 400rpx;
      }

      .no-record-img {
        height: 400rpx;
        width: 500rpx;
        display: flex;
        flex-wrap: wrap;

        .no-record-tip {
          width: 100%;
          padding-top: 32rpx;
          text-align: center;
          font-size: 28rpx;
          font-family: PingFang SC-Regular, PingFang SC;
          font-weight: 400;
          color: #999999;
          line-height: 33rpx;
        }
      }
    }
  }

  .certificate-code-all {
    display: flex;
    align-items: center;
    color: #5B5B5B;
    font-family: PingFang SC-Regular, PingFang SC;
    line-height: 28rpx;

    span {
      display: block;
      width: 8rpx;
      height: 8rpx;
      content: "";
      font-size: 0;
      border-top: 2rpx solid #333;
      border-right: 2rpx solid #333;
      transform: rotate(45deg);
      margin-left: 10rpx;
    }
  }
}
