{% sw_extends '@Storefront/storefront/layout/breadcrumb.html.twig' %}
{% block layout_breadcrumb_inner %}
	{% if category %}
		{% set breadcrumbCategories = sw_breadcrumb_full(category, context.context) %}
		{% set categoryId = category.id %}
	{% elseif categoryId %}
		{% set breadcrumbCategories = sw_breadcrumb_full_by_id(categoryId, context.context) %}
	{% else %}
		{% return %}
	{% endif %}


	{% if breadcrumbCategories|length > 0 %}
		{% set breadcrumbKeys = breadcrumbCategories|keys %}

		<nav aria-label="breadcrumb">
			{% block layout_breadcrumb_list %}
				<ol class="breadcrumb" itemscope itemtype="https://schema.org/BreadcrumbList">
					<li class="breadcrumb-item">
						<a href="{{ path('frontend.home.page') }}" 
							class="breadcrumb-link"/>
							{{ "BrandCrockAquaTheme.breadcrumb.lable1"|trans|sw_sanitize }}					
						</a>
						</li>		
					<div class="breadcrumb-placeholder">
						{% sw_icon 'arrow-medium-right' style { size: 'fluid', pack: 'solid' } %}
					</div>
						{% for breadcrumbCategory in breadcrumbCategories %}
							{% set key = breadcrumbCategory.id %}
							{% set name = breadcrumbCategory.translated.name %}
							{% set categoryUrl = category_url(breadcrumbCategory) %}

							{% block layout_breadcrumb_list_item %}
								<li class="breadcrumb-item" {% if key is same as(categoryId) %} aria-current="page" {% endif %} itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
									{% if breadcrumbCategory.type == 'folder' %}
										<div itemprop="item">
											<div itemprop="name">{{ name }}</div>
										</div>
									{% else %}
										<a href="{{ categoryUrl }}" class="breadcrumb-link {% if key is same as(categoryId) %} is-active{% endif %}" title="{{ name }}" {% if category_linknewtab(breadcrumbCategory) %} target="_blank" {% endif %} itemprop="item">
											<link itemprop="url" href="{{ categoryUrl }}">
											<span class="breadcrumb-title" itemprop="name">{{ name }}</span>
										</a>
									{% endif %}
									<meta itemprop="position" content="{{ loop.index }}"/>
								</li>
							{% endblock %}
							{% block layout_breadcrumb_placeholder %}
								{% if key != breadcrumbKeys|last %}
									<div class="breadcrumb-placeholder">
										{% sw_icon 'arrow-medium-right' style { size: 'fluid', pack: 'solid' } %}
									</div>
								{% endif %}
							{% endblock %}
						{% endfor %}
				</ol>
			{% endblock %}
		</nav>
	{% endif %}
{% endblock %}
