{% set companyObj = companyObj is defined ? companyObj : app.request.get('companyInner') %}
{% set headerPages = companyObj.pages|default([])|filter(page => page.active and 'header' in page.displayLocations) %}
{% if companyObj.headerVisible is not defined or companyObj.headerVisible %}
<div class="py-[12px] px-[24px] mb-[16px] rounded-[16px] border-[#E2E2E9] bg-[#F7F7FA] mx-auto w-full border">
<div class="flex justify-between items-center">
<div class="flex gap-[16px] items-center">
<div class="[&_img]:max-w-[91px] [&_img]:max-h-[43px] [&_img]:object-contain">
<a href="/">
{% if companyStyles.mainImage is not empty %}
{{ sonata_media(companyStyles.mainImage, 'reference') }}
{% endif %}
</a>
</div>
<p class="text-[16px] font-medium text-[#1B2028] leading-tight">
Краще місце для купівлі e-Sim!
</p>
</div>
{% if headerPages is not empty %}
<div class="hidden min-[1100px]:flex flex-wrap gap-[16px] items-center">
{% for page in headerPages %}
<a href="{{ path('custom_page_show', {slug: page.slug}) }}" class="font-semibold text-[#1B2028] text-[12px] text-center uppercase block hover:underline">{{ page.title }}</a>
{% endfor %}
</div>
<button type="button" class="js--headerPagesToggle min-[1100px]:hidden flex items-center justify-center w-[24px] h-[24px] shrink-0" aria-expanded="false" aria-label="Menu">
<svg class="w-[24px] h-[24px]" viewBox="0 0 24 24" fill="none">
<path d="M4 6H20M4 12H20M4 18H20" stroke="#1B2028" stroke-width="2" stroke-linecap="round"/>
</svg>
</button>
{% endif %}
</div>
{% if headerPages is not empty %}
<div class="js--headerPagesMenu hidden min-[1100px]:hidden flex-col gap-[12px] mt-[12px]">
{% for page in headerPages %}
<a href="{{ path('custom_page_show', {slug: page.slug}) }}" class="font-semibold text-[#1B2028] text-[12px] text-center uppercase block hover:underline">{{ page.title }}</a>
{% endfor %}
</div>
{% endif %}
</div>
{% endif %}