.app-container {
  background-color: #fff;
  position: relative;
  min-height: 700px;
  .icon-container {
    position: absolute;
    top: 29px;
    right: 29px;
    .wx-button {
      margin-left: 32px;
      width: 40px !important;
      height: 40px !important;
      &:first-child {
        margin-left: 0;
      }
    }
  }
  .filter-container {
    padding: 29px 29px 0 29px;
    .filter-container-form {
      .el-form-item {
        margin-bottom: 29px;
        .el-input {
          .el-input__inner {
            color: #1C1C1C;
          }
          input::-webkit-input-placeholder {
            line-height: 20px;
            font-size: 14px;
            color: #939393;
          }
          input::-moz-input-placeholder {
            line-height: 20px;
            font-size: 14px;
            color: #939393;
          }
          input::-ms-input-placeholder {
            line-height: 20px;
            font-size: 14px;
            color: #939393;
          }
        }
      }
    }
  }
  > .el-table {
    margin: 0 29px;
    width: calc(100% - 58px);
  }
  .el-table {
    border: 1px solid #D5D5D5;
    border-radius: 12px;
    background-color: #fff;
    .el-table__header {
      tr {
        height: 53px;
        th {
          background-color: #F5F6FA;
          .cell {
            color: #000;
            font-size: 14px;
            line-height: 20px;
            margin-top: 4px;
          }
          &.ascending {
            .ascending {
              border-bottom-color: #6993FF;
            }
          }
          &.descending {
            .descending {
              border-top-color: #6993FF;
            }
          }
        }
      }
    }
    .configurationTable .el-table__body-wrapper {
      overflow: hidden;
    }
    .el-table__body-wrapper {
      .el-table__body {
        .el-table__row {
          height: 58px;
          .cell {
            color: #000;
            font-size: 14px;
            i {
              font-size: 20px;
              cursor: pointer;
              &.el-icon-delete {
                color: #f56c6c;
              }
            }
          }
        }
      }
    }
    .afterRenderClass {
      .el-table__body-wrapper {
        overflow: auto;
      }
    }
    .el-checkbox {
      margin-left: calc((100% - 26px) / 2);
      .el-checkbox__input {
        .el-checkbox__inner {
          height: 26px;
          width: 26px;
          border-radius: 6px;
          border-color: #B3B3B3;
          &:after {
            @extend %iconfont;
            content: '\e617';
            color: #fff;
            width: 0;
            height: 0;
            border: none;
            font-size: 14px;
            transform: rotate(0) scaleX(1);
            top: 5px;
          }
        }
        &.is-indeterminate {
          .el-checkbox__inner {
            &:before {
              top: 12px;
            }
          }
        }
        &.is-focus, &:hover {
          .el-checkbox__inner {
            border-color: #6993FF;
          }
        }
        &.is-indeterminate, &.is-checked {
          .el-checkbox__inner {
            background-color: #6993FF;
            border-color: #6993FF;
          }
        }
        &.is-disabled {
          display: none;
        }
      }
    }
  }
  .el-tabs {
    .el-tabs__content {
      .details-container,
      .alarm-container,
      .attribute-container,
      .event-container,
      .log-container,
      .relation-container,
      .telemetering-container {
        width: 100%;
        height: 100%;
      }
      .details-container {
        .el-form {
          width: 955px;
          @extend %el-form;
          margin-bottom: 20px;
        }
      }
    }
  }
  .pagination-container {
    padding: 29px 0;
  }
  .btn-container {
    position: absolute;
    top: -48px;
    right: 0;
    .wx-button {
      margin-right: 10px;
      &:last-child {
        margin-right: 0;
      }
    }
  }
  &.details-container {
    border: none !important;
  }
}

.pagination-container {
  @include center();
  background-color: #fff;
}