<script lang="ts">
	import type { Snippet } from 'svelte';

	let { title, children }: { title: string; children?: Snippet } = $props();
</script>

<section
	class="flex flex-col gap-2 rounded-sm bg-slate-900 p-2 font-medium shadow-md shadow-slate-950/30"
>
	<h2 class="text-2xl">{title}</h2>
	<div class="flex flex-row flex-wrap gap-10">
		{@render children?.()}
	</div>
</section>