@php
$auxItem = null;
$slideCount = 0;
$cards = [];
foreach($block->cards as $card) {
    $cardFields = $card->getCardFields();
    if ($card && $cardFields) {
        $cards[] = [
            'fields' => $cardFields,
            'cta_label' => $card->cta_label,
            'cta2_label' => $card->cta2_label
        ];
    }
}
@endphp
@if(!empty($cards))
    <div class="featured-slider {{ isset($center_title) ? 'featured-slider--fix-margin' : '' }} block-margin-top--{{ $block->margin_type_top }} block-margin-bottom--{{$block->margin_type_bottom}}" data-controller="blocks/featured-slider">
        @if ($block->anchor_id )
            <div id="{{ $block->anchor_id }}" class="anchor-offset"></div>
        @endif
        <div class="featured-slider__divider" data-aos="growline" data-aos-delay="500" data-aos-once="true"></div>
        @if(!empty($block->block_title))
            <div class="featured-slider__container-title {{ isset($center_title) ? 'featured-slider--center' : '' }}" data-aos="fade-up" data-aos-once="true" data-aos-delay="1000">
                @php $block->heading_type = 'h2'; @endphp
                @include('frontend.templates.blocks.title-block',[
                    'isInclude' => true,
                ])
            </div>
        @endif
        <div class="featured-slider__wrapper" data-aos="fade-up" data-aos-delay="500" data-aos-once="true">
            {{-- START SLIDER DESKTOP --}}
            <div class="featured-slider__container featured-slider__desktop" data-role="slider">
                @foreach($cards as $i => $item)
                    @if(($i + 1) % 2 == 0)
                        @php
                            $firstItem = $slideCount % 2 == 0 ? $auxItem : $item;
                            $secondItem = $slideCount % 2 == 0 ? $item : $auxItem;
                        @endphp
                        @include(
                            'frontend.templates.blocks.featured-slide',
                            array(
                                'firstItem' => $firstItem['fields'],
                                'secondItem' => $secondItem['fields'],
                                'container_class' => 'featured-slide--slider',
                                'id' => (($i - 1) / 2),
                                'invert' => (($i - 1) / 2) % 2 == 1,
                                'firstItemCtaLabels' => [$firstItem['cta_label'], $firstItem['cta2_label']],
                                'secondItemCtaLabels' => [$secondItem['cta_label'], $secondItem['cta2_label']]
                            ))
                        @php
                            $auxItem =  null;
                            $slideCount++;
                        @endphp
                    @else
                        @php $auxItem =  $item; @endphp
                    @endif
                @endforeach
                @if($auxItem)
                    @include(
                        'frontend.templates.blocks.featured-slide',
                        array(
                            'firstItem' => $auxItem['fields'],
                            'secondItem' => null,
                            'container_class' => 'featured-slide--slider',
                            'id' => (sizeof($cards) - 1) / 2,
                            'invert' => false,
                            'firstItemCtaLabels' => [$auxItem['cta_label'], $auxItem['cta2_label']],
                        ))
                    @php $slideCount++; @endphp
                @endif
            </div>
            <div class="featured-slider__navigation featured-slider__desktop" data-role="nav">
                <div class="featured-slider__prev" data-action="prev">
                    @include('frontend.svg.icon-arrow-blue-down')
                </div>

                @for($i = 0; $i < $slideCount; $i++)
                    <div class="featured-slider__dot" data-action="dot" data-index="{{ $i }}"></div>
                @endfor
                <div class="featured-slider__next" data-action="next">
                    @include('frontend.svg.icon-arrow-blue-down')
                </div>
            </div>
            {{-- END SLIDER DESKTOP --}}

            {{-- START SLIDER MOBILE --}}
            <div class="featured-slider__container featured-slider__mobile" data-role="slider-mobile">
                @foreach($cards as $i => $item)
                    @include(
                        'frontend.templates.blocks.featured-slide-mobile',
                        array(
                            'item' => $item['fields'],
                            'id' => $i,
                            'ctaLabels' => [$item['cta_label'], $item['cta2_label']]
                        ))
                @endforeach
            </div>
            <div class="featured-slider__navigation featured-slider__mobile" data-role="nav-mobile">
                <div class="featured-slider__prev" data-action="prev-mobile">
                    @include('frontend.svg.icon-arrow-blue-down')
                </div>
                @foreach($cards as $i => $item)
                    <div class="featured-slider__dot" data-action="dot-mobile" data-index-mobile="{{ $i }}"></div>
                @endforeach
                <div class="featured-slider__next" data-action="next-mobile">
                    @include('frontend.svg.icon-arrow-blue-down')
                </div>
            </div>
            {{-- END SLIDER MOBILE --}}
        </div>
        @if($block->cta1)
            {!! generateLink($block->cta1, 'square-button square-button--arrow featured-slider__container-button') !!}
        @endif
    </div>
@endif