@extends('frontend::layouts.master')

@section('content')
    <div class="container relative pt-6 lg:pt-10">
        <x-frontend::utility.sectiontitle title="Coupon"></x-frontend>
    </div>
    <div class="container relative pt-6 lg:pt-10">
        <div class="flex flex-wrap -mx-4">
            <div class="w-full lg:w-3/12 px-4 pb-2 lg:pb-0">
                <div class=" bg-glass p-4">
                    <livewire:frontend::menu.sidebar-menu active='1' />
                </div>
            </div>
            <div class="w-full lg:w-9/12 px-4">
                <div class="flex flex-wrap -mx-2">
                    @for ($i = 0; $i < 10; $i++)
                        <div class="w-full sm:w-1/2 xl:w-1/3 p-2">
                            <div class="coupon-irl-wrapper">
                                <div class="coupon-irl-container">
                                    <div class="coupon-cd-wrapper">
                                        99 Coins
                                    </div>
                                    <div class="flex items-center justify-center h-full flex-1 py-1">
                                        <div class="flex flex-col justify-between h-full pl-3 py-half">
                                            <div class="flex-space"></div>
                                            <div class="coupon-irl-content">
                                                <p class="coupon-irl-mtitle">JHJSFU662348</p>
                                                <p class="coupon-irl-stitle">รวมมูลค่า 25,000 บาทขึ้นไปรวมมูลค่า 25,000 บาทขึ้นไปรวมมูลค่า 25,000 บาทขึ้นไปรวมมูลค่า 25,000 บาทขึ้นไป</p>
                                            </div>
                                            <p class="text-[10px] text-primary">Exp. 21/03/2024</p>
                                        </div>
                                        <div class="flex flex-col justify-end h-full items-end flex-1 py-half relative">
                                            <button class="butn-coupon" type="button">COLLECT</button>
                                        </div>
                                    </div>
                                    <img src="{{ Module::asset('frontend:img/cv.svg') }}" class="cv">
                                    <img src="{{ Module::asset('frontend:img/cv.svg') }}" class="cv cv-revert">
                                </div>
                            </div>
                        </div>
                    @endfor
                </div>
            </div>
        </div>

    </div>
@endsection