@charset "UTF-8";
/* WC Plus — single-product (summary/gallery/header). Lean, tokens-gedreven, Bootstrap-vrij.
   Structuur + defaults; het (starter)theme heeft volledige vrijheid via template-overrides. */

/* Layout: gallery + summary naast elkaar op desktop (WC levert .woocommerce-product-gallery
   + .summary; wij wrappen de gallery in .woocommerce-gallery-wrapper). */
@media ( min-width: 48rem ) {
	.single-product div.product {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 2.5rem;
		align-items: start;
	}
	.single-product div.product .woocommerce-gallery-wrapper {
		grid-column: 1;
	}
	.single-product div.product .summary {
		grid-column: 2;
	}
}

/* Heading. */
.wcp-product-heading__title {
	margin: 0 0 1rem;
}

/* Gallery. */
.woocommerce-gallery-wrapper {
	position: relative;
}
.gallery-inner {
	position: relative;
}
.badges {
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}
.woocommerce-product-gallery__trigger {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	background: var(--wcp-surface, #fff);
	border-radius: 999px;
	box-shadow: 0 1px 4px rgba( 0, 0, 0, 0.15 );
}

/* Summary. */
.wcp-product-summary__inner > * + * {
	margin-top: 1rem;
}
.wcp-product-summary__title {
	margin: 0;
}
.wcp-product-summary__details .wcp-product-header__row,
.product-details .wcp-product-header__row {
	color: var(--wcp-color-muted, #6c757d);
	font-size: var(--wcp-font-size-sm, 0.875rem);
}
.wcp-product-price .price {
	font-size: 1.5rem;
	font-weight: var(--wcp-font-weight-bold, 700);
}


/* Reviews (lean default; was Bootstrap row/col/card). Sterren via icon-font (theme-asset). */
.wcp-stars { display: inline-flex; align-items: center; gap: 0.1rem; }
.wcp-stars .svg-icon__star { color: var(--wcp-color-border, #e5e7eb); }
.wcp-stars .svg-icon__star.filled { color: #f5a623; }
.wcp-stars__count { margin-left: 0.4rem; font-size: var(--wcp-font-size-sm, 0.875rem); }

.wcp-reviews { display: flex; flex-direction: column; gap: 2rem; }
.wcp-reviews__summary {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	align-items: center;
}
.wcp-reviews__score { display: flex; flex-direction: column; gap: 0.25rem; }
.wcp-reviews__average { font-size: 2.5rem; font-weight: var(--wcp-font-weight-bold, 700); line-height: 1; }
.wcp-reviews__total { color: var(--wcp-color-muted, #6c757d); font-size: var(--wcp-font-size-sm, 0.875rem); }
.wcp-reviews__bars { flex: 1 1 16rem; display: flex; flex-direction: column; gap: 0.25rem; }
.wcp-reviews__bar-row { display: flex; align-items: center; gap: 0.5rem; }
.wcp-reviews__bar-label { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 0.15rem; font-size: var(--wcp-font-size-sm, 0.875rem); }
.wcp-reviews__bar { flex: 1 1 auto; height: 0.5rem; background: var(--wcp-color-border, #e5e7eb); border-radius: 999px; overflow: hidden; }
.wcp-reviews__bar-fill { display: block; height: 100%; background: #f5a623; }
.wcp-reviews__bar-count { flex: 0 0 2ch; text-align: right; font-size: var(--wcp-font-size-sm, 0.875rem); color: var(--wcp-color-muted, #6c757d); }

.wcp-reviews__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
@media ( min-width: 48rem ) { .wcp-reviews__list { grid-template-columns: 1fr 1fr; } }
.wcp-review {
	border: 1px solid var(--wcp-color-border, #e5e7eb);
	border-radius: var(--wcp-radius, 0.375rem);
	padding: 1rem;
}
.wcp-review__head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.4rem; }
.wcp-review__title { font-weight: var(--wcp-font-weight-medium, 500); }
.wcp-review__text { margin: 0 0 0.5rem; }
.wcp-review__meta { display: flex; align-items: center; gap: 0.5rem; font-size: var(--wcp-font-size-sm, 0.875rem); color: var(--wcp-color-muted, #6c757d); }
.wcp-review__verified { color: #1e7e34; }

.wcp-review-cta {
	border: 1px solid var(--wcp-color-border, #e5e7eb);
	border-radius: var(--wcp-radius, 0.375rem);
	padding: 1.25rem;
}
.wcp-review-cta__title { margin: 0 0 0.75rem; }

/* Review-formulier (WC-native comment_form met expliciete args — zie review-form.php). */
.wcp-review-cta .comment-form {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	max-width: 40rem;
}
.wcp-review-cta .comment-form > p,
.wcp-review-cta .comment-form .comment-form-rating { margin: 0; }
.wcp-review-cta .comment-form label {
	display: block;
	margin-bottom: 0.375rem;
	font-weight: var(--wcp-font-weight-medium, 500);
	font-size: var(--wcp-font-size-sm, 0.875rem);
}
.wcp-review-cta .comment-form input[type="text"],
.wcp-review-cta .comment-form input[type="email"],
.wcp-review-cta .comment-form textarea,
.wcp-review-cta .comment-form select {
	width: 100%;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--wcp-color-border, #c9cdd3);
	border-radius: var(--wcp-radius, 0.375rem);
	background: #fff;
	font: inherit;
}
.wcp-review-cta .comment-form input:focus,
.wcp-review-cta .comment-form textarea:focus,
.wcp-review-cta .comment-form select:focus {
	outline: 2px solid var(--wcp-color-primary, #873EFF);
	outline-offset: -1px;
}
.wcp-review-cta .comment-form select { max-width: 12rem; }
.wcp-review-cta .comment-form textarea { min-height: 7rem; resize: vertical; }
/* Cookies-consent: checkbox + label op één regel. */
.wcp-review-cta .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: var(--wcp-font-size-sm, 0.875rem);
}
.wcp-review-cta .comment-form-cookies-consent input { margin-top: 0.2rem; }
.wcp-review-cta .comment-form-cookies-consent label {
	display: inline;
	margin: 0;
	font-weight: 400;
	font-size: inherit;
}
.wcp-review-cta .form-submit { margin: 0; }
/* WC's sterren-widget (JS vervangt de select door p.stars): kleur op de merk-accent. */
.wcp-review-cta p.stars a { color: #f5a623; }

/* Specificaties-tabel (was Bootstrap .table.table-striped). */
.wcp-specs {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1rem;
}
.wcp-specs th,
.wcp-specs td {
	padding: 0.5rem 0.75rem;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--wcp-color-border, #e5e7eb);
}
.wcp-specs th {
	font-weight: var(--wcp-font-weight-medium, 500);
	width: 40%;
}
.wcp-specs tr:nth-child(even) {
	background: var(--wcp-color-light, #f5f4f0);
}
.wcp-specs__group-heading {
	display: block;
	margin: 1.25rem 0 0.5rem;
	font-size: 1rem;
}

/* Check/kruis-waarden (was Bootstrap .text-success/.text-danger). */
.wcp-icon--success {
	color: #1e7e34;
}
.wcp-icon--danger {
	color: #9b1c1c;
}

/* Uitleg help-icoon. */
.wcp-attr-help {
	cursor: pointer;
	color: var(--wcp-color-muted, #6c757d);
	margin-left: 0.25rem;
}
.wcp-attr-help:hover {
	color: var(--wcp-color-primary, #873EFF);
}

/* Attribuut-uitleg dialog (chrome bovenop wcp-ui .wcp-dialog). */
.wcp-attr-dialog {
	max-width: 32rem;
	width: calc(100% - 2rem);
	border-radius: var(--wcp-radius, 0.375rem);
}
.wcp-dialog__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem 1.25rem;
	border-bottom: 1px solid var(--wcp-color-border, #e5e7eb);
}
.wcp-dialog__title {
	margin: 0;
	font-size: 1.125rem;
}
.wcp-dialog__body {
	padding: 1.25rem;
}
.wcp-dialog__close {
	border: 0;
	background: transparent;
	cursor: pointer;
	width: 1.75rem;
	height: 1.75rem;
	position: relative;
	flex: 0 0 auto;
}
.wcp-dialog__close::before,
.wcp-dialog__close::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 15%;
	width: 70%;
	height: 2px;
	background: currentColor;
}
.wcp-dialog__close::before { transform: rotate( 45deg ); }
.wcp-dialog__close::after  { transform: rotate( -45deg ); }

/* Voorraad (was Bootstrap .badge). */
.wcp-product-stock {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-wrap: wrap;
}
.wcp-product-stock__label {
	display: inline-block;
	padding: 0.2rem 0.6rem;
	border-radius: 999px;
	font-size: var(--wcp-font-size-sm, 0.875rem);
	background: var(--wcp-color-light, #f5f4f0);
	color: var(--wcp-color-dark, #374151);
}
.wcp-product-stock__label.is-in-stock {
	background: #e6f4ea;
	color: #1e7e34;
}
.wcp-product-stock__label.is-out-of-stock {
	background: #fde8e8;
	color: #9b1c1c;
}
.wcp-product-stock__text {
	color: var(--wcp-color-muted, #6c757d);
	font-size: var(--wcp-font-size-sm, 0.875rem);
}

/* ── P2: demo-pariteit productpagina ── */

/* heading-meta: rating + SKU onder de titel */
.wcp-product-heading { margin-bottom: 1rem; }
.wcp-product-heading__title { margin: 0 0 0.25rem; }
.wcp-product-heading__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	font-size: var(--wcp-font-size-sm, 0.875rem);
}
.wcp-product-heading__rating {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	text-decoration: none;
	color: var(--wcp-color-primary, #873EFF);
}
.wcp-product-heading__sku { color: var(--wcp-color-muted, #6c757d); }

/* add-to-cart met carticoon (demo-stijl) */
.single_add_to_cart_button:before {
	content: '';
	display: inline-block;
	width: 1.1em;
	height: 1.1em;
	margin-right: 0.5rem;
	vertical-align: -0.15em;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath d='M0 1.5A.5.5 0 0 1 .5 1H2a.5.5 0 0 1 .485.379L2.89 3H14.5a.5.5 0 0 1 .491.592l-1.5 8A.5.5 0 0 1 13 12H4a.5.5 0 0 1-.491-.408L2.01 3.607 1.61 2H.5a.5.5 0 0 1-.5-.5M3.102 4l1.313 7h8.17l1.313-7zM5 12a2 2 0 1 0 0 4 2 2 0 0 0 0-4m7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4m-7 1a1 1 0 1 1 0 2 1 1 0 0 1 0-2m7 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2'/%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	background-color: currentColor;
}

/* prijs-typografie + suffix */
.summary .price {
	font-size: 1.75rem;
	font-weight: var(--wcp-font-weight-bold, 700);
	color: var(--wcp-color-dark, #374151);
}
.summary .price .woocommerce-price-suffix {
	font-size: var(--wcp-font-size-sm, 0.875rem);
	font-weight: 400;
	color: var(--wcp-color-muted, #6c757d);
}

/* cart-rij: qty naast de knop */
form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0.75rem;
}
form.cart .woocommerce-variation { width: 100%; }
form.cart table.variations { width: 100%; }

/* gallery: badges-zone + zoom + flexslider-pijlen/thumbs */
.woocommerce-gallery-wrapper { position: relative; }
.woocommerce-gallery-wrapper .badges {
	position: absolute;
	left: 0.75rem;
	top: 0.75rem;
	z-index: 5;
	display: flex;
	flex-direction: column;
	gap: 0.375rem;
	align-items: flex-start;
}
.woocommerce-product-gallery { position: relative; }
.woocommerce-product-gallery__trigger {
	position: absolute;
	right: 0.75rem;
	top: 0.75rem;
	z-index: 5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	background-color: #fff;
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
	color: var(--wcp-color-dark, #374151);
	text-decoration: none;
}
.woocommerce-product-gallery .flex-direction-nav {
	list-style: none;
	margin: 0;
	padding: 0;
}
.woocommerce-product-gallery .flex-direction-nav a {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	background-color: #fff;
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
	color: var(--wcp-color-dark, #374151);
	font-size: 0;
	text-decoration: none;
}
.woocommerce-product-gallery .flex-direction-nav a:before {
	content: '';
	width: 1rem;
	height: 1rem;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	background-color: currentColor;
}
.woocommerce-product-gallery .flex-direction-nav .flex-next { right: 0.75rem; }
.woocommerce-product-gallery .flex-direction-nav .flex-prev { left: 0.75rem; }
.woocommerce-product-gallery .flex-direction-nav .flex-prev:before { transform: rotate(180deg); }
.woocommerce-product-gallery .flex-control-thumbs {
	list-style: none;
	margin: 0.75rem 0 0;
	padding: 0;
	display: flex;
	gap: 0.5rem;
}
.woocommerce-product-gallery .flex-control-thumbs img {
	width: 4rem;
	height: 4rem;
	object-fit: cover;
	border: 1px solid var(--wcp-color-border, #e5e7eb);
	border-radius: var(--wcp-radius, 0.375rem);
	cursor: pointer;
	opacity: 0.6;
	transition: opacity 0.2s ease-in-out;
}
.woocommerce-product-gallery .flex-control-thumbs img:hover,
.woocommerce-product-gallery .flex-control-thumbs img.flex-active { opacity: 1; }

/* 2-koloms productlayout (gallery ~48% / summary ~48%) — expliciet, los van WC-theme-CSS */
.single-product div.product {
	display: block;
}
.single-product div.product .woocommerce-gallery-wrapper {
	float: left;
	width: 48%;
}
.single-product div.product .entry-summary,
.single-product div.product .summary {
	float: right;
	width: 48%;
}
.single-product div.product .woocommerce-product-gallery { width: 100%; }
.single-product div.product .woocommerce-product-gallery img {
	width: 100%;
	height: auto;
	border-radius: var(--wcp-radius, 0.375rem);
}
@media (max-width: 47.99rem) {
	.single-product div.product .woocommerce-gallery-wrapper,
	.single-product div.product .entry-summary,
	.single-product div.product .summary {
		float: none;
		width: 100%;
	}
}

/* WC-layout-css zet div.images op 48% + float — binnen onze wrapper moet de gallery
   de volle wrapper-breedte pakken (anders 48% × 48% = kwart-breedte foto's). */
.single-product div.product .woocommerce-gallery-wrapper div.images,
.single-product div.product .woocommerce-gallery-wrapper .woocommerce-product-gallery {
	width: 100% !important;
	float: none !important;
	margin-bottom: 0;
}
