@import '~antd/es/style/themes/default.less';

.design-config {
  background-color: @layout-header-background;
  &-field {
    width: 100%;
    padding-left: 8px;
    padding-bottom: 8px;
    padding-right: 8px;
    &:first-child {
      padding-top: 16px;
    }
    &:last-child {
      padding-bottom: 16px;
    }

    &-title-level1 {
      color: white;
      // padding-left: 8px;
      background-color: rgb(28, 32, 28);
    }
    &-title-level2 {
      color: rgb(195, 211, 217);
    }
    &-title-level3 {
      color: rgb(158, 170, 175);
    }
    &-title-level4 {
      color: rgb(96, 104, 107);
    }

    &-title {
      flex: 1;
      height: var(--config-component-height);
      line-height: var(--config-component-height);
      padding-right: 5px;
      font-size: 12px;
    }

    &-container {
      width: 192px;
    }
  }
  &-field-disabled {
    cursor: not-allowed;
    .design-config-field-title {
      cursor: not-allowed;
      opacity: 0.6;
    }
    .design-config-field-container {
      cursor: not-allowed;
      pointer-events: none;
      opacity: 0.6;
    }
  }
}
.design-config-level-1 {
  .design-config-field {
    padding-top: 4px;
    padding-bottom: 4px;
    padding-right: 8px;
  }
}
