/* ==========================================================================
   Productreviews Sportcoachplein
   ========================================================================== */

.scp-reviews {
	--scp-goud: #f6a623;
	--scp-rborder: #d9d9d9;
	max-width: 820px;
}

.scp-reviews__bedankt {
	background: #eafbea;
	border: 1px solid #bfe6bf;
	color: #1c7a1c;
	padding: 0.85rem 1rem;
	border-radius: 8px;
	margin-bottom: 1.25rem;
}

/* ---------- Samenvatting ---------- */
.scp-reviews__top {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	align-items: center;
	padding: 1.25rem 0 1.5rem;
	border-bottom: 1px solid var(--scp-rborder);
	margin-bottom: 1.25rem;
}
.scp-reviews__score {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.15rem;
}
.scp-reviews__cijfer {
	font-size: 2.6rem;
	font-weight: 800;
	line-height: 1;
}
.scp-reviews__aantal {
	font-size: 0.85rem;
	color: #666;
}
.scp-sterren {
	display: inline-flex;
	gap: 2px;
	line-height: 0;
}
.scp-sterren .scp-ster { display: block; }

.scp-reviews__balken {
	flex: 1 1 240px;
	min-width: 220px;
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
}
.scp-reviews__balk-rij {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.85rem;
}
.scp-reviews__balk-label {
	width: 0.9rem;
	text-align: right;
	color: #666;
}
.scp-reviews__balk {
	flex: 1;
	height: 10px;
	background: #eee;
	border-radius: 6px;
	overflow: hidden;
}
.scp-reviews__balk-vul {
	display: block;
	height: 100%;
	background: var(--scp-goud);
	border-radius: 6px;
}

/* ---------- Knoppen ---------- */
.scp-reviews__acties {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-bottom: 1.75rem;
}
.scp-rvwknop {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	padding: 0.7rem 1.25rem;
	border-radius: 999px;
	border: 2px solid #1c1c1c;
	background: #1c1c1c;
	color: #fff;
	font: inherit;
	font-weight: 700;
	line-height: 1.1;
	text-decoration: none;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}
