{{ $model := .model }}
{{ $date := .model.Datum.When }}
<!-- Header with year link left, nav buttons right -->
<div class="flex items-center justify-between mb-3">
	<a
		href="/jahrgang/{{- $date.Year -}}"
		class="inline-flex items-center gap-1 text-black hover:text-slate-700 text-base font-medium">
		<i class="ri-calendar-line"></i>
		{{ $date.Year }}
	</a>

	<div class="flex flex-row gap-x-1">
		{{ if $model.Prev }}
			<a
				href="/{{- $model.Prev.Datum.When.Year -}}/{{- $model.Prev.Number.No -}}"
				class="inline-flex items-center justify-center w-7 h-7 bg-slate-100 text-slate-700 rounded
				hover:bg-slate-200 transition-colors no-underline font-bold">
				<i class="ri-arrow-left-line text-sm"></i>
			</a>
		{{ end }}

		{{ if $model.Next }}
			<a
				href="/{{- $model.Next.Datum.When.Year -}}/{{- $model.Next.Number.No -}}"
				class="inline-flex items-center justify-center w-7 h-7 bg-slate-100 text-slate-700 rounded
				hover:bg-slate-200 transition-colors no-underline font-bold">
				<i class="ri-arrow-right-line text-sm"></i>
			</a>
		{{ end }}
	</div>
</div>

<!-- Issue title and date -->
<div class="border-t border-slate-200 pt-3 mb-4">
	<div class="flex items-center justify-between">
		<div class="flex items-center gap-1">
			<h1 class="text-lg font-semibold text-slate-800">
				{{ $model.Number.No }}&#8201;/&#8201;{{ $date.Year }}
			</h1>
		</div>
		<div class="text-base font-medium text-slate-700 bg-slate-100 px-2 py-1 rounded">
			<span class="pr-1">{{ printf "%.2s" (WeekdayName $date.Weekday) }}</span>
			{{ $date.Day }}. {{ $date.MonthNameShort }}. <b>{{ $date.Year }}</b>
		</div>
	</div>
</div>
