.shop-shell { background: #f5f7fc; }
.shop-main { max-width: 1160px; margin: 0 auto; padding: 20px 28px 58px; }
.shop-breadcrumb { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; color: #8490a4; font-size: 9px; }
.shop-breadcrumb a:hover { color: #1263df; }.shop-breadcrumb strong { color: #1263df; font-weight: 600; }
.shop-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 22px; }.shop-heading h1 { margin: 0 0 6px; color: #182235; font-size: 27px; letter-spacing: -.5px; }.shop-heading p { margin: 0; color: #708096; font-size: 10px; }.results-count { color: #7d899b; font-size: 9px; }
.shop-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 12px; padding: 10px; border: 1px solid #e1e7f0; border-radius: 6px; background: #fff; }.shop-search { display: flex; align-items: center; gap: 8px; width: min(100%, 420px); height: 29px; padding: 0 9px; border-radius: 5px; background: #f0f4fc; color: #8290a5; }.shop-search span { font-size: 17px; transform: rotate(-20deg); }.shop-search input { width: 100%; border: 0; outline: 0; color: #344157; background: transparent; font: inherit; font-size: 9px; }.shop-search input::placeholder { color: #9aa6b8; }.view-controls { display: flex; align-items: center; gap: 8px; color: #77849a; font-size: 8px; text-transform: uppercase; }.sort-button, .view-button { border: 0; color: #2468e8; background: transparent; font: inherit; font-size: 8px; cursor: pointer; }.sort-button span { margin-left: 5px; }.view-button { width: 21px; height: 21px; border: 1px solid #dce3ed; border-radius: 3px; color: #8290a2; }.view-button.active { color: #fff; background: #2468e8; border-color: #2468e8; }
.shop-layout { display: grid; grid-template-columns: 145px minmax(0, 1fr); gap: 16px; }.filter-panel { align-self: start; padding: 14px 12px; border: 1px solid #e1e7f0; border-radius: 6px; background: #fff; }.filter-heading { display: flex; flex-direction: column; gap: 3px; margin-bottom: 18px; }.filter-heading strong { color: #26344b; font-size: 10px; }.filter-heading small { color: #8b97a8; font-size: 7px; }fieldset { min-width: 0; margin: 0 0 19px; padding: 0; border: 0; }legend { margin-bottom: 10px; color: #687791; font-size: 7px; font-weight: 700; text-transform: uppercase; }.category-select { display: block; width: 100%; box-sizing: border-box; padding: 3px; border: 1px solid #d7e1f1; border-radius: 4px; color: #617086; background: #fff; font: inherit; font-size: 8px; }.category-select option { padding: 3px; }.filter-hint { display: block; margin-top: 5px; color: #8b97a8; font-size: 7px; }fieldset label { display: flex; align-items: center; gap: 6px; margin: 0 0 8px; color: #617086; font-size: 8px; }fieldset input[type="checkbox"] { width: 10px; height: 10px; margin: 0; accent-color: #2468e8; }.price-inputs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5px; width: 100%; margin-bottom: 8px; }.price-inputs input { min-width: 0; width: 100%; box-sizing: border-box; height: 24px; padding: 3px 5px; border: 1px solid #cbd6e6; border-radius: 3px; color: #617086; font: inherit; font-size: 8px; }.range { width: 100%; height: 3px; accent-color: #2468e8; }.clear-filters { display: inline-block; box-sizing: border-box; width: 100%; min-height: 25px; margin-top: 4px; padding: 6px 4px; border: 1px solid #d7e1f1; border-radius: 4px; color: #587092; background: #f4f7fd; font-size: 7px; text-align: center; cursor: pointer; }
.shop-results { min-width: 0; }.shop-product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }.shop-product-card { position: relative; min-width: 0; min-height: 266px; padding: 7px; border: 1px solid #e1e7f0; border-radius: 6px; background: #fff; box-shadow: 0 2px 8px rgba(38, 68, 115, .06); }.shop-product-image { height: 123px; margin-bottom: 8px; border-radius: 3px; background-color: #e9eef5; background-position: center; background-size: cover; }.shop-product-card small { display: block; margin-bottom: 4px; color: #8a96a8; font-size: 6px; font-weight: 700; }.shop-product-card h2 { min-height: 24px; margin: 0 0 5px; color: #2a374d; font-size: 9px; line-height: 1.25; }.product-meta { display: flex; gap: 3px; color: #8490a0; font-size: 7px; }.product-meta span:first-child { color: #e3a916; }.shop-price { display: block; margin-top: 7px; color: #1167df; font-size: 11px; }
.product-qty-control { display: flex; align-items: center; justify-content: space-between; width: 80px; height: 26px; margin-top: 8px; padding: 0 6px; border: 1px solid #dfe7f3; border-radius: 5px; background: #fff; }
.product-qty-control button { width: 20px; height: 20px; border: 0; border-radius: 4px; color: #2468e8; background: transparent; font-size: 14px; line-height: 1; cursor: pointer; }
.product-qty-control span { min-width: 18px; text-align: center; color: #2d3d55; font-size: 10px; font-weight: 700; }
.stock-pill { position: absolute; right: 7px; bottom: 34px; padding: 3px 5px; border-radius: 8px; color: #168b55; background: #dff8e9; font-size: 6px; }.sale-tag { position: absolute; z-index: 1; top: 10px; left: 10px; padding: 3px 4px; border-radius: 2px; color: #fff; background: #ec3a2e; font-size: 6px; font-weight: 700; }.wishlist { position: absolute; z-index: 1; top: 8px; right: 8px; width: 19px; height: 19px; border: 0; border-radius: 50%; color: #51647c; background: rgba(255,255,255,.86); font-size: 15px; line-height: 19px; cursor: pointer; }.cart-button { position: absolute; right: 7px; bottom: 7px; left: 7px; height: 20px; border: 0; border-radius: 3px; color: #fff; background: #2468e8; font-size: 7px; cursor: pointer; }.cart-button:hover { background: #135bd4; }
.product-details-link { display: block; color: inherit; text-decoration: none; }
.product-card-category { display: block; color: #8490a0; font-size: 9px; }
.treadmill { background-image: url("https://images.unsplash.com/photo-1576678927484-cc907957088c?auto=format&fit=crop&w=500&q=80"); }.elliptical { background-image: url("https://images.unsplash.com/photo-1599058917212-d750089bc07e?auto=format&fit=crop&w=500&q=80"); }.bicycle { background-image: url("https://images.unsplash.com/photo-1538805060514-97d9cc17730c?auto=format&fit=crop&w=500&q=80"); }.bench { background-image: url("https://images.unsplash.com/photo-1586401100295-7a8096fd231a?auto=format&fit=crop&w=500&q=80"); }.bands { background-image: url("https://images.unsplash.com/photo-1598971639058-fab3c3109a00?auto=format&fit=crop&w=500&q=80"); }.kettlebell { background-image: url("https://images.unsplash.com/photo-1517963879433-6ad2b056d5f8?auto=format&fit=crop&w=500&q=80"); }.mats { background-image: url("https://images.unsplash.com/photo-1601925260368-ae2f83cf8b7f?auto=format&fit=crop&w=500&q=80"); }.accessories { background-image: url("https://images.unsplash.com/photo-1598289431512-b97b0917affc?auto=format&fit=crop&w=500&q=80"); }.placeholder-card { min-height: 214px; }.placeholder-card .shop-product-image { height: 157px; margin: 0; }
.shop-promo { min-height: 140px; margin: 18px 0 24px; padding: 20px; display: flex; align-items: center; border-radius: 5px; color: #fff; background: linear-gradient(90deg, rgba(11,79,184,.95), rgba(21,85,176,.55)), url("https://images.unsplash.com/photo-1581009146145-b5ef050c2e1e?auto=format&fit=crop&w=1000&q=80") center / cover; }.shop-promo strong { display: block; margin-bottom: 9px; font-size: 20px; line-height: .95; }.shop-promo button { height: 22px; padding: 0 10px; border: 0; border-radius: 3px; color: #1263df; background: #fff; font-size: 7px; font-weight: 700; cursor: pointer; }.secondary-products .shop-product-card { min-height: 214px; }.pagination { display: flex; justify-content: center; gap: 4px; margin-top: 34px; }.pagination button { width: 20px; height: 20px; border: 1px solid #e0e6ef; border-radius: 3px; color: #66758d; background: #fff; font-size: 8px; cursor: pointer; }.pagination button.current { color: #fff; border-color: #2468e8; background: #2468e8; }
@media (max-width: 800px) { .shop-main { padding: 18px 18px 40px; }.shop-layout { grid-template-columns: 1fr; }.filter-panel { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }.filter-heading { margin: 0; }.filter-panel fieldset { margin: 0; }.clear-filters { align-self: end; }.shop-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .shop-heading { align-items: flex-start; flex-direction: column; gap: 10px; }.shop-heading h1 { font-size: 22px; }.shop-toolbar { align-items: stretch; flex-direction: column; }.shop-search { width: 100%; }.view-controls { justify-content: flex-end; }.filter-panel { display: block; }.filter-heading, .filter-panel fieldset { margin-bottom: 16px; }.shop-product-grid { gap: 8px; }.shop-product-image { height: 125px; }.shop-promo { min-height: 120px; }.shop-promo strong { font-size: 17px; } }

/* Improve readability and keep search actions separate from sorting. */
.shop-breadcrumb { font-size: 12px; }
.shop-heading p { font-size: 14px; }
.results-count { font-size: 12px; }
.shop-toolbar { gap: 10px; }
.shop-search-box { display: flex; flex: 1 1 420px; align-items: center; min-width: 0; max-width: 520px; height: 40px; padding: 0 5px 0 9px; border: 1px solid #dce3ed; border-radius: 5px; background: #f0f4fc; }
.shop-search { flex: 1 1 auto; width: auto; max-width: none; height: 38px; padding: 0; background: transparent; }
.shop-search input { font-size: 13px; }
.search-actions { display: flex; align-items: center; gap: 7px; flex-shrink: 0; }
.search-button, .clear-search { min-height: 30px; padding: 6px 10px; border: 1px solid #2468e8; border-radius: 4px; font-size: 12px; text-decoration: none; cursor: pointer; }
.search-button { color: #fff; background: #2468e8; }
.clear-search { color: #2468e8; background: #fff; }
.search-button:hover { background: #135bd4; }
.clear-search:hover { background: #f0f4fc; }
.view-controls { font-size: 12px; }
.sort-button { font-size: 12px; }
.filter-heading strong { font-size: 14px; }
.filter-heading small, .filter-hint { font-size: 10px; }
legend { font-size: 10px; }
.category-select, .category-select option { font-size: 12px; }
.price-inputs input { font-size: 12px; }
.clear-filters { font-size: 11px; }
.shop-product-card small { font-size: 10px; }
.shop-product-card h2 { font-size: 14px; }
.shop-price { font-size: 15px; }
.stock-pill { font-size: 10px; }
.cart-button { font-size: 11px; }
.pagination a, .pagination button { font-size: 12px; }
.pagination a, .pagination-control { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 7px; border: 1px solid #e0e6ef; border-radius: 3px; color: #66758d; background: #fff; font-size: 12px; text-decoration: none; }
.pagination a:hover:not(.current), .pagination-control:hover:not(.disabled) { color: #2468e8; border-color: #2468e8; }
.pagination a.current { color: #fff; border-color: #2468e8; background: #2468e8; }
.pagination-control.disabled { color: #b5bfce; background: #f5f7fb; cursor: not-allowed; }
.wishlist.is-wishlisted { color: #000; }

@media (max-width: 800px) {
	.shop-search-box { max-width: none; }
}

.variant-picker-backdrop { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; padding: 20px; background: rgba(18, 32, 54, .45); }
.variant-picker-backdrop[hidden] { display: none; }
.variant-picker { position: relative; width: min(100%, 420px); padding: 24px; border-radius: 10px; background: #fff; box-shadow: 0 18px 50px rgba(20, 41, 76, .25); }
.variant-picker h2 { margin: 0 0 16px; color: #182235; font-size: 20px; }
.variant-picker-close { position: absolute; top: 10px; right: 12px; border: 0; color: #718096; background: transparent; font-size: 24px; cursor: pointer; }
.shop-variant-option { display: flex; justify-content: space-between; gap: 12px; width: 100%; margin: 7px 0; padding: 10px; border: 1px solid #dfe7f3; border-radius: 6px; color: #344157; background: #fff; text-align: left; cursor: pointer; }.shop-variant-option span { color: #718096; font-size: 11px; }.shop-variant-option.selected { border-color: #2468e8; background: #eef5ff; }.shop-variant-option:disabled { opacity: .5; cursor: not-allowed; }
.variant-picker-quantity { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; color: #344157; font-size: 13px; font-weight: 600; }.variant-quantity-control { display: inline-flex; align-items: center; gap: 14px; height: 34px; padding: 0 6px; border: 1px solid #dfe7f3; border-radius: 6px; background: #fff; }.variant-quantity-control button { width: 25px; height: 25px; border: 0; border-radius: 4px; color: #2468e8; background: transparent; font-size: 18px; cursor: pointer; }.variant-quantity-control button:disabled { color: #aab4c2; cursor: not-allowed; }.variant-picker-total { margin: 10px 0 0; color: #718096; font-size: 12px; }.variant-picker-total strong { color: #182235; }
.variant-picker-add { width: 100%; height: 38px; margin-top: 14px; border: 0; border-radius: 5px; color: #fff; background: #2468e8; cursor: pointer; }