/**
 * MD-act — Google-beoordeling
 * ===========================
 * Hoort bij reviews/mdact-google.php: [mdact_google_score].
 *
 * Een regel: sterren, dan de zin. Op een smal scherm loopt de zin onder de
 * sterren door. Lettertype en kleuren zoals de bronregel van de reviewkaartjes,
 * een maat groter, zodat de regel leesbaar blijft boven het overzicht.
 *
 * Twee klassen in elke selector, om dezelfde reden als in mdact-reviews.css:
 * de Elementor-kit en reset.css van Hello Elementor winnen anders van een losse
 * klasse. De link heeft zijn kleur daarom uitgeschreven voor alle toestanden.
 * De focusring is sitebreed geregeld in style.css; hier geen eigen outline.
 */

.mdact-google.mdact-google,
p.mdact-google {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	margin: 0;
	font-family: 'Inter', sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.4;
	color: var(--mdact-body, #54595F);
}

.mdact-google.is-midden {
	justify-content: center;
	text-align: center;
}

.mdact-google .mdact-google__sterren {
	display: inline-flex;
	line-height: 0;
}

.mdact-google .mdact-google__tekst strong {
	font-weight: 600;
	color: var(--mdact-donkergroen, #2C4A3E);
}

.mdact-google a.mdact-google__link,
.mdact-google a.mdact-google__link:visited,
.mdact-google a.mdact-google__link:focus,
.mdact-google a.mdact-google__link:active {
	font-weight: 500;
	color: var(--mdact-groen, #4A7C6B);
	text-decoration: underline;
	text-underline-offset: 3px;
	background: transparent;
}

.mdact-google a.mdact-google__link:hover {
	color: var(--mdact-donkergroen, #2C4A3E);
	background: transparent;
}