/**
 * PDP v2 — conversiegericht herontwerp.
 *
 * Alles hangt onder body.kh-pdp-v2 zodat de huidige productpagina (en de
 * hydratie-tests die daarop lopen) niets van deze regels merkt.
 *
 * Tokens en maten komen 1-op-1 uit het handoff-document:
 * imph-docs/pdp-redesign/design_handoff_pdp_shc10/README.md
 */

body.kh-pdp-v2 {
	--kh-navy: #122A5E;
	--kh-text: #16224F;
	--kh-text-2: #4A5570;
	--kh-text-3: #7C8598;
	--kh-text-4: #98A0B2;
	--kh-orange: #F0691C;
	--kh-orange-soft: #FFF4EC;
	--kh-orange-soft-hover: #FFE9DA;
	--kh-cta: #2FC49B;
	--kh-cta-hover: #25A886;
	--kh-deliv: #0B6A4C;
	--kh-deliv-bg: #E9F7F1;
	--kh-deliv-2: #2E6B58;
	--kh-green-soft: #F2FCF9;
	--kh-link: #1B58BF;
	--kh-badge: #2C7BE5;
	--kh-help-bg: #EDF3FC;
	--kh-star: #E8A020;
	--kh-border: #DFE5EF;
	--kh-border-light: #EDF1F7;
	--kh-surface: #F5F7FB;
	--kh-surface-active: #F2F5FB;
	--kh-shadow-card: 0 2px 4px rgba(18, 42, 94, .05), 0 12px 28px -16px rgba(18, 42, 94, .28);

	background: #fff;
	color: var(--kh-text);
	font-family: "museo-sans", "Museo Sans", "Nunito Sans", system-ui, sans-serif;
	font-variant-numeric: tabular-nums;
}

body.kh-pdp-v2 { scroll-behavior: smooth; }
html:has(body.kh-pdp-v2) {
	scroll-behavior: smooth;
	/* Header + meelopende ankerbalk krijgen ruimte bij het springen. */
	scroll-padding-top: calc(var(--kh-header-h, 130px) + 70px);
}

body.kh-pdp-v2 main a { color: var(--kh-link); text-decoration: none; }
body.kh-pdp-v2 main a:hover { text-decoration: underline; }

/* ── Containers ──────────────────────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-wrap,
body.kh-pdp-v2 .kh-pdp-section > .wp-block-group__inner-container,
body.kh-pdp-v2 .kh-pdp-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding-left: 28px;
	padding-right: 28px;
	box-sizing: border-box;
}

body.kh-pdp-v2 .kh-pdp-section {
	padding-top: 52px;
	padding-bottom: 52px;
	border-top: 1px solid var(--kh-border-light);
}
body.kh-pdp-v2 .kh-pdp-section.has-surface,
body.kh-pdp-v2 .kh-pdp-section.kh-pdp-section--surface { background: var(--kh-surface); }

body.kh-pdp-v2 .kh-pdp-kicker {
	margin: 0 0 9px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--kh-orange);
}
body.kh-pdp-v2 .kh-pdp-h2 {
	margin: 0 0 20px;
	font-size: 28px;
	font-weight: 800;
	letter-spacing: -.015em;
	line-height: 1.2;
	color: var(--kh-text);
}
body.kh-pdp-v2 .kh-pdp-h3 { margin: 0 0 20px; font-size: 19px; font-weight: 700; }

body.kh-pdp-v2 .kh-pdp-label {
	display: block;
	margin-bottom: 9px;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--kh-text-3);
}

body.kh-pdp-v2 .kh-pdp-card {
	border: 1px solid var(--kh-border);
	border-radius: 12px;
	background: #fff;
}

/* ── Breadcrumb ──────────────────────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-breadcrumb,
body.kh-pdp-v2 .kh-pdp-breadcrumb .wc-block-breadcrumbs {
	font-size: 13px;
	color: var(--kh-text-3);
}
body.kh-pdp-v2 .kh-pdp-breadcrumb a { color: var(--kh-text-2); }

/* ── Galerij + buybox ────────────────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-top { padding-bottom: 48px; }
body.kh-pdp-v2 .kh-pdp-top > .wp-block-columns {
	gap: 52px;
	align-items: stretch; /* nodig: de galerijkolom moet net zo hoog zijn als de
	                         buybox, anders heeft de meelopende foto geen ruimte */
	margin-bottom: 0;
}

body.kh-pdp-v2 .kh-pdp-gallery .wc-block-components-product-image,
body.kh-pdp-v2 .kh-pdp-gallery .woocommerce-product-gallery__image img,
body.kh-pdp-v2 .kh-pdp-gallery .wp-block-woocommerce-product-image-gallery img {
	border-radius: 12px;
}
body.kh-pdp-v2 .kh-pdp-gallery .woocommerce-product-gallery__wrapper {
	border: 1px solid var(--kh-border);
	border-radius: 12px;
	background: #fff;
	padding: 16px;
	overflow: hidden;
}

/* Kop boven de buybox */

body.kh-pdp-v2 .kh-pdp-brandrow {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 9px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--kh-text-3);
}
body.kh-pdp-v2 .kh-pdp-brandrow .product-sku,
body.kh-pdp-v2 .kh-pdp-brandrow .wp-block-woocommerce-product-sku {
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
}
body.kh-pdp-v2 .kh-pdp-title h1,
body.kh-pdp-v2 h1.wp-block-post-title {
	margin: 0;
	font-size: 29px;
	font-weight: 800;
	line-height: 1.24;
	letter-spacing: -.015em;
	text-wrap: pretty;
	color: var(--kh-text);
}
body.kh-pdp-v2 .kh-pdp-rating {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 12px;
	font-size: 14px;
}

/* De buybox zelf: één kaart met vijf blokken */

body.kh-pdp-v2 .kh-pdp-buybox {
	border: 1px solid var(--kh-border);
	border-radius: 12px;
	box-shadow: var(--kh-shadow-card);
	margin-top: 20px;
	overflow: hidden;
	background: #fff;
}
body.kh-pdp-v2 .kh-pdp-buybox > * + * { border-top: 1px solid var(--kh-border-light); }
body.kh-pdp-v2 .kh-pdp-bb-block { padding: 20px 24px; }
body.kh-pdp-v2 .kh-pdp-bb-help {
	padding: 16px 24px;
	background: var(--kh-help-bg);
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: nowrap;
}
body.kh-pdp-v2 .kh-pdp-bb-help > p { margin: 0; }
body.kh-pdp-v2 .kh-pdp-bb-help > p:not(.kh-pdp-help-actions) { flex: 1; min-width: 0; font-size: 13.5px; line-height: 1.45; }
body.kh-pdp-v2 .kh-pdp-bb-help .kh-pdp-help-actions { flex: none; display: flex; gap: 8px; }
body.kh-pdp-v2 .kh-pdp-bb-pay { padding: 18px 24px; }

/* Prijs — bestaande markup (.custom-price / .b2b-price-container) blijft intact,
   zodat de Gold-prijs en de prijs-hydratie precies zo blijven werken. */

body.kh-pdp-v2 .kh-pdp-price .sc-price-wrapper { line-height: 1; margin: 0; }
body.kh-pdp-v2 .kh-pdp-price .sc-price-wrapper br { display: none; }
body.kh-pdp-v2 .kh-pdp-price .sc-price-label,
body.kh-pdp-v2 .kh-pdp-price .wc-block-components-product-price,
body.kh-pdp-v2 .kh-pdp-price .custom-price {
	font-size: 44px;
	font-weight: 900;
	line-height: 1;
	letter-spacing: -.035em;
	color: var(--kh-text);
}
body.kh-pdp-v2 .kh-pdp-price .sc-price-label .custom-price .price-int,
body.kh-pdp-v2 .kh-pdp-price .custom-price .price-int { font-size: 44px; font-weight: 900; line-height: 1; }
body.kh-pdp-v2 .kh-pdp-price .sc-price-label .custom-price .price-dec,
body.kh-pdp-v2 .kh-pdp-price .custom-price .price-dec { font-size: 27px; font-weight: 900; }
body.kh-pdp-v2 .kh-pdp-price .sc-price-btw { display: none; }
/* Prijsblok voor ingelogde Gold-klanten: géén eigen opmaak. De plugin levert die
   al (123CustomFunctions/assets/css/b2b-product-price.css, `.b2b-price-pdp`), en
   die moet exact gelijk zijn aan de huidige PDP. Eigen regels hier zouden dat
   juist overschrijven. */
body.kh-pdp-v2 .kh-pdp-price-sub { margin: 8px 0 0; font-size: 13px; color: var(--kh-text-3); }

/* Leverblok */

body.kh-pdp-v2 .kh-pdp-deliv {
	margin-top: 16px;
	background: none;
	padding: 0;
	display: block;
}
/* Alleen de levertijdregel staat in het groene kader; de voorraadregel komt
   daaronder te staan, buiten het groen. Het vinkje staat verticaal gecentreerd. */
body.kh-pdp-v2 .kh-pdp-deliv .lynqio-toon_levertijd,
body.kh-pdp-v2 .kh-pdp-deliv .lynqio-levertijd_kort {
	position: relative;
	display: block;
	background: var(--kh-deliv-bg);
	border-radius: 12px;
	padding: 13px 15px 13px 44px;
	margin: 0;
	color: var(--kh-deliv);
	font-size: 14.5px;
	font-weight: 700;
	line-height: 1.4;
}
body.kh-pdp-v2 .kh-pdp-deliv .lynqio-toon_levertijd::before,
body.kh-pdp-v2 .kh-pdp-deliv .lynqio-levertijd_kort::before {
	content: "";
	position: absolute;
	left: 15px;
	top: 50%;
	transform: translateY(-50%);
	width: 18px;
	height: 18px;
	background: url("https://123installatiematerialen.nl/wp-content/uploads/2026/03/check.png") center/contain no-repeat;
}
body.kh-pdp-v2 .kh-pdp-deliv [class*="lynqio-stock-status-"] {
	display: block;
	margin: 8px 0 0;
	padding: 0;
	background: none;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--kh-text-2);
}
body.kh-pdp-v2 .kh-pdp-deliv [class*="lynqio-stock-status-"]::before {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--kh-cta);
	margin-right: 7px;
	vertical-align: middle;
}
body.kh-pdp-v2 .kh-pdp-deliv [class*="lynqio-stock-status-"].outofstock::before { background: var(--kh-text-4); }
body.kh-pdp-v2 .kh-pdp-deliv .lynqio-stock-warning { font-size: 13px; margin: 6px 0 0; }

/* De regel uit [toon_levertijd] van Lynqio (en het voorraadlabel eronder) is de
   bron; im-price-hydrate werkt die bij. Alleen de opmaak is nieuw. */


/* Maatkiezer */

