/* Four-column catalog: scoped to the customer shop, never cart/checkout. */
.shop-layout{grid-template-columns:220px minmax(0,1fr)}
.shop-layout>section{min-width:0}
#productGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:8px;min-width:0}
#productGrid .product-card{min-width:0;box-shadow:none;border:1px solid var(--line)}
#productGrid .product-img-wrap{padding-top:100%;background:#fff}
#productGrid .product-img{object-fit:contain;padding:2px}
#productGrid .product-card:hover .product-img{transform:none}
#productGrid .product-info{padding:6px 4px;min-width:0}
#productGrid .product-name{font-size:12px;line-height:1.4;min-height:51px;-webkit-line-clamp:3;overflow-wrap:anywhere}
#productGrid .product-price-row{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;min-height:36px}
#productGrid .product-price,#productGrid .product-old-price{display:block;max-width:100%;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;line-height:1.4}
#productGrid .product-price{font-size:12px}
#productGrid .product-old-price{font-size:11px}
#productGrid .product-actions{display:flex;flex-direction:column;align-items:center;padding:0 3px 4px;gap:2px;margin-top:auto}
#productGrid .stock-pill{position:static;max-width:100%;font-size:10px;line-height:1.4;padding:2px 0;background:transparent;overflow-wrap:anywhere}
#productGrid .add-circle{position:relative;inset:auto;width:44px;height:44px;min-width:44px;min-height:44px;flex-shrink:0}
#productGrid .badge-discount{top:2px;right:2px;padding:2px 3px;font-size:10px}
#productGrid .badge-best{position:static;display:block;font-size:10px;line-height:1.4;padding:3px;letter-spacing:normal}
#productGrid .product-skeleton .product-info{height:105px;flex-basis:105px}
.shop-main{min-width:0}
.catalog-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;font-size:12px;color:var(--muted)}
#catalogStatus{min-width:0;overflow-wrap:anywhere;line-height:1.5}
#resetCatalogFilters{flex-shrink:0;min-width:44px;min-height:44px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--green-d);font-size:12px;font-weight:600;cursor:pointer}
#resetCatalogFilters:focus-visible,#productGrid a:focus-visible{outline:2px solid var(--green-d);outline-offset:-2px}
#productGrid .product-name a{display:block;min-height:44px;color:inherit;text-decoration:none}
#productGrid .product-name a:hover{text-decoration:underline}
.discount-banner{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 18px;padding:8px 12px;background:#fff8df;font-weight:600;line-height:1.5}
.storefront-promo-note{font-weight:400}
#catalogRetry{min-width:44px;min-height:44px;padding:6px 10px;border:1px solid var(--green);border-radius:8px;background:#fff;color:var(--green-d);cursor:pointer}
#catalogRetry[hidden]{display:none}
.catalog-toolbar{flex-wrap:wrap}
#catalogStatus{flex:1 1 140px}
.catalog-toolbar .sidebar-toggle{position:static;inset:auto;z-index:auto;width:auto;min-width:44px;height:44px;min-height:44px;gap:6px;padding:6px 10px;border-radius:8px;box-shadow:none;color:#fff;font-size:12px}
.catalog-toolbar .sidebar-toggle svg{width:18px;height:18px}
@media(max-width:599px){#catalogStatus{flex-basis:100%;min-height:36px}}
@media(max-width:900px){.shop-layout{grid-template-columns:minmax(0,1fr)}}
@media(min-width:600px){
 #productGrid{gap:10px;padding:10px}
 #productGrid .product-info{padding:8px}
 #productGrid .product-name{font-size:14px;min-height:59px}
 #productGrid .product-price{font-size:16px}
 #productGrid .product-price-row{min-height:41px}
 #productGrid .product-actions{flex-direction:row;justify-content:space-between;padding:0 8px 8px}
}
@media(min-width:1200px){#productGrid{gap:12px}}
