/**
 * Single product page – De Slimme Doos.
 *
 * Styles WooCommerce's native product markup (gallery, summary, add-to-cart
 * forms, variations, stock) and the page sections of inc/product.php +
 * template-parts/product/. Loaded on single product pages only, after
 * catalog.css (product cards in "Bekijk ook").
 *
 * GeneratePress gives its content wrapper id="content". Hero rules are
 * prefixed ".single-product #content div.product .eno-product-hero" so they
 * outrank WooCommerce's own selectors (up to ".woocommerce #content
 * div.product …") without !important.
 */

/* Page shell: no white GeneratePress box -------------------------------- */

.single-product .site-main {
	margin: 0;
}

.single-product .inside-article {
	padding: 0;
	background-color: transparent;
}

.single-product .entry-content {
	margin: 0;
}

/* Notices ("… is toegevoegd aan je winkelwagen") in the page container. */
.single-product .woocommerce-notices-wrapper:not(:empty) {
	width: min(calc(100% - (2 * var(--eno-gutter))), var(--eno-content-width));
	margin: 0.5rem auto 1rem;
}

/* Hero: gallery + summary ------------------------------------------------- */

/* Gallery ≈ 54% and buy column ≈ 42% of the container on desktop, with a
   moderate gap: the image anchors the first viewport, the summary has room
   for long titles and variation selects. */
.eno-product-hero {
	position: relative;
	display: grid;
	gap: 1.75rem;
	padding-block: 0.25rem 3rem;
}

/* Must outrank WooCommerce's ".woocommerce #content div.product div.images"
   (1,3,2), which otherwise keeps both columns at 48% of their grid cell. */
.single-product #content div.product .eno-product-hero > :is(div.images, div.summary) {
	width: auto;
	margin: 0;
	float: none;
}

@media (min-width: 768px) {
	.eno-product-hero {
		grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
		/* Row 1 = gallery height, the summary spans both rows, so the
		   specifications start right below the gallery. */
		grid-template-rows: auto 1fr;
		align-items: start;
		gap: 2rem;
	}

	.single-product #content div.product .eno-product-hero > div.images {
		grid-column: 1;
		grid-row: 1;
	}

	.single-product #content div.product .eno-product-hero > div.summary {
		grid-column: 2;
		grid-row: 1 / span 2;
	}

	.eno-product-hero > .eno-product-keyspecs {
		grid-column: 1;
		grid-row: 2;
		max-width: none;
	}
}

@media (min-width: 1024px) {
	.eno-product-hero {
		grid-template-columns: minmax(0, 1.28fr) minmax(0, 1fr);
		gap: 3rem;
		padding-block: 0.5rem 4.5rem;
	}
}

@media (min-width: 1280px) {
	.eno-product-hero {
		gap: 3.5rem;
	}
}

/* Sale badge, top left on the main image (as in the shop grid). */
.single-product #content div.product .eno-product-hero > span.onsale {
	top: 1rem;
	left: 1rem;
	z-index: 10;
	min-width: 0;
	min-height: 0;
	padding: 0.375rem 0.625rem;
	border-radius: var(--eno-radius-sm);
	background-color: var(--eno-color-orange);
	color: var(--eno-color-text);
	font-size: var(--eno-text-small);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* Gallery (WooCommerce FlexSlider, zoom and PhotoSwipe stay as they are) */

.single-product #content div.product .eno-product-hero .woocommerce-product-gallery {
	margin: 0;
}

.single-product #content div.product .eno-product-hero .woocommerce-product-gallery__wrapper {
	margin: 0;
}

/* Visible warm frame (surface-low was nearly the page colour, so the image
   area did not read as one large block). */
.single-product #content div.product .eno-product-hero .flex-viewport,
.single-product #content div.product .eno-product-hero .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:only-child {
	overflow: hidden;
	border-radius: var(--eno-radius-lg);
	background-color: var(--eno-color-surface);
}

.single-product #content div.product .eno-product-hero .woocommerce-product-gallery__image {
	background-color: var(--eno-color-surface);
}

/* Square main image filling the frame: square product photos (with their
   own backdrop) run edge to edge, other ratios are centred, never cropped or
   distorted. Multiply lets white photo backgrounds take on the frame colour
   (as on the homepage). The zoom layer (img.zoomImg) sits outside the link
   and is left alone. */
.single-product #content div.product .eno-product-hero .woocommerce-product-gallery__image > a > img {
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	background-color: transparent;
	object-fit: contain;
	mix-blend-mode: multiply;
}

