{% if flash is defined and flash|length > 0 %}
    <div class="mx-auto mb-4 max-w-3xl space-y-2">
        {% for entry in flash %}
            {% set color = {
                'error': 'border-red-300 bg-red-50 text-red-800 dark:border-red-800 dark:bg-red-950 dark:text-red-300',
                'success': 'border-emerald-300 bg-emerald-50 text-emerald-800 dark:border-emerald-800 dark:bg-emerald-950 dark:text-emerald-300',
                'info': 'border-sky-300 bg-sky-50 text-sky-800 dark:border-sky-800 dark:bg-sky-950 dark:text-sky-300',
            }[entry.type]|default('border-slate-300 bg-slate-50 text-slate-800') %}
            <div class="rounded-md border px-4 py-2 text-sm {{ color }}">{{ entry.message }}</div>
        {% endfor %}
    </div>
{% endif %}