.container {
  min-height: 0;
}

.container:empty {
  border: 1px dashed #d5dadf;
  min-height: 200px;
}

.row {
  min-height: 0;
}

.row:empty {
  border: 1px dashed #d5dadf;
  min-height: 150px;
  width: 100%;
  min-width: 500px;
}

.dragging [class^='col-']{
  outline: 1px dashed #555 !important;
  outline-offset: -1px !important;
  box-shadow: inset 0 0 0 4px rgb(0 0 0 / 10%),
    inset 0 0 0 4px rgb(255 255 255 / 20%),
    inset 0 0 0 1px rgb(255 255 255 / 30%);
}

[class^='col-']:empty:after {
  pointer-events: none;
  display: block;
  width: 100%;
  height: 100%;
  content: '';
  outline: 1px dashed #555;
  outline-offset: -1px;
  box-shadow:
    inset 0 0 0 4px rgb(0 0 0 / 10%),
    inset 0 0 0 4px rgb(255 255 255 / 20%),
    inset 0 0 0 1px rgb(255 255 255 / 30%);
}

[class^='col-']:empty {
  min-height: 75px;
  min-width: 75px;
}

html {
  height: 100%;
}

body {
  user-select: none;
  overflow-x: hidden;
  min-height: 100%;
}

body > .row {
  margin: 0;
}

form {
  min-height: 50px;
}

form:empty:before {
  pointer-events: none;
  display: block;
  width: 100%;
  height: 100px;
  content: 'Drag form elements here';
  text-align: center;
  background-color: #eee;
  color: #d5dadf;
  font-size: 22px;
  border: 1px dashed #d5dadf;
  padding-top: 33px;
}

[contenteditable='true'] {
  outline: none;
}

.ar-drag-el {
  opacity: 0.4 !important;
}