body.kh-pdp-v2 .kh-pdp-sizes { margin-top: 0; }
body.kh-pdp-v2 .kh-pdp-sizes__grid { display: grid; gap: 8px; }
body.kh-pdp-v2 .kh-pdp-sizes__btn {
	display: block;
	text-align: center;
	border: 1px solid var(--kh-border);
	border-radius: 5px;
	padding: 11px 6px;
	background: #fff;
	color: var(--kh-text-2);
	text-decoration: none;
}
body.kh-pdp-v2 .kh-pdp-sizes__btn:hover { text-decoration: none; border-color: #C9D3E4; }
body.kh-pdp-v2 .kh-pdp-sizes__btn.is-active {
	border: 1.5px solid var(--kh-navy);
	background: var(--kh-surface-active);
	color: var(--kh-text);
}
body.kh-pdp-v2 .kh-pdp-sizes__liters { display: block; font-size: 16px; font-weight: 800; }
body.kh-pdp-v2 .kh-pdp-sizes__sub { display: block; font-size: 11.5px; font-weight: 600; margin-top: 3px; line-height: 1.25; }
body.kh-pdp-v2 .kh-pdp-sizes__price { display: block; font-size: 12px; margin-top: 4px; color: var(--kh-text-3); }
body.kh-pdp-v2 .kh-pdp-sizes__note { margin: 10px 0 0; font-size: 13.5px; color: var(--kh-text-2); line-height: 1.5; }

/* Keuzehulp-trigger — de bestaande configurator-knop, in het nieuwe jasje */

/* Aansluitset-vinkje */

body.kh-pdp-v2 .kh-pdp-bundle {
	display: flex;
	gap: 13px;
	align-items: center;
	padding: 13px 15px;
	border: 1px solid var(--kh-border);
	border-radius: 5px;
	cursor: pointer;
	margin-top: 14px;
	background: #fff;
}
/* Aangevinkt geeft alleen een iets sterkere rand; het groene vlak was te luid. */
body.kh-pdp-v2 .kh-pdp-bundle.is-on { border-color: #C9D3E4; background: #fff; }
/* Eigen vinkje: met alleen accent-color kiest de browser zelf de kleur van het
   vinkje (op het lichte groen werd dat donker). Nu altijd een wit vinkje. */
body.kh-pdp-v2 .kh-pdp-bundle__check {
	-webkit-appearance: none;
	appearance: none;
	width: 19px;
	height: 19px;
	margin: 0;
	border: 1.5px solid var(--kh-border);
	border-radius: 4px;
	background: #fff center / 13px 13px no-repeat;
	flex: none;
	cursor: pointer;
}
body.kh-pdp-v2 .kh-pdp-bundle__check:checked {
	border-color: var(--kh-cta);
	background-color: var(--kh-cta);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3.2L13 5' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
body.kh-pdp-v2 .kh-pdp-bundle__check:focus-visible { outline: 2px solid var(--kh-cta); outline-offset: 2px; }
body.kh-pdp-v2 .kh-pdp-bundle__thumb {
	width: 50px;
	height: 50px;
	border: 1px solid var(--kh-border-light);
	border-radius: 5px;
	background: #fff;
	display: grid;
	place-items: center;
	flex: none;
	overflow: hidden;
}
body.kh-pdp-v2 .kh-pdp-bundle__thumb img { max-width: 100%; height: auto; }
body.kh-pdp-v2 .kh-pdp-bundle__text { flex: 1; }
body.kh-pdp-v2 .kh-pdp-bundle__kicker {
	display: block;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--kh-orange);
}
body.kh-pdp-v2 .kh-pdp-bundle__title { display: block; font-size: 14.5px; font-weight: 700; line-height: 1.3; margin-top: 2px; }
body.kh-pdp-v2 .kh-pdp-bundle__sub { display: block; font-size: 13px; color: var(--kh-text-2); }
body.kh-pdp-v2 .kh-pdp-bundle__price { flex: none; font-size: 14.5px; font-weight: 700; }

/* Zwevende balk: de centen stonden op 900 en de euro's op 700, waardoor ",00"
   zwaarder oogde dan het bedrag ervoor. Eén gewicht voor allebei. */
body.kh-pdp-v2 .sticky-atc-bar .custom-price .price-int,
body.kh-pdp-v2 .sticky-atc-bar .custom-price .price-dec { font-weight: 700; }
/* Centen in de zwevende balk een tikje kleiner dan de euro's (thema 2.css zet beide
   op 18px !important). */
body.kh-pdp-v2.single-product .sticky-atc-bar .sc-regular-product .sc-price-label .custom-price .price-dec { font-size: 15px !important; }

/* CTA-rij: het bestaande add-to-cart-formulier van WooCommerce */

body.kh-pdp-v2 .kh-pdp-cta {
	margin-top: 16px;
	display: flex;
	align-items: stretch;
	gap: 11px;
}
/* Het add-to-cart-blok is een wrapper om form.cart heen; die moet meerekken,
   anders staat de verlanglijstknop los van de rij. */
body.kh-pdp-v2 .kh-pdp-cta .wp-block-add-to-cart-form,
body.kh-pdp-v2 .kh-pdp-cta .wp-block-woocommerce-add-to-cart-form { flex: 1; min-width: 0; }
body.kh-pdp-v2 .kh-pdp-cta form.cart {
	display: flex;
	gap: 11px;
	align-items: stretch;
	margin: 0;
}
body.kh-pdp-v2 .kh-pdp-cta .quantity {
	display: flex;
	align-items: center;
	height: 54px;
	border: 1px solid var(--kh-border);
	border-radius: 5px;
	flex: none;
	background: #fff;
	overflow: hidden;
	margin: 0;
}
body.kh-pdp-v2 .kh-pdp-cta .quantity input.qty {
	width: 46px;
	height: 52px;
	border: 0;
	text-align: center;
	font-size: 16px;
	font-weight: 800;
	background: none;
	color: var(--kh-text);
	-moz-appearance: textfield;
	padding: 0;
	margin: 0;
}
body.kh-pdp-v2 .kh-pdp-cta .quantity input.qty::-webkit-outer-spin-button,
body.kh-pdp-v2 .kh-pdp-cta .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
body.kh-pdp-v2 .kh-pdp-cta .quantity .kh-qty-btn,
body.kh-pdp-v2 .kh-pdp-cta .quantity .quantity-btn {
	width: 42px;
	height: 52px;
	border: 0;
	background: none;
	cursor: pointer;
	color: var(--kh-text-2);
	font-size: 19px;
	line-height: 1;
	padding: 0;
	margin: 0;
	border-radius: 0;
}
body.kh-pdp-v2 .kh-pdp-cta .quantity .quantity-btn:hover { background: var(--kh-surface); }
body.kh-pdp-v2 .kh-pdp-cta button.single_add_to_cart_button,
body.kh-pdp-v2 .kh-pdp-cta .single_add_to_cart_button {
	flex: 1;
	height: 54px;
	min-height: 54px;
	margin: 0;
	border: 0;
	border-radius: 5px;
	background: var(--kh-cta);
	color: #fff;
	font-size: 17px;
	font-weight: 600;
	cursor: pointer;
	padding: 0 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	line-height: 1;
}
body.kh-pdp-v2 .kh-pdp-cta button.single_add_to_cart_button:hover { background: var(--kh-cta-hover); }
/* Verlanglijst: eigen kolom van 54 × 54, zelfde tussenruimte als de rest. */
body.kh-pdp-v2 .kh-pdp-cta .wp-block-im123-pdp-project-button,
body.kh-pdp-v2 .kh-pdp-cta > .wp-block-group { flex: none; margin: 0; }
body.kh-pdp-v2 .kh-pdp-cta .pdp-project-btn,
body.kh-pdp-v2 .kh-pdp-cta .add-to-project-btn {
	width: 54px;
	height: 54px;
	min-height: 54px;
	border: 1px solid var(--kh-border);
	border-radius: 5px;
	background: #fff;
	cursor: pointer;
	display: grid;
	place-items: center;
	color: var(--kh-text-2);
	padding: 0;
	margin: 0;
}
body.kh-pdp-v2 .kh-pdp-cta .pdp-project-btn svg,
body.kh-pdp-v2 .kh-pdp-cta .add-to-project-btn svg { width: 22px; height: 22px; }
body.kh-pdp-v2 .kh-pdp-cta .wp-block-im123-pdp-project-button { display: flex; }

body.kh-pdp-v2 .kh-pdp-guarantees {
	display: flex;
	gap: 18px;
	flex-wrap: wrap;
	margin-top: 14px;
	font-size: 13px;
	font-weight: 600;
	color: var(--kh-text-2);
	list-style: none;
	padding: 0;
}
body.kh-pdp-v2 .kh-pdp-guarantees li {
	display: flex;
	align-items: center;
	gap: 7px;
	white-space: nowrap;
	flex: none;
}
body.kh-pdp-v2 .kh-pdp-guarantees li::before {
	content: "";
	width: 16px;
	height: 16px;
	flex: none;
	background: url("https://123installatiematerialen.nl/wp-content/uploads/2026/03/check.png") center/contain no-repeat;
}

/* Hulpblok en betaalblok */

body.kh-pdp-v2 .kh-pdp-bb-help .kh-pdp-avatar {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: #fff;
	display: grid;
	place-items: center;
	flex: none;
	font-weight: 800;
	color: var(--kh-navy);
}
body.kh-pdp-v2 .kh-pdp-bb-help .kh-pdp-btn-ghost,
body.kh-pdp-v2 .kh-pdp-btn-ghost {
	display: inline-block;
	padding: 10px 15px;
	border: 1px solid #C9D3E4;
	border-radius: 5px;
	background: #fff;
	color: var(--kh-text);
	font-size: 13.5px;
	font-weight: 700;
	text-decoration: none;
}
body.kh-pdp-v2 .kh-pdp-btn-primary {
	display: inline-block;
	padding: 13px 20px;
	border-radius: 5px;
	background: var(--kh-cta);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
}
body.kh-pdp-v2 .kh-pdp-btn-primary:hover { background: var(--kh-cta-hover); text-decoration: none; }
body.kh-pdp-v2 .kh-pdp-bb-pay {
	display: grid;
	grid-template-columns: 1fr;
	gap: 6px;
	align-items: center;
}
body.kh-pdp-v2 .kh-pdp-bb-pay p { margin: 0; font-size: 13.5px; color: var(--kh-text-2); }
body.kh-pdp-v2 .kh-pdp-bb-pay figure { grid-column: 1 / -1; margin: 6px 0 0; }
body.kh-pdp-v2 .kh-pdp-bb-pay figure img { max-width: 100%; height: auto; }

/* ── Sticky ankernavigatie ───────────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-anchornav {
	/* TEST: balk loopt mee, onder de vaste site-header (js/pdp-v2.js meet die).
	   Terugzetten = deze twee regels vervangen door `position: static;`. */
	position: sticky;
	top: var(--kh-header-h, 0px);
	z-index: 40;
	background: rgba(255, 255, 255, .95);
	backdrop-filter: blur(10px);
	border-top: 1px solid var(--kh-border);
	border-bottom: 1px solid var(--kh-border);
}
body.kh-pdp-v2 .kh-pdp-anchornav__inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 28px;
	display: flex;
	gap: 26px;
	height: 54px;
	align-items: center;
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
}
body.kh-pdp-v2 .kh-pdp-anchornav__inner::-webkit-scrollbar { height: 0; }
body.kh-pdp-v2 .kh-pdp-anchornav__link {
	color: var(--kh-text-2);
	font-size: 14.5px;
	font-weight: 600;
	height: 54px;
	display: flex;
	align-items: center;
	white-space: nowrap;
	flex: none;
	text-decoration: none;
	border-bottom: 2px solid transparent;
}
body.kh-pdp-v2 .kh-pdp-anchornav__link.is-active {
	color: var(--kh-text);
	font-weight: 700;
	border-bottom-color: var(--kh-orange);
}
body.kh-pdp-v2 .kh-pdp-anchornav__meta {
	margin-left: auto;
	white-space: nowrap;
	flex: none;
	font-size: 13.5px;
	color: var(--kh-text-2);
	font-weight: 600;
}
body.kh-pdp-v2 .kh-pdp-anchornav__price bdi { font-weight: 800; color: var(--kh-text); }