/* WooCommerce gives the zoom trigger z-index 99, which put it above the
   header (z-index 50) and the open mobile menu. Isolating the gallery keeps
   that z-index inside the gallery. */
.single-product #content div.product .eno-product-hero .woocommerce-product-gallery {
	isolation: isolate;
}

.single-product #content div.product .eno-product-hero .woocommerce-product-gallery__trigger {
	top: 1rem;
	right: 1rem;
	border: 1px solid var(--eno-color-surface-high);
	box-shadow: none;
}

.single-product #content div.product .eno-product-hero .woocommerce-product-gallery__trigger:focus-visible {
	outline: 2px solid var(--eno-color-orange);
	outline-offset: 2px;
}

.single-product #content div.product .eno-product-hero .flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.5rem;
	margin-top: 0.75rem;
}

/* Must outrank WooCommerce's ".woocommerce div.product div.images
   .flex-control-thumbs li { width: 25% }", which shrank every thumbnail to
   a quarter of its grid cell. */
.single-product #content div.product .eno-product-hero .flex-control-thumbs li {
	overflow: hidden;
	width: auto;
	border-radius: var(--eno-radius);
	background-color: var(--eno-color-surface);
	float: none;
}

.single-product #content div.product .eno-product-hero .flex-control-thumbs li img {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	border: 2px solid transparent;
	border-radius: var(--eno-radius);
	object-fit: cover;
	mix-blend-mode: multiply;
	opacity: 0.6;
	transition: opacity 150ms var(--eno-ease), border-color 150ms var(--eno-ease);
}

.single-product #content div.product .eno-product-hero .flex-control-thumbs li img:hover {
	opacity: 1;
}

.single-product #content div.product .eno-product-hero .flex-control-thumbs li img.flex-active {
	border-color: var(--eno-color-orange);
	opacity: 1;
}

@media (min-width: 1024px) {
	.single-product #content div.product .eno-product-hero .flex-control-thumbs {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: 0.75rem;
		margin-top: 1rem;
	}
}

/* Summary ----------------------------------------------------------------- */

.eno-product-context {
	margin: 0 0 0.625rem;
	font-size: var(--eno-text-small);
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.eno-product-context a {
	color: var(--eno-color-orange-dark);
	text-decoration: none;
	transition: color 150ms var(--eno-ease);
}

.eno-product-context a:hover,
.eno-product-context a:focus-visible {
	color: var(--eno-color-text);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.single-product #content div.product .eno-product-hero .product_title {
	margin: 0 0 0.875rem;
	font-family: var(--eno-font-heading);
	font-size: clamp(1.75rem, 1.3rem + 1.4vw, 2.5rem);
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.02em;
	overflow-wrap: break-word;
	text-wrap: balance;
}

.single-product #content div.product .eno-product-hero .summary .price {
	margin: 0 0 1.25rem;
	color: var(--eno-color-text);
	font-family: var(--eno-font-heading);
	font-size: 1.625rem;
	font-weight: 700;
	line-height: 1.2;
	font-variant-numeric: tabular-nums;
}

.single-product #content div.product .eno-product-hero .summary .price del {
	margin-right: 0.375rem;
	color: var(--eno-color-text-muted);
	font-size: 0.7em;
	font-weight: 400;
	opacity: 1;
}

.single-product #content div.product .eno-product-hero .summary .price ins {
	color: var(--eno-color-orange-dark);
	text-decoration: none;
}

.single-product #content div.product .eno-product-hero .summary .price small {
	color: var(--eno-color-text-muted);
	font-family: var(--eno-font-body);
	font-size: var(--eno-text-label);
	font-weight: 400;
}

.single-product #content div.product .eno-product-hero .woocommerce-product-details__short-description {
	max-width: 36rem;
	margin: 0 0 1.75rem;
	padding-bottom: 1.75rem;
	border-bottom: 1px solid var(--eno-color-surface-high);
	color: var(--eno-color-text-muted);
	font-size: 1.0625rem;
	line-height: 1.65;
}

.single-product #content div.product .eno-product-hero .woocommerce-product-details__short-description > :first-child {
	margin-top: 0;
}

.single-product #content div.product .eno-product-hero .woocommerce-product-details__short-description > :last-child {
	margin-bottom: 0;
}

.single-product #content div.product .eno-product-hero .woocommerce-product-details__short-description ul {
	margin: 0 0 1em 1.25em;
}

