.CIG[data-type='com.psddev.cms.db.ContentForm'] {
  display: flex;
  flex-wrap: wrap;

  > .CIG-row {
    width: 100%;
  }

  > .CIG-row[data-field='contentType'] {
    display: none;
  }

  > .CIG-row[data-field='hiddenItems'],
  > .CIG-row[data-field='visibleFields'] {
    width: 50%;

    > .CIG-large {
      > .RCIG-list > li > btu-dropdown > .Dropdown-container,
      > .RCIG-list > li > .RCIG-remove {
        display: none !important;
      }

      > .RCIG-list > li {
        > .RCIG-toggleButtonWrapper {
          align-items: center;
          display: flex;
          height: var(--RCIG-titleHeight);
          position: absolute;
          right: 0;
          top: 0;

          &:hover {
            cursor: pointer;
          }

          .RCIG-toggleButton {
            .Icon.is-s;
            .IconButton;

            --IconButton-name: 'keyboard_arrow_right';

            background: transparent;
            border: none;
            border-left: 1px solid var(--color-gray3);
            height: var(--Icon-size);
            overflow: visible;
            padding: 0;
            padding-left: var(--gap-xs);
            width: calc(var(--Icon-size) + 3 * var(--gap-s));

            &::after {
              height: calc(var(--Icon-size) + 2 * var(--gap-s));
              left: var(--gap-xs);
              top: calc(-1 * var(--gap-s));
              width: calc(var(--Icon-size) + 2 * var(--gap-s));
            }

            &::before {
              padding: 0;
            }
          }
        }

        > .MultiSortable-buttonToggle {
          right: calc(var(--Icon-size) + 3 * var(--gap-s) + var(--gap-xs));
        }
      }
    }

    .Sortable-allowedContainer::before {
      bottom: calc(-1 * var(--gap-s));
      left: calc(-1 * var(--gap-s));
      margin-top: calc(-1 * var(--gap-s));
      right: calc(-1 * var(--gap-s));
    }
  }

  > .CIG-row[data-field='visibleFields'] {
    padding-right: var(--gap-l);
  }

  > .CIG-row[data-field='hiddenItems'] {
    left: calc(var(--gap-l) / 2);

    > .CIG-large {
      height: calc(100% - var(--lineHeight-s) - var(--gap-s));

      > .RCIG-list {
        height: 100%;

        &:empty::after {
          content: 'Nothing hidden yet! Drag other items in here to hide them.';
          display: block;
          font-style: italic;
          padding: var(--gap-m) var(--gap-l);
          text-align: center;
        }

        > li {
          &.is-loading::after {
            left: calc(var(--Icon-size) + 4 * var(--gap-s));
          }

          > .RCIG-toggleButtonWrapper {
            right: auto;

            .RCIG-toggleButton {
              --IconButton-name: 'keyboard_arrow_left';

              border-left: none;
              border-right: 1px solid var(--color-gray3);
              padding-left: 0;
            }
          }

          > .MultiSortable-buttonToggle {
            right: var(--gap-xs);
          }

          > .RCIG-title {
            padding-left: calc(var(--Icon-size) + 3 * var(--gap-s));
          }
        }
      }

      > .RCIG-controls {
        display: none;
      }
    }
  }
}

.CIG[data-type='com.psddev.cms.db.ContentFormCluster'],
.CIG[data-type='com.psddev.cms.db.ContentFormTab'] {
  > .CIG-row[data-field='fields'] {
    min-height: 0;

    > .CIG-large {
      > .RCIG-list > li > .RCIG-remove,
      > .RCIG-controls {
        display: none;
      }
    }
  }
}

.CIG[data-type='com.psddev.cms.db.ContentFormField'] {
  > .CIG-row[data-field='internalName'] {
    display: none;
  }
}

.CIG[data-type='com.psddev.cms.db.ContentFormWidget'] {
  > .CIG-row[data-field='widget'],
  > .CIG-row[data-field='name'] {
    display: none;
  }
}

.ContentForm-create {
  display: flex;
  margin: var(--gap-l) 0;

  select,
  .ComboInput {
    flex: auto;
    margin-right: var(--gap-s);
    width: 100%;
  }
}

.ComboInput-option[data-value='Widget'] {
  display: none;
}
