.layout-builder-block {
  padding: 0.5em;
  cursor: move;
  background-color: #fff;
}

/* Page layout */

@media screen and (min-width: 30em) {
  /* If sidebar first and not sidebar second */
  .grid-layout-2col-sidebar-first {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: var(--gcds-grid-gap-400);
  }

  /* If sidebar second and not sidebar first */
  .grid-layout-2col-sidebar-second {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: var(--gcds-grid-gap-400);
    width: 100%;
    min-width: 0; /* Prevents content from overflowing */
  }
}

@media screen and (min-width: 48em) {
  /* If sidebar left and right */
  .grid-layout-3col {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: var(--gcds-grid-gap-600);
  }

  /* If sidebar first and not sidebar second */
  .grid-layout-2col-sidebar-first {
    grid-template-columns: 1fr 3fr;
    gap: var(--gcds-grid-gap-600);
  }

  /* If sidebar second and not sidebar first */
  .grid-layout-2col-sidebar-second {
    grid-template-columns: 3fr 1fr;
    gap: var(--gcds-grid-gap-600);
  }
}

/* Allow layout to shrink and grow as needed */
.layout-content {
  display: block;
  width: 100%;
  min-width: 0;
}