.single-product #content div.product .eno-product-hero .woocommerce-product-details__short-description a {
	color: var(--eno-color-orange-dark);
}

/* Products without a price print an empty p.price. */
.single-product #content div.product .eno-product-hero .summary .price:empty {
	display: none;
}

/* Stock (WooCommerce output inside the form) */

.single-product #content div.product .eno-product-hero .stock {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 1rem;
	color: var(--eno-color-green-ink);
	font-size: var(--eno-text-label);
	font-weight: 600;
}

.single-product #content div.product .eno-product-hero .stock::before {
	content: "";
	flex-shrink: 0;
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	background-color: var(--eno-color-green);
}

.single-product #content div.product .eno-product-hero .stock.out-of-stock {
	color: var(--eno-color-orange-dark);
}

.single-product #content div.product .eno-product-hero .stock.out-of-stock::before {
	background-color: var(--eno-color-orange-dark);
}

.single-product #content div.product .eno-product-hero .stock.available-on-backorder {
	color: var(--eno-color-kraft-ink);
}

.single-product #content div.product .eno-product-hero .stock.available-on-backorder::before {
	background-color: var(--eno-color-orange);
}

/* Add to cart: quantity + button in one row ------------------------------- */

.single-product #content div.product .eno-product-hero form.cart {
	margin: 0 0 1.25rem;
}

.single-product #content div.product .eno-product-hero form.cart:not(.variations_form, .grouped_form),
.single-product #content div.product .eno-product-hero .woocommerce-variation-add-to-cart {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0.5rem;
}

.single-product #content div.product .eno-product-hero form.cart::before,
.single-product #content div.product .eno-product-hero form.cart::after,
.single-product #content div.product .eno-product-hero .woocommerce-variation-add-to-cart::before,
.single-product #content div.product .eno-product-hero .woocommerce-variation-add-to-cart::after {
	display: none;
}

.single-product #content div.product .eno-product-hero form.cart div.quantity {
	margin: 0;
	float: none;
}

.single-product #content div.product .eno-product-hero .quantity .qty {
	width: 5rem;
	height: 3.5rem;
	padding: 0 0.25rem;
	border: 1px solid var(--eno-color-outline);
	border-radius: var(--eno-radius-sm);
	background-color: var(--eno-color-white);
	color: var(--eno-color-text);
	font-size: 1.0625rem;
	font-weight: 600;
	text-align: center;
	font-variant-numeric: tabular-nums;
}

.single-product #content div.product .eno-product-hero .quantity .qty:focus {
	border-color: var(--eno-color-orange);
	outline: 2px solid var(--eno-color-orange-tint);
	outline-offset: 0;
}

/* Primary button: brand orange with dark text (white on #f27111 is too low
   in contrast), darker orange with white text on hover. */
.single-product #content div.product .eno-product-hero form.cart .single_add_to_cart_button {
	display: inline-flex;
	flex: 1 1 12rem;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 3.5rem;
	margin: 0;
	padding: 0.75rem 2rem;
	border: 1px solid var(--eno-color-orange);
	border-radius: var(--eno-radius-sm);
	background-color: var(--eno-color-orange);
	box-shadow: var(--eno-shadow-sm);
	color: var(--eno-color-text);
	font-family: var(--eno-font-body);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.01em;
	text-align: center;
	transition: background-color 150ms var(--eno-ease), border-color 150ms var(--eno-ease), color 150ms var(--eno-ease), box-shadow 150ms var(--eno-ease);
}

.single-product #content div.product .eno-product-hero form.cart .single_add_to_cart_button:hover,
.single-product #content div.product .eno-product-hero form.cart .single_add_to_cart_button:focus-visible {
	border-color: var(--eno-color-orange-dark);
	background-color: var(--eno-color-orange-dark);
	box-shadow: var(--eno-shadow-md);
	color: var(--eno-color-white);
}

.single-product #content div.product .eno-product-hero form.cart .single_add_to_cart_button:focus-visible {
	outline: 2px solid var(--eno-color-orange);
	outline-offset: 3px;
}

/* Variable product before a choice is made, or out of stock (also beats
   WooCommerce's purple :disabled:hover rule). */
.single-product #content div.product .eno-product-hero form.cart .single_add_to_cart_button.button:is(.disabled, :disabled),
.single-product #content div.product .eno-product-hero form.cart .single_add_to_cart_button.button:is(.disabled, :disabled):hover {
	border-color: var(--eno-color-orange);
	background-color: var(--eno-color-orange);
	box-shadow: none;
	color: var(--eno-color-text);
	cursor: not-allowed;
	opacity: 0.5;
}

