@extends("front/layout.master")
@php
  $user = Auth::user();
  $sellerac = App\Store::where('user_id','=', $user->id)->first();
  require_once(base_path().'/app/Http/Controllers/price.php');
@endphp
@section('title',__('staticwords.MyWallet').' | ')
@section("body")

<div class="max-w-[1400px] mx-auto px-4 lg:px-6 pt-5">
    <nav class="breadcrumb-row text-[12px] text-slate-500 flex items-center gap-1.5 leading-none">
        <a href="{{ url('/') }}" class="hover:text-brand-600">{{ __('Home') }}</a>
        <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" class="text-slate-300 shrink-0"><path d="m9 6 6 6-6 6"/></svg>
        <span class="text-deep font-medium">{{ __('staticwords.MyWallet') }}</span>
    </nav>
</div>

<section class="max-w-[1400px] mx-auto px-4 lg:px-6 mt-5 grid lg:grid-cols-[300px_1fr] gap-5 pb-12">
    <aside class="lg:sticky lg:top-28 lg:self-start">
        @include('user.sidebar')
    </aside>

    <div class="space-y-5">

        {{-- Balance + add money --}}
        <div class="bg-white rounded-2xl shadow-card p-6 lg:p-8">
            <div class="flex items-center gap-3 mb-5">
                <div class="w-12 h-12 bg-brand-50 rounded-xl grid place-items-center text-brand-600">
                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><rect x="2" y="5" width="20" height="14" rx="2"/><path d="M2 10h20"/></svg>
                </div>
                <div>
                    <h1 class="font-display font-extrabold text-2xl">{{ __('staticwords.MyWallet') }}</h1>
                    <p class="text-[13px] text-slate-500">{{ __('staticwords.CurrentBalance') }}</p>
                </div>
            </div>

            {{-- Balance card --}}
            <div class="rounded-2xl p-6 text-white mb-7" style="background:linear-gradient(135deg,#3b6df0 0%,#1e3a8a 100%);">
                <div class="text-[12px] uppercase tracking-wider text-white/70">{{ __('staticwords.CurrentBalance') }}</div>
                <div class="text-3xl font-extrabold mt-1">
                    <i class="{{ $defCurrency->currency_symbol }}"></i>
                    @if(isset($user->wallet)) {!! price_format($user->wallet->balance) !!} @else 0.00 @endif
                </div>
                @if(isset($user->wallet) && $defCurrency->currency->code != session()->get('currency')['id'])
                    <div class="text-[13px] text-white/80 mt-1">
                        ( <i class="{{ session()->get('currency')['value'] }}"></i>
                        {!! price_format(currency($user->wallet->balance, $defCurrency->currency->code, session()->get('currency')['id'], false)) !!} )
                        {{ __('staticwords.amountinyourcurrency') }}
                    </div>
                @endif
            </div>

            <div class="grid md:grid-cols-2 gap-6">
                {{-- Add money --}}
                <form id="mainform" action="{{ route('wallet.choose.paymethod') }}" method="POST" class="space-y-3">
                    @csrf
                    <label class="block text-[13px] font-semibold">{{ __('Amount') }}</label>
                    <div class="flex items-center border-2 border-slate-200 rounded-lg overflow-hidden focus-within:border-brand-500 transition-colors">
                        <span class="px-3 text-slate-500"><i class="{{ $defCurrency->currency_symbol }}"></i></span>
                        <input name="amount" required type="number" class="flex-1 h-11 px-2 outline-none text-[14px]" value="1.00" placeholder="0.00" min="1" step="0.01">
                    </div>
                    <button type="submit" class="bg-brand-500 hover:bg-brand-600 text-white font-bold px-5 py-2.5 rounded-lg text-[14px] transition-colors">
                        {{ __('staticwords.proccedtopay') }}…
                    </button>
                </form>

                {{-- Notes --}}
                <ul class="space-y-2.5 text-[13px] text-slate-500">
                    <li class="flex items-start gap-2"><svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="text-slate-400 mt-0.5 shrink-0"><rect x="5" y="11" width="14" height="10" rx="2"/><path d="M8 11V7a4 4 0 0 1 8 0v4"/></svg><span>{{ __('staticwords.moneynonrefundable') }}.</span></li>
                    <li class="flex items-start gap-2"><svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="text-amber-400 mt-0.5 shrink-0"><path d="M12 2l3 7h7l-5.5 4.5L18 21l-6-4-6 4 1.5-7.5L2 9h7z"/></svg><span>{{ __('staticwords.usepoint') }}.</span></li>
                    <li class="flex items-start gap-2"><svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="text-slate-400 mt-0.5 shrink-0"><circle cx="12" cy="12" r="10"/><path d="M12 8v4M12 16h.01"/></svg><span>{{ __('staticwords.expirepoint') }}.</span></li>
                    <li class="flex items-start gap-2"><svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="text-slate-400 mt-0.5 shrink-0"><circle cx="12" cy="12" r="10"/><path d="M12 8v4M12 16h.01"/></svg><span>{{ __('staticwords.walletamounote') }} <b class="text-deep">{{ $defCurrency->currency->code }}</b></span></li>
                </ul>
            </div>
        </div>

        {{-- Wallet history --}}
        @if(isset($wallethistory) && count($wallethistory))
        <div class="bg-white rounded-2xl shadow-card p-6 lg:p-8">
            <h2 class="font-display font-extrabold text-lg mb-4">{{ __('staticwords.WalletHistory') }}</h2>
            <div class="divide-y divide-slate-100">
                @foreach($wallethistory->sortByDesc('id') as $history)
                <div class="py-3.5 flex items-start justify-between gap-4">
                    <div class="min-w-0">
                        <div class="font-semibold text-deep text-[14px]">{{ $history->log }}</div>
                        <div class="text-[12px] text-slate-400 mt-1 leading-relaxed">
                            @if($history->type == 'Credit')
                                <b>{{ __('staticwords.CreditedON') }}:</b> {{ date('d/m/Y | h:i A',strtotime($history->created_at)) }}
                                &middot; <b>{{ __('Ref ID:') }}</b> {{ $history->txn_id }}
                                &middot; <b>{{ __('Expire ON:') }}</b> {{ date('d/m/Y | h:i A',strtotime($history->expire_at)) }}
                            @else
                                <b>{{ __('staticwords.DebitedON') }}:</b> {{ date('d/m/Y | h:i A',strtotime($history->created_at)) }}
                                &middot; <b>{{ __('Ref ID:') }}</b> {{ $history->txn_id }}
                            @endif
                        </div>
                    </div>
                    <div class="{{ $history->type == 'Credit' ? 'text-emerald-600' : 'text-rose-600' }} font-bold whitespace-nowrap text-[15px]">
                        {{ $history->type == 'Credit' ? '+' : '-' }} <i class="{{ $defCurrency->currency_symbol }}"></i> {!! price_format($history->amount,2) !!}
                    </div>
                </div>
                @endforeach
            </div>
            <div class="mt-5">{!! $wallethistory->links() !!}</div>
        </div>
        @endif

    </div>
</section>

@include('front.partials.change-password-modal')

@endsection