{{ define "main" }}
<h1 class="text-3xl font-bold mb-4">Seite nicht gefunden</h1>
<p class="mb-6">Die angeforderte Seite konnte nicht gefunden werden.</p>
<p class="mb-6">Vielleicht interessiert Sie eine unserer Kategorien:</p>
<nav>
	<ul class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4">
{{ range $slug, $data := hugo.Data }}
{{ if and $data.slug $data.name }}
	{{ $url := partial "category-url.html" (dict "category" $data.slug "units" $data.units) }}
	{{ if not $url }}{{ continue }}{{ end }}
		<li>
			<a class="grid grid-cols-[24px_auto] gap-4 bg-primary text-white p-6 rounded-lg shadow-md transition-transform hover:scale-105 hover:bg-primary-light transition-[backgroundColor_transform]" href="{{ $url }}">
				{{ $svgPath := printf "img/%s.svg" $data.slug }}
				{{ $svgFile := readFile (printf "static/%s" $svgPath) }}
				{{ if $svgFile }}
					{{ $svgFile | safeHTML }}
				{{ else }}
					<span></span>
					{{ end }}
				<span>{{ $data.name }}</span>
			</a>
		</li>
{{ end }}
{{ end }}
	</ul>
</nav>
{{ end }}