@extends('panel.layouts.master')
@section('content')
    <style>
        .info {
            border-bottom: 1px dashed #000;
        }
    </style>
    <div
        class="content transition-[margin,width] duration-100 rtl:xl:pr-3.5 ltr:xl:pl-3.5 pt-[54px] pb-16 relative z-10 group mode content--compact rtl:xl:mr-[275px] ltr:xl:ml-[275px] mode--light rtl:[&.content--compact]:xl:mr-[91px] ltr:[&.content--compact]:xl:ml-[91px]">
        <div class="px-5 mt-16">
            <div class="container">
                <div class="grid grid-cols-12 gap-x-6 gap-y-10 w-1/2 mx-auto">
                    <div class="col-span-12">
                        <div class="flex flex-col gap-y-3 md:h-10 md:flex-row md:items-center">
                            <div class="text-base font-medium group-[.mode--light]:text-white">
                                فاکتور
                            </div>
                        </div>
                        <div class="mt-3.5 flex flex-col gap-8">
                            <div class="box box--stacked flex flex-col">
                                <p class="m-0 text-center w-100" style="font-size: large">
                                    بعد از 3 ثانیه منتقل خواهید شد...
                                </p>
                                <div
                                    class="mx-3 my-3">
                                    <div class="info px-3 py-5">
                                        <span>نام و نام خانوادگی</span>
                                        <span style="float: left;">{{ $user->full_name }}</span>
                                    </div>
                                    <div class="info px-3 py-5">
                                        <span>کد ارجاع</span>
                                        <span style="float: left;">{{ $payment->reference_code }}</span>
                                    </div>
                                    <div class="info px-3 py-5">
                                        <span>شماره تماس</span>
                                        <span style="float: left;">{{ $user->phone }}</span>
                                    </div>
                                    <div class="info px-3 py-5">
                                        <span>بابت</span>
                                        <span style="float: left;">ثبت نام پکیج سیکس پک</span>
                                    </div>
                                    <div class="info px-3 py-5" style="border-bottom: none;">
                                        <span>مبلغ</span>
                                        <span style="float: left;">{{ number_format($payment->amount) }} ریال</span>
                                    </div>
                                    <div class="info px-3 py-5 {{ $payment->status == 'success' ? 'bg-success' : 'bg-danger' }} text-white rounded"
                                         style="border-bottom: none;">
                                        <span>وضعیت</span>
                                        <span style="float: left;">{{ $payment->status == 'success' ? 'موفق' : 'ناموفق' }}</span>
                                    </div>
                                    <div class="info px-3 py-5 bg-warning text-white rounded mt-3"
                                         style="border-bottom: none;">
                                        <p>توجه : داوطلب  گرامی، ثبت نام شما با موفقیت انجام شد. پکیج سیکس پک از روز دوشنبه ۱۴ آبان ماه در پنل کاربری شما قرار می گیرد.</p>
                                    </div>
                                    <div class="text-center">
                                        <a href="{{ route('panel') }}"
                                            class="mt-3 transition duration-200 border shadow-sm items-center justify-center py-2 px-3 rounded-md font-medium cursor-pointer focus:ring-4 focus:ring-primary focus:ring-opacity-20 focus-visible:outline-none dark:focus:ring-slate-700 dark:focus:ring-opacity-50 [&amp;:hover:not(:disabled)]:bg-opacity-90 [&amp;:hover:not(:disabled)]:border-opacity-90 [&amp;:not(button)]:text-center disabled:opacity-70 disabled:cursor-not-allowed border-success text-success dark:border-success [&amp;:hover:not(:disabled)]:bg-success/10 inline-block w-100">
                                            برگشت به صفحه اصلی
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('script')
    <script>
        setTimeout(function () {
            window.location.href = '/panel'
        },3000)
    </script>
@endsection