.card-container .mx-tabs.mx-tabs-top {
  height: calc(~'100% - 41px');
  .mx-tabs-bar {
    margin-bottom: 0px;
    .mx-tabs-nav.mx-tabs-nav-animated {
      height: 34px;
    }
  }
  .mx-tabs-content.mx-tabs-content-animated {
    height: calc(~'100% - 33px');
  }
}

.task-wrapper {
  height: 100%;
  width: 100%;
  font-size: 12px;
  overflow: hidden;
  .title-bar {
    background-color: #eff1f4;
    padding: 4px 0 4px 5px;
    font-weight: bold;
    border-bottom: 1px solid #cfd4db;
  }
  .content-wrapper {
    overflow: auto;
    height: 100%;
    .one-record-wrapper {
      padding: 8px;
      border-bottom: 1px solid #f5f5f5;
      &:hover {
        background-color: #eff1f4;
        .one-record {
          i {
            color: #626464;
          }
        }
      }
      .one-record {
        cursor: pointer;
        white-space: nowrap;
        line-height: 20px;
        .item-num {
          padding-left: 2px;
          padding-right: 2px;
          margin-right: 10px;
          min-width: 16px;
          float: right;
          display: inline-block;
          border-radius: 10px;
          background: #fa7252;
          color: #fff;
          height: 17px;
          text-align: center;
          line-height: 19px;
        }
        span {
          display: inline-block;
          margin-left: 5px;
        }
        .desc {
          font-weight: bold;
        }
        .to-do {
          background-color: #3aafda;
          color: #fff;
          padding:0 4px 0 4px;
        }
        .reject {
          padding:0 4px 0 4px;
          background-color: #ec932a;
          color: #fff;
        }
        .will-do {
          background-color: #82b244;
        }
        i {
          float: right;
          margin-top: -2px;
          color: #c4ccd4;
          font-size: 10px;
        }
      }
    }
  }

}
