.json-schema-editor-modal {
  h3.card-title {
    margin-top: 0;

    label {
      display: none;
    }
  }

  .card .je-object__container {
    border-bottom: 1px dashed var(--primary-low);
    padding-bottom: 1em;
    margin-bottom: 1em;
    position: relative;

    .card-title label {
      display: inline-block;
      font-size: var(--font-down-1);
      color: var(--primary-medium);
    }

    .form-group {
      label {
        display: inline-block;
        width: 35%;
      }

      .form-control {
        width: 65%;
      }
    }

    .btn-group:last-child {
      position: absolute;
      right: 0px;
      top: 0px;

      .btn {
        font-size: var(--font-down-1);
      }
    }
  }

  .btn-group {
    margin-top: 0;
    display: flex;
    align-items: stretch;
    gap: 0.25em;

    .btn {
      .d-icon {
        margin-right: 0;
      }
    }
  }

  .card-body > .btn-group {
    // !important needed to override inline style :-(
    display: block !important;
    text-align: right;
  }

  .table {
    td {
      vertical-align: top;
      padding: 1em 0;
    }

    td.compact {
      .invalid-feedback {
        margin: 0;
        font-size: var(--font-down-1);
        color: var(--danger);
      }
    }

    input[type="text"] {
      margin-bottom: 0;
      width: 95%;

      &.is-invalid {
        border-color: var(--danger);
        outline: 1px solid var(--danger);
      }
    }
  }

  .desktop-view & #json-editor-holder {
    min-width: 600px;
  }
}