/* =========================================================
   Sportcoachplein — productpagina (single product)
   ========================================================= */

/* ---------- Single product ---------- */
.scp-product__titel { margin-top: 0.25rem; }
.scp-product__boven {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(1.5rem, 4vw, 3.5rem);
	align-items: start;
	margin-bottom: 2rem;
}
@media (max-width: 900px) { .scp-product__boven { grid-template-columns: 1fr; } }

/* Galerij: grote afbeelding + thumbnailslider met pijlen */
.scp-product__galerij .woocommerce-product-gallery { width: 100% !important; float: none !important; }
.scp-product__galerij .woocommerce-product-gallery__wrapper { border-radius: var(--scp-radius-groot); overflow: hidden; background: var(--scp-creme); }
.scp-product__galerij .flex-viewport { border-radius: var(--scp-radius-groot); }
.scp-product__galerij .flex-direction-nav { position: static; }
.scp-product__galerij .flex-direction-nav a {
	text-decoration: none !important;
	overflow: hidden;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px; height: 44px;
	border-radius: 50%;
	background: var(--scp-wit);
	box-shadow: var(--scp-schaduw);
	display: grid !important;
	place-items: center;
	z-index: 5;
	font-size: 0;
	opacity: 1;
	text-indent: 0;
}
.scp-product__galerij .flex-direction-nav a::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 0.95rem;
	color: var(--scp-zwart);
	display: block;
	line-height: 1;
}
.scp-product__galerij .flex-direction-nav .flex-prev { left: 0.9rem; }
.scp-product__galerij .flex-direction-nav .flex-next { right: 0.9rem; }
.scp-product__galerij .flex-direction-nav .flex-prev::before { content: "\f053"; }
.scp-product__galerij .flex-direction-nav .flex-next::before { content: "\f054"; }
.scp-product__galerij .flex-control-thumbs {
	display: flex;
	gap: 0.75rem;
	margin-top: 2.25rem !important;
	overflow-x: auto;
	padding-bottom: 0.25rem;
}
.scp-product__galerij .flex-control-thumbs li {
	width: 84px !important;
	flex: none;
	margin: 0 !important;
}
.scp-product__galerij .flex-control-thumbs img {
	border-radius: 12px;
	border: 2px solid transparent;
	opacity: 0.7;
	cursor: pointer;
}
.scp-product__galerij .flex-control-thumbs img.flex-active,
.scp-product__galerij .flex-control-thumbs img:hover { border-color: var(--scp-geel); opacity: 1; }

/* Koopblok rechts */
.scp-product__prijs { display: flex; align-items: baseline; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1rem; }
.scp-product__prijs del { color: var(--scp-grijs); font-size: 1.15rem; }
.scp-product__prijs ins,
.scp-product__prijs-nu .amount { color: var(--scp-rood); font-size: 1.9rem; font-weight: 800; text-decoration: none; }
.scp-product__prijs-nu del .amount { color: var(--scp-grijs); font-size: 1.15rem; font-weight: 400; }
.scp-product__excl { color: var(--scp-grijs); font-size: 0.88rem; }

