/* Shop page styles — focused, responsive, accessible */
.shop-hero {
  padding-block: var(--space-10) var(--space-6);
  background: color-mix(in oklab, var(--color-primary) 4%, transparent);
}
.shop-search { margin-top: var(--space-5); }
.shop-search__row { display: grid; grid-template-columns: 1fr auto; gap: var(--space-3); }
.shop-search__suggestions { margin-top: var(--space-3); display: flex; flex-wrap: wrap; gap: var(--space-2); }
.chip {
  padding: 8px 12px; border: 1px solid var(--gray-300); background: var(--color-surface);
  border-radius: var(--radius-pill); cursor: pointer; transition: var(--duration-normal) var(--ease-standard);
}
.chip:hover { background: var(--gray-100); }

/* Filters */
.shop-filters { padding-block: var(--space-5); border-top: 1px solid var(--gray-200); border-bottom: 1px solid var(--gray-200); background: var(--color-surface); }
.filters-panel__summary { font-weight: 600; padding: var(--space-3) 0; cursor: pointer; }
.filters { display: grid; gap: var(--space-5); }
.filters__group { display: grid; gap: var(--space-4); }
.filters__options { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--space-2); }
.filters__range { display: grid; gap: var(--space-2); max-width: 360px; }
.filters__actions { display: flex; gap: var(--space-3); align-items: center; justify-content: space-between; flex-wrap: wrap; }
.filters__buttons { display: flex; gap: var(--space-2); }

/* Sections */
.section { padding-block: var(--space-8); }
.highlight-list { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.highlight-list a { display: inline-flex; gap: 8px; align-items: center; padding: 10px 12px; border: 1px solid var(--gray-200); border-radius: var(--radius-md); background: var(--color-surface); }
.highlight-list a:hover { text-decoration: none; background: var(--gray-100); }

/* Product cards */
.product-card { position: relative; overflow: hidden; }
.product-card__body { display: grid; gap: var(--space-2); margin-top: var(--space-4); }
.product-card__price { font-size: var(--text-lg); }
.product-card__actions { display: flex; gap: var(--space-2); align-items: center; margin-top: var(--space-2); }
.product-card__badges { position: absolute; top: 10px; left: 10px; display: flex; gap: 8px; }
.rating { color: var(--color-warning); letter-spacing: 1px; }

/* Brands */
.brands { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }
.brand-chip { display: inline-flex; align-items: center; padding: 8px 12px; border-radius: var(--radius-pill); border: 1px dashed var(--gray-300); background: var(--color-surface); }

/* Offers */
.offers { display: grid; gap: var(--space-3); }
.offers__cta { margin-top: var(--space-2); }

/* Showroom dialog */
.showroom { display: grid; gap: var(--space-3); }
.showroom__actions { display: flex; justify-content: flex-start; }
.showroom-dialog { max-width: min(920px, 96vw); border: none; border-radius: var(--radius-lg); padding: 0; box-shadow: var(--shadow-lg); }
.showroom-dialog::backdrop { background: rgba(0,0,0,.55); }
.dialog__header { display: flex; justify-content: space-between; align-items: center; padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--gray-200); }
.dialog__body { padding: var(--space-5); display: grid; gap: var(--space-3); }
.dialog__close { line-height: 1; }

/* Responsive tweaks */
@media (min-width: 768px) {
  .shop-hero { padding-block: var(--space-12) var(--space-8); }
}
