/**
 * Ondersteunende CSS voor hover-preview.js.
 */

/* De floating afbeelding die de cursor volgt */
.js-hover-preview-float {
	position: fixed;
	top: 0;
	left: 0;
	width: 220px;
	height: auto;
	border-radius: 12px;
	pointer-events: none;
	opacity: 0;
	transform: scale(0.95);
	z-index: 9999;
	will-change: transform, opacity;
}

/* Visuele hint dat er iets gebeurt bij hover */
.js-hover-preview {
	cursor: pointer;
}

/*
 * Bron-afbeeldingen (.js-hover-preview-source) blijven zelf gewoon
 * zichtbaar op hun eigen plek in de pagina — dit script "leent" alleen
 * de src, verplaatst niks. Wil je de bron zelf verbergen (bv. als je 'm
 * alleen als los archief van afbeeldingen wilt gebruiken, niet als
 * zichtbaar element), zet er dan zelf in Kadence een "Verbergen op alle
 * apparaten"-instelling op, of geef 'm hier een display:none:
 *
 * .js-hover-preview-source { display: none; }
 *
 * Staat hieronder bewust NIET standaard aan — sommige ontwerpen willen
 * de bron-afbeelding wél laten zien op zijn eigen plek.
 */