@extends('layouts.app')

@section('content')
<div id="wrapper">
        <section>
            <div class="container">
                <div class="pricing__upper text-center">
                <div class="my-4 text-center">
                <img src="/animation_lnkteycp_smal.gif" alt="" style='width:100px;'>
                 </div>
                    @foreach($order as $orderdetail)
                    <h2 class="mt-4">Order Confirmed</h2>
                    <p class="mt-3">your order is being processed. You're almost ready to put it to work.</p>
                    @endforeach
                    <button class="btn btn-sm btn-dark rounded-0 mt-2">Continue</button>
                </div>
            </div>

        </section>
        <section>
             
            <div class="container d-flex justify-content-center">
            @foreach($order as $orderdetail)
                <div class="pricing__bottom text-center mt-5">
                    <h5 class="mt-4 fw-normal">Thank you for your order!</h5>
                    <p class="mt-4">We've emailed your receipt to <b>{{$orderdetail->email}}</b></p>

                    <div class="row mt-4">
                        <div class="col-md-2">
                            <div class="product__icon">
                                <i class="fa-solid fa-globe"></i>
                            </div>

                        </div>

                        <div class="col-md-8 d-flex align-items-center">
                            <div class="pricing__detail text-start">
                                <p class="mb-0">{{$orderdetail->radius_address}}</p>
                                <span>{{$orderdetail->productname}}</span>
                            </div>

                        </div>
                        <div class="col-md-2 d-flex align-items-center">
                            <div class="product__price">
                                @if($orderdetail->newprice == '')
                                <h6>${{$orderdetail->price}}</h6>
                                @else
                                <h6>${{$orderdetail->newprice}}</h6>
                                @endif
                            </div>

                        </div>
                    </div>

                    <hr >

                    <div class="row mt-4">
                        <div class="col-md-2">
                            <div class="product__icon">
                                <i class="fa-solid fa-location-dot"></i>
                            </div>
                        </div>
                        <div class="col-md-8 d-flex align-items-center">
                            <div class="pricing__detail text-start">
                                <p class="mb-0">{{$orderdetail->productname}}</p>
                                <strong>{{$orderdetail->radius}}</strong>
                            </div>
                        </div>
                        <div class="col-md-2 d-flex align-items-center">
                            <div class="product__price">
                            @if($orderdetail->newprice == '')
                                <h6>${{$orderdetail->price}}</h6>
                                @else
                                <h6>${{$orderdetail->newprice}}</h6>
                                @endif
                            </div>
                        </div>
                    </div>

                    <div class="row mt-4">
                        <div class="col-md-6">
                            <h3 class="text-start">Total</h3>
                        </div>
                        <div class="col-md-6">
                        @if($orderdetail->newprice == '')
                        <h4 class="text-dark text-end">${{$orderdetail->price}}</h4>
                                @else
                                <h4 class="text-dark text-end">${{$orderdetail->newprice}}</h4>
                                @endif
                           
                        </div>
                    </div>
                </div>
            </div>
            @endforeach

        </section>
    </div>

@endsection