/**

 * ETA SiteLoader — calm B2B navy loader (not Geex purple).

 * #siteLoader: fixed bottom-right, high z-index, pointer-events:none (critical).

 * v1.5 — corner-first (no centered phase); truthful hide owned by JS.

 */



:root {

	--eta-loader-navy: #001f3f;

	--eta-loader-soft: #f2f8fb;

	--eta-loader-ink: rgba(0, 31, 63, 0.92);

	--eta-loader-muted: rgba(0, 31, 63, 0.55);

	--eta-loader-radius: 999px;

	--eta-loader-z: 100050; /* above cmplz 99980 + admin-bar 99999; clicks pass (pointer-events:none) */

	--eta-loader-pad: 20px;

}



#siteLoader.eta-site-loader {

	position: fixed;

	inset: 0;

	z-index: var(--eta-loader-z);

	pointer-events: none !important;

	display: flex;

	align-items: flex-end;

	justify-content: flex-end;

	padding: 0 var(--eta-loader-pad) var(--eta-loader-pad) 0;

	opacity: 0;

	visibility: hidden;

	transition: opacity 0.18s ease, visibility 0.18s ease;

}



#siteLoader.eta-site-loader.is-active {

	opacity: 1;

	visibility: visible;

}



#siteLoader.eta-site-loader[hidden] {

	display: none !important;

}



#siteLoader.eta-site-loader.is-active[hidden] {

	display: flex !important;

}



.eta-site-loader__panel {

	display: flex;

	flex-direction: column;

	align-items: center;

	gap: 8px;

	padding: 10px 14px;

	background: rgba(255, 255, 255, 0.96);

	border: 1px solid rgba(0, 31, 63, 0.08);

	border-radius: 14px;

	box-shadow: 0 8px 28px -6px rgba(0, 31, 63, 0.18);

	transform: translateY(0) scale(1);

	transition: transform 0.28s ease, padding 0.28s ease, gap 0.28s ease, border-radius 0.28s ease;

}



.eta-site-loader__pill {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	padding: 5px 11px;

	border-radius: var(--eta-loader-radius);

	background: var(--eta-loader-soft);

	color: var(--eta-loader-ink);

	font-family: "Instrument Sans", system-ui, sans-serif;

	font-size: 12.5px;

	font-weight: 560;

	letter-spacing: 0.01em;

	line-height: 1.2;

	white-space: nowrap;

}



.eta-site-loader__dot {

	width: 7px;

	height: 7px;

	border-radius: 50%;

	background: var(--eta-loader-navy);

	animation: eta-loader-pulse 1.1s ease-in-out infinite;

}



.eta-site-loader__bar {

	display: block;

	width: 112px;

	height: 2px;

	border-radius: 999px;

	background: rgba(0, 31, 63, 0.08);

	overflow: hidden;

}



.eta-site-loader__bar-fill {

	display: block;

	height: 100%;

	width: 40%;

	border-radius: inherit;

	background: linear-gradient(90deg, transparent, var(--eta-loader-navy), transparent);

	animation: eta-loader-bar 1.15s ease-in-out infinite;

}



.eta-site-loader__spinner {

	display: none;

	width: 20px;

	height: 20px;

	border: 2px solid rgba(0, 31, 63, 0.12);

	border-top-color: var(--eta-loader-navy);

	border-radius: 50%;

	animation: eta-loader-spin 0.7s linear infinite;

}



/* Long request — compact spinner only (still bottom-right) */

#siteLoader.eta-site-loader.is-docked .eta-site-loader__panel {

	padding: 10px;

	gap: 0;

	border-radius: 50%;

	min-width: 0;

}



#siteLoader.eta-site-loader.is-docked .eta-site-loader__pill,

#siteLoader.eta-site-loader.is-docked .eta-site-loader__bar {

	display: none;

}



#siteLoader.eta-site-loader.is-docked .eta-site-loader__spinner {

	display: block;

}



body.admin-bar #siteLoader.eta-site-loader {

	/* keep clear of WP admin bar on tall viewports — pad already bottom-right */

	padding-top: 32px;

}



/* Skeletons */

.eta-skeleton {

	display: grid;

	gap: 16px;

	width: 100%;

}



.eta-skeleton--cards,

.eta-skeleton--product-cards {

	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));

}



.eta-skeleton__card,

.eta-skeleton__row,