/* WooCommerce adds .loading while the AJAX request runs. */
.single-product #content div.product .eno-product-hero form.cart .single_add_to_cart_button.loading {
	opacity: 0.75;
}

/* Variations */

.single-product #content div.product .eno-product-hero table.variations {
	width: 100%;
	margin: 0 0 1.25rem;
	border: 0;
	border-collapse: collapse;
}

.single-product #content div.product .eno-product-hero table.variations tr {
	display: block;
	margin: 0 0 1rem;
}

.single-product #content div.product .eno-product-hero table.variations :is(th, td) {
	display: block;
	padding: 0;
	border: 0;
	background: none;
	text-align: left;
	line-height: 1.4;
}

.single-product #content div.product .eno-product-hero table.variations th.label {
	padding-bottom: 0.5rem;
}

.single-product #content div.product .eno-product-hero table.variations label {
	color: var(--eno-color-text);
	font-size: var(--eno-text-label);
	font-weight: 700;
}

.single-product #content div.product .eno-product-hero table.variations select {
	width: 100%;
	min-width: 0;
	max-width: none;
	min-height: 3.25rem;
	margin: 0;
	padding: 0 2.75rem 0 1rem;
	border: 1px solid var(--eno-color-outline);
	border-radius: var(--eno-radius-sm);
	background-color: var(--eno-color-white);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 -960 960 960'%3E%3Cpath fill='%23584236' d='M480-345 240-585l56-56 184 184 184-184 56 56-240 240Z'/%3E%3C/svg%3E");
	background-position: right 0.75rem center;
	background-repeat: no-repeat;
	background-size: 1.25rem;
	color: var(--eno-color-text);
	font-size: 1rem;
	appearance: none;
	cursor: pointer;
}

.single-product #content div.product .eno-product-hero table.variations select:focus {
	border-color: var(--eno-color-orange);
	outline: 2px solid var(--eno-color-orange-tint);
	outline-offset: 0;
}

.single-product #content div.product .eno-product-hero .reset_variations {
	display: inline-block;
	margin-top: 0.5rem;
	color: var(--eno-color-text-muted);
	font-size: var(--eno-text-label);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.single-product #content div.product .eno-product-hero .single_variation_wrap .woocommerce-variation {
	margin: 0 0 1rem;
}

.single-product #content div.product .eno-product-hero .woocommerce-variation-description {
	color: var(--eno-color-text-muted);
	font-size: var(--eno-text-label);
}

.single-product #content div.product .eno-product-hero .woocommerce-variation-price .price {
	margin-bottom: 0.75rem;
	font-size: 1.5rem;
}

/* Grouped products */

.single-product #content div.product .eno-product-hero table.group_table {
	width: 100%;
	margin: 0 0 1.25rem;
	border: 0;
	border-collapse: collapse;
}

.single-product #content div.product .eno-product-hero table.group_table td {
	padding: 0.75rem 0.75rem 0.75rem 0;
	border: 0;
	border-bottom: 1px solid var(--eno-color-surface-high);
	vertical-align: middle;
}

.single-product #content div.product .eno-product-hero table.group_table .qty {
	min-height: 2.75rem;
}

/* Minimum order quantity above the add-to-cart form (inc/product-min-qty.php) */
.single-product #content div.product .eno-product-hero .summary .eno-product-min-qty {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 1rem;
	color: var(--eno-color-text);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.5;
}

.eno-product-min-qty .eno-icon {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	color: var(--eno-color-orange);
}

/* Delivery note, trust points, SKU (template-parts/product/purchase-info.php) */

/* Express checkout / PayPal buttons (payment plugins) between the button and
   the trust points: spacing only, their own styling stays. */
.single-product #content div.product .eno-product-hero .summary > :is(.ppc-button-wrapper, .ppcp-messages, [id^="wcpay-express-checkout"]) {
	margin-bottom: 1.25rem;
}

/* Directly under the purchase controls, part of the same group. */
.eno-product-purchase {
	display: grid;
	gap: 0.75rem;
	max-width: 36rem;
	padding-top: 0.25rem;
}

.eno-product-purchase__delivery {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	margin: 0;
	color: var(--eno-color-text);
	font-weight: 600;
	line-height: 1.5;
}

