/**
 * Product Sheet Skeleton — PRE-001.1
 *
 * Structural placeholders mirroring pg-product-sheet-layout to avoid empty
 * sheet frames and minimize CLS when AJAX content arrives.
 *
 * @package PasionGift_App
 */

.pg-product-sheet-skeleton {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
	min-width: 0;
	width: 100%;
	overflow: hidden;
}

.pg-product-sheet-skeleton[hidden] {
	display: none !important;
}

.pg-product-sheet-skeleton__label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.pg-product-sheet-skeleton__layout {
	flex: 1 1 auto;
	pointer-events: none;
	user-select: none;
}

.pg-product-sheet-skeleton__bone {
	display: block;
	border-radius: var(--pg-radius-full);
	background: linear-gradient(
		110deg,
		var(--pg-color-interactive-bg) 8%,
		rgba(207, 186, 165, 0.45) 18%,
		var(--pg-color-interactive-bg) 33%
	);
	background-size: 200% 100%;
	animation: pg-product-sheet-skeleton-shimmer 1.4s ease-in-out infinite;
}

.pg-product-sheet-skeleton__gallery {
	display: flex;
	justify-content: center;
	padding-top: 0.25rem;
}

.pg-product-sheet-skeleton__bone--media {
	width: min(100%, min(42dvh, 18rem));
	max-height: min(42dvh, 18rem);
	aspect-ratio: 1 / 1;
	border-radius: var(--pg-radius-sm);
	background-color: var(--pg-color-interactive-bg);
}

.pg-product-sheet-skeleton__summary {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.375rem;
	padding: 0.625rem calc(1rem + var(--pg-safe-right)) 0.75rem calc(1rem + var(--pg-safe-left));
	border-bottom: 1px solid var(--pg-color-border-subtle);
	background-color: var(--pg-color-surface);
	min-width: 0;
}

.pg-product-sheet-skeleton__summary-main {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	min-width: 0;
}

.pg-product-sheet-skeleton__bone--thumb {
	flex-shrink: 0;
	width: 3.5rem;
	height: 3.5rem;
	border-radius: var(--pg-radius-sm);
	border: 1px solid var(--pg-color-border-subtle);
}

.pg-product-sheet-skeleton__identity {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 0.375rem;
	min-width: 0;
}

.pg-product-sheet-skeleton__bone--title {
	height: 0.75rem;
	width: 88%;
}

.pg-product-sheet-skeleton__bone--title-short {
	height: 0.75rem;
	width: 62%;
	animation-delay: 0.08s;
}

.pg-product-sheet-skeleton__bone--price {
	height: 0.625rem;
	width: 36%;
	margin-top: 0.125rem;
	animation-delay: 0.12s;
}

.pg-product-sheet-skeleton__bone--cta {
	height: 0.625rem;
	width: 11rem;
	max-width: 70%;
	animation-delay: 0.16s;
}

.pg-product-sheet-skeleton__scroll {
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
	padding: 0.875rem calc(1rem + var(--pg-safe-right)) 0.75rem calc(1rem + var(--pg-safe-left));
}

.pg-product-sheet-skeleton__bone--benefit {
	height: 0.625rem;
	width: 78%;
}

.pg-product-sheet-skeleton__bone--info {
	height: 2.75rem;
	width: 100%;
	border-radius: var(--pg-radius-md);
	animation-delay: 0.1s;
}

.pg-product-sheet-skeleton__bone--info-short {
	height: 2.75rem;
	width: 100%;
	border-radius: var(--pg-radius-md);
	animation-delay: 0.18s;
}

.pg-product-sheet-skeleton__footer {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	padding: 0.75rem calc(1rem + var(--pg-safe-right)) calc(0.75rem + var(--pg-safe-bottom)) calc(1rem + var(--pg-safe-left));
	border-top: 1px solid var(--pg-color-border-subtle);
	background-color: var(--pg-color-surface);
	box-shadow: 0 -0.25rem 1rem rgb(15 15 20 / 0.06);
}

.pg-product-sheet-skeleton__bone--qty {
	height: var(--pg-touch-target);
	width: 5rem;
	border-radius: var(--pg-radius-sm);
}

.pg-product-sheet-skeleton__bone--atc {
	height: var(--pg-touch-target);
	width: 100%;
	border-radius: var(--pg-radius-full);
	animation-delay: 0.14s;
}

@keyframes pg-product-sheet-skeleton-shimmer {
	0% {
		background-position: 100% 0;
	}

	100% {
		background-position: -100% 0;
	}
}

@media (min-width: 360px) {
	.pg-product-sheet-skeleton__footer {
		flex-direction: row;
		align-items: flex-end;
	}

	.pg-product-sheet-skeleton__bone--atc {
		flex: 1 1 auto;
		width: auto;
		min-width: 0;
	}
}

@media (max-width: 359px) {
	.pg-product-sheet-skeleton__summary {
		padding-inline: calc(0.875rem + var(--pg-safe-left)) calc(0.875rem + var(--pg-safe-right));
	}

	.pg-product-sheet-skeleton__bone--thumb {
		width: 3rem;
		height: 3rem;
	}

	.pg-product-sheet-skeleton__scroll {
		padding-inline: calc(0.875rem + var(--pg-safe-left)) calc(0.875rem + var(--pg-safe-right));
	}
}

@media (prefers-reduced-motion: reduce) {
	.pg-product-sheet-skeleton__bone {
		animation: none;
		background: var(--pg-color-interactive-bg);
	}
}