@use '../../styles/variate.scss' as *;

$raduis: 20px;
$font_size: 2.67vh;
$heder_h: 6.17vh;

.stu-mgr-content {
  margin-top: $space-3_h;
  width: 100%;
  height: calc(100% - 11vh);
  position: relative;
  .table-box {
    height: 77vh;
  }
  &::after {
    content: '';
    display: block;
    width: calc(100% - 40px);
    height: 1vh;
    position: absolute;
    top: 8vh;
    left: 20px;
    background: v-bind(student_bg_hollow);
    background-size: 20px 12px;
  }
}

.student-toolbar {
  height: 8.5vh;
  border-top-left-radius: $raduis;
  border-top-right-radius: $raduis;
  background: linear-gradient(269deg, #83fff3 0%, #77e3ff 100%);
  padding: 0 $space-4 0.42vh;
  display: flex;
  align-items: center;
  position: relative;

  justify-content: space-between;
  color: $font-tag-color;
  font-size: $font-size-7;
  font-family: $font-special;

  .status-button {
    height: 5vh;
  }

  :deep(.el-input) {
    width: 320px;
    height: 4.83vh;
    .el-input__wrapper {
      height: 4.83vh;
      border-radius: 1.67vh;
      background: rgba(0, 0, 0, 0.6);
      box-shadow: none;
      .el-input__inner {
        font-size: 2.67vh;
        color: rgba(255, 255, 255, 0.85);
      }
    }
    .el-input__icon {
      font-size: 2.67vh;
      color: #4de798;
    }
  }

  .left-items {
    display: flex;
    align-items: center;
    column-gap: $space-4;
  }

  .right-items {
    display: flex;
    column-gap: $space-4;
  }

  .update-time-box {
    display: flex;
    align-items: center;
    column-gap: $space-4;

    .icon-text {
      display: flex;
      align-items: center;
      column-gap: $space-1;
    }
  }
}

.student-table {
  max-height: 100%;
  background: #fff;
  @include checkbox;

  :deep(.el-table__header) {
    // border-radius: $radius-5;
    overflow: hidden;
    margin-bottom: $space-1_h;

    .el-table__cell {
      background: #d2f1ff;
      color: $font-color;
      font-family: $font-special;
      padding: 0;

      .cell {
        font-size: $font-size-5;
        height: $heder_h;
        line-height: $heder_h;
      }
    }
  }

  :deep(.el-table__body) {
    // border-radius: 1.67vh;
    overflow: hidden;
    background: none;
    .row-disabled {
      color: rgba(212, 84, 78, 0.45);
    }
  }

  :deep(.el-table__row) {
    background: #fff;
    font-family: $font-special;
    color: $font-tag-color;
    font-size: $font-size-7;
    padding: $space-1_h $space-2;
    box-shadow: 0 0.33vh 0.33vh 0 rgba(0, 0, 0, 0.15);

    .el-table__cell {
      padding: 0;
      .cell {
        height: 7vh;
        line-height: 7vh;
      }
    }
  }
}