.eno-product-purchase__delivery .eno-icon {
	width: 1.375rem;
	height: 1.375rem;
	color: var(--eno-color-green);
}

.eno-product-purchase__trust {
	display: grid;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.eno-product-purchase__trust li {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	margin: 0;
	color: var(--eno-color-text-muted);
	font-size: 0.9375rem;
	line-height: 1.5;
}

.eno-product-purchase__trust .eno-icon {
	width: 1.25rem;
	height: 1.25rem;
	margin-top: 0.0625rem;
	color: var(--eno-color-green);
}

/* Quote block (template-parts/product/quote.php): one quiet block after the
   purchase info; the dark outline button stays secondary to the order button. */
.eno-product-quote {
	max-width: 36rem;
	margin-top: 1.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--eno-color-surface);
}

.single-product .eno-product-quote__title {
	margin: 0 0 0.25rem;
	color: var(--eno-color-text);
	font-family: var(--eno-font-heading);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.4;
}

.single-product .eno-product-quote__text {
	margin: 0 0 1rem;
	color: var(--eno-color-text-muted);
	font-size: 0.9375rem;
	line-height: 1.6;
}

.eno-product-quote__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1.5rem;
}

.eno-product-quote__button .eno-icon {
	width: 1.25rem;
	height: 1.25rem;
}

.eno-product-quote__contact {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.eno-product-quote__contact li {
	margin: 0;
}

.single-product .eno-product-quote__contact a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 2.75rem;
	color: var(--eno-color-text);
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
}

