@use "sass:map";
@use '../settings/index' as *;

.main {
  grid-area: main;
  display: flex;
  justify-content: flex-start;
  padding: 0 $gutter;
  overflow: hidden;
  @media screen and (min-width: map.get($breakpoints, lg)) {
    padding: 0;
  }

  &__container {
    background: var(--bg-surface);
    box-shadow: var(--shadow-outline);
    border-radius: $border-radius;
    width: 100%;
    min-height: 100%;
    padding: $gutter;
    @media screen and (min-width: map.get($breakpoints, lg)) {
      padding: calc($gutter * 2);
    }
  }
}