/**
 * Shared listing grid loading state (mobile + bike AJAX filters).
 * Cross-product chrome: lives under `assets/css/global/`; enqueued via {@see \Core\Bootstrap\FrontendAssets\ListingAjaxGridAssetsRegistrar}.
 *
 * @package NewTechPrice
 */

[data-ntp-listing-grid][aria-busy='true'] {
	position: relative;
	pointer-events: none;
	min-height: 12rem;
}

[data-ntp-listing-grid][aria-busy='true']::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 0.75rem;
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	background: linear-gradient(
		110deg,
		color-mix(in srgb, var(--ntp-surface-color, #f1f2f6) 35%, transparent) 0%,
		color-mix(in srgb, var(--ntp-surface-color, #f1f2f6) 85%, transparent) 40%,
		color-mix(in srgb, var(--ntp-surface-color, #f1f2f6) 35%, transparent) 80%
	);
	background-size: 200% 100%;
	animation: ntp-listing-skeleton-shimmer 1.1s ease-in-out infinite;
	pointer-events: none;
}

[data-theme='dark'] [data-ntp-listing-grid][aria-busy='true']::after {
	background: linear-gradient(
		110deg,
		color-mix(in srgb, var(--ntp-surface-color, #1e293b) 40%, transparent) 0%,
		color-mix(in srgb, var(--ntp-border-color, #334155) 75%, transparent) 45%,
		color-mix(in srgb, var(--ntp-surface-color, #1e293b) 40%, transparent) 80%
	);
	background-size: 200% 100%;
}

@keyframes ntp-listing-skeleton-shimmer {
	0% {
		background-position: 100% 0;
	}
	100% {
		background-position: -100% 0;
	}
}