[kui-theme-style] {
  .kui--form-section {
    &:not(:first-child) {
      padding-top: 1em;
      margin-top: 1em;
    }
  }

  .bx--form {
    display: grid;
    grid-template-rows: min-content;
    grid-column-gap: 1em;
    grid-row-gap: 1em;
    grid-auto-flow: dense;
    grid-template-columns: repeat(auto-fill, minmax(3em, auto));
    flex: unset;

    .kui--form-item--for-label .bx--form-item {
      .bx--label {
        color: var(--color-map-key);
      }
      .bx--text-input,
      .bx--text-area {
        background-color: var(--color-base03);
        border-bottom-color: var(--color-base04);
      }
    }

    .bx--form-item {
      font-size: 0.875em;

      .bx--text-input {
        height: 2.5em;
        padding: 0 1em;
        line-height: 1.125em;
      }

      .bx--text-area {
        min-height: 2.5em;
        min-width: 10em;
        padding: 0.6875em 1em;
        line-height: 1.25em;
      }

      .bx--text-input,
      .bx--text-area {
        font-size: 1em;
        color: var(--color-text-01);
        background-color: rgba(255, 255, 255, 0.1);
        border-bottom-color: var(--color-base03);

        &:focus,
        &:active {
          outline-color: var(--active-tab-color);
        }
      }

      .bx--label {
        color: var(--color-text-01);
        font-size: 0.875em;
        margin-bottom: 0.5em;
        line-height: 1em;
      }
    }
  }
}
