/* Accessories listing styles */
.products-grid { display:grid; grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); gap:14px; }
.product-card { background:#fff; border-radius:8px; padding:12px; box-shadow:0 6px 18px rgba(0,0,0,0.04); }
.product-img { height:140px; object-fit:contain }
.product-name { font-size:1rem; font-weight:700 }
.price { color:#e64a19; font-weight:700; margin-top:8px }

@media (max-width:640px) { .products-grid { grid-template-columns: repeat(2,1fr); } }

/* Responsive override: single column under 432px, two columns from 432px up to 899px */
@media (max-width:200px) {
	.products-grid { grid-template-columns: 1fr !important; }
}
@media (min-width:432px) and (max-width:200px) {
	.products-grid { grid-template-columns: repeat(2,1fr) !important; }
}

/* Page-specific overrides to avoid large global rules from other stylesheets
	 forcing product cards off-screen or with incorrect sizing. These are safe
	 and scoped to #accessoriesGrid only. */
#accessoriesGrid.product-grid-reset, #accessoriesGrid.products-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
	gap: 14px !important;
}
#accessoriesGrid .product-card {
	flex: none !important;
	max-width: none !important;
	display: block !important;
	background: #fff !important;
	color: #000 !important;
	padding: 12px !important;
	border-radius: 8px !important;
	box-shadow: 0 6px 18px rgba(0,0,0,0.04) !important;
	min-height: 0 !important;
}
#accessoriesGrid .product-img {
	max-height: 160px !important;
	height: auto !important;
	display: block !important;
	object-fit: contain !important;
}