@use '../../global/scss/tools' as nsw;

$nsw-layout-gap: 32px;

.nsw-layout {
  @include nsw.grid();

  &__main {
    @include nsw.column-default();

    &:not(:first-child) {
      @include nsw.column(8, nsw.$nsw-desktop-breakpoint);
    }

    &:not(:last-child) {
      @include nsw.column(8, nsw.$nsw-desktop-breakpoint);
    }
  }

  &__sidebar {
    @include nsw.column-default();
    @include nsw.column(4, nsw.$nsw-desktop-breakpoint);

    &:first-child {
      @include nsw.breakpoint('lg') {
        padding-right: nsw.rem(nsw.$grid-gutters*2 + $nsw-layout-gap);
      }
    }

    &:last-child {
      @include nsw.breakpoint(nsw.$nsw-desktop-breakpoint) {
        padding-left: nsw.rem(nsw.$grid-gutters*2 + $nsw-layout-gap);
      }
    }

    &--desktop {
      display: none;

      @include nsw.breakpoint(nsw.$nsw-desktop-breakpoint) {
        display: block;
      }
    }
  }
}

.nsw-sticky-container,
.js-sticky-container {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: var(--nsw-layer-sticky, 1000);
  display: block;
}

@media print {
  .nsw-sticky-container,
  .js-sticky-container {
    position: static;
  }
}