@extends('dashboard.layouts.master')
@section('title', 'Transaction Details | Admin Panel')
@section('content')
    @if(\Helper::checkPermission('unified_transaction_logs', 'show'))
<div class="padding website-label">
    <div class="box">
        <div class="box-header dker">
            <div class="row">
                <div class="col-sm-8">
                    <h3>Transaction Details: #{{ $transaction->transaction_number }}</h3>
                    <small>
                        <a href="{{ route('adminHome') }}">{{ __('backend.dashboard') }}</a> /
                        <a href="{{ route('transactions.index') }}">Transaction Logs</a> /
                        <span>Details</span>
                    </small>
                </div>
                <div class="col-sm-4 text-right">
                    <a href="{{ route('transactions.index') }}" class="btn btn-sm white box-shadow">
                        <i class="fa fa-arrow-left"></i> Back to Listing
                    </a>
                </div>
            </div>
        </div>
        
        <div class="box-body">
            {{-- Status & Summary Ribbon --}}
            <div class="row m-b-lg">
                <div class="col-md-3">
                    <div class="box p-a b-l b-l-2x b-info">
                        <small class="text-muted text-uppercase font-weight-bold">Amount</small>
                        <div class="text-2x font-weight-bold {{ $transaction->amount < 0 ? 'text-danger' : 'text-success' }}">
                            {{ $transaction->currency }} {{ number_format(abs($transaction->amount), 2) }}
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="box p-a b-l b-l-2x b-success">
                        <small class="text-muted text-uppercase font-weight-bold">Status</small>
                        <div class="text-2x font-weight-bold">
                            @if($transaction->status == 'completed')
                                <span class="text-success">Completed</span>
                            @elseif($transaction->status == 'pending')
                                <span class="text-warning">Pending</span>
                            @elseif($transaction->status == 'failed')
                                <span class="text-danger">Failed</span>
                            @else
                                <span class="text-info">{{ ucfirst($transaction->status) }}</span>
                            @endif
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="box p-a b-l b-l-2x b-primary">
                        <small class="text-muted text-uppercase font-weight-bold">Type</small>
                        <div class="text-2x font-weight-bold text-primary">
                            {{ ucfirst(str_replace('_', ' ', $transaction->type)) }}
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="box p-a b-l b-l-2x b-accent">
                        <small class="text-muted text-uppercase font-weight-bold">Date</small>
                        <div class="text-2x font-weight-bold">
                            {{ $transaction->created_at->format('M d, Y') }}
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">
                {{-- Left Column: Core Details --}}
                <div class="col-md-7">
                    <div class="box">
                        <div class="box-header dker">
                            <h4>Transaction Information</h4>
                        </div>
                        <table class="table table-striped m-a-0">
                            <tr>
                                <td style="width:180px"><strong>Transaction ID:</strong></td>
                                <td>#{{ $transaction->id }}</td>
                            </tr>
                            <tr>
                                <td><strong>Reference Number:</strong></td>
                                <td class="text-primary font-weight-bold">{{ $transaction->transaction_number }}</td>
                            </tr>
                            <tr>
                                <td><strong>Transaction Type:</strong></td>
                                <td>{{ ucfirst(str_replace('_', ' ', $transaction->type)) }}</td>
                            </tr>
                            <tr>
                                <td><strong>Payment Method:</strong></td>
                                <td><span class="label white text-dark">{{ strtoupper($transaction->payment_method) }}</span></td>
                            </tr>
                            <tr>
                                <td><strong>External Reference:</strong></td>
                                <td><code>{{ $transaction->payment_reference ?? 'N/A' }}</code></td>
                            </tr>
                            <tr>
                                <td><strong>Creation Date:</strong></td>
                                <td>{{ $transaction->created_at->format('Y-m-d H:i:s') }} ({{ $transaction->created_at->diffForHumans() }})</td>
                            </tr>
                            <tr>
                                <td><strong>Description:</strong></td>
                                <td>{{ $transaction->description ?? 'No description provided.' }}</td>
                            </tr>
                        </table>
                    </div>

                    {{-- Metadata Section --}}
                    @if($transaction->metadata)
                    <div class="box m-t">
                        <div class="box-header dker">
                            <h4>Additional Metadata (JSON)</h4>
                        </div>
                        <div class="box-body grey-100">
                            <pre class="m-a-0" style="background:transparent; border:none;">{{ json_encode($transaction->metadata, JSON_PRETTY_PRINT) }}</pre>
                        </div>
                    </div>
                    @endif
                </div>

                {{-- Right Column: User & Business --}}
                <div class="col-md-5">
                    {{-- User Details --}}
                    <div class="box">
                        <div class="box-header dker">
                            <h4>User Primary Information</h4>
                        </div>
                        <div class="box-body">
                            @if($transaction->user)
                                <div class="row m-b">
                                    <div class="col-xs-3">
                                        <div class="avatar w-64 grey-100">
                                            <i class="fa fa-user fa-3x text-muted" style="margin-top: 10px;"></i>
                                        </div>
                                    </div>
                                    <div class="col-xs-9">
                                        <h5 class="m-a-0">{{ $transaction->user->name }}</h5>
                                        <p class="text-muted">{{ $transaction->user->email }}</p>
                                        <span class="label primary">ID: #{{ $transaction->user->id }}</span>
                                    </div>
                                </div>
                            @else
                                <div class="alert alert-warning m-a-y">User information not found.</div>
                            @endif
                        </div>
                    </div>

                    {{-- Business Details --}}
                    <div class="box">
                        <div class="box-header dker">
                            <h4>Related Business</h4>
                        </div>
                        <div class="box-body">
                            @if($transaction->business)
                                <h5 class="m-a-0 text-primary">{{ $transaction->business->business_name }}</h5>
                                <p class="text-muted m-b-sm">{{ $transaction->business->business_email }}</p>
                                
                                <div class="row">
                                    <div class="col-xs-6">
                                        <small class="text-muted d-block">Phone</small>
                                        <strong>{{ $transaction->business->business_phone ?? 'N/A' }}</strong>
                                    </div>
                                    <div class="col-xs-6 text-right">
                                        <small class="text-muted d-block">Business ID</small>
                                        <strong>#{{ $transaction->business->id }}</strong>
                                    </div>
                                </div>
                            @else
                                <div class="text-muted italic">No specific business associated.</div>
                            @endif
                        </div>
                    </div>

                    {{-- Quick Actions --}}
                    <div class="box">
                        <div class="box-header dker">
                            <h4>Admin Actions</h4>
                        </div>
                        <div class="box-body">
                            <button class="btn btn-block white" onclick="window.print()">
                                <i class="fa fa-print"></i> Print Receipt
                            </button>
                            <button class="btn btn-block danger m-t" disabled>
                                <i class="fa fa-undo"></i> Refund Transaction (Coming Soon)
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
    @else
        <script>window.location.href = "{{ route('adminHome') }}";</script>
    @endif

<style>
    .b-l-2x { border-left-width: 4px !important; }
    .text-2x { font-size: 1.5rem; line-height: 1.2; }
    .grey-100 { background-color: #f8f9fa; }
    .font-weight-bold { font-weight: 600; }
    code { font-family: monospace; padding: 2px 4px; background: #eee; border-radius: 4px; }
</style>
@endsection