.single-product .eno-product-quote__contact a:hover span,
.single-product .eno-product-quote__contact a:focus-visible span {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.eno-product-quote__contact .eno-icon {
	width: 1.25rem;
	height: 1.25rem;
	color: var(--eno-color-green);
	fill: currentcolor;
}

/* Full-width button on small screens; contact links underneath. */
@media (max-width: 479px) {
	.eno-product-quote__button {
		width: 100%;
	}
}

/* Quote dialog: product name under the title, form in the site form style. */
.eno-quote-dialog__product {
	margin: 0.375rem 0 0;
	color: var(--eno-color-text-muted);
	font-size: var(--eno-text-small);
	line-height: 1.5;
}

.eno-quote-dialog__form .wpforms-container {
	margin: 0;
}

/* Page sections ----------------------------------------------------------- */

.eno-product-section {
	padding-block: 4rem;
	border-top: 1px solid var(--eno-color-surface);
}

.eno-product-section__title {
	margin: 0 0 2rem;
	font-family: var(--eno-font-heading);
	font-size: var(--eno-text-headline-lg);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.02em;
	text-wrap: balance;
}

.eno-product-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0 0 1rem;
	color: var(--eno-color-text-muted);
	font-family: var(--eno-font-body);
	font-size: var(--eno-text-small);
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.eno-product-eyebrow::before {
	content: "";
	width: 1.5rem;
	height: 2px;
	background-color: var(--eno-color-orange);
}

@media (min-width: 1024px) {
	.eno-product-section {
		padding-block: 6rem;
	}

	.eno-product-section__title {
		margin-bottom: 2.5rem;
	}
}

/* Readable rich text: product description, choice help, story text. */

.eno-product-prose {
	max-width: 44rem;
	color: var(--eno-color-text-muted);
	font-size: 1.0625rem;
	line-height: 1.75;
}

.eno-product-prose > :first-child {
	margin-top: 0;
}

.eno-product-prose > :last-child {
	margin-bottom: 0;
}

.eno-product-prose :is(p, ul, ol, blockquote, table) {
	margin: 0 0 1.25em;
}

.eno-product-prose :is(h2, h3, h4) {
	margin: 2em 0 0.6em;
	color: var(--eno-color-text);
	font-family: var(--eno-font-heading);
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.eno-product-prose h2 {
	font-size: 1.625rem;
}

.eno-product-prose h3 {
	font-size: 1.25rem;
}

.eno-product-prose h4 {
	font-size: 1.0625rem;
}

.eno-product-prose :is(ul, ol) {
	padding-left: 1.25em;
}

.eno-product-prose li {
	margin-bottom: 0.4em;
}

.eno-product-prose li::marker {
	color: var(--eno-color-orange);
}

.eno-product-prose strong {
	color: var(--eno-color-text);
	font-weight: 700;
}

.eno-product-prose a {
	color: var(--eno-color-orange-dark);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color 150ms var(--eno-ease);
}

.eno-product-prose a:hover,
.eno-product-prose a:focus-visible {
	color: var(--eno-color-text);
}

.eno-product-prose img {
	height: auto;
	border-radius: var(--eno-radius);
}

/* Product information */

/* One reading column: label, heading, then the description right below it,
   so short and long descriptions both read as one block. */
.eno-product-intro__header,
.eno-product-intro__content {
	max-width: 46rem;
}

.eno-product-intro__header .eno-product-section__title {
	margin-bottom: 1.5rem;
}

.eno-product-intro__header > h2.eno-product-eyebrow {
	margin-bottom: 1.25rem;
}

.eno-product-intro__content {
	color: var(--eno-color-text);
}

.eno-product-intro__content > p:first-child {
	font-size: 1.125rem;
}

/* Benefits: short columns with hairline dividers, no cards */

.eno-product-benefits {
	background-color: var(--eno-color-white);
}

.eno-product-benefits__list {
	display: grid;
	gap: 2rem;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: eno-benefit;
}

.eno-product-benefits__item {
	margin: 0;
	padding-top: 1.5rem;
	border-top: 1px solid var(--eno-color-surface-high);
	counter-increment: eno-benefit;
}

.eno-product-benefits__item::before {
	content: counter(eno-benefit, decimal-leading-zero);
	display: block;
	margin-bottom: 1rem;
	color: var(--eno-color-orange);
	font-family: var(--eno-font-heading);
	font-size: 0.9375rem;
	font-weight: 800;
	letter-spacing: 0.06em;
}

.eno-product-benefits__title {
	margin: 0 0 0.5rem;
	font-family: var(--eno-font-heading);
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.eno-product-benefits__text {
	margin: 0;
	color: var(--eno-color-text-muted);
	line-height: 1.7;
}

@media (min-width: 768px) {
	.eno-product-benefits__list {
		grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
		gap: 2.5rem;
	}
}

@media (min-width: 1024px) {
	.eno-product-benefits__list {
		gap: 4rem;
	}
}

/* Specifications in the hero (template-parts/product/key-specs.php).
   "#content" outranks WooCommerce's zebra rows and its small-screen rule
   that stacks label and value. */

.eno-product-keyspecs {
	display: grid;
	gap: 1.25rem;
	max-width: 36rem;
	padding-top: 1.75rem;
	border-top: 1px solid var(--eno-color-surface-high);
}

.single-product .eno-product-keyspecs__title {
	margin: 0;
	font-family: var(--eno-font-heading);
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.eno-product-keyspecs__size {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.125rem 1.25rem;
	border-left: 3px solid var(--eno-color-orange);
	border-radius: 0 var(--eno-radius) var(--eno-radius) 0;
	background-color: var(--eno-color-surface-low);
}

.eno-product-keyspecs__size .eno-icon {
	flex-shrink: 0;
	width: 1.75rem;
	height: 1.75rem;
	margin-top: 0.125rem;
	color: var(--eno-color-orange-dark);
}

.eno-product-keyspecs__size p {
	display: grid;
	gap: 0.125rem;
	margin: 0;
}

.eno-product-keyspecs__size-label {
	color: var(--eno-color-text-muted);
	font-size: var(--eno-text-small);
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.eno-product-keyspecs__size-value {
	color: var(--eno-color-text);
	font-family: var(--eno-font-heading);
	font-size: clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	font-variant-numeric: tabular-nums;
}

.eno-product-keyspecs__size-hint {
	color: var(--eno-color-text-muted);
	font-size: var(--eno-text-small);
	line-height: 1.5;
}

.single-product #content .eno-product-keyspecs .shop_attributes {
	width: 100%;
	margin: 0;
	border: 0;
	border-top: 1px solid var(--eno-color-surface-high);
	border-collapse: collapse;
}

.single-product #content .eno-product-keyspecs .shop_attributes tr {
	display: table-row;
	border-bottom: 1px solid var(--eno-color-surface-high);
	background: none;
}

.single-product #content .eno-product-keyspecs .shop_attributes :is(th, td) {
	display: table-cell;
	padding: 0.75rem 0;
	border: 0;
	background: none;
	line-height: 1.5;
	text-align: left;
	vertical-align: top;
}

.single-product #content .eno-product-keyspecs .shop_attributes th {
	width: 42%;
	padding-right: 1.5rem;
	color: var(--eno-color-text-muted);
	font-size: var(--eno-text-label);
	font-weight: 500;
}

.single-product #content .eno-product-keyspecs .shop_attributes td {
	color: var(--eno-color-text);
	font-size: 0.9375rem;
	font-style: normal;
	font-weight: 600;
}

