@extends("Site.Layouts.blank")
@section ("content")
    <div class="relative"  >
        <!--  -->
        <img src="{{asset('site_assets/images/meal_inner_banner.webp')}}" alt="home_banner" class="w-full  h-[200px] md:h-[300px]  object-cover">
        <div class="absolute inset-0 center-by-flex " style="background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.50) 100%);">
            <h1 class="text-white text-[40px] font-medium">Checkout</h1>
        </div>
    </div>


    <div class="bg-green-dark  min-h-screen">
        <main class="x-container  bg-white   px-5 md:px-10 min-h-[80vh]">

            <checkout-page-components
                :cart_items="{{$CartItems}}"
                :address_list="{{$address}}"
                :cities="{{$cities}}"
                :time_slots="{{$TimeSlots}}"
                :vat_percentage="{{$vatPercentage}}"
                :vat_amount="{{$vatAmount}}"
                :delivery_price="{{$delivery_price}}"
                :final_price="{{$finalPrice}}"
            >
            </checkout-page-components>

        </main>


    </div>



@endsection