.secs-monitor {
  padding: 24px 0 0 0;
  height: 100%;
  .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    .title {
      /* height: 32px; */
      background: #fafbfc;
      border-radius: 3px;
      border: 1px solid #ebeef2;
      display: flex;
      align-items: center;
      .text {
        display: inline-block;
        margin-left: 8px;
        margin-right: 4px;
        font-size: 12px;
        font-weight: 400;
        color: rgba(0, 0, 0, 0.6);
      }
      .value {
        display: flex;
        align-items: center;
        position: relative;
        margin-right: 1px;
        padding: 0 10px;
        height: 100%;
        background: #ebeef2;
        border-radius: 1px;
      }
    }
    .setting {
      width: 100%;
      display: flex;
      justify-content: space-between;
      .num ,
      .unit {
        font-weight: 400;
        color: rgba(0, 0, 0, 0.9);
      }
      .ant-radio-button-wrapper-checked {
        .num,.unit {
          color: #008cd3;
        }
      }
    }
  }
  .chart-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-start;
    height: calc(100% - 56px);
    overflow: auto;
    .chart-item {
      width: calc(33.333% - 12px);
      height: 345px;
      margin-top: 16px;
      &:nth-child(-n + 3) {
        margin-top: 0;
      }
      .scSelect {
        min-width: 120px !important;
      }
    }
    &:after {
      content: '';
      width: calc(33.333% - 12px);
    }
  }
  .chart-title-select {
    width: 100px;
    margin-left: 8px;
  }
  .chart-title-select-max {
    width: 160px !important;
    .ant-select-selection-item {
      color: rgba(0, 0, 0, 0.4);
    }
  }
}