@import '../../../theme/styles/default.less';
@import './variable.less';

@{card-limit-prefix} {
  display: inline-block;
  width: 100%;
  min-width: 420;
  height: 276px;
  border-radius: 4px;
  background-color: #fff;
  margin: 0 0 20px 0;
  cursor: pointer;
  i{

    margin: 0 5px 0 0;
  }
  .limit {
    width: 100%;
    height: 100%;
    padding: 20px;
    position: relative;
    .residue{
      position: absolute;
      right: 15px;
      top: 12px;
      color: #71a9ff;
      font-size: 18px;
    }

    &-emp {
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      flex-direction: column;
      -webkit-box-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      align-items: center;
      text-align: center;
      border-bottom: #dcdce0 solid 1px;
      padding-bottom: 15px;
      position: relative;

      .photo {
        width: 84px;
        height: 84px;
        line-height: 84px;
      }

      .row1 {
        width: 100%;

        label:nth-child(1) {
          font-size: 18px;
          font-weight: bold;
          margin-top: 10px;
          margin-bottom: 5px;
        }

        label:nth-child(2) {
          margin: 5px 0 0 0;
          display: inline-block;
          width: 100%;
          text-align: center;
          color: #9b9b9b;
          font-size: 12px;
        }
      }

      .row2 {
        width: 100%;
        display: flex;
        margin: 10px 0 0 0;

        label {
          flex: 1;
          color: #9b9b9b;
          font-size: 12px;
          text-align: left;
        }
      }
    }

    &-quota {
      width: 100%;

      .quota {
        display: flex;
        line-height: 24px;

        .title {
          width: 40%;
          font-size: 13px;
          color: #8c8c8c;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          word-break: break-all;
        }

        .des {
          -webkit-box-flex: 1;
          flex-grow: 1;
          text-align: right;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          word-break: break-all;
          width: 60%;
        }

        nz-progress {
          margin-left: 8px;
          display: inline-block;
          width: 70px;
          float: right;
        }
      }
    }
  }

  .limit:hover {
    border-radius: 4px;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
    background-color: #ffffff
  }
}