/*
 * @file
 * Provides the layout styles for section template.
 */

.layout--section-template-default {
  display: flex;
  flex-direction: column;
  margin-bottom: 2rem;

  .layout__region--top {
    order: 1;
  }

  .layout__region--sidebar {
    order: 3;
  }

  .layout__region--main-bottom {
    position: relative;
    order: 2;
  }

  .layout__region--bottom {
    order: 5;
  }

  .layout__region--sidebar .block {
    margin-bottom: 0;
  }
}

@media screen and (min-width: 1024px) {
  .layout--section-template-default {
    display: grid;
    grid-template-columns: 3fr 1fr;
    grid-template-rows: auto auto 1fr auto;
    column-gap: 2.4rem;

    .layout__region--top {
      grid-column: 1 / 3;
      grid-row: 1 / 2;
      order: initial;
    }

    .layout__region--sidebar {
      margin-top: 0;
      grid-column: 2 / 3;
      grid-row: 2 / 3;
      order: initial;
    }

    .layout__region--content {
      margin-top: 0;
      grid-column: 1 / 2;
      grid-row: 2 / 4;
      order: initial;

      .layout-builder__layout & {
        flex-basis: auto;
        flex-grow: 1;
      }
    }

    .layout__region--bottom {
      grid-column: 1 / 3;
      grid-row: 4 / 5;
      order: initial;
    }
  }
}