/* ── In het kort / FAQ ───────────────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-pros { list-style: none; margin: 0; padding: 0; }
body.kh-pdp-v2 .kh-pdp-pros li {
	position: relative;
	padding: 12px 0 12px 35px;
	border-bottom: 1px solid var(--kh-border-light);
	font-size: 15.5px;
	list-style: none;
}
body.kh-pdp-v2 .kh-pdp-pros li:last-child { border-bottom: 0; }
body.kh-pdp-v2 .kh-pdp-pros li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 17px;
	width: 18px;
	height: 18px;
	background: url("https://123installatiematerialen.nl/wp-content/uploads/2026/03/check.png") center/contain no-repeat;
}
body.kh-pdp-v2 .kh-pdp-pros li.is-con::before {
	content: "−";
	background: none;
	color: var(--kh-text-4);
	font-weight: 900;
	top: 11px;
	line-height: 1.4;
}
body.kh-pdp-v2 .kh-pdp-pros li strong { display: block; }
body.kh-pdp-v2 .kh-pdp-pros li em { display: block; font-style: normal; color: var(--kh-text-2); font-size: 14px; }

body.kh-pdp-v2 .kh-pdp-faq { border: 1px solid var(--kh-border); border-radius: 12px; overflow: hidden; }
body.kh-pdp-v2 .kh-pdp-faq > .wp-block-group__inner-container > h3 { margin: 0; padding: 20px 22px 16px; font-size: 19px; font-weight: 700; }
body.kh-pdp-v2 .kh-pdp-faq__item { border-top: 1px solid var(--kh-border-light); padding: 15px 22px; }
body.kh-pdp-v2 .kh-pdp-faq__item strong { font-size: 15px; }
body.kh-pdp-v2 .kh-pdp-faq__item p { margin: 6px 0 0; font-size: 14.5px; color: var(--kh-text-2); }
body.kh-pdp-v2 .kh-pdp-faq__foot { border-top: 1px solid var(--kh-border-light); padding: 16px 22px; background: var(--kh-surface); font-size: 13.5px; }

/* ── Productinformatie + montage ─────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-prose p { max-width: 64ch; margin: 0 0 14px; font-size: 16px; line-height: 1.65; color: var(--kh-text-2); }
body.kh-pdp-v2 .kh-pdp-prose strong { color: var(--kh-text); }
body.kh-pdp-v2 .kh-pdp-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; counter-reset: kh-step; }
body.kh-pdp-v2 .kh-pdp-steps li { position: relative; padding-left: 43px; list-style: none; }
body.kh-pdp-v2 .kh-pdp-steps li::before {
	counter-increment: kh-step;
	content: counter(kh-step);
	position: absolute;
	left: 0;
	top: 0;
	width: 29px;
	height: 29px;
	border-radius: 50%;
	background: var(--kh-navy);
	color: #fff;
	display: grid;
	place-items: center;
	font-size: 13px;
	font-weight: 700;
}
body.kh-pdp-v2 .kh-pdp-steps li strong { display: block; }
body.kh-pdp-v2 .kh-pdp-steps li em { display: block; font-style: normal; font-size: 14.5px; color: var(--kh-text-2); }

/* ── Specificaties ───────────────────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-stats {
	display: grid;
	grid-template-columns: repeat(var(--kh-stat-cols, 6), 1fr);
	gap: 12px;
	margin-bottom: 36px;
}
body.kh-pdp-v2 .kh-pdp-stat { border: 1px solid var(--kh-border); border-radius: 12px; padding: 17px 15px; }
body.kh-pdp-v2 .kh-pdp-stat__value { font-size: 27px; font-weight: 900; letter-spacing: -.03em; line-height: 1.1; }
body.kh-pdp-v2 .kh-pdp-stat__unit { font-style: normal; font-size: 13px; color: var(--kh-text-3); font-weight: 600; }
body.kh-pdp-v2 .kh-pdp-stat__label { font-size: 12.5px; color: var(--kh-text-3); margin-top: 5px; font-weight: 600; }

body.kh-pdp-v2 .kh-pdp-spectables { display: grid; grid-template-columns: repeat(var(--kh-spec-cols, 2), 1fr); gap: 0 60px; }
body.kh-pdp-v2 .kh-pdp-spectable { padding: 24px 0; border-top: 1px solid var(--kh-border-light); }
body.kh-pdp-v2 .kh-pdp-spectable__title {
	margin: 0 0 12px;
	color: var(--kh-text-3);
	font-size: 10.5px;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
}
body.kh-pdp-v2 .kh-pdp-spectable__list { display: grid; grid-template-columns: 1fr auto; margin: 0; }
body.kh-pdp-v2 .kh-pdp-spectable__list dt {
	padding: 8px 0;
	margin: 0;
	font-size: 15px;
	color: var(--kh-text-2);
	border-bottom: 1px dotted var(--kh-border);
}
body.kh-pdp-v2 .kh-pdp-spectable__list dd {
	padding: 8px 0;
	margin: 0;
	font-size: 15px;
	font-weight: 700;
	text-align: right;
	border-bottom: 1px dotted var(--kh-border);
}

/* ── Documentatie ────────────────────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-doccards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
body.kh-pdp-v2 .kh-pdp-doccard {
	border: 1px solid var(--kh-border);
	border-radius: 12px;
	padding: 22px;
	color: var(--kh-text);
}
body.kh-pdp-v2 .kh-pdp-doccard strong { display: block; }
body.kh-pdp-v2 .kh-pdp-doccard span,
body.kh-pdp-v2 .kh-pdp-doccard p { font-size: 14px; color: var(--kh-text-2); margin: 0; }

/* ── Beoordelingen (Trusted Shops) ───────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-reviews .wp-block-imcb-etrusted-reviews { margin: 0; }

/* ── Persoonlijk advies ──────────────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-advice { background: var(--kh-surface); border-top: 1px solid var(--kh-border); }
body.kh-pdp-v2 .kh-pdp-advice .kh-pdp-h2 { max-width: 16ch; }
body.kh-pdp-v2 .kh-pdp-advice p { color: var(--kh-text-2); max-width: 46ch; }
body.kh-pdp-v2 .kh-pdp-advice__avatar {
	width: 82px;
	height: 82px;
	border-radius: 50%;
	background: #DCE4F0;
	flex: none;
	display: grid;
	place-items: center;
	color: #5A6480;
	font-size: 26px;
	font-weight: 800;
}

/* ── Sticky koopbalk: de bestaande balk, in de nieuwe opmaak ─────────────── */

body.kh-pdp-v2 .sticky-atc-bar {
	background: rgba(255, 255, 255, .97);
	backdrop-filter: blur(10px);
	border-top: 1px solid var(--kh-border);
	box-shadow: none;
}
body.kh-pdp-v2 .sticky-atc-bar__inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 12px 28px;
	gap: 18px;
	align-items: center;
}
body.kh-pdp-v2 .sticky-atc-bar__img img { width: 44px; height: 44px; object-fit: contain; }
body.kh-pdp-v2 .sticky-atc-bar__title {
	font-size: 14.5px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: var(--kh-text);
}
body.kh-pdp-v2 .sticky-atc-bar__price,
body.kh-pdp-v2 .sticky-atc-bar__price .custom-price {
	font-size: 22px;
	font-weight: 900;
	letter-spacing: -.03em;
	white-space: nowrap;
	color: var(--kh-text);
}
body.kh-pdp-v2 .sticky-atc-bar__lead { font-size: 13px; color: var(--kh-deliv); font-weight: 700; white-space: nowrap; }
body.kh-pdp-v2 .sticky-atc-bar__btn {
	height: 46px;
	padding: 0 22px;
	border: 0;
	border-radius: 5px;
	background: var(--kh-cta);
	color: #fff;
	font-size: 15px;
	font-family: inherit; /* plugin zet Arial */
	font-weight: 600;
	white-space: nowrap;
}
body.kh-pdp-v2 .sticky-atc-bar__btn:hover { background: var(--kh-cta-hover); }

/* ── Responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 1180px) {
	body.kh-pdp-v2 .kh-pdp-wrap,
	body.kh-pdp-v2 .kh-pdp-inner,
	body.kh-pdp-v2 .kh-pdp-anchornav__inner,
	body.kh-pdp-v2 .kh-pdp-section > .wp-block-group__inner-container { padding-left: 22px; padding-right: 22px; }

	body.kh-pdp-v2 .kh-pdp-title h1, body.kh-pdp-v2 h1.wp-block-post-title { font-size: 25px; }
	body.kh-pdp-v2 .kh-pdp-price .wc-block-components-product-price,
	body.kh-pdp-v2 .kh-pdp-price .custom-price,
	body.kh-pdp-v2 .kh-pdp-stats { grid-template-columns: repeat(3, 1fr); }
	body.kh-pdp-v2 .kh-pdp-doccards { grid-template-columns: repeat(3, 1fr); }
	body.kh-pdp-v2 .kh-pdp-spectables { grid-template-columns: 1fr; gap: 0; }
}

@media (max-width: 900px) and (orientation: landscape) {
}

@media (max-width: 781px) {
	body.kh-pdp-v2 .kh-pdp-wrap,
	body.kh-pdp-v2 .kh-pdp-inner,
	body.kh-pdp-v2 .kh-pdp-anchornav__inner,
	body.kh-pdp-v2 .kh-pdp-section > .wp-block-group__inner-container { padding-left: 16px; padding-right: 16px; }

	body.kh-pdp-v2 .kh-pdp-section { padding-top: 32px; padding-bottom: 32px; }
	body.kh-pdp-v2 .kh-pdp-title h1, body.kh-pdp-v2 h1.wp-block-post-title { font-size: 21px; }
	body.kh-pdp-v2 .kh-pdp-price .wc-block-components-product-price,
	body.kh-pdp-v2 .kh-pdp-price .custom-price,
	body.kh-pdp-v2 .kh-pdp-stats { grid-template-columns: repeat(2, 1fr); gap: 10px; }
	body.kh-pdp-v2 .kh-pdp-doccards { grid-template-columns: 1fr; }
	body.kh-pdp-v2 .kh-pdp-bb-block { padding: 18px 16px; }
	body.kh-pdp-v2 .kh-pdp-bb-help,
	body.kh-pdp-v2 .kh-pdp-bb-pay { padding: 16px; }
	/* Onder de kolombreuk: knop over de volle breedte, met het aantal en het
	   hartje op één regel erboven. De wrappers van WooCommerce zetten we op
	   display:contents zodat hun kinderen in hetzelfde raster vallen. */
	body.kh-pdp-v2 .kh-pdp-cta {
		display: grid;
		grid-template-columns: auto 1fr;
		align-items: center;
		gap: 11px;
	}
	body.kh-pdp-v2 .kh-pdp-cta .wp-block-add-to-cart-form,
	body.kh-pdp-v2 .kh-pdp-cta .wp-block-woocommerce-add-to-cart-form,
	body.kh-pdp-v2 .kh-pdp-cta form.cart { display: contents; }
	body.kh-pdp-v2 .kh-pdp-cta .quantity { grid-column: 1; grid-row: 1; }
	body.kh-pdp-v2 .kh-pdp-cta .wp-block-im123-pdp-project-button { grid-column: 2; grid-row: 1; justify-self: end; }
	body.kh-pdp-v2 .kh-pdp-cta .single_add_to_cart_button {
		grid-column: 1 / -1;
		grid-row: 2;
		width: 100%;
	}
	body.kh-pdp-v2 .kh-pdp-cta button.single_add_to_cart_button { flex: 1 1 100%; order: 1; }
	body.kh-pdp-v2 .kh-pdp-cta .quantity { order: 2; }
	body.kh-pdp-v2 .kh-pdp-cta .pdp-project-btn,
body.kh-pdp-v2 .kh-pdp-cta .add-to-project-btn { order: 3; margin-left: auto; }
	body.kh-pdp-v2 .sticky-atc-bar__inner { flex-wrap: wrap; gap: 10px; padding: 10px 16px; }
	body.kh-pdp-v2 .sticky-atc-bar__title { flex: 1 1 100%; font-size: 13.5px; }
}

/* ── Aantalveld: het thema tekent zowel om .quantity als om .quantity-wrapper
      een rand, wat een dubbele lijn gaf. ─────────────────────────────────── */
body.kh-pdp-v2 .kh-pdp-cta .quantity .quantity-wrapper,
body.kh-pdp-v2 .kh-pdp-cta .quantity .quantity-wrapper * {
	border: 0 !important;
	box-shadow: none !important;
	background: none;
}
body.kh-pdp-v2 .kh-pdp-cta .quantity .quantity-wrapper { border-radius: 0 !important; }

/* ── Sectiekop uit het productveld ───────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-sectiekop { margin-bottom: 20px; }
body.kh-pdp-v2 .kh-pdp-sectiekop .kh-pdp-h2 { margin-bottom: 0; }

/* ── Documentatie: de echte productdocumenten ([product_attachments]) ────── */

