{{ if ne (len .model.Search) 1 }}
	{{ $agent := index $.model.Agents .model.Search }}
	{{ if not $agent }}
		<div class="max-w-7xl mx-auto px-8 py-8">
			<div class="bg-red-50 border border-red-200 rounded-lg p-6">
				<div class="flex items-center">
					<i class="ri-error-warning-line text-red-600 text-2xl mr-3"></i>
					<span class="text-red-800 text-lg">Person nicht gefunden: <strong>{{ .model.Search }}</strong></span>
				</div>
			</div>
		</div>
	{{ else }}
		<div class="max-w-7xl mx-auto px-8 py-8">
			<div class="bg-white px-6 py-6 rounded">
				<div class="mb-6">
					{{ if eq $agent.ID "anonym" }}
						<a href="/akteure/a" class="inline-flex items-center text-black hover:text-gray-700 transition-colors text-xl no-underline font-bold">
							<i class="ri-arrow-left-line mr-3 text-xl font-bold"></i>
							A
						</a>
					{{ else }}
						{{ $letter := Upper (FirstLetter $agent.ID) }}
						<a href="/akteure/{{ $letter }}" class="inline-flex items-center text-black hover:text-gray-700 transition-colors text-xl no-underline font-bold">
							<i class="ri-arrow-left-line mr-3 text-xl font-bold"></i>
							{{ $letter }}
						</a>
					{{ end }}
				</div>
				{{ template "_akteur" $agent }}
			</div>
		</div>
	{{ end }}

{{ else }}
	<div class="max-w-7xl mx-auto px-8 py-8">
		<div class="mb-10 2xl:mb-0">
			<!-- Main header - hidden on 2xl+ screens when scrollspy is visible -->
			<div class="bg-white px-6 py-4 rounded mb-6 2xl:hidden">
				{{ if eq .model.Search "autoren" }}
					<h1 class="text-4xl font-bold text-gray-900 mb-2">Autor:innen</h1>
					<p class="text-gray-700">Personen, die Beiträge in der Zeitung verfasst haben</p>
				{{ else }}
					<h1 class="text-4xl font-bold text-gray-900 mb-2">Personen & Körperschaften</h1>
					<p class="text-gray-700">Verzeichnis aller in der Zeitung erwähnten Personen und Institutionen</p>
				{{ end }}

				<!-- Integrated checkbox into header -->
				<div class="flex items-center gap-4 mt-4">
					<label class="inline-flex items-center">
						<input type="checkbox"
						       class="form-checkbox h-5 w-5 text-red-600 focus:ring-red-500 focus:border-red-500 checked:bg-red-600 checked:border-red-600 rounded"
						       {{ if eq .model.Search "autoren" }}checked{{ end }}
						       autocomplete="off"
						       hx-get="{{ if eq .model.Search "autoren" }}/akteure/a{{ else }}/akteure/autoren{{ end }}"
						       hx-target="body"
						       hx-push-url="true">
						<span class="ml-2 text-gray-700">Nur Autor:innen anzeigen</span>
					</label>
				</div>
			</div>

			<!-- Alphabet Navigation - styled like year selector -->
			{{ if ne .model.Search "autoren" }}
			<div class="mb-6 w-full">
				<div class="bg-white px-6 py-4 rounded">
					<div class="mx-auto flex flex-row flex-wrap gap-x-6 gap-y-3 w-fit items-end leading-none justify-center">
						{{ range $_, $l := .model.AvailableLetters }}
							{{ if eq $l (Upper $.model.Search) }}
								<!-- This is the active letter -->
								<span class="no-underline leading-none !m-0 !p-0 text-4xl font-bold text-red-600 pointer-events-none" aria-current="true">{{ $l }}</span>
							{{ else }}
								<!-- This is an inactive letter -->
								<a href="/akteure/{{ $l }}" class="no-underline leading-none !m-0 !p-0 text-2xl font-medium text-gray-700 hover:text-red-600 transition-colors">{{ $l }}</a>
							{{ end }}
						{{ end }}
						<!-- Separator and Anonym link -->
						<span class="text-gray-400 text-2xl">|</span>
						{{ if eq $.model.Search "anonym" }}
							<span class="no-underline leading-none !m-0 !p-0 text-4xl font-bold text-red-600 pointer-events-none" aria-current="true">anonym</span>
						{{ else }}
							<a href="/akteure/anonym" class="no-underline leading-none !m-0 !p-0 text-2xl font-medium text-gray-700 hover:text-red-600 transition-colors">anonym</a>
						{{ end }}
					</div>
				</div>
			</div>
			{{ end }}
		</div>

<!-- Two Column Layout: Scrollspy + Content -->
<div class="flex gap-8">

	{{ template "_scrollspy_layout" .model }}

	<!-- People List - Main Content -->
	<div class="flex-1 space-y-6 bg-white">
		{{ range $_, $id := $.model.Sorted }}
			{{ $a := index $.model.Agents $id }}
			<div id="author-{{ $id }}" class="p-6 scroll-mt-8 author-section">
				{{ template "_akteur" $a }}
			</div>
		{{ end }}
	</div>
</div>
{{ end }}