{% if modal is not defined %}
    {% set modal = false %}
{% endif %}
<div class="{{ html_classes('rounded-md mb-4', { 'p-4': modal == false, 'bg-red-500': level == 'error', 'bg-green-500': level == 'success', 'bg-yellow-500': level == 'warning', 'bg-primary-light': level == 'info' }) }}">
    <div class="flex items-start">
        <div class="{{ html_classes('shrink-0 mt-1', { 'text-gray-800': level == 'warning', 'text-white': level != 'warning' }) }}">
            {% if level == 'error' or level == 'warning' %}
                <svg class="w-5 h-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                    <path fill-rule="evenodd" d="M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM8.28 7.22a.75.75 0 0 0-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 1 0 1.06 1.06L10 11.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L11.06 10l1.72-1.72a.75.75 0 0 0-1.06-1.06L10 8.94 8.28 7.22Z" clip-rule="evenodd" />
                </svg>
            {% elseif level == 'success' %}
                <svg class="w-5 h-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                    <path fill-rule="evenodd" d="M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z" clip-rule="evenodd" />
                </svg>
            {% else %}
                <svg class="w-5 h-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                    <path fill-rule="evenodd" d="M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-7-4a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM9 9a.75.75 0 0 0 0 1.5h.253a.25.25 0 0 1 .244.304l-.459 2.066A1.75 1.75 0 0 0 10.747 15H11a.75.75 0 0 0 0-1.5h-.253a.25.25 0 0 1-.244-.304l.459-2.066A1.75 1.75 0 0 0 9.253 9H9Z" clip-rule="evenodd" />
                </svg>
            {% endif %}
        </div>
        <div class="ml-3">
            {% if title is defined %}
                <div class="{{ html_classes('text-lg font-semibold uppercase', { 'text-gray-800': level == 'warning', 'text-white': level != 'warning' }) }}">
                    {{ title }}
                </div>
            {% endif %}
            {% if messages is defined %}
                <div class="{{ html_classes({ 'text-gray-800': level == 'warning', 'text-white': level != 'warning' }) }}">
                    <ul role="list" class="space-y-1">
                        {% for message in messages %}
                            <li>
                                {{ message|raw }}
                            </li>
                        {% endfor %}
                    </ul>
                </div>
            {% endif %}
            {% if level == 'error' and has_error_code() %}
                <div class="pt-8 text-white text-sm font-mono">
                    Fehlercode (bitte angeben): {{ error_code() }}
                </div>
            {% endif %}
        </div>
    </div>
</div>