
.shop-catalog {
  --shop-search-w: 18rem;
  --shop-search-min: 11rem;
  --shop-sort-w: 14.5rem;                                   
  --shop-bar-h: calc(var(--control-sm) + var(--space-3));   
  --shop-toolbar-h: var(--space-8);                         
  padding-bottom: var(--space-9);
}

.shop-head { padding-bottom: var(--space-5); }

.shop-head .page-head__lead { text-wrap: pretty; }

.catalog-toolbar { display: contents; }

html:has(.catalog-toolbar) { scroll-padding-top: calc(var(--header-h) + var(--nav-row-h, 0px) + var(--control-sm) + var(--space-3) + var(--space-4)); }

.catalog-toolbar__bar {
  position: sticky;
  top: calc(var(--header-h) + var(--nav-row-h, 0px));
  z-index: var(--z-sticky);
  display: flex;
  align-items: center;
  min-height: var(--shop-bar-h);
  margin-top: var(--space-3);
  border-bottom: var(--border-w) solid var(--rule);
  background: var(--color-bg);

  box-shadow: 0 0 0 100vmax var(--color-bg);
  clip-path: inset(0 -100vmax);
}

.catalog-toolbar__filters,
.catalog-toolbar__sort { display: none; }

.catalog-toolbar__active { font-variant-numeric: tabular-nums; }

.catalog-toolbar__count {
  margin-top: var(--space-4);
  font-size: var(--text-small);
  font-weight: var(--weight-medium);
  color: var(--color-text);
}

.catalog-toolbar__sort-label {
  font-size: var(--text-label);
  color: var(--color-muted);
  white-space: nowrap;
}

.shop-active { padding-block: var(--space-3) 0; }

.shop-grid { margin-top: var(--space-5); }

html.js .shop-grid:has(> .boot-pending) { position: relative; }

html.js .shop-grid > .boot-pending {
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--color-bg);
  visibility: hidden;
  animation: boot-fallback-show 0s 8s forwards !important;
}

html.js .shop-grid > .boot-pending ~ li { animation: boot-fallback-hide 0s 8s forwards !important; }

html.js .shop-catalog:has(> .shop-grid > .boot-pending) > .catalog-toolbar { animation: boot-fallback-hide 0s 8s forwards !important; }

html:not(.js) .catalog-toolbar,
html:not(.js) .shop-grid { display: none; }

.shop-empty {
  --rosette: calc(var(--space-9) + var(--space-5));   
  --rosette-dim: .5;
}

@media (max-width: 767.98px), (max-height: 500px) {
  .shop-empty { --rosette: var(--space-8); }   

  .shop-empty .empty-state { gap: var(--space-3); padding-block: var(--space-5); }
}

@media (max-height: 500px) {
  .shop-empty { --rosette: var(--space-7); }   

  .shop-empty .empty-state { gap: var(--space-2); padding-top: var(--space-3); }
}

.shop-fallback {
  display: grid;
  gap: var(--space-2);
  align-content: start;
  padding: var(--space-4);
  border: var(--border-w) solid var(--rule);
  background: var(--color-surface);
}

.shop-fallback__name { font-family: var(--font-display); font-variation-settings: "opsz" var(--opsz-text); font-size: var(--text-h4); font-weight: var(--weight-display-strong); color: var(--color-maroon); }

.shop-fallback__price { font-size: var(--text-price); font-weight: var(--weight-medium); font-variant-numeric: tabular-nums; }

.shop-filters__wide { display: none; }

.shop-filters__body { padding-block: 0; }

.shop-filters__set { display: grid; }

.shop-filters__body .accordion { border-bottom: 0; }

.shop-filters__body .accordion__item:first-child { border-top: 0; }

@media (min-width: 768px) {
  html:has(.catalog-toolbar) { scroll-padding-top: calc(var(--header-h) + var(--nav-row-h, 0px) + var(--space-8) + var(--space-4)); }

  .catalog-toolbar {
    position: sticky;
    top: calc(var(--header-h) + var(--nav-row-h, 0px));
    z-index: var(--z-sticky);
    display: flex;
    align-items: center;
    gap: var(--space-4);
    min-height: var(--shop-toolbar-h);
    padding-block: var(--space-2);
    border-bottom: var(--border-w) solid var(--rule);
    background: var(--color-bg);
    box-shadow: 0 0 0 100vmax var(--color-bg);
    clip-path: inset(0 -100vmax);
  }

  .catalog-toolbar__count { order: -1; flex: 1 0 auto; margin-top: 0; white-space: nowrap; }

  .catalog-toolbar__search {
    flex: 0 1 var(--shop-search-w);
    min-width: var(--shop-search-min);
    min-height: var(--control-sm);
    padding-left: var(--space-3);
  }

  .catalog-toolbar__bar { display: none; }

  .catalog-toolbar__filters { display: inline-flex; }

  .catalog-toolbar__sort { display: flex; flex: none; align-items: center; gap: var(--space-3); }

  .catalog-toolbar__sort .select { width: var(--shop-sort-w); }

  .catalog-toolbar__sort .field__control { min-height: var(--control-sm); height: var(--control-sm); padding-block: 0; font-size: var(--text-small); }

  .catalog-toolbar__sort-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .shop-filters__phone,
  .shop-filters__sort { display: none; }

  .shop-filters__wide { display: inline; }

  .shop-filters__sort + .accordion__item { border-top: 0; }
}

@media (min-width: 1024px) {
  .catalog-toolbar__sort-label {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip-path: none;
  }
}