body.kh-pdp-v2 .kh-pdp-doccard--files .attachments-buttons {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 10px;
}
body.kh-pdp-v2 .kh-pdp-doccard--files .attachment-button {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 9px 12px;
	border: 1px solid var(--kh-border);
	border-radius: 5px;
	background: #fff;
	color: var(--kh-text);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	line-height: 1.35;
}
body.kh-pdp-v2 .kh-pdp-doccard--files .attachment-button:hover { background: var(--kh-surface); text-decoration: none; }
body.kh-pdp-v2 .kh-pdp-doccard--files .attachment-button .download-icon { flex: none; width: 16px; height: 20px; }
body.kh-pdp-v2 .kh-pdp-doccard--files .product-attachments-wrapper { margin: 0; }

/* ── Toebehoren: de bestaande "123 Toebehoren Slider" ────────────────────────
   Het thema heeft in 2.css een eigen, horizontale `.product-card` (regels 2421
   en 3182). Die naam botst met de kaart van de slider: die werd daardoor een
   rij in plaats van een kolom, met afgeknipte tekst tot gevolg. Hier zetten we
   binnen de nieuwe PDP de eigen opmaak van de slider terug.
   NB: dezelfde botsing speelt overal waar deze slider staat; dat buiten de
   nieuwe PDP oplossen raakt de huidige pagina's en is dus een aparte keuze. */

body.kh-pdp-v2 main .imcb-accessories .product-card {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: stretch;
	padding: 0;
	margin-bottom: 0;
	border: 1px solid var(--kh-border);
	border-radius: 12px;
	box-shadow: none !important;
	overflow: hidden;
}
body.kh-pdp-v2 main .imcb-accessories .product-card:hover { box-shadow: 0 4px 18px rgba(18, 42, 94, .10) !important; }
body.kh-pdp-v2 main .imcb-accessories .accessories-title:empty { display: none; }

/* Bestelrij in de slidekaart: de knop mag krimpen, anders loopt hij buiten de
   kaart (262 px breed bij vier kaarten naast elkaar). */
body.kh-pdp-v2 main .imcb-accessories .card-cart-row { display: flex; gap: 8px; align-items: stretch; }
body.kh-pdp-v2 main .imcb-accessories .card-cart-row .qty-control { flex: none; }
body.kh-pdp-v2 main .imcb-accessories .card-cart-row .btn-cart {
	flex: 1 1 auto;
	min-width: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 0 10px;
	white-space: nowrap;
	font-size: 13.5px;
}

/* ── Keuzehulp: de knop van de configuratorplugin, ongewijzigd ───────────────
   Alleen de ruimte eromheen regelen we hier; kleur en vorm komen uit de plugin. */
body.kh-pdp-v2 .kh-pdp-keuzehulp { margin-top: 0; }
body.kh-pdp-v2 .kh-pdp-keuzehulp .dhc-pdp-block { margin: 0; }

/* ── Totaal van de samenstelling, onder de prijs ─────────────────────────── */

body.kh-pdp-v2 .kh-pdp-total {
	margin: 6px 0 0;
	font-size: 14px;
	font-weight: 700;
	color: var(--kh-text);
}
body.kh-pdp-v2 .kh-pdp-total span { font-weight: 600; color: var(--kh-text-3); }

/* ── Toebehoren: melding als er niets gekoppeld is ───────────────────────── */

body.kh-pdp-v2 .kh-pdp-leeg {
	margin: 0;
	padding: 22px 24px;
	border: 1px dashed var(--kh-border);
	border-radius: 12px;
	background: #fff;
	color: var(--kh-text-2);
	font-size: 14.5px;
}

/* ── Toebehoren-kaarten: rustiger en in de tokens van het ontwerp ────────── */

