{% trans_default_domain 'admin' %}

{% if breadcrumb is defined %}
    <div class="px-2 pt-5 pb-1">
        <nav class="flex" aria-label="Breadcrumb">
            <ol role="list" class="flex items-center space-x-2">

                <li>
                    <div>
                        <a href="{{ path('admin_index') }}" class="text-gray-400 dark:text-gray-500 hover:text-gray-500 dark:hover:text-gray-300">
                            <twig:ux:icon name="ph:house" class="h-4 w-4 flex-shrink-0" aria-hidden="true" />
                            <span class="sr-only">Dashboard</span>
                        </a>
                    </div>
                </li>

                {% for item in breadcrumb.children %}

                    <li class="[&:not(:last-child)]:hidden sm:[&:not(:last-child)]:block">
                        <div class="flex items-center">

                            <twig:ux:icon name="ph:caret-right" class="h-4 w-4 flex-shrink-0 text-gray-300 dark:text-gray-600" aria-hidden="true" />

                            {% if item.current %}
                                <strong class="ml-2 text-sm font-medium text-gray-700 dark:text-gray-100"
                                        aria-current="page">{{ item.label|trans }}</strong>
                            {% else %}
                                <a href="{{ item.uri }}"
                                   class="ml-2 text-sm font-normal text-gray-500 dark:text-gray-300 hover:text-gray-700 dark:hover:text-gray-200 transition-colors">{{ item.label|trans }}</a>
                            {% endif %}

                        </div>
                    </li>

                {% endfor %}

            </ol>
        </nav>
    </div>
{% endif %}