.single-product #content .eno-product-keyspecs .shop_attributes td p {
	margin: 0;
	padding: 0;
}

.single-product #content .eno-product-keyspecs .shop_attributes td a {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: var(--eno-color-outline);
	text-underline-offset: 3px;
}

.single-product #content .eno-product-keyspecs .shop_attributes td a:hover,
.single-product #content .eno-product-keyspecs .shop_attributes td a:focus-visible {
	color: var(--eno-color-orange-dark);
}

.eno-product-keyspecs__finder {
	justify-self: start;
	font-size: 0.9375rem;
}

/* Choice help (template-parts/product/specs.php) */

.eno-product-specs__choice {
	max-width: 44rem;
}

.eno-product-specs__choice-title {
	margin: 0 0 1rem;
	font-family: var(--eno-font-heading);
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1.3;
}

@media (min-width: 1024px) {
	.eno-product-specs__choice {
		padding-left: 2.5rem;
		border-left: 3px solid var(--eno-color-orange);
	}
}

/* Story: image + text */

.eno-product-story {
	background-color: var(--eno-color-green-bg);
	border-top: 0;
}

.eno-product-story__inner {
	display: grid;
	gap: 2rem;
	align-items: center;
}

.eno-product-story__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	border-radius: var(--eno-radius-lg);
	object-fit: cover;
}

.eno-product-story .eno-product-prose {
	color: var(--eno-color-green-ink);
}

@media (min-width: 1024px) {
	.eno-product-story__inner {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 5rem;
	}

	.eno-product-story--text .eno-product-story__inner {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* "Bekijk ook": shop cards (catalog.css), three in a row; scroll row below 768px */

.eno-product-related {
	background-color: var(--eno-color-surface-low);
}

.eno-product-related__header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 2rem;
}

.eno-product-related__header .eno-product-section__title {
	margin: 0;
}

.eno-product-related__controls {
	display: flex;
	gap: 0.5rem;
}

.eno-product-related__controls[hidden] {
	display: none;
}

.eno-product-related__control {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid var(--eno-color-outline);
	border-radius: 50%;
	background-color: transparent;
	color: var(--eno-color-text);
	cursor: pointer;
	transition: background-color 150ms var(--eno-ease), border-color 150ms var(--eno-ease), color 150ms var(--eno-ease);
}

.eno-product-related__control:hover,
.eno-product-related__control:focus-visible {
	border-color: var(--eno-color-orange);
	background-color: var(--eno-color-orange);
	color: var(--eno-color-text);
}

.eno-product-related__control[aria-disabled="true"] {
	opacity: 0.35;
	pointer-events: none;
}

.single-product .eno-product-related ul.products[class] {
	display: grid;
	grid-auto-columns: min(78%, 20rem);
	grid-auto-flow: column;
	grid-template-columns: none;
	gap: 1rem;
	margin-inline: calc(-1 * var(--eno-gutter));
	padding-inline: var(--eno-gutter);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-padding-inline: var(--eno-gutter);
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.single-product .eno-product-related ul.products[class]::-webkit-scrollbar {
	display: none;
}

.single-product .eno-product-related ul.products[class] li.product {
	scroll-snap-align: start;
}

.single-product .eno-product-related ul.products[class] li.product .price {
	margin-bottom: 0;
}

@media (min-width: 768px) {
	.single-product .eno-product-related ul.products[class] {
		grid-auto-flow: row;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 2.5rem 1.5rem;
		margin-inline: 0;
		padding-inline: 0;
		overflow: visible;
	}
}

@media (min-width: 1024px) {
	.single-product .eno-product-related ul.products[class] {
		gap: 2.5rem 2.5rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.single-product #content div.product .eno-product-hero .flex-control-thumbs li img,
	.single-product #content div.product .eno-product-hero form.cart .single_add_to_cart_button,
	.eno-product-related__control {
		transition: none;
	}
}

/* Bulk pricing table above the add-to-cart form (inc/product-bulk-pricing.php) */

.single-product #content div.product .eno-product-hero .summary .eno-bulk {
	max-width: 36rem;
	margin: 0 0 1.25rem;
}

.eno-bulk__table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	font-variant-numeric: tabular-nums;
}

.eno-bulk__caption {
	margin: 0 0 0.75rem;
	text-align: left;
}

.eno-bulk__title {
	display: block;
	color: var(--eno-color-text);
	font-family: var(--eno-font-heading);
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.3;
}

.eno-bulk__intro {
	display: block;
	margin-top: 0.25rem;
	color: var(--eno-color-text-muted);
	font-size: var(--eno-text-label);
	line-height: 1.5;
}

.eno-bulk__table th {
	padding: 0 0.75rem 0.5rem;
	border: 0;
	border-bottom: 1px solid var(--eno-color-surface-high);
	background: none;
	color: var(--eno-color-text-muted);
	font-size: var(--eno-text-small);
	font-weight: 600;
	letter-spacing: 0.04em;
	text-align: left;
	text-transform: uppercase;
}

.eno-bulk__table th.eno-bulk__price-head {
	text-align: right;
}

.eno-bulk__table th small {
	font-size: inherit;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
}

.eno-bulk__table td {
	padding: 0;
	border: 0;
	border-bottom: 1px solid var(--eno-color-surface-high);
	background: none;
	vertical-align: middle;
}

.eno-bulk__table tbody tr {
	cursor: pointer;
	transition: background-color 150ms var(--eno-ease);
}

.eno-bulk__table tbody tr:hover {
	background-color: var(--eno-color-surface-low);
}

.eno-bulk__table tbody tr.is-active {
	background-color: var(--eno-color-orange-tint);
	box-shadow: inset 3px 0 0 var(--eno-color-orange);
}

.eno-bulk__pick {
	display: block;
	width: 100%;
	min-height: 2.75rem;
	padding: 0.5rem 0.75rem;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--eno-color-text);
	font-family: var(--eno-font-body);
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.3;
	text-align: left;
	cursor: pointer;
}

