{{ $model := . }}
<div
	class="bg-[url(/assets/hintergrund.webp)] w-full border-t border-b py-8 mt-9 relative"
	x-data="{ open: true }"
	x-show="open">
	<div class="container-extraoversize flex flex-row gap-x-8">
		<div
			class="max-w-[52rem] font-serif text-base hyphens-auto bg-gray-50 py-8 border-r
		border-b">
			<div class="px-8">
				{{ Safe $model.record.Text }}
				<div class="pt-3">
					<a href="/redaktion/einleitung">Einleitung</i></a>
					<i class="ri-seedling-line px-1.5"></i>
					<a href="/redaktion/benutzerhinweise">Benutzerhinweise</a>
				</div>

				<div class="mt-4 py-2 px-3 rounded bg-orange-100 border border-orange-200
				text-orange-950 font-sans font-bold">
					Bitte beachten Sie, dass es sich hier noch um eine öffentliche Testversion
					handelt. Über Rückmeldungen und Anregungen freuen wir uns [&rarr; <a
						href="/redaktion//kontakt">Kontakt</a>]
				</div>
			</div>
		</div>
		<div class="-mr-16 pt-2 grow-0">
			<img src="{{ $model.record.ImagePath }}" />
		</div>
	</div>
	<div class="absolute top-0 right-0 m-4 mr-8">
		<tool-tip position="left">
			<div class="data-tip">Hinweis schließen</div>
			<button
				@click="open = false"
				class="text-3xl text-stone-500 opacity-85 hover:opacity-100 transition-opacity
					duration-200 hover:text-stone-900 leading-none
			hover:cursor-pointer">
				<i class="ri-close-circle-fill"></i>
			</button>
		</tool-tip>
	</div>
</div>