.scp-rvwknop:hover { background: #000; border-color: #000; color: #fff; }
.scp-rvwknop--rand {
	background: #fff;
	color: #1c1c1c;
}
.scp-rvwknop--rand:hover { background: #f4f4f4; color: #1c1c1c; }
.scp-rvwknop--klein { padding: 0.5rem 1rem; font-size: 0.9rem; }

/* ---------- Reviewlijst ---------- */
.scp-reviews__leeg { color: #666; }
.scp-review {
	padding: 1.5rem 1.75rem;
	margin-bottom: 1rem;
}
.scp-review__kop {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 0.85rem;
	margin-bottom: 0.25rem;
}
.scp-review__onderwerp {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
}
.scp-review__meta {
	display: flex;
	gap: 0.75rem;
	font-size: 0.85rem;
	color: #777;
	margin: 0 0 0.6rem;
}
.scp-review__tekst { margin-bottom: 0.75rem; }
.scp-review__tekst p { margin: 0 0 0.5rem; }

.scp-review__punten {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 2rem;
	margin: 0.5rem 0 0.75rem;
}
.scp-review__pro,
.scp-review__con {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 0.92rem;
}
.scp-review__pro li,
.scp-review__con li {
	position: relative;
	padding-left: 1.4rem;
	margin-bottom: 0.2rem;
}
.scp-review__pro li::before {
	content: "+";
	position: absolute;
	left: 0;
	top: -1px;
	width: 1.05rem;
	height: 1.05rem;
	line-height: 1.05rem;
	text-align: center;
	font-weight: 700;
	color: #1c7a1c;
	background: #eafbea;
	border-radius: 50%;
}
.scp-review__con li::before {
	content: "\2212";
	position: absolute;
	left: 0;
	top: -1px;
	width: 1.05rem;
	height: 1.05rem;
	line-height: 1.05rem;
	text-align: center;
	font-weight: 700;
	color: #b23b3b;
	background: #fbeaea;
	border-radius: 50%;
}

.scp-review__fotos {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.5rem;
}
.scp-review__fotos a { display: block; }
.scp-review__fotos img {
	width: 84px;
	height: 84px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid var(--scp-rborder);
}

/* ---------- Formulier ---------- */
.scp-review-login {
	background: #f7f7f7;
	border: 1px solid var(--scp-rborder);
	border-radius: 10px;
	padding: 1.25rem;
	margin-top: 1rem;
}
.scp-review-login p { margin: 0 0 0.85rem; }

.scp-review-form {
	background: #fafafa;
	border: 1px solid var(--scp-rborder);
	border-radius: 12px;
	padding: 1.5rem;
	margin-top: 1.5rem;
}
.scp-review-form__titel { margin: 0 0 1rem; font-size: 1.2rem; }
.scp-veld { margin-bottom: 1.1rem; }
.scp-veld__label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.35rem;
	font-size: 0.95rem;
}
.scp-verplicht { color: #b23b3b; }
.scp-review-form input[type="text"],
.scp-review-form textarea {
	width: 100%;
	padding: 0.7rem 0.85rem;
	border: 1px solid #cfcfcf;
	border-radius: 8px;
	font: inherit;
	background: #fff;
}
.scp-review-form textarea { resize: vertical; }
.scp-review-form input[type="text"]:focus,
.scp-review-form textarea:focus {
	outline: none;
	border-color: #1c1c1c;
}

/* Sterkiezer */
.scp-sterkiezer { display: inline-flex; gap: 4px; }
.scp-sterkiezer__ster {
	background: none;
	border: none;
	padding: 2px;
	cursor: pointer;
	line-height: 0;
}
.scp-sterkiezer__ster svg path {
	fill: none;
	stroke: #cfcfcf;
	stroke-width: 1.2;
	stroke-linejoin: round;
	transition: fill 0.1s ease, stroke 0.1s ease;
}
.scp-sterkiezer__ster.is-vol svg path {
	fill: var(--scp-goud);
	stroke: var(--scp-goud);
}

/* Toppunten / minpunten */
.scp-punt-rij {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}
.scp-punt-teken {
	width: 1.4rem;
	height: 1.4rem;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-weight: 700;
	color: #fff;
}
.scp-punt-teken--pro { background: #2e9a2e; }
.scp-punt-teken--con { background: #c25555; }
.scp-punt-rij input[type="text"] { flex: 1; }
.scp-punt-verwijder {
	flex: 0 0 auto;
	width: 2rem;
	height: 2rem;
	border: 1px solid #cfcfcf;
	background: #fff;
	border-radius: 8px;
	cursor: pointer;
	font-size: 1.1rem;
	line-height: 1;
}
.scp-punt-verwijder:hover { background: #f1f1f1; }
.scp-punt-toevoegen {
	background: none;
	border: none;
	color: #1c1c1c;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	padding: 0.2rem 0;
}
.scp-punt-toevoegen:hover { text-decoration: underline; }

/* Afbeeldingen */
.scp-images-hint {
	display: inline-block;
	margin-left: 0.5rem;
	font-size: 0.82rem;
	color: #777;
}
.scp-image-previews {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.75rem;
}
.scp-image-previews figure {
	position: relative;
	margin: 0;
}
.scp-image-previews img {
	width: 80px;
	height: 80px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid var(--scp-rborder);
}

.scp-veld--check label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.92rem;
	font-weight: 400;
}
.scp-review-form__melding {
	font-size: 0.85rem;
	color: #666;
	margin: 0 0 1rem;
}
.scp-review-form__verstuur { margin-top: 0.25rem; }

/* Honeypot: onzichtbaar houden */
.scp-hp {
	position: absolute !important;
	left: -9999px !important;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media (max-width: 600px) {
	.scp-reviews__top { gap: 1.25rem; }
	.scp-reviews__cijfer { font-size: 2.2rem; }
	.scp-reviews__acties .scp-rvwknop { flex: 1 1 auto; }
}


/* Reviewregel boven de prijs */
.scp-prijs-review {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	text-decoration: none;
	color: #333;
	margin-bottom: 0.5rem;
	font-size: 0.9rem;
}
.scp-prijs-review .scp-sterren { line-height: 0; }
.scp-prijs-review__cijfer { font-weight: 700; color: #1c1c1c; }
.scp-prijs-review__link { color: #1c1c1c; text-decoration: none; }
.scp-prijs-review:hover .scp-prijs-review__link { text-decoration: underline; }

/* Knoppen die als link renderen (uitgelogde bezoeker): tekst leesbaar houden.
   Themaregel .scp-main a:not(...) forceert color:inherit met hoge specificiteit, dus !important. */
.scp-reviews a.scp-rvwknop,
.scp-reviews a.scp-rvwknop:link,
.scp-reviews a.scp-rvwknop:visited,
.scp-reviews a.scp-rvwknop:hover,
.scp-reviews a.scp-rvwknop:focus { color: #fff !important; }
.scp-reviews a.scp-rvwknop--rand,
.scp-reviews a.scp-rvwknop--rand:link,
.scp-reviews a.scp-rvwknop--rand:visited,
.scp-reviews a.scp-rvwknop--rand:hover,
.scp-reviews a.scp-rvwknop--rand:focus { color: #1c1c1c !important; }