@use '../breakpoints';
@use '../functions';

.sl-l-container {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--sl-container-max-width, functions.sl-px-to-rem(1920px));
  padding-left: var(--sl-gutter);
  padding-right: var(--sl-gutter);

  @include breakpoints.sl-breakpoint--small {
    padding-left: var(--sl-gutter--double);
    padding-right: var(--sl-gutter--double);
  }

  &--small {
    max-width: functions.sl-px-to-rem(960px);
  }

  .sl-l-container {
    padding: 0;
  }
}