/*------------------------------------------------------------------------------*/
/* Category Page Layout
/*------------------------------------------------------------------------------*/
.CategoryLayout {
  display: flex;
  gap: var(--margin-large) var(--grid-gutter);
}

.CategoryAside {
  --sidebar-width: 16rem;
  flex: 0 1 var(--sidebar-width);
}
.CategoryAside .FilterList {
  min-width: 100%;
}
.CategoryAside .FilterGroupName,
.CategoryAside .FilterGroup {
  width: 100%;
}

.CategoryAside:empty {
  display: none;
}

.CategoryMain {
  flex: 1;
}

@media screen and (max-width: 1024px) {
  .CategoryLayout {
    display: block;
  }
  .CategoryAside {
    display: none;
  }
}
.SiteLayoutColumns .CategoryAside {
  display: none !important;
}

/*------------------------------------------------------------------------------*/
/* Product Page Layout
/*------------------------------------------------------------------------------*/
.ProductLayout {
  display: grid;
  gap: 20px 3vw;
  grid-template-columns: minmax(340px, 1fr) 1fr minmax(250px, 0.5fr);
  margin-bottom: var(--margin-large);
}
.ProductLayout .Breadcrumb {
  grid-column: 1/-1;
  margin: 0;
}
@media (max-width: 1024px) {
  .ProductLayout {
    grid-template-columns: minmax(280px, 1fr) 1fr;
  }
}
@media (max-width: 576px) {
  .ProductLayout {
    grid-template-columns: 100%;
  }
}
.ProductLayout .BuyForm {
  margin-bottom: 0;
}

.SiteLayoutColumns .ProductLayout {
  grid-template-columns: minmax(340px, 500px) 1fr;
}

@media screen and (max-width: 1320px) {
  .SiteLayoutColumns .ProductLayout {
    grid-template-columns: minmax(340px, 1fr) 1fr;
  }
}
/*------------------------------------------------------------------------------*/
/* Info Page Layout
/*------------------------------------------------------------------------------*/
.BaseLayout {
  --sidebar-width: 24rem;
  display: grid;
  gap: var(--grid-gutter);
  grid-template-columns: 1fr var(--sidebar-width);
}

.BaseLayout .SideNavigation {
  position: sticky;
  top: calc(var(--margin-large) + 4rem);
}

@media screen and (max-width: 860px) {
  .BaseLayout {
    display: block;
    margin-inline: auto;
  }
  .BaseLayout .SideNavigation {
    border-top: 1px solid var(--border-color);
    margin-top: var(--grid-gutter);
    padding-top: var(--grid-gutter);
  }
}

/*# sourceMappingURL=layouts.css.map */