.products,
.new-product,
.edit-product {
  margin: 0 auto;
  padding-bottom: 6rem;
}

.products {
  max-width: 1600px;
  display: grid;
  grid-template-rows: min-content 8rem 1fr;
  align-items: flex-start;

  & > header {
    grid-column: 1 / -1;
    margin-bottom: 2.4rem;
    @include header();
    gap: 2.4rem;
  }

  .store-filters {
    grid-area: 2 / 1 / 4 / 2;
    background-color: var(--gray-soft-lightest);
    z-index: 1;
  }
  .store-list { grid-area: 3 / 1 / 4 / 2; }

  @media (min-width: 1200px) {
    @include grid-col(12);
    grid-template-rows: min-content 1fr;
    gap: 2.4rem 3.2rem;
    align-items: flex-start;

    & > header { margin-bottom: 0; }

    .store-filters {
      position: static;
      grid-area: 2 / 1 / 3 / 4;
    }
    .store-list { grid-area: 2 / 4 / 3 / -1; }
  }
}

.new-product,
.edit-product {
  max-width: 1200px;
  display: flex;
  flex-direction: column;

  &-nav {
    max-width: 1200px;
    margin: 0 auto;
  }
  & > header {
    padding-bottom: 0;
    @include header($sticky: true);
    gap: 2.4rem;
  }
}
