/* =========================================================================
 * Tap N Roll Singles — Collection / PLP
 * ========================================================================= */

.tnr-plp { padding-bottom: var(--tnr-s-8); }

.tnr-plp__hero {
	padding: var(--tnr-s-6) 0 var(--tnr-s-4);
	border-bottom: 1px solid var(--tnr-line);
	margin-bottom: var(--tnr-s-5);
}
.tnr-plp__title {
	font-family: var(--tnr-font-display);
	font-size: clamp(40px, 6vw, 64px);
	letter-spacing: var(--tnr-ls-display);
	margin: var(--tnr-s-2) 0 0;
	color: var(--tnr-text);
}

.tnr-plp__toolbar {
	position: sticky;
	top: 0;
	z-index: 5;
	background: linear-gradient(180deg, var(--tnr-bg), rgba(15,17,21,0.92));
	backdrop-filter: blur(6px);
	padding: var(--tnr-s-3) 0;
	margin-bottom: var(--tnr-s-5);
	border-bottom: 1px solid var(--tnr-line);
}
.tnr-plp__filters {
	display: flex;
	flex-wrap: wrap;
	gap: var(--tnr-s-2);
}
.tnr-input--search { flex: 1 1 260px; min-width: 220px; }
.tnr-input--select { flex: 0 0 auto; }

/* ShopWP renders products inside .wp-shopify .wps-products. We grid-ify it
   without touching ShopWP's own markup. */
.tnr-plp__grid .wp-shopify .wps-products,
.tnr-plp__grid .wp-shopify .wps-collection-products {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
	gap: var(--tnr-s-4) !important;
	list-style: none;
	padding: 0;
	margin: 0;
}
.tnr-plp__grid .wp-shopify .wps-products > li,
.tnr-plp__grid .wp-shopify .wps-collection-products > li {
	background: var(--tnr-card);
	border: 1px solid var(--tnr-line);
	border-radius: var(--tnr-r-3);
	padding: var(--tnr-s-3);
	transition: border-color var(--tnr-dur-fast) var(--tnr-ease),
	            transform var(--tnr-dur-fast) var(--tnr-ease);
}
.tnr-plp__grid .wp-shopify .wps-products > li:hover,
.tnr-plp__grid .wp-shopify .wps-collection-products > li:hover {
	border-color: var(--tnr-amber);
	transform: translateY(-2px);
}
.tnr-plp__grid .wp-shopify img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--tnr-r-2);
}
.tnr-plp__grid .wp-shopify .wps-product-title {
	font: 500 14px/1.25 var(--tnr-font-body);
	color: var(--tnr-text);
	margin: var(--tnr-s-3) 0 var(--tnr-s-1);
}
.tnr-plp__grid .wp-shopify .wps-product-price {
	font-family: var(--tnr-font-display);
	font-size: 22px;
	letter-spacing: var(--tnr-ls-display);
	color: var(--tnr-amber);
}
