/* Heaven Product Experience: small, editorial catalogue enhancements. */
.prototype-bar {
	display: none !important;
}

.heaven-size-picker {
	margin: 1.35rem 0 1.15rem;
	padding: 0;
	border: 0;
}

/* The theme gives ordinary cart forms a horizontal flex layout. A variable
 * product has several stacked controls, so keep this form vertical and let
 * the size cards and extras use the full summary-column width. */
body.single-product form.cart.variations_form {
	display: block !important;
	width: 100%;
	margin: 24px 0 26px;
}

body.single-product form.cart.variations_form .heaven-size-picker,
body.single-product form.cart.variations_form .variations,
body.single-product form.cart.variations_form .single_variation_wrap {
	width: 100%;
	max-width: 100%;
}

/* Keep the friendly cards visible even if a block/theme delays its script. */
.heaven-size-picker.is-pending {
	display: block;
}

/* The native select remains in the form for WooCommerce and screen readers,
 * but the cards are the visible choice. JavaScript still synchronises it. */
body.single-product form.cart.variations_form .heaven-size-picker ~ table.variations {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.heaven-size-picker legend {
	margin-bottom: .7rem;
	color: #244b3b;
	font-size: clamp(1.05rem, 2vw, 1.35rem);
	font-weight: 700;
}

.heaven-size-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: .7rem;
}

.heaven-size-card {
	position: relative;
	display: block;
	min-width: 0;
	cursor: pointer;
}

.heaven-size-card > input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.heaven-size-content {
	display: grid;
	min-height: 11.5rem;
	align-content: start;
	justify-items: start;
	gap: .22rem;
	padding: .95rem .9rem .85rem;
	border: 1px solid rgba(36, 75, 59, .2);
	border-radius: 16px;
	background: rgba(255, 252, 244, .7);
	box-shadow: 0 5px 18px rgba(36, 75, 59, .04);
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}

.heaven-size-card:hover .heaven-size-content,
.heaven-size-card > input:focus-visible + .heaven-size-content {
	border-color: #5f8b6f;
	box-shadow: 0 8px 22px rgba(36, 75, 59, .12);
	transform: translateY(-1px);
}

.heaven-size-card > input:checked + .heaven-size-content {
	border-color: #244b3b;
	background: #f1f5e9;
	box-shadow: 0 8px 24px rgba(36, 75, 59, .14);
}

.heaven-size-card strong {
	color: #244b3b;
	font-size: 1rem;
}

.heaven-size-card small {
	margin-top: .22rem;
	color: #5a645c;
	font-size: .76rem;
	line-height: 1.35;
}

.heaven-size-icon {
	position: relative;
	display: block;
	width: 4rem;
	height: 2.9rem;
	margin: .05rem 0 .55rem;
	border-radius: 50% 50% 42% 42%;
	background: #e9cfae;
	box-shadow: inset 0 -.48rem 0 rgba(172, 111, 78, .16), 0 3px 0 rgba(36, 75, 59, .12);
}

.heaven-size-icon::before,
.heaven-size-icon::after {
	position: absolute;
	content: '';
	display: block;
	border-radius: 50%;
}

.heaven-size-icon::before {
	left: 12%;
	right: 12%;
	top: -.34rem;
	height: .75rem;
	background: #fff3d7;
	box-shadow: inset 0 -.08rem 0 rgba(172, 111, 78, .15);
}

.heaven-size-icon::after {
	left: 38%;
	top: .42rem;
	width: .28rem;
	height: .28rem;
	background: #668d6c;
	box-shadow: .64rem .2rem 0 #d08b73, 1.2rem -.08rem 0 #668d6c, -.62rem .22rem 0 #d08b73;
}

.heaven-size-small .heaven-size-icon,
.heaven-size-icon.heaven-size-small {
	width: 3.3rem;
	height: 2.5rem;
}

.heaven-size-large.heaven-size-icon {
	width: 4.7rem;
	height: 3.25rem;
}

.heaven-size-servings {
	color: #3e6b50;
	font-size: .94rem;
	font-weight: 600;
}

.heaven-size-price {
	margin-top: .25rem;
	color: #244b3b;
	font-size: 1.35rem;
	line-height: 1.25;
	font-weight: 700;
}

