.form {
}

  .form .field-group {
    margin-top: 20px;
    line-height: 1.4rem;
  }

    .form .field-group.small {
      font-size: .85rem;
      line-height: 1.1rem;
    }

    .form .field-group label:not(.multi-switch-label) {
      display: block;
      font-size: .8rem;
      line-height: .8rem;
      font-weight: 600;
      letter-spacing: .5px;
      margin-bottom: 0.2rem;
      color: var(--sub-text-color);
      font-family: var(--font-sans-serif);
      text-align: left;
      padding-left: 8px;
    }

    .form .field-group label.no-indent {
      padding-left: 0;
    }

    .form .field-group .unit-list {
    }

      .form .field-group .unit-list ul {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
      }

        .form .field-group .unit-list ul li {
          margin-top: 5px;
        }

      .form .field-group .unit-list input[type='checkbox'] {
        display: inline-block;
        vertical-align: middle;
        margin: 0;
      }

      .form .field-group .unit-list label {
        display: inline-block;
        vertical-align: middle;
        margin: 0;
      }

    .form .field-group .list-chooser {
      position: relative;
    }

      .form .field-group .list-chooser ul {
        position: relative;
        border: 1px solid var(--border-color);
        border-radius: var(--button-radius);
        margin: 0;
        padding: 5px 10px;
        list-style: none;
        transition: .2s all;
      }

        .form .field-group .list-chooser ul.target-list {
          border-color: var(--color-success);
        }

        .form .field-group .list-chooser ul li {
          margin: 5px 0;
          border: 1px solid var(--border-color);
          cursor: grab;
          transition: box-shadow .2s, background .2s;
          user-select: none;
          background: white;
        }

          .form .field-group .list-chooser ul li:active {
            cursor: grabbing;
          }

          .form .field-group .list-chooser ul li:hover {
            background: var(--color-lightest);
            box-shadow: var(--shadow-near);
          }

          .form .field-group .list-chooser ul li.drag-over {
            background: var(--color-light);
            border-color: var(--color-2) !important;
          }

          .form .field-group .list-chooser ul li.dragging {
            background: var(--color-lighter);
            opacity: 0.5;
          }

  .form input[type='text'],
  .form input[type='email'],
  .form input[type='tel'],
  .form input[type='search'],
  .form input[type='number'],
  .form input[type='password'],
  .form input[type='date'],
  .form input[type='datetime'],
  .form input[type='datetime-local'],
  .form textarea {
    width: 75%;
  }

  .form select {
    width: auto;
  }

  .form input[type='checkbox'] {
    width: 20px;
    height: 20px;
  }

  .form input[type='number'] {
    min-width: 50px !important;
  }

  .form input:disabled,
  .form textarea:disabled,
  .form select:disabled {
    opacity: .5;
  }

  .form.full-width-fields input[type='text'],
  .form.full-width-fields input[type='email'],
  .form.full-width-fields input[type='tel'],
  .form.full-width-fields input[type='search'],
  .form.full-width-fields input[type='number'],
  .form.full-width-fields input[type='password'],
  .form.full-width-fields input[type='date'],
  .form.full-width-fields input[type='datetime'],
  .form.full-width-fields input[type='datetime-local'],
  .form.full-width-fields textarea,
  .form.full-width-fields select {
    width: 100%;
  }

  .form input.unsaved-changes {
    background: var(--color-warning-light);
  }

  .form .control-buttons {
    margin-top: 40px;
    display: flex;
    align-items: center;
    align-content: flex-start;
    justify-content: flex-start;
    padding-top: 20px;
    position: relative;
    border-top: 1px solid var(--border-color);
  }

    .form .control-buttons .button {
      margin-right: 10px;
    }

      .form .control-buttons .button.right {
        margin-left: auto !important;
      }

    .form .control-buttons .message {
      color: var(--sub-text-color);
      font-size: .9rem;
      line-height: .9rem;
      margin-left: auto;
    }

      .form .control-buttons .message.fade-out {
        animation: fade-out 8s forwards;
        font-weight: 700;
      }

      .form .control-buttons .message.error {
        color: var(--color-error);
      }

  .form.content-editor {
    display: grid;
    grid-template-rows: minmax(0, 1fr) 100px;
    height: 100%;
  }

    .form.content-editor .editor {
      overflow-y: auto;
      height: 100%;
    }

      .form.content-editor .editor textarea {
        height: 100%;
      }

.field-group .top-right-link {
  float: right;
  font-size: .85rem;
  line-height: .85rem;
  color: var(--link-color);
  cursor: pointer;
}