/*
Theme Name: Eigenlijk Mooi
Theme URI: https://eigenlijkmooi.nl
Author: Harm van den Brink
Description: Blokthema voor de Eigenlijk Mooi webshop: handgemaakte, gepersonaliseerde cadeaus uit eigen werkplaats. Gebouwd volgens het brandboek "Roze, Salie & Bes" (v1.4).
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.6.7
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eigenlijk-mooi
Tags: e-commerce, block-patterns, full-site-editing, block-styles
*/

/* Alle stijlen komen uit theme.json en assets/css/. */


/* ---------------------------------------------------------------------------
   Veilig gebruik op de productpagina

   De GPSR-tekst moet voor het bestellen zichtbaar zijn, dus hij staat in de
   pagina en niet in een uitklapper. Maar hij is geen verkooptekst: kleine
   letter, gedempte kleur en een dunne lijn erboven houden hem aanwezig zonder
   dat hij de aandacht van het product wegneemt.

   Twee kolommen vanaf 700 px, want een lijst van elf regels onder elkaar
   oogt als een waarschuwingsbord. Op een telefoon blijft het een kolom.
--------------------------------------------------------------------------- */
.em-veiligheid {
	margin-top: var(--wp--preset--spacing--50);
	padding-top: var(--wp--preset--spacing--40);
	border-top: 1px solid var(--wp--preset--color--zacht-roze);
	color: color-mix(in srgb, var(--wp--preset--color--contrast) 72%, transparent);
	font-size: 0.82rem;
	line-height: 1.6;
}

.em-veiligheid__kop {
	margin: 0 0 0.9em;
	font-family: var(--wp--preset--font-family--mulish, inherit);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--bes-licht);
}

.em-veiligheid__lijst {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.55em 2.2em;
}

@media (min-width: 700px) {
	.em-veiligheid__lijst {
		grid-template-columns: 1fr 1fr;
	}
}

.em-veiligheid__lijst li {
	position: relative;
	padding-left: 1em;
	min-width: 0;
}

/* Een streepje in plaats van een bolletje: rustiger dan een opsomming met
   punten, die bij waarschuwingen al snel als alarm leest. */
.em-veiligheid__lijst li::before {
	content: "\2013";
	position: absolute;
	left: 0;
	color: var(--wp--preset--color--zacht-roze);
}

.em-veiligheid__voet {
	margin: 1.2em 0 0;
	padding-top: 0.9em;
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--zacht-roze) 55%, transparent);
	display: flex;
	flex-wrap: wrap;
	gap: 0.3em 1.6em;
	font-size: 0.76rem;
}

.em-veiligheid__voet strong {
	font-weight: 700;
}