.overview-page {
  margin: 16px 24px 60px;
  padding-bottom: 60px;

  .el-card {
    border: none;
    margin-bottom: 16px;
  }

  ::v-deep .el-descriptions {
    .el-descriptions__label {
      margin-right: 0;
    }
  }


  .el-row {
    &.first-row {
      ::v-deep .el-card {
        .el-card__body {
          @apply flex flex-col items-center;
          .icon {
            width: 28px;
          }

          .number {
            font-size: 28px;
            font-weight: 600;
          }

          .index {
            color: #808695;
            font-size: 12px;
          }
        }
      }
    }

    &.second-row {
      .chart1 {
        height: 455px;
      }

      .chart2 {
        height: 200px;
      }

      .chart3 {
        height: 140px;
      }
    }
  }

  ::v-deep .el-table {
    width: 100%;
    background-color: #fff;
    border: none;

    &::before {
      display: none;
    }

    .el-table__header-wrapper {
      .el-table__header {
        height: 48px;

        th {
          .cell {
            font-weight: 600;
            color: #535a5d;
            padding: 0 17px;
          }
        }
      }
    }

    .el-table__body-wrapper {
      &::-webkit-scrollbar {
        width: 3px;
      }

      tr {
        &:last-child {
          td {
            border-bottom: none !important;
          }
        }

        td {
          padding: 0;
          border-bottom: 1px solid #f4f4f4 !important;

          .cell {
            line-height: 13px;
            color: #535a5d;
            padding: 13px 17px;
            font-size: 13px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
          }
        }
      }

    }

    .el-empty {
      @apply select-none;
    }
  }

  ::v-deep .el-pagination {
    @apply text-center;
    margin-top: 16px;

    .number {
      font-weight: 400;
    }
  }
}
