@extends('layouts.app')

@section('content')
<section class="order_wrapper">
    <div class="container">
        <div class="row">
            <div class="col-12 text-center">
                <div class="order_wrapper">
                    <div class="d-flex justify-content-center align-items-center">
                        <div class="order-card d-flex justify-content-center align-items-center rounded-circle" id="orderCardFailed">
                            <i class="fa-solid fa-times-circle" id="orderIconFailed"></i>
                        </div>
                    </div>
                </div>
                
                <!-- <p class="order-title pt-3 text-danger">Order Failed</p> -->
                <p class="order-title pt-3 text-danger">{{$titleMessage}}</p>
                
                <p class="order-subtitle">Unfortunately, your order could not be processed at this time. <br class="d-lg-block d-none"> 
                    Please try again or contact support for assistance.
                </p>
                <div class="alert alert-danger">
                    <strong>Reason :</strong> {{ $failedReason }}
                </div>
               
                <a href="{{ url('/shop') }}" class="btn btn-info">Retry Order</a>
                <a href="{{ url('/contactus') }}" class="btn btn-warning ml-2">Contact Support</a>
            </div>
        </div>
    </div>
</section>


@endsection