body.kh-pdp-v2 main .imcb-accessories .product-card { transition: box-shadow .2s, border-color .2s; }
body.kh-pdp-v2 main .imcb-accessories .product-card:hover { border-color: #C9D3E4; }
body.kh-pdp-v2 main .imcb-accessories .card-img-area { padding: 16px 16px 10px; }
body.kh-pdp-v2 main .imcb-accessories .card-img-area img { max-height: 170px; width: auto; margin: 0 auto; object-fit: contain; }
body.kh-pdp-v2 main .imcb-accessories .card-body { padding: 0 16px 16px; }
body.kh-pdp-v2 main .imcb-accessories .card-title,
body.kh-pdp-v2 main .imcb-accessories .card-title a {
	color: var(--kh-text);
	font-size: 14.5px;
	font-weight: 700;
	line-height: 1.35;
	text-decoration: none;
}
body.kh-pdp-v2 main .imcb-accessories .card-excerpt { font-size: 13px; color: var(--kh-text-2); line-height: 1.45; }
body.kh-pdp-v2 main .imcb-accessories .card-sku { font-size: 12px; color: var(--kh-text-3); }
body.kh-pdp-v2 main .imcb-accessories .card-price,
body.kh-pdp-v2 main .imcb-accessories .price-amount {
	font-size: 22px;
	font-weight: 900;
	letter-spacing: -.03em;
	color: var(--kh-text);
}
body.kh-pdp-v2 main .imcb-accessories .btn-cart {
	background: var(--kh-cta);
	border: 0;
	border-radius: 5px;
	color: #fff;
	font-weight: 800;
	height: 44px;
}
body.kh-pdp-v2 main .imcb-accessories .btn-cart:hover { background: var(--kh-cta-hover); }
body.kh-pdp-v2 main .imcb-accessories .qty-control {
	border: 1px solid var(--kh-border);
	border-radius: 5px;
	height: 44px;
	display: flex;
	align-items: center;
	overflow: hidden;
}
body.kh-pdp-v2 main .imcb-accessories .qty-btn { border: 0; background: none; width: 30px; height: 42px; color: var(--kh-text-2); }
body.kh-pdp-v2 main .imcb-accessories .card-delivery { font-size: 12.5px; color: var(--kh-text-2); line-height: 1.4; align-items: center; }
body.kh-pdp-v2 main .imcb-accessories .card-stock { font-size: 12.5px; font-weight: 700; color: #12946A; }
body.kh-pdp-v2 main .imcb-accessories .heart-btn { color: var(--kh-text-3); }

/* Kaarten in de slider even hoog, met de bestelrij onderaan uitgelijnd. */
body.kh-pdp-v2 main .imcb-accessories .imcb-slider-track { align-items: stretch; }
body.kh-pdp-v2 main .imcb-accessories .product-card { height: 100%; }
body.kh-pdp-v2 main .imcb-accessories .card-body,
body.kh-pdp-v2 main .imcb-accessories .product-card > div:last-child { flex: 1; display: flex; flex-direction: column; }
body.kh-pdp-v2 main .imcb-accessories .card-cart-row { margin-top: auto; }
body.kh-pdp-v2 main .imcb-accessories .card-delivery { display: flex; gap: 7px; align-items: flex-start; margin-top: 10px; }
body.kh-pdp-v2 main .imcb-accessories .card-delivery .truck-icon { flex: none; margin-top: 2px; }
/* De levertijdregel bracht zelf ook een icoon mee; één is genoeg. */
body.kh-pdp-v2 main .imcb-accessories .card-delivery .lynqio-levertijd_kort { padding-left: 0; }

/* ══════════════════════════════════════════════════════════════════════════
   Ronde 5
   ══════════════════════════════════════════════════════════════════════════ */

/* De blokafstand van 25 px uit theme.json hoort niet in de buybox: de blokken
   sluiten daar op elkaar aan met alleen een scheidingslijn. (Deze regels waren
   bij een eerdere opschoning gesneuveld.) */
body.kh-pdp-v2 .kh-pdp-buybox > *,
body.kh-pdp-v2 .kh-pdp-config > *,
body.kh-pdp-v2 .kh-pdp-price > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}
body.kh-pdp-v2 .kh-pdp-config > * + * { margin-block-start: 14px !important; margin-top: 14px !important; }
body.kh-pdp-v2 .kh-pdp-config .kh-pdp-cta { margin-block-start: 16px !important; margin-top: 16px !important; }
body.kh-pdp-v2 .kh-pdp-config .kh-pdp-guarantees { margin-block-start: 14px !important; margin-top: 14px !important; }
body.kh-pdp-v2 .kh-pdp-price .kh-pdp-deliv { margin-top: 16px !important; }

/* Keuzehulp-knop even breed als het aansluitset-vak eronder. */
body.kh-pdp-v2 .kh-pdp-keuzehulp,
body.kh-pdp-v2 .kh-pdp-keuzehulp .dhc-pdp-block,
body.kh-pdp-v2 .kh-pdp-keuzehulp .dhc-trigger { width: 100%; box-sizing: border-box; }

/* Secties met een vlak: de kleur loopt over de volle breedte van de pagina,
   de inhoud blijft binnen dezelfde 1240 px als de rest. */
body.kh-pdp-v2 .kh-pdp-section--surface,
body.kh-pdp-v2 .kh-pdp-advice {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Documentatie: bij tien handleidingen mag de kaart niet uitgroeien; de lijst
   scrollt dan binnen de kaart, zodat de drie blokken even hoog blijven. */
body.kh-pdp-v2 .kh-pdp-doccards { align-items: stretch; }
body.kh-pdp-v2 .kh-pdp-doccard { min-height: 100%; }
body.kh-pdp-v2 .kh-pdp-doccard--files .attachments-buttons {
	max-height: 168px;
	overflow-y: auto;
	padding-right: 4px;
	scrollbar-width: thin;
}
body.kh-pdp-v2 .kh-pdp-doccard--files .attachments-buttons::-webkit-scrollbar { width: 6px; }
body.kh-pdp-v2 .kh-pdp-doccard--files .attachments-buttons::-webkit-scrollbar-thumb { background: var(--kh-border); border-radius: 5px; }
body.kh-pdp-v2 .kh-pdp-doccard--files .kh-pdp-doccard__count { font-size: 12.5px; color: var(--kh-text-3); margin: 2px 0 0; }

/* Specialist */
body.kh-pdp-v2 .kh-pdp-specialist { display: flex; align-items: center; gap: 14px; }
body.kh-pdp-v2 .kh-pdp-specialist__foto {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	object-fit: cover;
	flex: none;
	background: #fff;
}
body.kh-pdp-v2 .kh-pdp-specialist--groot .kh-pdp-specialist__foto { width: 82px; height: 82px; }
body.kh-pdp-v2 .kh-pdp-specialist__initiaal {
	display: grid;
	place-items: center;
	font-weight: 800;
	color: var(--kh-navy);
	background: #fff;
}
body.kh-pdp-v2 .kh-pdp-specialist--groot .kh-pdp-specialist__initiaal { background: #DCE4F0; color: #5A6480; font-size: 26px; }
body.kh-pdp-v2 .kh-pdp-specialist__tekst { flex: 1; min-width: 0; font-size: 13.5px; line-height: 1.45; }
body.kh-pdp-v2 .kh-pdp-specialist__titel { font-size: 14.5px; font-weight: 700; display: block; }
body.kh-pdp-v2 .kh-pdp-specialist__sub { color: var(--kh-text-2); display: block; }
body.kh-pdp-v2 .kh-pdp-specialist__acties { flex: none; display: flex; gap: 8px; }
body.kh-pdp-v2 .kh-pdp-specialist--groot { gap: 16px; }
body.kh-pdp-v2 .kh-pdp-specialist--groot .kh-pdp-specialist__rol {
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--kh-text-3);
	display: block;
}
body.kh-pdp-v2 .kh-pdp-specialist--groot .kh-pdp-specialist__naam { font-weight: 700; font-size: 17px; display: block; }
body.kh-pdp-v2 .kh-pdp-specialist--groot .kh-pdp-specialist__ervaring { font-size: 13.5px; color: var(--kh-text-3); display: block; }

/* Blijft er van een tweekolomssectie maar één kolom over (geen montagestappen,
   geen koopvragen), dan hoort die de volle breedte te pakken. */
body.kh-pdp-v2 .kh-pdp-section .wp-block-columns > .wp-block-column:only-child {
	flex-basis: 100% !important;
	max-width: 100%;
}

/* Montagekaart strakker in het stramien van het ontwerp. */
body.kh-pdp-v2 .kh-pdp-montage {
	padding: 26px;
	background: #fff;
	border: 1px solid var(--kh-border);
	border-radius: 12px;
}
body.kh-pdp-v2 .kh-pdp-montage .kh-pdp-h3 { margin: 0 0 20px; font-size: 19px; font-weight: 700; }
body.kh-pdp-v2 .kh-pdp-montage .kh-pdp-steps { display: grid; gap: 18px; margin: 0; padding: 0; }
body.kh-pdp-v2 .kh-pdp-montage .kh-pdp-steps li { padding-left: 43px; }
body.kh-pdp-v2 .kh-pdp-montage .kh-pdp-steps li strong { font-size: 15.5px; font-weight: 700; line-height: 1.35; }
body.kh-pdp-v2 .kh-pdp-montage .kh-pdp-steps li em { margin-top: 2px; font-size: 14.5px; line-height: 1.5; }
body.kh-pdp-v2 .kh-pdp-montage .kh-pdp-steps li::before { top: 1px; }
body.kh-pdp-v2 .kh-pdp-montage__link { margin: 22px 0 0; font-size: 14.5px; font-weight: 600; }

/* De trigger van de configurator heeft zelf een breedtebeperking; in de buybox
   hoort hij even breed te zijn als het aansluitset-vak eronder. */
body.kh-pdp-v2 .kh-pdp-keuzehulp .dhc-trigger {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	box-sizing: border-box;
}

/* ── Productomschrijving in de typografie van dit ontwerp ────────────────────
   De omschrijving komt uit het product en brengt eigen koppen en lijstjes mee;
   die kregen anders de themastijl (26 px koppen) en vielen uit de toon. */
body.kh-pdp-v2 .kh-pdp-prose h1,
body.kh-pdp-v2 .kh-pdp-prose h2,
body.kh-pdp-v2 .kh-pdp-prose h3,
body.kh-pdp-v2 .kh-pdp-prose h4 {
	font-size: 19px !important;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -.01em;
	color: var(--kh-text);
	margin: 26px 0 12px;
}
body.kh-pdp-v2 .kh-pdp-prose > :first-child { margin-top: 0; }
body.kh-pdp-v2 .kh-pdp-prose p {
	max-width: 64ch;
	margin: 0 0 14px;
	font-size: 16px;
	line-height: 1.65;
	color: var(--kh-text-2);
}
body.kh-pdp-v2 .kh-pdp-prose strong,
body.kh-pdp-v2 .kh-pdp-prose b { color: var(--kh-text); }
body.kh-pdp-v2 .kh-pdp-prose ul,
body.kh-pdp-v2 .kh-pdp-prose ol {
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
	max-width: 64ch;
}
body.kh-pdp-v2 .kh-pdp-prose li {
	position: relative;
	padding: 6px 0 6px 28px;
	font-size: 15px;
	line-height: 1.5;
	color: var(--kh-text-2);
}
body.kh-pdp-v2 .kh-pdp-prose li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 9px;
	width: 16px;
	height: 16px;
	background: url("https://123installatiematerialen.nl/wp-content/uploads/2026/03/check.png") center/contain no-repeat;
}

/* ── Documenten: eigen rij met downloadtegels ────────────────────────────────
   Een lijst met onbekende lengte hoort niet in een rij met vaste tekstblokjes:
   bij tien handleidingen groeide die kaart uit de rij. Documenten staan nu
   onder de zekerheidsblokken, als tegels die netjes uitvloeien — alles zichtbaar,
   niets weggescrold. */

body.kh-pdp-v2 .kh-pdp-docs { margin-top: 26px; }
body.kh-pdp-v2 .kh-pdp-docs__kop {
	margin: 0 0 12px;
	font-size: 10.5px;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--kh-text-3);
}
body.kh-pdp-v2 .kh-pdp-docs__kop span { font-weight: 700; }
body.kh-pdp-v2 .kh-pdp-docs .product-attachments-wrapper { margin: 0; }
body.kh-pdp-v2 .kh-pdp-docs .attachments-buttons {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 10px;
	max-height: none;
	overflow: visible;
}
body.kh-pdp-v2 .kh-pdp-docs .attachment-button {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 13px 15px;
	border: 1px solid var(--kh-border);
	border-radius: 5px;
	background: #fff;
	color: var(--kh-text);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	text-decoration: none;
}
body.kh-pdp-v2 .kh-pdp-docs .attachment-button:hover { background: var(--kh-surface); border-color: #C9D3E4; text-decoration: none; }
body.kh-pdp-v2 .kh-pdp-docs .attachment-button .download-icon { flex: none; width: 16px; height: 20px; }

@media (max-width: 781px) {
	body.kh-pdp-v2 .kh-pdp-docs .attachments-buttons { grid-template-columns: 1fr; }
}

/* Kaarten in de documentatierij zijn grid-items; de blokafstand van theme.json
   zette op de tweede en derde een marge van 25 px, waardoor de eerste hoger
   stond. Het raster regelt de tussenruimte al. */
body.kh-pdp-v2 .kh-pdp-doccards > * {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

/* ── Galerij loopt mee tot onder aan het koopblok ────────────────────────────
   De kolom is even hoog als de buybox; de foto blijft daarbinnen plakken tot de
   lijn onder de sectie. (Deze regels waren bij een opschoning gesneuveld.) */
body.kh-pdp-v2 .kh-pdp-gallery { align-self: stretch; }
body.kh-pdp-v2 .kh-pdp-gallery__sticky {
	position: sticky;
	top: calc(var(--kh-header-h, 0px) + 16px);
}

@media (max-width: 1180px) {
	body.kh-pdp-v2 .kh-pdp-gallery__sticky { position: static; }
}

/* ══════════════════════════════════════════════════════════════════════════
   Knoprij en slidekaart — definitief
   (Deze regels stonden er eerder al; ze sneuvelden bij het opschonen van de
   oranje keuzehulp-opmaak. Daarom staan ze hier onderaan bij elkaar.)
   ══════════════════════════════════════════════════════════════════════════ */

/* Drie storende dingen in de knoprij: de clearfix van form.cart telt in een
   flexrij als flex-item mee, het thema centreert de forminhoud, en het
   verborgen bundel-veld at een tussenruimte op. */
body.kh-pdp-v2 .kh-pdp-cta form.cart::before,
body.kh-pdp-v2 .kh-pdp-cta form.cart::after { display: none !important; }
body.kh-pdp-v2 .kh-pdp-cta form.cart { justify-content: flex-start !important; gap: 11px !important; }
body.kh-pdp-v2 .kh-pdp-cta form.cart input[type="hidden"] { display: none; }
body.kh-pdp-v2 .kh-pdp-cta { gap: 11px !important; }
body.kh-pdp-v2 .kh-pdp-cta .quantity { margin-right: 0 !important; }

/* Zelfde hoogte als op de huidige PDP: 40 px. */
body.kh-pdp-v2 .kh-pdp-cta .quantity,
body.kh-pdp-v2 .kh-pdp-cta button.single_add_to_cart_button,
body.kh-pdp-v2 .kh-pdp-cta .pdp-project-btn,
body.kh-pdp-v2 .kh-pdp-cta .add-to-project-btn {
	height: 40px !important;
	min-height: 40px !important;
}
body.kh-pdp-v2 .kh-pdp-cta .quantity input.qty,
body.kh-pdp-v2 .kh-pdp-cta .quantity .quantity-btn,
body.kh-pdp-v2 .kh-pdp-cta .quantity .kh-qty-btn { height: 38px !important; }
body.kh-pdp-v2 .kh-pdp-cta .quantity .quantity-btn,
body.kh-pdp-v2 .kh-pdp-cta .quantity .kh-qty-btn { width: 34px; font-size: 16px; }
body.kh-pdp-v2 .kh-pdp-cta button.single_add_to_cart_button { font-size: 16px; }
body.kh-pdp-v2 .kh-pdp-cta .pdp-project-btn,
body.kh-pdp-v2 .kh-pdp-cta .add-to-project-btn { width: 40px !important; }
body.kh-pdp-v2 .kh-pdp-cta .pdp-project-btn svg,
body.kh-pdp-v2 .kh-pdp-cta .add-to-project-btn svg { width: 19px; height: 19px; }

/* Aantalregelaar in de slidekaart: het getal kreeg maar ±12 px, waardoor twee
   cijfers niet pasten. */
body.kh-pdp-v2 main .imcb-accessories .qty-control {
	border: 1px solid var(--kh-border);
	border-radius: 5px;
	height: 44px;
	display: flex;
	align-items: center;
	overflow: hidden;
	flex: none;
}
body.kh-pdp-v2 main .imcb-accessories .qty-btn {
	width: 32px;
	height: 42px;
	border: 0;
	background: none;
	color: var(--kh-text-2);
	font-size: 17px;
	line-height: 1;
	cursor: pointer;
	padding: 0;
}
body.kh-pdp-v2 main .imcb-accessories .qty-btn:hover { background: var(--kh-surface); }
body.kh-pdp-v2 main .imcb-accessories .qty-num {
	min-width: 30px;
	text-align: center;
	font-size: 15px;
	font-weight: 800;
	color: var(--kh-text);
	font-variant-numeric: tabular-nums;
}



/* Kaartinhoud iets ruimer, titel en prijs strakker in het stramien. */
body.kh-pdp-v2 main .imcb-accessories .card-excerpt {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 4px;
}
body.kh-pdp-v2 main .imcb-accessories .card-sku { margin-top: 6px; }
body.kh-pdp-v2 main .imcb-accessories .card-divider { border: 0; border-top: 1px solid var(--kh-border-light); margin: 12px 0; }
body.kh-pdp-v2 main .imcb-accessories .card-price { display: flex; align-items: baseline; gap: 7px; }
body.kh-pdp-v2 main .imcb-accessories .price-vat { font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--kh-text-3); font-weight: 600; }

/* ══════════════════════════════════════════════════════════════════════════
   Toebehoren-kaart = de kaart van de categoriepagina, plus een aantalregelaar
   Maten overgenomen van .product-item op /boilers/close-in-boiler/:
   radius 10 px, rand #efefef, padding 15, titel 16/600 in #224284,
   knop #47CFAC met radius 4 en 39 px hoog.
   ══════════════════════════════════════════════════════════════════════════ */

body.kh-pdp-v2 main .imcb-accessories .product-card {
	border: 1px solid #efefef;
	border-radius: 10px;
	padding: 15px;
	background: #fff;
	box-shadow: none !important;
}
body.kh-pdp-v2 main .imcb-accessories .product-card:hover { box-shadow: 0 4px 18px rgba(18, 42, 94, .10) !important; }
body.kh-pdp-v2 main .imcb-accessories .card-img-area { padding: 0 0 12px; }
body.kh-pdp-v2 main .imcb-accessories .card-img-area img { max-height: 210px; width: auto; margin: 0 auto; object-fit: contain; }
body.kh-pdp-v2 main .imcb-accessories .card-body { padding: 0; }
body.kh-pdp-v2 main .imcb-accessories .card-title,
body.kh-pdp-v2 main .imcb-accessories .card-title a {
	color: #224284;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.25;
	text-decoration: none;
}
body.kh-pdp-v2 main .imcb-accessories .card-excerpt { font-size: 13px; color: var(--kh-text-2); }
body.kh-pdp-v2 main .imcb-accessories .card-sku { font-size: 12.5px; color: var(--kh-text-3); }
body.kh-pdp-v2 main .imcb-accessories .card-divider { border: 0; border-top: 1px solid #efefef; margin: 12px 0; }
body.kh-pdp-v2 main .imcb-accessories .card-price {
	display: flex;
	flex-direction: column;
	line-height: 1.15;
	margin-bottom: 10px;
}
body.kh-pdp-v2 main .imcb-accessories .price-amount { font-size: 20px; font-weight: 800; color: #333; letter-spacing: 0; }
body.kh-pdp-v2 main .imcb-accessories .price-vat { font-size: 12px; font-weight: 400; color: var(--kh-text-3); text-transform: none; letter-spacing: 0; }

/* Aantal en knop naast elkaar, zoals gevraagd. */
body.kh-pdp-v2 main .imcb-accessories .card-cart-row {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 8px;
	margin-top: auto;
}
body.kh-pdp-v2 main .imcb-accessories .card-cart-row .qty-control {
	flex: 0 0 88px;
	height: 39px;
	border: 1px solid #dfe5ef;
	border-radius: 4px;
	display: flex;
	align-items: center;
	overflow: hidden;
	background: #fff;
}
body.kh-pdp-v2 main .imcb-accessories .card-cart-row .qty-btn {
	width: 28px;
	height: 37px;
	border: 0;
	background: none;
	color: var(--kh-text-2);
	font-size: 16px;
	cursor: pointer;
	padding: 0;
}
body.kh-pdp-v2 main .imcb-accessories .card-cart-row .qty-btn:hover { background: var(--kh-surface); }
body.kh-pdp-v2 main .imcb-accessories .card-cart-row .qty-num {
	min-width: 30px;
	text-align: center;
	font-size: 15px;
	font-weight: 700;
	color: #333;
	font-variant-numeric: tabular-nums;
}
body.kh-pdp-v2 main .imcb-accessories .card-cart-row .btn-cart {
	flex: 1 1 auto;
	min-width: 0;
	height: 39px;
	border: 0;
	border-radius: 4px;
	background: #47CFAC;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 0 10px;
	white-space: nowrap;
}
body.kh-pdp-v2 main .imcb-accessories .card-cart-row .btn-cart:hover { background: #35b795; }

/* Prijs boven, daaronder aantal + knop naast elkaar.
   (Prijs en knop náást elkaar zoals op de categoriekaart is hier geprobeerd,
   maar die kaart is 345 px breed en deze ±325 px inclusief de aantalregelaar:
   dan kapt de knoptekst af. Vandaar de prijs op een eigen regel.) */
body.kh-pdp-v2 main .imcb-accessories .card-price { margin-bottom: 10px; }


/* ── Levertijd in de slidekaart ──────────────────────────────────────────────
   Niets namaken: de markup van [levertijd_kort] draagt dezelfde klassen als op
   de categoriepagina, dus de opmaak uit blocks/levertijd-kort/style.css (echte
   vrachtwagen-svg, pulserend bolletje) geldt hier vanzelf. We zetten alleen de
   eigen levertijd-elementen van de kaart uit, zodat het er niet dubbel staat. */
body.kh-pdp-v2 main .imcb-accessories .card-delivery .truck-icon { display: none; }
body.kh-pdp-v2 main .imcb-accessories .card-stock { display: none; }
body.kh-pdp-v2 main .imcb-accessories .card-delivery { display: block; margin-top: 10px; }
body.kh-pdp-v2 main .imcb-accessories .card-delivery .lynqio-levertijd_kort { margin-top: 0; }

/* De kop van de koopvragen-kaart stond tegen de rand: de oude regel mikte nog op
   de structuur van vóór het eigen blok (.wp-block-group__inner-container > h3). */
body.kh-pdp-v2 .kh-pdp-faq__head {
	margin: 0 !important;
	padding: 20px 22px 16px;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--kh-text);
}
body.kh-pdp-v2 .kh-pdp-faq__item strong { display: block; font-size: 15px; font-weight: 700; }
body.kh-pdp-v2 .kh-pdp-faq__item p { margin: 6px 0 0; font-size: 14.5px; line-height: 1.5; color: var(--kh-text-2); }

/* In de smallere slidekaart kneep de flexrij het icoon van 20 naar 18,5 px. */
body.kh-pdp-v2 main .imcb-accessories .card-delivery .lynqio-levertijd_kort::before { flex: none; }

/* Ankerbalk: in de pagina houdt hij de gewone breedte aan. Zodra hij vastplakt
   en meeschuift, loopt hij van rand tot rand — de links blijven op hun plek,
   want die zitten in een container van 1240 px. De klasse wordt in
   js/pdp-v2.js gezet zodra de balk daadwerkelijk tegen de header aan komt. */
body.kh-pdp-v2 .kh-pdp-anchornav { z-index: 45; }
body.kh-pdp-v2 .kh-pdp-anchornav.is-vast {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Op telefoon liep de galerij over zijn eigen hoogte heen: de container kreeg
   380 px terwijl hoofdfoto (384) plus thumbstrip (±50) erin moeten. De strip
   viel daardoor over het merk en het artikelnummer heen. */
/* css/7.css zet `height: 380px !important` op de galerijcontainer (regel met
   .woocommerce div.product div.images.woocommerce-product-gallery). De inhoud —
   hoofdfoto 384 px plus thumbstrip 52 px — past daar niet in en viel dus over
   het merk en het artikelnummer heen. Deze selector is één klasse specifieker. */
/* De regel in 7.css weegt 4 klassen + 2 elementen; deze weegt 5 klassen, dus
   deze wint. */
body.kh-pdp-v2 .kh-pdp-gallery .kh-pdp-gallery__sticky .woocommerce-product-gallery.woocommerce-product-gallery,
body.kh-pdp-v2 .kh-pdp-gallery__sticky,
body.kh-pdp-v2 .kh-pdp-gallery { height: auto !important; }
body.kh-pdp-v2 .kh-pdp-gallery .woocommerce-product-gallery { overflow: visible; }

/* Pijltjes rechtsonder in de foto (js/pdp-v2.js hangt ze in het fotovenster). */
body.kh-pdp-v2 .kh-pdp-gallery .flex-viewport { position: relative; }
body.kh-pdp-v2 .kh-pdp-gallery .flex-viewport .custom-gallery-nav-container {
	position: absolute;
	right: 12px;
	bottom: 12px;
	top: auto;
	z-index: 3;
}

/* Het prijsblok van v2 zet line-height 1 (voor de grote consumentenprijs); de
   labels van het Gold-blok erven dat en werden daardoor 14/12 px hoog in plaats
   van "normal" zoals op de huidige PDP. Alleen dat terugzetten — de rest van de
   Gold-opmaak komt uit de plugin. */
body.kh-pdp-v2 .kh-pdp-price .b2b-price-container,
body.kh-pdp-v2 .kh-pdp-price .b2b-price-label-excl,
body.kh-pdp-v2 .kh-pdp-price .b2b-price-label-incl { line-height: normal; }

/* Prijs en kortingslabel op één regel, zoals op de huidige PDP (daar zit het in
   een flexgroep `prijsb2b prijsb2b-flex`). Het label houdt zijn eigen opmaak:
   die komt uit de shortcode zelf. */
body.kh-pdp-v2 .kh-pdp-price-row {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	/* 20 px, gemeten op de huidige PDP (label begint 20 px na het prijsblok). */
	gap: 20px;
	margin: 0 !important;
}
body.kh-pdp-v2 .kh-pdp-price-row .b2b-korting-label { flex: none; margin-top: 2px; }

/* De drie knoppen in de adviessectie horen even groot te zijn (het ontwerp
   geeft ze alle drie 13/20 padding op 15 px tekst). De witte hebben een rand van
   1 px, dus daar gaat die 1 px van de padding af — anders worden ze 2 px hoger. */
body.kh-pdp-v2 .kh-pdp-advice .kh-pdp-btn-primary,
body.kh-pdp-v2 .kh-pdp-advice .kh-pdp-btn-ghost {
	font-size: 15px;
	font-weight: 700;
	line-height: normal;
	box-sizing: border-box;
}
body.kh-pdp-v2 .kh-pdp-advice .kh-pdp-btn-primary { padding: 13px 20px; }
body.kh-pdp-v2 .kh-pdp-advice .kh-pdp-btn-ghost { padding: 12px 19px; }

/* ── Alternatieven: "Bekijk ons alternatief" in de stijl van de nieuwe PDP ──
   Zelfde kaartmaten als de toebehoren- en categoriekaart. */

body.kh-pdp-v2 .kh-pdp-alt__grid {
	display: grid;
	grid-template-columns: repeat(var(--kh-alt-cols, 3), 1fr);
	gap: 16px;
}
body.kh-pdp-v2 .kh-pdp-alt__kaart {
	display: flex;
	flex-direction: column;
	border: 1px solid #efefef;
	border-radius: 10px;
	padding: 15px;
	background: #fff;
}
body.kh-pdp-v2 .kh-pdp-alt__kaart:hover { border-color: #C9D3E4; }
body.kh-pdp-v2 .kh-pdp-alt__beeld {
	display: block;
	height: 150px;
	margin-bottom: 12px;
	text-align: center;
}
body.kh-pdp-v2 .kh-pdp-alt__beeld img { max-height: 150px; width: auto; margin: 0 auto; object-fit: contain; }
body.kh-pdp-v2 .kh-pdp-alt__titel {
	color: #224284;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.25;
	text-decoration: none;
	margin-bottom: 10px;
}
body.kh-pdp-v2 .kh-pdp-alt__titel:hover { text-decoration: none; color: var(--kh-navy); }
body.kh-pdp-v2 .kh-pdp-alt__prijs {
	margin-top: auto;
	font-size: 20px;
	font-weight: 800;
	color: #333;
	line-height: 1.15;
}
body.kh-pdp-v2 .kh-pdp-alt__prijs span { display: block; font-size: 12px; font-weight: 400; color: var(--kh-text-3); }
body.kh-pdp-v2 .kh-pdp-alt__knop {
	margin-top: 12px;
	height: 39px;
	border-radius: 4px;
	background: #47CFAC;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}
body.kh-pdp-v2 .kh-pdp-alt__knop:hover { background: #35b795; color: #fff; text-decoration: none; }

@media (max-width: 781px) {
	body.kh-pdp-v2 .kh-pdp-alt__grid { grid-template-columns: 1fr; }
}

/* Alternatieven: motivatie op de kaart en de verwijzing in het koopblok. */
body.kh-pdp-v2 .kh-pdp-alt__richting {
	align-self: flex-start;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: 3px 8px;
	border-radius: 4px;
	margin-bottom: 6px;
	background: var(--kh-surface);
	color: var(--kh-text-2);
}
body.kh-pdp-v2 .kh-pdp-alt__richting.is-goedkoper { background: #E9F7F1; color: var(--kh-deliv); }
body.kh-pdp-v2 .kh-pdp-alt__richting.is-duurder { background: #FFF4EC; color: var(--kh-orange); }
body.kh-pdp-v2 .kh-pdp-alt__verschil { margin: 0 0 12px; font-size: 13px; line-height: 1.45; color: var(--kh-text-2); }

body.kh-pdp-v2 .kh-pdp-alt-teaser {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: 14px !important;
	padding: 11px 14px;
	border: 1px solid var(--kh-border);
	border-radius: 5px;
	background: #fff;
	color: var(--kh-text);
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
}
body.kh-pdp-v2 .kh-pdp-alt-teaser:hover { background: var(--kh-surface); text-decoration: none; }
body.kh-pdp-v2 .kh-pdp-alt-teaser__pijl { color: var(--kh-text-3); }

/* ── Belangrijkste kenmerken, onder de buybox ────────────────────────────────
 * Vijf stijlen, te kiezen op het blok in de Site Editor (attribuut "stijl").
 * Standaard: kaart.
 * ────────────────────────────────────────────────────────────────────────── */

body.kh-pdp-v2 .kh-pdp-kenmerken { margin-top: 20px; }
body.kh-pdp-v2 .kh-pdp-kenmerken__title {
	margin: 0 0 12px;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: -.01em;
	color: var(--kh-text);
}
body.kh-pdp-v2 .kh-pdp-kenmerken__list { list-style: none; margin: 0; padding: 0; }
body.kh-pdp-v2 .kh-pdp-kenmerken__list li {
	position: relative;
	padding-left: 27px;
	font-size: 14.5px;
	line-height: 1.4;
	color: var(--kh-text-2);
	list-style: none;
}
body.kh-pdp-v2 .kh-pdp-kenmerken__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .18em;
	width: 16px;
	height: 16px;
	background: url("https://123installatiematerialen.nl/wp-content/uploads/2026/03/check.png") center/contain no-repeat;
}
body.kh-pdp-v2 .kh-pdp-kenmerken strong { color: var(--kh-text); font-weight: 700; }

/* 1. Kaart — zelfde kader als de buybox, regels zonder scheidingslijnen */
body.kh-pdp-v2 .kh-pdp-kenmerken--kaart {
	border: 1px solid var(--kh-border);
	border-radius: 12px;
	background: #fff;
	padding: 18px 22px 20px;
}
body.kh-pdp-v2 .kh-pdp-kenmerken--kaart .kh-pdp-kenmerken__list { display: grid; gap: 11px; }

/* 2. Zachte tegel — geen rand, rustige grond, iets compacter */
body.kh-pdp-v2 .kh-pdp-kenmerken--zacht {
	background: var(--kh-surface);
	border-radius: 12px;
	padding: 18px 20px 20px;
}
body.kh-pdp-v2 .kh-pdp-kenmerken--zacht .kh-pdp-kenmerken__list { display: grid; gap: 10px; }
body.kh-pdp-v2 .kh-pdp-kenmerken--zacht .kh-pdp-kenmerken__list li { color: var(--kh-text); font-weight: 600; }
body.kh-pdp-v2 .kh-pdp-kenmerken--zacht .kh-pdp-kenmerken__list li strong { font-weight: 800; }

/* 3. Open — geen kaart, alleen kop en lijst; laat de buybox het kader zijn */
body.kh-pdp-v2 .kh-pdp-kenmerken--open { padding: 4px 2px 0; }
body.kh-pdp-v2 .kh-pdp-kenmerken--open .kh-pdp-kenmerken__title {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--kh-text-3);
	margin-bottom: 11px;
}
body.kh-pdp-v2 .kh-pdp-kenmerken--open .kh-pdp-kenmerken__list { display: grid; gap: 9px; }

/* 4. Twee kolommen — zes regels in drie rijen, scheelt hoogte */
body.kh-pdp-v2 .kh-pdp-kenmerken--duo {
	border: 1px solid var(--kh-border);
	border-radius: 12px;
	background: #fff;
	padding: 18px 20px 20px;
}
body.kh-pdp-v2 .kh-pdp-kenmerken--duo .kh-pdp-kenmerken__list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 18px;
}
body.kh-pdp-v2 .kh-pdp-kenmerken--duo .kh-pdp-kenmerken__list li { font-size: 13.5px; }

/* 5. Gesplitst — beloftes met vinkje, specificaties als label/waarde */
body.kh-pdp-v2 .kh-pdp-kenmerken--split {
	border: 1px solid var(--kh-border);
	border-radius: 12px;
	background: #fff;
	overflow: hidden;
}
body.kh-pdp-v2 .kh-pdp-kenmerken--split .kh-pdp-kenmerken__title { margin: 0; padding: 16px 20px 12px; }
body.kh-pdp-v2 .kh-pdp-kenmerken--split .kh-pdp-kenmerken__list { display: grid; gap: 9px; padding: 0 20px 16px; }
body.kh-pdp-v2 .kh-pdp-kenmerken--split .kh-pdp-kenmerken__specs {
	margin: 0;
	padding: 4px 20px 6px;
	background: var(--kh-surface);
	border-top: 1px solid var(--kh-border-light);
	display: grid;
	grid-template-columns: auto 1fr;
}
body.kh-pdp-v2 .kh-pdp-kenmerken--split .kh-pdp-kenmerken__specs dt {
	padding: 9px 16px 9px 0;
	font-size: 13.5px;
	color: var(--kh-text-2);
	border-bottom: 1px solid var(--kh-border-light);
}
body.kh-pdp-v2 .kh-pdp-kenmerken--split .kh-pdp-kenmerken__specs dd {
	margin: 0;
	padding: 9px 0;
	font-size: 13.5px;
	font-weight: 700;
	color: var(--kh-text);
	text-align: right;
	border-bottom: 1px solid var(--kh-border-light);
	font-variant-numeric: tabular-nums;
}
body.kh-pdp-v2 .kh-pdp-kenmerken--split .kh-pdp-kenmerken__specs dt.is-vol { grid-column: 1 / -1; }
body.kh-pdp-v2 .kh-pdp-kenmerken--split .kh-pdp-kenmerken__specs dt.is-vol + dd { display: none; }
body.kh-pdp-v2 .kh-pdp-kenmerken--split .kh-pdp-kenmerken__specs > :nth-last-child(-n+2) { border-bottom: 0; }

@media (max-width: 900px) {
	body.kh-pdp-v2 .kh-pdp-kenmerken--kaart,
	body.kh-pdp-v2 .kh-pdp-kenmerken--zacht,
	body.kh-pdp-v2 .kh-pdp-kenmerken--duo { padding: 16px 18px 18px; }
	body.kh-pdp-v2 .kh-pdp-kenmerken--duo .kh-pdp-kenmerken__list { grid-template-columns: 1fr; }
}

/* Adviesblok onderaan: de footerfoto steekt via margin-top:-18.5rem omhoog de
   pagina in en viel over "Twijfel je over de juiste keuze?". Witruimte ONDER het
   blok (margin, niet padding: het grijze vlak blijft even groot), zodat de foto
   in de witte ruimte landt. */
body.kh-pdp-v2 .kh-pdp-advice { margin-bottom: 100px !important; }

/* Koopblok: bij producten zonder keuzehulp-regel blijft de keuzehulp-groep leeg,
   maar telde hij wel mee in de tussenruimte → extra wit boven de koopknop. */
body.kh-pdp-v2 .kh-pdp-keuzehulp:empty,
body.kh-pdp-v2 .kh-pdp-keuzehulp:not(:has(*)) { display: none; }
body.kh-pdp-v2 .kh-pdp-config .kh-pdp-keuzehulp:empty + .kh-pdp-cta,
body.kh-pdp-v2 .kh-pdp-config .kh-pdp-keuzehulp:not(:has(*)) + .kh-pdp-cta { margin-block-start: 0 !important; margin-top: 0 !important; }

/* Specialist in het koopblok, mobiel: de knoppen Bel/App namen naast de tekst zoveel
   breedte in dat "Twijfel je over de juiste keuze?" over twee regels brak. De knoppen
   gaan op mobiel naar een eigen regel onder de tekst (uitgelijnd met de tekst). */
@media (max-width: 781px) {
	body.kh-pdp-v2 .kh-pdp-specialist:not(.kh-pdp-specialist--groot) { flex-wrap: wrap; row-gap: 10px; }
	body.kh-pdp-v2 .kh-pdp-specialist:not(.kh-pdp-specialist--groot) .kh-pdp-specialist__tekst { flex: 1 1 0; }
	body.kh-pdp-v2 .kh-pdp-specialist:not(.kh-pdp-specialist--groot) .kh-pdp-specialist__titel { white-space: nowrap; }
	body.kh-pdp-v2 .kh-pdp-specialist:not(.kh-pdp-specialist--groot) .kh-pdp-specialist__acties { flex: 1 1 100%; margin-left: 56px; }
}

/* Productomschrijving ingeklapt: ±6 regels op desktop, ±5 op mobiel, met een
   zachte overgang naar wit en een "Lees meer"-knop (js/pdp-v2.js). */
body.kh-pdp-v2 .kh-pdp-prose.is-ingeklapt {
	max-height: 170px;
	overflow: hidden;
	position: relative;
}
body.kh-pdp-v2 .kh-pdp-prose.is-ingeklapt::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 64px;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff);
	pointer-events: none;
}
body.kh-pdp-v2 .kh-pdp-leesmeer {
	margin: 10px 0 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--kh-link);
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
body.kh-pdp-v2 .kh-pdp-leesmeer::after { content: "↓"; font-size: 13px; }
body.kh-pdp-v2 .kh-pdp-leesmeer[aria-expanded="true"]::after { content: "↑"; }
body.kh-pdp-v2 .kh-pdp-leesmeer:hover { text-decoration: underline; }
@media (max-width: 781px) {
	body.kh-pdp-v2 .kh-pdp-prose.is-ingeklapt { max-height: 140px; }
}

/* 21-10-2026 — Header en footer zoals op de huidige PDP: de v2-tekstkleur en
   tabelcijfers op body erfden door naar de footer. */
body.kh-pdp-v2 header.wp-block-template-part,
body.kh-pdp-v2 footer.wp-block-template-part { color: #333; font-variant-numeric: normal; }

/* Knoppen: thema zet de groene achtergrond met !important, waardoor de hover niet
   doorkwam; en de algemene link-hover (main a:hover) onderstreepte de slider-knop. */
body.kh-pdp-v2 .kh-pdp-cta button.single_add_to_cart_button:hover,
body.kh-pdp-v2 main .imcb-accessories .btn-cart:hover,
body.kh-pdp-v2 main .imcb-accessories .card-cart-row .btn-cart:hover { background: #35b795 !important; }
body.kh-pdp-v2 main a.btn-cart:hover,
body.kh-pdp-v2 main a.button:hover,
body.kh-pdp-v2 main a.wp-block-button__link:hover,
body.kh-pdp-v2 main a.add_to_cart_button:hover { text-decoration: none; }

/* 21-10-2026 — Mobiel zoals de huidige PDP. */
@media (max-width: 781px) {
	/* Koopregel op één rij: aantal, knop (met winkelwagen-icoon), hartje. */
	body.kh-pdp-v2 .kh-pdp-cta { grid-template-columns: auto 1fr auto; }
	body.kh-pdp-v2 .kh-pdp-cta .quantity { grid-column: 1; grid-row: 1; order: 0; }
	body.kh-pdp-v2 .kh-pdp-cta .single_add_to_cart_button,
	body.kh-pdp-v2 .kh-pdp-cta button.single_add_to_cart_button { grid-column: 2; grid-row: 1; width: 100%; flex: 1 1 auto; order: 0; }
	body.kh-pdp-v2 .kh-pdp-cta .wp-block-im123-pdp-project-button { grid-column: 3; grid-row: 1; justify-self: end; }
	body.kh-pdp-v2 .kh-pdp-cta .pdp-project-btn,
	body.kh-pdp-v2 .kh-pdp-cta .add-to-project-btn { order: 0; margin-left: 0; }

	/* Prijs: thema zet euro's en centen op mobiel allebei op 28px (!important) en
	   v2 zette er 10px ruimte tussen. Zelfde verhouding als desktop, centen eraan vast. */
	body.kh-pdp-v2.single-product .kh-pdp-price .custom-price { gap: 0 !important; }
	body.kh-pdp-v2.single-product .kh-pdp-price .sc-price-label .custom-price .price-int,
	body.kh-pdp-v2.single-product .kh-pdp-price .custom-price .price-int { font-size: 44px !important; }
	body.kh-pdp-v2.single-product .kh-pdp-price .sc-price-label .custom-price .price-dec,
	body.kh-pdp-v2.single-product .kh-pdp-price .custom-price .price-dec { font-size: 27px !important; }
}

/* 21-10-2026 — Toebehoren-slider. Het venster (overflow:hidden) knipte de
   hover-schaduw en onderrand van de kaart af. Alleen verticale ruimte: de
   slidebreedte wordt uit de viewportbreedte berekend. */
body.kh-pdp-v2 main .imcb-accessories .imcb-slider-viewport { padding-top: 6px; padding-bottom: 24px; margin-top: -6px; margin-bottom: -18px; }
/* Pijltjes duidelijker en op de hoogte van de foto; weg als er niets te schuiven valt. */
body.kh-pdp-v2 main .imcb-accessories .imcb-slider-arrow {
	top: 110px; transform: none; width: 38px; height: 38px; border-radius: 50%;
	background: #fff; border: 1px solid var(--kh-border); box-shadow: 0 2px 8px rgba(18, 42, 94, .15);
	color: var(--kh-navy); font-size: 24px; line-height: 1; opacity: 1; z-index: 3;
	display: flex; align-items: center; justify-content: center; padding: 0 0 3px;
}
body.kh-pdp-v2 main .imcb-accessories .imcb-slider-arrow:hover { background: var(--kh-surface); }
body.kh-pdp-v2 main .imcb-accessories .imcb-slider-arrow:disabled { opacity: .35; }
body.kh-pdp-v2 main .imcb-accessories.kh-geen-schuif .imcb-slider-arrow { display: none; }
@media (max-width: 781px) {
	body.kh-pdp-v2 main .imcb-accessories .imcb-slider-prev { left: -8px; }
	body.kh-pdp-v2 main .imcb-accessories .imcb-slider-next { right: -8px; }
}
@media (max-width: 781px) {
	/* Knop mag krimpen, anders schoof hij 2px over het hartje. */
	body.kh-pdp-v2 .kh-pdp-cta .single_add_to_cart_button,
	body.kh-pdp-v2 .kh-pdp-cta button.single_add_to_cart_button { min-width: 0; max-width: 100%; box-sizing: border-box; }
}
@media (max-width: 781px) {
	/* Hartje is 40px; de auto-kolom werd 27px waardoor hij over de tussenruimte heen viel. */
	body.kh-pdp-v2 .kh-pdp-cta { grid-template-columns: auto minmax(0, 1fr) 40px; }
}

/* Winkelwagen-popup: slidebreedte al vóór het sliderscript zijn maten zet (dat
   gebeurt pas ~120ms na openen), anders sprong de popup van groot naar normaal.
   Zelfde formule als het script: (viewport - gap*(n-1)) / n, gap 20px. Het
   inline width van het script wint daarna gewoon. */
body.kh-pdp-v2 #ccp-popup-wrapper .imcb-slider-track > .imcb-qs-slide { width: calc((100% - 60px) / 4); flex: 0 0 auto; }
body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide img { max-width: 100%; height: auto; }
@media (max-width: 1023px) { body.kh-pdp-v2 #ccp-popup-wrapper .imcb-slider-track > .imcb-qs-slide { width: calc((100% - 20px) / 2); } }
@media (max-width: 599px)  { body.kh-pdp-v2 #ccp-popup-wrapper .imcb-slider-track > .imcb-qs-slide { width: 100%; } }

/* Keuzehulp-banner ("Twijfel je of dit de juiste boiler is?"): de configurator
   bouwt hem pas na het laden op in een leeg blok, waardoor de koopknop omlaag
   sprong. Ruimte vasthouden zolang het blok nog leeg is én er een regel in zit. */
body.kh-pdp-v2 .kh-pdp-keuzehulp .dhc-pdp-block[data-pdp*="trigger_label"]:empty { min-height: 76px; }
@media (max-width: 781px) {
	body.kh-pdp-v2 .kh-pdp-keuzehulp .dhc-pdp-block[data-pdp*="trigger_label"]:empty { min-height: 79px; }
}

/* Productgalerij: vóór de WooCommerce-slider start stonden alle foto's onder
   elkaar (1500px) en schoof de pagina daarna 1000px omhoog. Tot de start alleen
   de eerste foto, plus ruimte voor de miniaturen die het script eronder zet. */
body.kh-pdp-v2 .woocommerce-product-gallery[style*="opacity: 0"] .woocommerce-product-gallery__image:not(:first-child) { display: none !important; }
@media (max-width: 781px) {
	body.kh-pdp-v2 .woocommerce-product-gallery[style*="opacity: 0"] { padding-bottom: 63px; }
}

/* 21-10-2026 — Foto vergroten (WooCommerce PhotoSwipe) in een licht scherm. */
body.kh-pdp-v2 .pswp { z-index: 2147483000; }
body.kh-pdp-v2 .pswp__bg { background: #fff !important; opacity: 1 !important; }
body.kh-pdp-v2 .pswp__top-bar,
body.kh-pdp-v2 .pswp__caption { background: transparent !important; }
body.kh-pdp-v2 .pswp__counter { color: var(--kh-text-2); opacity: 1; font-size: 14px; font-weight: 600; }
body.kh-pdp-v2 .pswp__top-bar .pswp__button { filter: invert(1) brightness(.3); opacity: .9; }
body.kh-pdp-v2 .pswp__top-bar .pswp__button:hover { opacity: 1; }
body.kh-pdp-v2 .pswp__button--arrow--left,
body.kh-pdp-v2 .pswp__button--arrow--right { width: 70px; }
body.kh-pdp-v2 .pswp__button--arrow--left:before,
body.kh-pdp-v2 .pswp__button--arrow--right:before {
	width: 46px; height: 46px; top: calc(50% - 23px); border-radius: 50%;
	background: #fff center / 18px no-repeat !important;
	border: 1px solid var(--kh-border); box-shadow: 0 2px 10px rgba(18, 42, 94, .14);
}
body.kh-pdp-v2 .pswp__button--arrow--left:before {
	left: 16px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23122A5E' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E") !important;
}
body.kh-pdp-v2 .pswp__button--arrow--right:before {
	right: 16px; left: auto;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23122A5E' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E") !important;
}
body.kh-pdp-v2 .pswp__button--arrow--left:hover:before,
body.kh-pdp-v2 .pswp__button--arrow--right:hover:before { background-color: var(--kh-surface) !important; }
/* Ruimte onderin voor de miniaturen. */
body.kh-pdp-v2 .kh-pswp-thumbs {
	position: absolute; left: 0; right: 0; bottom: 18px; z-index: 1600;
	display: flex; justify-content: center; gap: 8px; padding: 0 16px; overflow-x: auto;
}
body.kh-pdp-v2 .kh-pswp-thumbs button {
	flex: 0 0 auto; width: 64px; height: 64px; padding: 4px; border-radius: 6px; cursor: pointer;
	background: #fff; border: 1px solid var(--kh-border); opacity: .7;
}
body.kh-pdp-v2 .kh-pswp-thumbs button.is-active { border: 2px solid var(--kh-navy); opacity: 1; }
body.kh-pdp-v2 .kh-pswp-thumbs img { width: 100%; height: 100%; object-fit: contain; display: block; }
@media (max-width: 781px) {
	body.kh-pdp-v2 .kh-pswp-thumbs { justify-content: flex-start; bottom: 14px; }
	body.kh-pdp-v2 .kh-pswp-thumbs button { width: 54px; height: 54px; }
}

/* Winkelwagen-popup op mobiel: zelfde kaart als altijd (slider), maar compacter,
   zodat de hele popup op een telefoon in beeld past zonder te scrollen. */
@media (max-width: 599px) {
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide .imcb-product-image { margin-bottom: 4px !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide .imcb-product-image img { max-height: 84px !important; width: auto !important; margin: 0 auto; object-fit: contain; }
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide > .wp-block-group { padding: 8px 10px !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide > .wp-block-group > .wp-block-group { gap: 4px !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide .wp-block-separator { margin: 4px 0 !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide .wp-block-imcb-product-title { font-size: 14px !important; margin: 0 !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide .imcb-product-price { margin: 0 !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide .imcb-levertijd-kort { margin: 0 !important; }
}
@media (max-width: 599px) {
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide .imcb-product-image { padding: 6px 6px 0 !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .imcb-qs-slide .imcb-add-to-cart { margin-top: 8px !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .ccp-buttons-col { gap: 8px !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .ccp-buttons-col a,
	body.kh-pdp-v2 #ccp-popup-wrapper .ccp-buttons-col button { padding-top: 11px !important; padding-bottom: 11px !important; min-height: 0 !important; height: auto !important; }
	body.kh-pdp-v2 #ccp-popup-wrapper .ccp-innerblocks { padding-top: 8px !important; }
}
/* Trusted Shops-badge (z-index max) niet over de vergrote foto. */
body.kh-pdp-v2:has(.pswp--open) [id^="trustbadge-container"],
body.kh-pdp-v2:has(.pswp--open) .dfd-chat-bubble,
body.kh-pdp-v2:has(.pswp--open) .data-svg-wrapper { display: none !important; }

/* Meerdere toebehoren-vinkjes (Lynqio) onder elkaar. */
body.kh-pdp-v2 .kh-pdp-bundles { display: flex; flex-direction: column; gap: 8px; }

/* Ankerbalk (vast onder de header): de buitenste header-groep is 177px hoog maar
   onderin 48px leeg en doorzichtig, en ligt boven de balk (z-index 100 vs 45). Dat
   lege stuk ving de klikken op Productinformatie/Documentatie/... af. Alleen die
   groep zelf laat klikken door; alles erin (menu, zoekbalk, knoppen) blijft klikbaar. */
body.kh-pdp-v2 header.wp-block-template-part,
body.kh-pdp-v2 header.wp-block-template-part > .wp-block-group.has-123-transparent-background-color { pointer-events: none; }
body.kh-pdp-v2 header.wp-block-template-part > :not(.has-123-transparent-background-color),
body.kh-pdp-v2 header.wp-block-template-part > .wp-block-group.has-123-transparent-background-color > * { pointer-events: auto; }

/* Toebehoren-slider vóór het sliderscript start: de kaarten stonden dan op volle
   breedte en het blok sprong bij herladen van groot naar normaal. Zelfde breedte
   en ruimte als na de start (3 / 2 / 1 per rij, gap 20px). */
body.kh-pdp-v2 main .imcb-accessories .imcb-slider:not(:has(.imcb-slider-viewport)) {
	display: flex; gap: 20px; overflow: hidden; padding: 6px 0 24px; margin: -6px 0 -18px;
}
body.kh-pdp-v2 main .imcb-accessories .imcb-slider:not(:has(.imcb-slider-viewport)) > * { flex: 0 0 calc((100% - 40px) / 3); min-width: 0; }
@media (max-width: 1023px) {
	body.kh-pdp-v2 main .imcb-accessories .imcb-slider:not(:has(.imcb-slider-viewport)) > * { flex-basis: calc((100% - 20px) / 2); }
}
@media (max-width: 599px) {
	body.kh-pdp-v2 main .imcb-accessories .imcb-slider:not(:has(.imcb-slider-viewport)) > * { flex-basis: 100%; }
}
/* Fotovlak in de toebehorenkaart: ruimte reserveren tot de (lazy) foto geladen is
   (12px → 222px), anders groeide de kaart na het laden. */
body.kh-pdp-v2 main .imcb-accessories .card-img-area { min-height: 222px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; }

/* "Bekijk N andere uitvoeringen" (storelinkr): zoals op de huidige PDP. De v2-
   linkregel (main a) maakte hem blauw en onderstreept bij hover, en hij stond
   zonder ruimte tegen de koopknop. */
body.kh-pdp-v2 main .storelinkr-variant-box a.storelinkr-view-variants,
body.kh-pdp-v2 main .storelinkr-variant-box a.storelinkr-view-variants:hover { color: #333; text-decoration: none; }
body.kh-pdp-v2 main .kh-pdp-buybox .storelinkr-variant-box { margin-bottom: 20px !important; }

/* Toebehorenkaarten even hoog: titel altijd twee regels ruimte (zodat prijs, knop en
   levertijd op één lijn staan) en de kaart vult de hele slide. */
body.kh-pdp-v2 main .imcb-accessories .card-title { min-height: 40px; }
body.kh-pdp-v2 main .imcb-accessories .imcb-qs-slide > .product-card,
body.kh-pdp-v2 main .imcb-accessories .imcb-slider-track > * > .product-card,
body.kh-pdp-v2 main .imcb-accessories .imcb-slider-track > .product-card { flex: 1 1 auto; align-self: stretch; height: auto; }