/* Zitjesregel – melding en markering in het zaalplan. Kleuren uit de huisstijl:
   rood = fout (harde regel), amber = waarschuwing (zachte regel).
   Onderdeel van de plugin L&J Theater. */
#lj-zitjes-modal { display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 999999; }
#lj-zitjes-modal.lj-open { display: block; }
#lj-zitjes-modal .lj-backdrop { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.6); }
#lj-zitjes-modal .lj-box {
	position: relative; width: calc(100% - 32px); max-width: 480px;
	margin: 12vh auto 0; background: #fff; border-radius: 4px;
	padding: 28px 30px; box-shadow: 0 6px 30px rgba(0,0,0,.35);
	color: var(--lj-tekst, #222); line-height: 1.5; text-align: left; box-sizing: border-box;
}
#lj-zitjes-modal .lj-box h5 { margin: 0 0 14px; font-size: 20px; }
#lj-zitjes-modal.lj-hard .lj-box h5 { color: var(--lj-fout, #b91c1c); }
#lj-zitjes-modal.lj-zacht .lj-box h5 { color: var(--lj-waarschuwing, #92400e); }
#lj-zitjes-modal .lj-box p { margin: 0 0 12px; font-size: 15px; }
#lj-zitjes-modal .lj-knoppen { margin-top: 18px; }
#lj-zitjes-modal button.lj-actie {
	display: inline-block; margin: 0 8px 8px 0; padding: 10px 20px; border: 0;
	font-size: 15px; border-radius: 3px; cursor: pointer;
}
#lj-zitjes-modal .lj-primair { background: var(--lj-fout, #b91c1c); color: var(--lj-wit, #fff); }
#lj-zitjes-modal.lj-zacht .lj-primair { background: var(--lj-waarschuwing-rand, #d97706); }
#lj-zitjes-modal .lj-secundair { background: var(--lj-rand, #d1d5db); color: var(--lj-tekst, #222); }
#lj-zitjes-modal .lj-sluit {
	position: absolute; top: 8px; right: 12px; border: 0; background: none;
	font-size: 24px; line-height: 1; color: var(--lj-tekst-gedempt, #6b7280); cursor: pointer;
}

/* Markering van de probleemstoelen in het zaalplan */
.tc-pan-wrapper .lj-markeer {
	border-radius: 50%;
	animation: lj-puls-hard 1.3s ease-out infinite;
}
.tc-pan-wrapper .lj-markeer.lj-markeer-zacht {
	animation-name: lj-puls-zacht;
}
@keyframes lj-puls-hard {
	0%   { box-shadow: 0 0 0 0 rgba(185,28,28,.9); }
	70%  { box-shadow: 0 0 0 10px rgba(185,28,28,0); }
	100% { box-shadow: 0 0 0 0 rgba(185,28,28,0); }
}
@keyframes lj-puls-zacht {
	0%   { box-shadow: 0 0 0 0 rgba(217,119,6,.9); }
	70%  { box-shadow: 0 0 0 10px rgba(217,119,6,0); }
	100% { box-shadow: 0 0 0 0 rgba(217,119,6,0); }
}
@media (prefers-reduced-motion: reduce) {
	.tc-pan-wrapper .lj-markeer { animation: none; box-shadow: 0 0 0 4px rgba(185,28,28,.9); }
	.tc-pan-wrapper .lj-markeer.lj-markeer-zacht { box-shadow: 0 0 0 4px rgba(217,119,6,.9); }
}