/* Product-first catalogue and collapsible category navigation. */
.products-section { background:#fff; }
.compact-heading { display:flex; align-items:baseline; justify-content:flex-start; gap:12px; min-width:0; }
.compact-heading h2 { flex:none; margin:0; font-size:22px; white-space:nowrap; }
.compact-tagline { overflow:hidden; color:#71899a; font-size:13px; white-space:nowrap; text-overflow:ellipsis; }
.compact-tagline > span:first-child { color:#168ad2; }
.product-tools { display:flex; flex-direction:row; align-items:center; gap:12px; margin:24px 0 20px; }
.categories-toggle { display:inline-flex; align-items:center; gap:8px; flex:0 0 auto; border:1px solid #d9e6f1; border-radius:10px; background:#fff; color:#173d5d; padding:10px 13px; font-size:14px; font-weight:700; }
.categories-toggle svg, .category-icon svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.categories-toggle[aria-expanded=true] { color:#0871bc; background:#eff8ff; border-color:#b9dff5; }
.product-tools .tool-options { display:flex; flex:1; min-width:0; gap:8px; }
.product-tools .search { min-width:0; flex:1; width:auto; }
.catalog-layout { display:grid; grid-template-columns:minmax(0,1fr); gap:22px; align-items:start; }
.catalog-layout.categories-visible { grid-template-columns:205px minmax(0,1fr); }
.catalog-main { min-width:0; }
.category-sidebar { min-width:0; border:1px solid #e4edf4; border-radius:14px; background:#fff; padding:14px 10px; }
.category-sidebar-head { display:flex; align-items:center; justify-content:space-between; padding:2px 8px 12px; color:#173d5d; font-size:15px; }
.category-sidebar-head button { width:34px; height:34px; border:0; border-radius:9px; background:#f3f7fa; color:#486b82; font-size:24px; line-height:1; }
.category-sidebar .filters { display:flex; flex-direction:column; align-items:stretch; gap:3px; }
.category-sidebar .filter { display:flex; align-items:center; gap:10px; width:100%; padding:10px 9px; border:0; border-radius:9px; background:transparent; color:#415e73; text-align:start; font-size:14px; line-height:1.45; }
.category-sidebar .filter:hover, .category-sidebar .filter.active { background:#eaf6fe; color:#086cba; }
.category-sidebar .filter.active { font-weight:700; }
.category-icon { display:inline-flex; flex:0 0 20px; align-items:center; justify-content:center; }
.category-icon img { display:block; width:26px; height:26px; object-fit:cover; border-radius:7px; }
.product-grid { gap:22px 15px; }
.product-card { display:flex; flex-direction:column; min-width:0; padding:0; border:0; border-radius:0; background:#fff; box-shadow:none; }
.product-art { position:relative; height:auto; aspect-ratio:1 / 1; border-radius:12px; background:#f3f6f8; }
.product-image-button { width:100%; height:100%; }
.product-card-photo { object-fit:contain; }
.product-art .add-button { position:absolute; inset-inline-end:9px; bottom:9px; z-index:1; width:40px; height:40px; display:grid; place-items:center; border:1px solid #edf0f2; border-radius:50%; background:#fff; color:#162d3d; box-shadow:0 2px 8px #183b5626; }
.product-art .add-button svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:2; }
.product-art .add-button:disabled { opacity:.6; background:#f4f4f4; }
.product-content { display:flex; flex:1; flex-direction:column; min-width:0; padding:9px 2px 2px; }
.product-name { height:auto; min-height:0; margin:0 0 5px; font-size:15px; line-height:1.45; color:#172b3b; }
.product-name-button { display:-webkit-box; max-width:100%; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow-wrap:anywhere; }
.product-description { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:3; margin:0 0 7px; color:#536b7c; font-size:13px; line-height:1.5; overflow-wrap:anywhere; }
.stock-badge { display:inline-block; align-self:flex-start; margin:2px 0 6px; color:#687c8a; font-size:12px; line-height:1.4; }
.stock-badge.in_stock { color:#138351; }
.stock-badge.out_of_stock { color:#b24643; }
.product-bottom { display:block; margin-top:auto; padding-top:2px; border:0; }
.product-bottom .price { font-size:18px; color:#132c40; font-weight:800; }
.product-grid.list-view .product-card { display:flex; flex-direction:row; gap:14px; padding:8px 0; border-bottom:1px solid #e8eff4; }
.product-grid.list-view .product-art { flex:0 0 145px; width:145px; height:145px; }
.product-grid.list-view .product-content { justify-content:flex-start; padding:2px 0; }
@media (min-width:768px) {
  .products-section > .container { width:min(1400px,calc(100% - 64px)); }
  .product-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .catalog-layout.categories-visible .product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (min-width:900px) {
  .product-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
  .catalog-layout.categories-visible .product-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (min-width:1200px) {
  .product-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .catalog-layout.categories-visible .product-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
}
@media (max-width:767px) {
  .products-section { padding-top:17px; }
  .compact-heading { gap:8px; }
  .compact-heading h2 { font-size:18px; }
  .compact-tagline { font-size:12px; }
  .product-tools { gap:8px; margin:18px 0 16px; }
  .categories-toggle { padding:9px 10px; font-size:13px; }
  .catalog-layout.categories-visible { grid-template-columns:minmax(0,1fr); }
  .categories-backdrop { position:fixed; inset:0; z-index:90; background:#102b3d80; }
  .category-sidebar { position:fixed; z-index:91; inset-block:0; inset-inline-start:0; width:min(310px,84vw); overflow-y:auto; border-radius:0; border:0; box-shadow:0 4px 30px #162d3b2e; padding:20px 14px; }
  body.categories-open { overflow:hidden; }
  .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 10px; }
  .product-name { font-size:14px; }
  .product-description { font-size:13px; }
  .product-bottom .price { font-size:16px; }
  .product-art .add-button { width:38px; height:38px; }
  .product-grid.list-view .product-art { flex-basis:110px; width:110px; height:110px; }
}
@media (max-width:360px) {
  .categories-toggle span { display:none; }
  .categories-toggle { padding:10px; }
  .product-grid { gap:18px 8px; }
  .product-art .add-button { width:36px; height:36px; inset-inline-end:6px; bottom:6px; }
  .product-bottom .price { font-size:15px; }
}
.catalog-layout .product-grid.list-view, .catalog-layout.categories-visible .product-grid.list-view { grid-template-columns:1fr; }

/* Clear progress and recovery on slow mobile connections. */
.catalog-state{min-height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;text-align:center;color:#466a83;font-size:14px}
.catalog-state p{margin:0}.catalog-spinner{width:27px;height:27px;border:3px solid #dbeefa;border-top-color:#0871bc;border-radius:50%;animation:catalog-spin .8s linear infinite}
.catalog-state.is-error .catalog-spinner{display:none}.catalog-retry{min-height:44px;border:1px solid #afd8f2;border-radius:9px;background:#eef8ff;color:#075b97;padding:9px 16px;font-weight:700}
@keyframes catalog-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.catalog-spinner{animation:none}}
@media(max-width:767px){.product-detail-modal,.modal{max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.modal .close,.category-sidebar-head button{min-width:44px;min-height:44px}}