.heaven-size-hint {
	margin: .85rem 0 0;
	color: #626a62;
	font-size: 1.05rem;
	line-height: 1.5;
}

.heaven-draft-note {
	margin: .65rem 0 0;
	color: #626a62;
	font-size: .82rem;
	line-height: 1.45;
}

.heaven-draft-note {
	padding: .65rem .8rem;
	border-left: 3px solid #d19a64;
	background: #fff8ec;
}

/* The size cards are the friendly control; WooCommerce still owns the real select. */
.heaven-size-variation-row {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.heaven-area {
	margin: 1.4rem 0 1.1rem;
	padding: clamp(1rem, 3vw, 1.45rem);
	border: 1px solid rgba(36, 75, 59, .16);
	border-radius: 18px;
	background: linear-gradient(135deg, rgba(242, 247, 235, .9), rgba(255, 250, 240, .95));
}

.heaven-area h3 {
	margin: 0 0 .2rem;
	color: #244b3b;
	font-size: 1.08rem;
}

.heaven-area-inner > p {
	margin: 0 0 .8rem;
	color: #526057;
	font-size: .9rem;
}

.heaven-postcode-form label {
	display: block;
	margin-bottom: .3rem;
	color: #244b3b;
	font-size: .82rem;
	font-weight: 700;
}

.heaven-postcode-row {
	display: flex;
	gap: .5rem;
	max-width: 28rem;
}

.heaven-postcode-row input {
	min-width: 0;
	flex: 1 1 auto;
	border-color: rgba(36, 75, 59, .26);
	min-height: 48px;
	padding: .75rem 1rem;
	border-radius: 7px !important;
	background: #fffef9;
	font: inherit;
}

.heaven-postcode-row button {
	flex: 0 0 auto;
	min-height: 48px;
	padding: .75rem 1.1rem;
	border: 1px solid #294e3c !important;
	border-radius: 7px !important;
	background: #294e3c !important;
	color: #fffdf5 !important;
	cursor: pointer;
	font: inherit;
	font-weight: 600;
}

.heaven-postcode-row button:hover,
.heaven-postcode-row button:focus-visible {
	background: #1f402f !important;
}

.heaven-postcode-result {
	min-height: 1.25em;
	margin: .55rem 0 0;
	color: #244b3b;
	font-size: .86rem;
	font-weight: 600;
}

.heaven-postcode-result.is-error {
	color: #984b3e;
}

.heaven-postcode-result.is-loading {
	color: #6d736c;
}

.heaven-area-inner > small {
	display: block;
	margin-top: .75rem;
	color: #687068;
	font-size: .76rem;
	line-height: 1.45;
}

.heaven-area-compact {
	margin: 0 0 1rem;
	padding: .78rem 1rem;
	border-radius: 14px;
	background: rgba(242, 247, 235, .72);
}

.heaven-area-compact summary {
	color: #244b3b;
	cursor: pointer;
	font-size: .9rem;
	font-weight: 700;
}

.heaven-area-compact .heaven-area-inner {
	padding-top: .8rem;
}

.heaven-product-notes {
	display: grid;
	gap: .45rem;
	margin-top: .75rem;
}

.heaven-product-notes details {
	border-top: 1px solid rgba(36, 75, 59, .14);
}

.heaven-product-notes summary {
	padding: .8rem 0;
	color: #244b3b;
	cursor: pointer;
	font-weight: 700;
}

.heaven-product-notes details > div {
	padding: 0 0 .75rem;
	color: #526057;
	font-size: .88rem;
	line-height: 1.55;
}

.heaven-product-notes ul {
	margin: 0 0 .55rem 1.15rem;
}

/* Match WooCommerce's variation price to the main product type scale. */
body.single-product form.cart .single_variation .woocommerce-variation-price .price,
body.single-product form.cart .single_variation .price {
	display: block;
	margin: .75rem 0 1rem !important;
	color: #294e3c !important;
	font-size: 1.45rem !important;
	line-height: 1.25;
	font-weight: 600;
}

/* The selected size card already displays the chosen price; avoid repeating
 * the same amount a third time below the cards. */
body.single-product form.cart.variations_form.heaven-size-picker-ready .single_variation .woocommerce-variation-price {
	display: none !important;
}

.heaven-instagram-icon {
	display: inline-flex;
	width: 20px;
	height: 20px;
	align-items: center;
	justify-content: center;
}

.heaven-instagram-icon svg {
	display: block;
	width: 20px;
	height: 20px;
}

/* Also render the mark when a saved block template bypasses render_block for
 * its nested footer pattern. The inline mark, when present, is hidden to avoid
 * showing two icons. */
.site-footer a[href*="instagram.com"]::before {
	content: '';
	display: inline-block;
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	border: 1.8px solid currentColor;
	border-radius: 5px;
	box-sizing: border-box;
	background: radial-gradient(circle at 50% 50%, transparent 0 3px, currentColor 3px 4.2px, transparent 4.2px), radial-gradient(circle at 72% 25%, currentColor 0 1.2px, transparent 1.3px);
}

.site-footer a[href*="instagram.com"] .heaven-instagram-icon {
	display: none;
}

/* Keep catalogue cards aligned when one product has less archive copy. The
 * grid supplies the row height; flex pushes each action to the same baseline. */
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product,
.heaven-live-catalogue .wc-block-product-template > li,
.heaven-live-catalogue ul.products > li.product {
	display: flex !important;
	flex-direction: column !important;
	height: 100%;
}

.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > .wc-block-components-product-image,
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > .wp-block-woocommerce-product-image,
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > .wp-block-post-featured-image {
	display: block !important;
	width: 100% !important;
	box-sizing: border-box !important;
	height: auto !important;
	aspect-ratio: 1 / 1;
	margin: 0 !important;
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	padding: 0 !important;
	padding-block-start: 0 !important;
	padding-block-end: 0 !important;
	overflow: hidden;
	line-height: 0 !important;
}

/* WooCommerce can add logical block spacing to a nested image link/figure.
 * Reset every layer that can create a top strip, while keeping the image
 * itself as the full square card area. */
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > :is(.wc-block-components-product-image, .wp-block-woocommerce-product-image, .wp-block-post-featured-image, .wc-block-grid__product-image) > a,
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > :is(.wc-block-components-product-image, .wp-block-woocommerce-product-image, .wp-block-post-featured-image, .wc-block-grid__product-image) > figure,
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > :is(.wc-block-components-product-image, .wp-block-woocommerce-product-image, .wp-block-post-featured-image, .wc-block-grid__product-image) > img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	padding: 0 !important;
	padding-block-start: 0 !important;
	padding-block-end: 0 !important;
	line-height: 0 !important;
}

