.multi-column-editor-label {
  clear: left;
}

.multi-column-editor-wrapper {
  .multi-column-editor {
    margin-top: 3px;
    margin-bottom: 3px;

    .rows {
      border: 1px solid var(--form-border, #aaa);
    }

    .mce-row {
      display: flex;
      padding: .5rem .5rem 0;
      background: var(--table-odd, #f3f3f5);

      .fields {
        display: flex;
        align-items: end;
        flex-wrap: wrap;
        clear: left;
      }

      &:not(:last-child) {
        border-bottom: 1px solid var(--content-border, #fff);
      }

      &:nth-child(even) {
        background: var(--table-even, #f9f9f9);
      }

      &:hover,
      &:focus {
        background-color: var(--hover-row, #fffce1);
      }

      .form-group {
        padding-right: 10px;
        position: relative;
        margin-bottom: .5rem;
        vertical-align: top;

        fieldset {
          &.tl_checkbox_container,
          &.tl_radio_container {
            margin-top: 0;
            margin-bottom: 0;
          }
        }

        input[type="text"], input[type="password"] {
          width: 100%;
        }

        &.wizard {
          input[type="text"], input[type="password"] {
            width: calc(100% - 24px);
          }
        }

        > h3 {
          padding-top: 0;
        }
      }

      .actions {
        display: inline-block;
        margin-left: auto;
        min-width: 60px;
        text-align: right;
        margin-top: .75rem;

        .drag-handle {
          background: none;
          border: none;
        }
      }
    }

    .rows.grouped {
      border: none;

      > .mce-row {
        border: 1px solid var(--form-border, #aaa);
        display: block;
        padding: 0;
        margin-bottom: 2px;
        position: relative;

        & > fieldset {
          display: flex;
          flex-direction: column;

          & > legend {
            padding: 9px 0 9px 28px;
            background-position-y: 11px;
          }

          & > .fields {
            padding: .5rem 15px 0;
          }
        }

        .actions {
          position: absolute;
          top: 9px;
          right: 9px;
          margin: 0;
        }
      }
    }
  }

  & + .tl_tip {
    clear: left;
  }
}

.widget.compact .multi-column-editor {
  .mce-row:not(:last-of-type) {
    .form-group {
      margin-bottom: 0.125rem;
    }

    .tl_help {
      display: none;
    }
  }

  .mce-row:not(:first-of-type) {
    padding-top: 0.125rem;

    h3 {
      display: none;
    }
  }
}