@extends('frontend.layout.master')
@section('title', $pageTitle)
@section('content')

<style>
    .success_div_1 {
        margin: 172px 0px 50px 0px;
    }
    .success_div_2 {
        width: 60%;
        margin: auto;
        padding: 40px;
        text-align: center;
        box-shadow: 3px 3px 7px #0000001f;
    }
    .success_h_1 {
        margin-bottom: 10px;
        font-size: 32px;
        color: #232b83;
        font-weight: 700;
    }
    .success_p_1 {
        font-size: 16px;
        margin: 5px 0px;
    }
    .success_p_2 {
        width: fit-content;
        margin: 25px auto 0px;
        padding: 0px 20px;
        line-height: 40px;
        background-color: #b40e16;
        color: white;
        box-shadow: 0px 0px 7px #0000002b;
    }
    .success_img_1 {
        width: 150px;
        height: 150px;
        object-fit: contain;
        margin-bottom: 15px;
    }
</style>

<div class="success_div_1">
    <div class="success_div_2">
        <img src="https://i.pinimg.com/originals/52/cd/db/52cddb4d267e3c3c3637f2abaf61aa5d.gif" class="success_img_1">
        <h2 class="success_h_1">Order Canceled!</h2>
        <p class="success_p_1">This is Your Transaction ID: {{$transid}}</p>
        <a href="{{ route('home') }}" class="success_a_1">
            <p class="success_p_2">Back to Home</p>
        </a>
    </div>
</div>
    

@endsection