@php

$arrowImage = ($category == 'people') ? '/wp-content/themes/equilibrium/resources/assets/impactreport-2022/assets/icons/arrow-blue.svg' : '/wp-content/themes/equilibrium/resources/assets/impactreport-2022/assets/icons/arrow-green.svg';

@endphp

<div class="impactreport2022-link impactreport2022-block">
    <div class="impactreport2022-link__wrapper">
        @foreach ($data as $item)
            <div class="impactreport2022-link__container" data-js="box-link">
                <img src="{{ $item->cover }}" class="impactreport2022-pillar-post-related-cover-desktop" alt=" {{ $item->title }} post cover">
                <img src="{{ $item->coverMobile }}" class="impactreport2022-pillar-post-related-cover-mobile" alt=" {{ $item->title }} post cover">
                <div class="@if($item->customFontSize) impactreport-2022-adjust-font @endif impactreport-2022-link-text">
                    <div class="impactreport-2022-line-clamp">
                        {{ $item->title }}
                    </div>
                </div>
                <a href="{{ $item->url }}" class="impactreport2022-link__arrow" data-layer="Impact Report 2022;;Suggested Article;;{{ $item->title }}" rel="link" target="_blank" data-utm="false" aria-label="Open {{ $item->title }} post on equilibrium.gucci.com">
                    <img src="{{ $arrowImage }}" alt="">
                    <img src="{{ $arrowImage }}" alt="">
                </a>
            </div>
        @endforeach
    </div>
</div>