@props(['sliders'])

<swiper-container slides-per-view="1" speed="500" loop="true">
    @foreach ($sliders as $slider)
        <swiper-slide>
            <a href="{{ $slider['link'] }}">
                <picture>
                    @php
                        $base_url = env('CDN_URL') . '/' . $slider['folder'];
                        $poster_url = !empty($slider['poster'])
                            ? $base_url . '/' . $slider['poster'] . '?w=1500'
                            : env('VITE_CDN_URL_ASSETS') . '/default/imageDefault2.jpg';
                        $poster_mobile_url = !empty($slider['poster_mobile'])
                            ? $base_url . '/' . $slider['poster_mobile'] . '?w=800'
                            : env('VITE_CDN_URL_ASSETS') . '/default/imageDefault2.jpg';
                        // dd($base_url, $slider['poster_mobile'])
                    @endphp
                    <source media="(min-width: 768px)" srcset="{{ e($poster_url) }}">
                    <source media="(max-width: 767px)" srcset="{{ e($poster_mobile_url) }}">
                    <img src="{{ e($poster_url) }}" alt="{{ $slider['title'] }}"
                        class="w-full aspect-square md:aspect-[19/6]" loading="lazy" decoding="async"
                        fetchpriority="high">
                </picture>
            </a>
        </swiper-slide>
    @endforeach
</swiper-container>



{{-- @foreach ($sliders as $slider)
    <div class="swiper-slide">
        <a href="{{ $slider['link'] }}">
            <picture>
                @php
                    $base_url = env('CDN_URL') . '/' . $slider['folder'];
                    $poster_url = !empty($slider['poster'])
                        ? $base_url . '/' . $slider['poster'] . '?w=1500'
                        : env('VITE_CDN_URL_ASSETS') . '/default/imageDefault2.jpg';
                    $poster_mobile_url = !empty($slider['poster_mobile'])
                        ? $base_url . '/' . $slider['poster_mobile'] . '?w=800'
                        : env('VITE_CDN_URL_ASSETS') . '/default/imageDefault2.jpg';
                    // dd($base_url, $slider['poster_mobile'])
                @endphp

                <source media="(min-width: 668px)" srcset="{{ e($poster_url) }}">
                <source media="(max-width: 667px)" srcset="{{ e($poster_mobile_url) }}">

                <img src="{{ e($poster_url) }}" alt="{{ $slider['title'] }}"
                    class="w-full rounded-[20px] md:rounded-[40px]" loading="lazy" decoding="async"
                    fetchpriority="high">
            </picture>
        </a>
    </div>
@endforeach --}}