@extends('portal.layouts.master')
@section('title', 'KYC Documents')
@section('page-title', 'KYC Documents')

@section('content')
<div class="row g-3">

    {{-- Upload form --}}
    <div class="col-md-4">
        <div class="card border-0 shadow-sm" style="border-radius:12px">
            <div class="card-body">
                <h6 class="fw-semibold mb-3">Upload Document</h6>
                <form action="{{ route('portal.kyc.upload') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    @if($errors->any())
                        <div class="alert alert-danger py-2 mb-3" style="font-size:.83rem">
                            {{ $errors->first() }}
                        </div>
                    @endif
                    <div class="mb-3">
                        <label class="form-label" style="font-size:.85rem;font-weight:500">Document Type</label>
                        <select name="document_type" class="form-select" required>
                            <option value="">-- Select --</option>
                            <option value="passport">Passport</option>
                            <option value="id_card">ID Card</option>
                            <option value="drivers_license">Driver's License</option>
                            <option value="utility_bill">Utility Bill</option>
                            <option value="bank_statement">Bank Statement</option>
                            <option value="selfie">Selfie</option>
                        </select>
                    </div>
                    <div class="mb-3">
                        <label class="form-label" style="font-size:.85rem;font-weight:500">File</label>
                        <input type="file" name="document_file" class="form-control" required accept=".jpg,.jpeg,.png,.pdf">
                        <div class="form-text">JPG, PNG or PDF. Max 10MB.</div>
                    </div>
                    <button type="submit" class="btn btn-primary w-100" style="border-radius:8px">
                        <i class="fa fa-upload me-1"></i> Upload
                    </button>
                </form>
            </div>
        </div>

        <div class="card border-0 shadow-sm mt-3" style="border-radius:12px">
            <div class="card-body">
                <h6 class="fw-semibold mb-2">Required Documents</h6>
                <ul style="font-size:.83rem;color:#374151;padding-left:1.2rem;margin-bottom:0">
                    <li>Government-issued photo ID <em>(passport, ID card, or driver's license)</em></li>
                    <li>Proof of address <em>(utility bill or bank statement, dated within 3 months)</em></li>
                    <li>Selfie holding your ID</li>
                </ul>
            </div>
        </div>
    </div>

    {{-- Documents list --}}
    <div class="col-md-8">
        <div class="card border-0 shadow-sm" style="border-radius:12px">
            <div class="card-body">
                <h6 class="fw-semibold mb-3">Submitted Documents</h6>
                @if($documents->isEmpty())
                    <p class="text-muted" style="font-size:.9rem">No documents uploaded yet.</p>
                @else
                <div class="table-responsive">
                    <table class="table table-sm">
                        <thead>
                            <tr style="font-size:.78rem;text-transform:uppercase;color:#6b7280">
                                <th>Type</th>
                                <th>Status</th>
                                <th>Submitted</th>
                                <th>Notes</th>
                            </tr>
                        </thead>
                        <tbody>
                        @php $colors = ['pending'=>'warning','under_review'=>'info','approved'=>'success','rejected'=>'danger']; @endphp
                        @foreach($documents as $doc)
                        <tr style="font-size:.88rem">
                            <td class="fw-semibold">{{ ucwords(str_replace('_',' ',$doc->document_type)) }}</td>
                            <td>
                                <span class="badge bg-{{ $colors[$doc->status] ?? 'secondary' }}">
                                    {{ ucwords(str_replace('_',' ',$doc->status)) }}
                                </span>
                            </td>
                            <td class="text-muted">{{ $doc->created_at->format('Y-m-d') }}</td>
                            <td>
                                @if($doc->status === 'rejected' && $doc->rejection_reason)
                                    <span class="text-danger" style="font-size:.8rem">{{ $doc->rejection_reason }}</span>
                                @elseif($doc->status === 'approved')
                                    <span class="text-success" style="font-size:.8rem">Verified</span>
                                @else
                                    <span class="text-muted" style="font-size:.8rem">Under review</span>
                                @endif
                            </td>
                        </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
                @endif
            </div>
        </div>
    </div>

</div>
@endsection