/*
 * "Polaroid Product" block style — applied to a `workbench/shop-collection`
 * block via `is-style-polaroid-product`. Each card becomes a
 * polaroid-style photo card: white photo paper with a generous
 * bottom caption area, drop shadow, and an alternating tilt for
 * scrapbook character.
 *
 * Targets both `.wb-category-card` (categories mode) and
 * `.wb-product-card` (products mode) so the look applies in either
 * mode. Pairs visually with the existing Polaroid (image) block
 * style and the Scrapbook gallery style.
 */

.wp-block-workbench-shop-collection.is-style-polaroid-product .wb-category-card,
.wp-block-workbench-shop-collection.is-style-polaroid-product .wb-product-card {
	background: #fdfaf2;
	padding: 0.75rem 0.75rem 1.6rem;
	box-shadow:
		0 12px 24px rgba(40, 30, 20, 0.22),
		0 3px 6px rgba(40, 30, 20, 0.14);
	transition:
		transform 0.3s ease,
		box-shadow 0.3s ease,
		z-index 0s linear 0.3s;
	border-radius: 0;
	position: relative;
}

/* Alternating tilt by sibling position so the grid reads as casually
 * placed photos rather than a uniform card grid. nth-of-type lets us
 * reach across DOM siblings (children of `.wb-shop-collection__grid`). */
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-category-card:nth-child(3n + 1),
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card:nth-child(3n + 1) {
	transform: rotate(-1.5deg);
}
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-category-card:nth-child(3n + 2),
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card:nth-child(3n + 2) {
	transform: rotate(1deg);
}
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-category-card:nth-child(3n),
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card:nth-child(3n) {
	transform: rotate(-0.5deg);
}

/* Hover: straighten + lift, pull to front so neighbours don't clip. */
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-category-card:hover,
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card:hover {
	transform: rotate(0deg) translateY(-4px);
	z-index: 5;
	box-shadow:
		0 18px 32px rgba(40, 30, 20, 0.3),
		0 5px 10px rgba(40, 30, 20, 0.18);
	transition:
		transform 0.3s ease,
		box-shadow 0.3s ease,
		z-index 0s linear 0s;
}

/* Image: tight rectangle, no rounded corners — polaroid window. */
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-category-card__image-wrap,
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card__image-wrap {
	margin: 0 0 0.85rem;
	border-radius: 0;
	overflow: hidden;
}

/* Title: hand-drawn cursive figcaption-style. Centre-aligned to fit
 * the polaroid caption convention. */
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-category-card__title,
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card__title {
	font-family: "Caveat", "Patrick Hand", "Georgia", serif;
	font-size: 1.4em;
	font-weight: 600;
	color: #4a3520;
	text-align: center;
	letter-spacing: 0.01em;
	line-height: 1.2;
	margin: 0.4rem 0.25rem 0.25rem;
}

.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-category-card__description,
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card__description {
	font-style: italic;
	text-align: center;
	color: #6a5538;
	opacity: 0.85;
	font-size: 0.9em;
	line-height: 1.4;
	margin: 0 0.25rem 0.25rem;
}

/* Price: hand-drawn style to match the title aesthetic. */
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card__price {
	font-family: "Caveat", "Patrick Hand", "Georgia", serif;
	font-size: 1.25em;
	font-weight: 700;
	color: #4a3520;
	text-align: center;
	opacity: 1;
	margin: 0.25rem 0;
}

/* Cart button: tighter, fits the polaroid bottom area. */
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card__button,
.wp-block-workbench-shop-collection.is-style-polaroid-product
	.wb-product-card__cart-btn {
	margin-top: 0.5rem;
	border-radius: 4px;
}

/* Reduced motion: keep the static look — no hover lift, no rotation. */
@media (prefers-reduced-motion: reduce) {
	.wp-block-workbench-shop-collection.is-style-polaroid-product
		.wb-category-card,
	.wp-block-workbench-shop-collection.is-style-polaroid-product
		.wb-product-card {
		transform: none !important;
		transition: none;
	}
	.wp-block-workbench-shop-collection.is-style-polaroid-product
		.wb-category-card:hover,
	.wp-block-workbench-shop-collection.is-style-polaroid-product
		.wb-product-card:hover {
		transform: none !important;
	}
}