/* GeneratePress styles button:hover/:focus; keep the row look. */
.eno-bulk__pick:hover,
.eno-bulk__pick:focus {
	background: none;
	color: var(--eno-color-text);
}

.eno-bulk__pick:focus-visible {
	outline: 2px solid var(--eno-color-orange);
	outline-offset: -2px;
}

.eno-bulk__table tr.is-active .eno-bulk__pick {
	font-weight: 700;
}

.eno-bulk__saving {
	padding-inline: 0.5rem;
	white-space: nowrap;
}

.eno-bulk__badge {
	display: inline-block;
	padding: 0.125rem 0.4375rem;
	border-radius: var(--eno-radius-sm);
	background-color: var(--eno-color-green-bg);
	color: var(--eno-color-green-ink);
	font-size: var(--eno-text-small);
	font-weight: 700;
	line-height: 1.5;
}

.eno-bulk__table td.eno-bulk__price {
	padding: 0.5rem 0.75rem;
	color: var(--eno-color-text);
	font-weight: 700;
	text-align: right;
	white-space: nowrap;
}

.eno-bulk__total {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.25rem 0.5rem;
	margin: 1rem 0 0;
	color: var(--eno-color-text-muted);
	font-size: var(--eno-text-label);
	font-variant-numeric: tabular-nums;
}

.eno-bulk__total-label {
	flex-basis: 100%;
}

.eno-bulk__total-amount {
	color: var(--eno-color-text);
	font-family: var(--eno-font-heading);
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.2;
}

.eno-bulk__total small {
	font-size: inherit;
}

/* From the highest tier on: a pointer to a quote (shown by main.js). */
.eno-bulk__quote {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25rem 0.75rem;
	margin: 1rem 0 0;
	padding: 0.75rem 1rem;
	border-radius: var(--eno-radius);
	background-color: var(--eno-color-green-bg);
	color: var(--eno-color-green-ink);
	font-size: 0.9375rem;
	line-height: 1.5;
}

.eno-bulk__quote[hidden] {
	display: none;
}

/* .single-product prefix: outranks GeneratePress's button and :focus colours. */
.single-product .eno-bulk__quote-link,
.single-product .eno-bulk__quote-link:hover,
.single-product .eno-bulk__quote-link:focus {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0;
	border: 0;
	background: none;
	color: var(--eno-color-orange-dark);
	font: inherit;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 0.2em;
	cursor: pointer;
}

.single-product .eno-bulk__quote-link:focus-visible {
	outline: 2px solid var(--eno-color-orange);
	outline-offset: 2px;
}

.eno-bulk__quote-link .eno-icon {
	width: 1rem;
	height: 1rem;
}

@media (prefers-reduced-motion: reduce) {
	.eno-bulk__table tbody tr {
		transition: none;
	}
}