.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > :is(.wc-block-components-product-image, .wp-block-woocommerce-product-image, .wp-block-post-featured-image, .wc-block-grid__product-image) > a > img,
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > :is(.wc-block-components-product-image, .wp-block-woocommerce-product-image, .wp-block-post-featured-image, .wc-block-grid__product-image) > figure > img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	padding: 0 !important;
	padding-block-start: 0 !important;
	padding-block-end: 0 !important;
	vertical-align: top !important;
	object-fit: cover;
}

.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > .wc-block-components-product-image img,
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > .wp-block-woocommerce-product-image img,
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > .wp-block-post-featured-image img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	object-fit: cover;
}

.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > .wc-block-components-product-button,
.heaven-live-catalogue .wc-block-product-template > li.wc-block-product > .wp-block-woocommerce-product-button,
.heaven-live-catalogue ul.products > li.product > .button {
	margin-top: auto !important;
}

@media (max-width: 620px) {
	.heaven-size-grid {
		grid-template-columns: 1fr;
	}

	.heaven-size-content {
		min-height: auto;
		grid-template-columns: auto 1fr;
		column-gap: .75rem;
	}

	.heaven-size-icon {
		grid-row: span 5;
		margin-top: .15rem;
	}

	.heaven-size-card small {
		margin-top: 0;
	}
}

@media (max-width: 420px) {
	.heaven-postcode-row {
		align-items: stretch;
		flex-direction: column;
	}

	.heaven-postcode-row button {
		width: 100%;
	}
}