/* Swatches: elk blok op een eigen rij (kleur boven, maat eronder) */
.scp-swatchblok { flex-basis: 100%; margin-bottom: 0.25rem; }
.scp-swatchblok__label { font-weight: 700; margin-bottom: 0.5rem; }
.scp-swatches { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.scp-swatch {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.5rem 1rem;
	border: 2px solid var(--scp-grijs-border);
	border-radius: 12px;
	background: var(--scp-wit);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: border-color var(--scp-overgang), background var(--scp-overgang);
}
.scp-swatch:hover { border-color: var(--scp-geel); }
.scp-swatch.is-actief { border-color: var(--scp-geel); background: var(--scp-geel-licht); }
.scp-swatch.is-uit { opacity: 0.35; pointer-events: none; }
.scp-swatch__bol {
	width: 18px; height: 18px;
	border-radius: 50%;
	border: 1px solid var(--scp-grijs-border);
	flex: none;
}

/* Variaties-tabel verbergen (swatches nemen het over) */
.scp-product .variations { display: none; }
.scp-product .single_variation_wrap .woocommerce-variation-price { margin-bottom: 0.75rem; font-weight: 700; }

/* Aantal + winkelwagenknop op één rij */
.scp-product form.cart { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.scp-product form.cart .variations_button { display: flex; gap: 0.75rem; align-items: center; width: 100%; }
.scp-qty {
	display: inline-flex;
	align-items: center;
	border: 2px solid var(--scp-grijs-border);
	border-radius: 999px;
	overflow: hidden;
}
.scp-qty .qty {
	width: 56px;
	border: 0;
	text-align: center;
	font: inherit;
	padding: 0.6rem 0;
	-moz-appearance: textfield;
}
.scp-qty .qty::-webkit-outer-spin-button,
.scp-qty .qty::-webkit-inner-spin-button { -webkit-appearance: none; }
.scp-qty__knop {
	border: 0;
	background: var(--scp-grijs-licht);
	width: 42px; height: 42px;
	font-size: 1.2rem;
	cursor: pointer;
}
.scp-qty__knop:hover { background: var(--scp-geel-licht); }
.scp-product form.cart .single_add_to_cart_button {
	flex: 1;
	background: var(--scp-groen);
	color: var(--scp-wit);
	border: 0;
	border-radius: 999px;
	font-weight: 800;
	font-size: 1.05rem;
	padding: 0.9rem 2rem;
	cursor: pointer;
}
.scp-product form.cart .single_add_to_cart_button:hover { background: var(--scp-groen-donker); opacity: 1; }
.scp-product form.cart .single_add_to_cart_button::before {
	content: "\f07a";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	margin-right: 0.6rem;
}
.scp-product form.cart .single_add_to_cart_button.disabled,
.scp-product form.cart .single_add_to_cart_button:disabled { background: var(--scp-grijs-border); color: var(--scp-grijs); }

/* Voorraad, lijn en USP's */
.scp-product__voorraad { color: var(--scp-zwart); font-weight: 400; margin-top: 1rem; }
.scp-product__voorraad i,
.scp-product__voorraad .scp-voorraad-groen { color: #1a7a2e; font-weight: 600; }
.scp-product__voorraad.is-uitverkocht { color: var(--scp-rood); }
.scp-product__lijn { border: 0; border-top: 1px solid var(--scp-grijs-border); margin: 1.25rem 0; }
.scp-product__usps li { margin-bottom: 0.45rem; font-weight: 600; }
.scp-product__usps i { color: #1a7a2e; margin-right: 0.5rem; }

/* Ankerknoppen */
.scp-product__ankers {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
	padding: 1rem 0;
	border-top: 1px solid var(--scp-grijs-border);
	border-bottom: 1px solid var(--scp-grijs-border);
	margin-bottom: 2rem;
}
.scp-product__ankers a {
	padding: 0.55rem 1.25rem;
	border-radius: 999px;
	background: var(--scp-grijs-licht);
	font-weight: 700;
	font-size: 0.92rem;
	text-decoration: none;
	transition: background var(--scp-overgang);
}
.scp-product__ankers a:hover { background: var(--scp-geel); }

/* Sectie-indeling: info links, eigenschappen + plus/min rechts */
.scp-product__secties {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(1.5rem, 4vw, 3.5rem);
	margin-bottom: 2.5rem;
}
@media (max-width: 900px) { .scp-product__secties { grid-template-columns: 1fr; } }
.scp-product__sectie { scroll-margin-top: 120px; }
.scp-product__sectie--vol { margin-bottom: 2.5rem; }
.scp-eigenschappen { width: 100%; border-collapse: collapse; }
.scp-eigenschappen th, .scp-eigenschappen td {
	text-align: left;
	padding: 0.6rem 0.75rem;
	border-bottom: 1px solid var(--scp-grijs-border);
}
.scp-eigenschappen th { width: 40%; color: var(--scp-grijs); font-weight: 600; }
.scp-eigenschappen tr:nth-child(odd) { background: var(--scp-grijs-licht); }
.scp-plusmin li { margin-bottom: 0.5rem; }
.scp-plusmin .is-plus i { color: #1a7a2e; }
.scp-plusmin .is-min i { color: var(--scp-rood); }
.scp-plusmin i { margin-right: 0.5rem; }

/* Reviews (Woo) */
.scp-product #reviews .commentlist { list-style: none; padding: 0; }
.scp-product #reviews .comment_container {
	background: var(--scp-grijs-licht);
	border-radius: var(--scp-radius);
	padding: 1.1rem;
	margin-bottom: 0.75rem;
}
.scp-product #reviews .comment_container img.avatar { display: none; }
.scp-product #reviews .star-rating { color: var(--scp-geel-donker); }
.scp-product #review_form .form-submit .submit {
	background: var(--scp-rood);
	color: var(--scp-wit);
	border: 0;
	border-radius: 999px;
	font-weight: 700;
	padding: 0.7rem 1.8rem;
	cursor: pointer;
}

/* ---------- Eigen lightbox ---------- */
.scp-lightbox-trigger {
	position: absolute;
	top: 0.9rem; right: 0.9rem;
	z-index: 9;
	width: 44px; height: 44px;
	border: 0;
	border-radius: 50%;
	background: var(--scp-wit);
	box-shadow: var(--scp-schaduw);
	cursor: pointer;
	display: grid;
	place-items: center;
}
.scp-lightbox-trigger { color: var(--scp-zwart); }
.scp-lightbox-trigger:hover { background: var(--scp-geel); }
.scp-lightbox { position: fixed; inset: 0; z-index: 300; }
.scp-lightbox[hidden] { display: none; }
.scp-lightbox__overlay { position: absolute; inset: 0; background: rgba(33, 26, 16, 0.85); }
.scp-lightbox__venster {
	position: absolute;
	inset: 0;
	display: grid;
	grid-template-rows: 1fr auto;
	justify-items: center;
	align-items: center;
	padding: clamp(1rem, 4vw, 3rem);
	pointer-events: none;
}
.scp-lightbox__venster > * { pointer-events: auto; }
.scp-lightbox__beeld {
	max-width: min(900px, 90vw);
	max-height: calc(100vh - 200px);
	width: auto;
	border-radius: var(--scp-radius);
	background: var(--scp-wit);
}
.scp-lightbox__x {
	position: absolute;
	top: 1.25rem; right: 1.25rem;
	width: 44px; height: 44px;
	border: 0;
	border-radius: 50%;
	background: var(--scp-wit);
	font-size: 1.3rem;
	cursor: pointer;
}
.scp-lightbox__pijl {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 48px; height: 48px;
	border: 0;
	border-radius: 50%;
	background: var(--scp-wit);
	box-shadow: var(--scp-schaduw);
	cursor: pointer;
	display: grid;
	place-items: center;
}
.scp-lightbox__pijl:hover { background: var(--scp-geel); }
.scp-lightbox__pijl--links { left: clamp(0.75rem, 4vw, 3rem); }
.scp-lightbox__pijl--rechts { right: clamp(0.75rem, 4vw, 3rem); }
.scp-lightbox__thumbs {
	display: flex;
	gap: 0.6rem;
	margin-top: 1rem;
	max-width: 90vw;
	overflow-x: auto;
	padding-bottom: 0.25rem;
}
.scp-lightbox__thumbs button {
	flex: none;
	width: 72px; height: 72px;
	padding: 0;
	border: 2px solid transparent;
	border-radius: 12px;
	overflow: hidden;
	cursor: pointer;
	background: var(--scp-wit);
	opacity: 0.7;
}
.scp-lightbox__thumbs button img { width: 100%; height: 100%; object-fit: cover; display: block; }
.scp-lightbox__thumbs button.is-actief,
.scp-lightbox__thumbs button:hover { border-color: var(--scp-geel); opacity: 1; }

/* Smalle schermen: rijen worden scrollbare sliders i.p.v. overflow */
@media (max-width: 960px) {
	#plusmin { margin-top: 2.25rem; }
	.scp-eigenschappen { display: table; width: 100%; }
	.scp-eigenschappen th, .scp-eigenschappen td { word-break: break-word; }
	.scp-product__ankers {
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
	}
	.scp-product__ankers::-webkit-scrollbar { display: none; }
	.scp-product__ankers a { white-space: nowrap; }
	.scp-product__boven > * { min-width: 0; }
}
