/* -------------------------------------------------------------------------
 * Contentbescherming.
 * Melding staat onderin het midden.
 * ---------------------------------------------------------------------- */

:root {
	--vbm-bev-bg: #1b2430;
	--vbm-bev-tekst: #ffffff;
	--vbm-bev-radius: 12px;
	--vbm-bev-pad: 14px 24px;
	--vbm-bev-offset: 28px;
	--vbm-bev-fs: 17px;
	--vbm-bev-schaduw: 0 10px 30px rgba(0, 0, 0, 0.22);
	--vbm-bev-z: 99999;
}

.vbm-melding {
	position: fixed;
	inset-block-end: var(--vbm-bev-offset);
	inset-inline-start: 50%;
	z-index: var(--vbm-bev-z);
	max-width: min(30rem, calc(100vw - 2rem));
	padding: var(--vbm-bev-pad);
	border-radius: var(--vbm-bev-radius);
	background-color: var(--vbm-bev-bg);
	color: var(--vbm-bev-tekst);
	font-family: inherit;
	font-size: var(--vbm-bev-fs);
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	box-shadow: var(--vbm-bev-schaduw);
	opacity: 0;
	transform: translate(-50%, 10px);
	transition: opacity 180ms ease, transform 180ms ease;
	pointer-events: none;
}

.vbm-melding.is-zichtbaar {
	opacity: 1;
	transform: translate(-50%, 0);
}

@media ( prefers-reduced-motion: reduce ) {
	.vbm-melding {
		transition: none;
		transform: translate(-50%, 0);
	}
}

.vbm-beveiligd img {
	-webkit-user-drag: none;
}

/* Selecteren blokkeren, behalve in formuliervelden. */
.vbm-geen-selectie {
	-webkit-user-select: none;
	user-select: none;
}

.vbm-geen-selectie input,
.vbm-geen-selectie textarea,
.vbm-geen-selectie select,
.vbm-geen-selectie [contenteditable="true"] {
	-webkit-user-select: text;
	user-select: text;
}

/* Printen blokkeren. */
@media print {
	body.vbm-geen-print {
		display: none !important;
	}
}