.eta-skeleton__line,

.eta-skeleton__product,

.eta-skeleton__bone {

	position: relative;

	overflow: hidden;

	background: rgba(0, 31, 63, 0.06);

	border-radius: 12px;

}



.eta-skeleton__card {

	aspect-ratio: 3 / 4;

}



/* Product card anatomy: image + title + price + button (matches .eta-product-card) */

.eta-skeleton__product {

	display: flex;

	flex-direction: column;

	gap: 12px;

	min-height: 0;

	background: #fff;

	border: 1px solid rgba(0, 31, 63, 0.08);

	border-radius: 14px;

	padding: 0 0 14px;

	box-sizing: border-box;

	overflow: hidden;

}



.eta-skeleton__product-img {

	width: 100%;

	aspect-ratio: 1 / 1;

	border-radius: 0;

	background: rgba(0, 31, 63, 0.07);

}



.eta-skeleton__product-body {

	display: flex;

	flex-direction: column;

	gap: 10px;

	padding: 0 12px;

	flex: 1 1 auto;

}



.eta-skeleton__product-title {

	height: 14px;

	width: 88%;

	border-radius: 6px;

	background: rgba(0, 31, 63, 0.08);

}



.eta-skeleton__product-title--short {

	width: 62%;

	height: 12px;

}



.eta-skeleton__product-price {

	height: 13px;

	width: 38%;

	border-radius: 6px;

	background: rgba(0, 31, 63, 0.1);

}



.eta-skeleton__product-btn {

	margin-top: 6px;

	height: 38px;

	width: 100%;

	border-radius: 10px;

	background: rgba(0, 31, 63, 0.12);

}



.eta-skeleton__row {

	height: 56px;

	border-radius: 10px;

}



.eta-skeleton__line {

	height: 12px;

	border-radius: 6px;

}



.eta-skeleton__line:nth-child(odd) {

	width: 92%;

}



.eta-skeleton__line:nth-child(even) {

	width: 72%;

}



.eta-skeleton__card::after,

.eta-skeleton__row::after,

.eta-skeleton__line::after,

.eta-skeleton__product-img::after,

.eta-skeleton__product-title::after,

.eta-skeleton__product-price::after,

.eta-skeleton__product-btn::after {

	content: "";

	position: absolute;

	inset: 0;

	background: linear-gradient(

		90deg,

		transparent 0%,

		rgba(255, 255, 255, 0.55) 45%,

		transparent 90%

	);

	transform: translateX(-100%);

	animation: eta-skeleton-shimmer 1.25s ease-in-out infinite;

}



.eta-skeleton__product-img,

.eta-skeleton__product-title,

.eta-skeleton__product-price,

.eta-skeleton__product-btn {

	position: relative;

	overflow: hidden;

}



@keyframes eta-loader-pulse {

	0%, 100% { opacity: 0.35; transform: scale(0.9); }

	50% { opacity: 1; transform: scale(1); }

}



@keyframes eta-loader-bar {

	0% { transform: translateX(-120%); }

	100% { transform: translateX(280%); }

}



@keyframes eta-loader-spin {

	to { transform: rotate(360deg); }

}



@keyframes eta-skeleton-shimmer {

	100% { transform: translateX(100%); }

}



@media (prefers-reduced-motion: reduce) {

	.eta-site-loader__dot,

	.eta-site-loader__bar-fill,

	.eta-site-loader__spinner,

	.eta-skeleton__card::after,

	.eta-skeleton__row::after,

	.eta-skeleton__line::after,

	.eta-skeleton__product-img::after,

	.eta-skeleton__product-title::after,

	.eta-skeleton__product-price::after,

	.eta-skeleton__product-btn::after {

		animation: none !important;

	}



	.eta-skeleton__card::after,

	.eta-skeleton__row::after,

	.eta-skeleton__line::after,

	.eta-skeleton__product-img::after,

	.eta-skeleton__product-title::after,

	.eta-skeleton__product-price::after,

	.eta-skeleton__product-btn::after {

		display: none;

	}



	#siteLoader.eta-site-loader {

		transition-duration: 0.01ms;

	}



	.eta-site-loader__dot {

		opacity: 0.85;

	}

}



@media (max-width: 767px) {

	:root {

		--eta-loader-pad: 14px;

	}



	.eta-site-loader__bar {

		width: 96px;

	}

}


