@if ($slide->type === 1)
    <div class="slide-type-1">
        <div class="slide-cols">
            <div class="col-left">
                <div class="inner">
                    <div class="slide-title">
                        <h2 class="title">{!! $slide->title !!}</h2>
                    </div>
                    <div class="slide-description">
                        <p>{!! $slide->description !!}</p>
                    </div>
                    <div class="slide-buttons">
                        <a class="btn-link acn-touch" href="{{ $slide->action_url }}"
                           target="_self">{{ $slide->button_text }}</a>
                    </div>
                </div>
            </div>
            <div class="col-right">
                <div class="mini-slider">
                    <div class="mini-clipper">
                        <div class="mini-holder">
                            @foreach($slide->getMedia('type_1_images') as $mini_slide)
                                <div class="slide">
                                    <img loading="lazy" alt="nerdhunters.com" src="{{ $mini_slide->getUrl() }}">
                                </div>
                            @endforeach
                        </div>
                    </div>

                    <div class="mini-nav">
                        <ul class="list">
                            @foreach($slide->getMedia('type_1_thumbs') as $mini_slide)
                                <li class="item{{ $loop->first ? ' active' : '' }}">
                                    <img loading="lazy" alt="nerdhunters.com" src="{{ $mini_slide->getUrl() }}">
                                </li>
                            @endforeach
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>

@elseif($slide->type === 2)
    <div class="slide-type-2">
        <div class="inner">
            <div class="image">
                <img loading="lazy" alt="nerdhunters.com" src="{{ $slide->getFirstMediaUrl('type_2') }}">
                <div class="cnt">
                    <h2 class="title">{!! $slide->title !!}</h2>
                    <div class="description">
                        <p>{!! $slide->description !!}</p>
                    </div>
                </div>
                <a class="link" href="{{ $slide->action_url }}" target="_self"></a>
            </div>
        </div>
    </div>

@elseif($slide->type === 3)
    <div class="slide-type-3">
        <div class="slide-cols">
            <div class="col-left">
                <div class="image">
                    <img loading="lazy" alt="nerdhunters.com" src="{{ $slide->getFirstMediaUrl('type_3_main') }}">
                    <div class="cnt">
                        <h2 class="title">{!! $slide->title !!}</h2>
                        <div class="description">
                            <p>{!! $slide->description !!}</p>
                        </div>
                    </div>
                    <a class="link" href="{{ $slide->action_url }}" target="_self"></a>
                </div>
            </div>

            <div class="col-right">
                @foreach($slide->getMedia('type_3_side') as $side_slide)
                    <div class="image">
                        <img loading="lazy" alt="nerdhunters.com" src="{{ $side_slide->getUrl() }}">
                        <div class="cnt">
                            <div class="description">
                                <p>{{ $side_slide->getCustomProperty('description') }}</p>
                            </div>
                        </div>
                        <a class="link" href="{{ $side_slide->getCustomProperty('link') }}" target="_self"></a>
                    </div>
                @endforeach
            </div>
        </div>
    </div>

@endif