/* =========================================================================
   Factorize Catalog - Infinite Scroll Enhancements
   =========================================================================
   Added: 2026-09-24
   
   Smooth fade-in for new cards, content-visibility for off-screen skipping,
   and image preloading from AJAX responses.
   ========================================================================= */

/* Off-screen cards are skipped by the browser (each card after the first dozen, not the
   whole grid, so the first rows always lay out normally). "auto" in the size remembers
   a card's real height after it has been shown, which keeps the scrollbar and
   Back-button restore steady. */
ul.products > li.product:nth-child(n+13) {
	content-visibility: auto;
	contain-intrinsic-size: auto 380px;
}

ul.products.et-restoring > li.product { content-visibility: visible; }

/* 1.3.5: with continuous scrolling on, shoppers see neither "Showing 1-16 of
   N results" nor the page-number bar. The links stay in the page for search
   engines (hidden by clipping, not display:none), and a noscript rule in
   <head> shows them again without JavaScript. If the loader fails, the bar
   comes back (body.fz-infinite-failed). */
body.fz-infinite .woocommerce-result-count { display: none; }
body.fz-infinite:not(.fz-infinite-failed) nav.woocommerce-pagination {
	position: absolute !important;
	width: 1px; height: 1px; margin: -1px; padding: 0; border: 0;
	overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

/* The short total that replaces the count: "2,546 products". */
.et-scroll-total {
	margin: 0; font-size: 13px; line-height: 1.3; font-weight: 600;
	color: var(--et-muted, #5f5f5f);
	float: left; clear: none;
}
@media (max-width: 699px) {
	.woocommerce .et-scroll-total { float: left; margin: 0 0 8px; }
}

/* Fade in newly appended cards */
ul.products li.product.is-new-card a img {
	opacity: 0;
}
ul.products li.product.is-new-card {
	animation: wc-card-fade-in .4s ease forwards;
}

@keyframes wc-card-fade-in {
	from { opacity: 0; transform: translateY(8px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* Scroll sentinel styling */
.et-scroll-sentinel {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 16px 0;
	clear: both;
}
.et-scroll-spinner {
	width: 20px;
	height: 20px;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: wc-scroll-spin 0.8s linear infinite;
}
.et-scroll-label {
	font-family: inherit;
	font-size: 13px;
	color: var(--et-muted, #5f5f5f);
}
@keyframes wc-scroll-spin {
	to { transform: rotate(360deg); }
}
.et-scroll-end {
	font-family: inherit;
	font-size: 14px;
	color: var(--et-muted, #5f5f5f);
	text-align: center;
	padding: 16px 0 8px;
	clear: both;
}