<script lang="ts">
import { m } from '$lib/paraglide/messages.js';

interface Props {
	note: string;
}

let { note }: Props = $props();
</script>

<div
	role="note"
	aria-label={m.journey_interlude_aria_label()}
	class="my-4 rounded-r-sm border-l-2 border-orange-400 bg-orange-50 py-2 pr-3 pl-3"
>
	<!-- plaintext — do NOT use {@html} here -->
	<p class="text-xs leading-relaxed text-ink italic">{note}</p>
</div>
