@extends('admin.layout')
@section('title', $student->name)
@section('page-title', $student->name . ' — ' . $student->student_id)

@section('content')
@php
$stageKeys = array_keys($stages);
$currentIdx = array_search($student->current_stage, $stageKeys);
@endphp

<!-- Header bar -->
<div style="display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap;">
    <a href="{{ route('admin.students') }}" class="btn btn-outline btn-sm"><i class="fas fa-arrow-left"></i> Back</a>
    <span class="badge badge-blue" style="font-size:13px;">{{ $student->course }}</span>
    @php $si = $student->stageInfo(); @endphp
    <span class="badge" style="background:{{ $si['color'] }}20;color:{{ $si['color'] }};font-size:13px;">
        <i class="fas {{ $si['icon'] }}"></i> {{ $si['label'] }}
    </span>
    @if($student->batch)
    <span class="badge badge-gray">{{ $student->batch }}</span>
    @endif
    <a href="{{ route('admin.student.edit',$student) }}" class="btn btn-outline btn-sm" style="margin-left:auto;"><i class="fas fa-edit"></i> Edit</a>
    <form method="POST" action="{{ route('admin.student.delete',$student) }}" onsubmit="return confirm('Delete this student?')">
        @csrf @method('DELETE')
        <button type="submit" class="btn btn-sm" style="background:#fef2f2;color:#dc2626;border:1px solid #fecaca;"><i class="fas fa-trash"></i></button>
    </form>
</div>

<!-- Stage Progress Bar -->
<div class="card" style="margin-bottom:18px;">
    <div class="card-body" style="padding:16px 20px;">
        <div style="font-size:12px;font-weight:600;color:#64748b;margin-bottom:10px;">Journey Progress</div>
        <div class="stage-bar">
            @foreach($stageKeys as $i => $key)
            <div class="stage-pip {{ $i < $currentIdx ? 'done' : ($i == $currentIdx ? 'current' : '') }}" title="{{ $stages[$key]['label'] }}"></div>
            @endforeach
        </div>
        <div style="display:flex;justify-content:space-between;font-size:11px;color:#94a3b8;margin-top:6px;">
            <span>Enquiry</span><span>{{ $si['label'] }}</span><span>Japan 🎌</span>
        </div>
    </div>
</div>

<div style="display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px;">
    <!-- Left column -->
    <div style="display:flex;flex-direction:column;gap:18px;">
        <!-- Profile -->
        <div class="card">
            <div class="card-header"><h3><i class="fas fa-user" style="color:var(--red);margin-right:8px;"></i>Profile</h3></div>
            <div class="card-body">
                @foreach([['fas fa-id-card','Student ID',$student->student_id],['fas fa-envelope','Email',$student->email],['fas fa-phone','Phone',$student->phone],['fas fa-birthday-cake','DOB',$student->dob?->format('d M Y')],['fas fa-user','Father',$student->father_name],['fas fa-graduation-cap','Education',$student->education],['fas fa-map-marker-alt','Location',trim(($student->city??'').', '.($student->state??''),', ')]] as $row)
                <div style="display:flex;gap:10px;padding:8px 0;border-bottom:1px solid #f1f5f9;font-size:13px;">
                    <i class="fas {{ $row[0] }}" style="color:var(--red);width:16px;margin-top:2px;flex-shrink:0;"></i>
                    <span style="color:#64748b;width:90px;flex-shrink:0;">{{ $row[1] }}</span>
                    <span style="color:#0f172a;font-weight:500;">{{ $row[2] ?: '—' }}</span>
                </div>
                @endforeach
            </div>
        </div>

        <!-- Update Stage -->
        <div class="card">
            <div class="card-header"><h3><i class="fas fa-route" style="color:var(--red);margin-right:8px;"></i>Update Stage</h3></div>
            <div class="card-body">
                <form method="POST" action="{{ route('admin.student.stage',$student) }}">
                    @csrf
                    <div class="form-group" style="margin-bottom:10px;"><label>New Stage</label>
                        <select name="stage">
                            @foreach($stages as $k => $v)
                            <option value="{{ $k }}" {{ $student->current_stage==$k?'selected':'' }}>{{ $v['label'] }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group" style="margin-bottom:10px;"><label>Note (optional)</label>
                        <input name="notes" placeholder="e.g. Documents received today">
                    </div>
                    <button type="submit" class="btn btn-primary btn-sm"><i class="fas fa-check"></i> Update Stage</button>
                </form>
            </div>
        </div>

        <!-- Fee Management -->
        <div class="card">
            <div class="card-header">
                <h3><i class="fas fa-rupee-sign" style="color:var(--red);margin-right:8px;"></i>Fees</h3>
                <button onclick="document.getElementById('feeModal').classList.add('open')" class="btn btn-primary btn-sm"><i class="fas fa-plus"></i> Add</button>
            </div>
            <div class="card-body" style="padding:0;">
                @forelse($student->fees as $fee)
                <div style="display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #f1f5f9;font-size:13px;">
                    <div>
                        <div style="font-weight:600;color:#0f172a;">₹{{ number_format($fee->amount) }} — {{ ucfirst($fee->type) }}</div>
                        <div style="font-size:11px;color:#94a3b8;">Due: {{ $fee->due_date?->format('d M Y') ?? '—' }}</div>
                    </div>
                    <div style="display:flex;align-items:center;gap:8px;">
                        <span class="badge {{ $fee->status=='paid'?'badge-green':($fee->status=='partial'?'badge-yellow':'badge-red') }}">{{ ucfirst($fee->status) }}</span>
                        @if($fee->status !== 'paid')
                        <form method="POST" action="{{ route('admin.fee.update',$fee) }}">
                            @csrf @method('PUT')
                            <input type="hidden" name="status" value="paid">
                            <input type="hidden" name="paid_date" value="{{ date('Y-m-d') }}">
                            <button type="submit" class="btn btn-sm" style="background:#dcfce7;color:#15803d;border:none;padding:4px 10px;font-size:11px;">Mark Paid</button>
                        </form>
                        @endif
                    </div>
                </div>
                @empty
                <div style="padding:20px;text-align:center;color:#94a3b8;font-size:13px;">No fee records.</div>
                @endforelse
            </div>
        </div>
    </div>

    <!-- Right column -->
    <div style="display:flex;flex-direction:column;gap:18px;">
        <!-- Document Checklist -->
        <div class="card">
            <div class="card-header">
                <h3><i class="fas fa-folder-open" style="color:var(--red);margin-right:8px;"></i>Documents</h3>
                <button onclick="document.getElementById('docModal').classList.add('open')" class="btn btn-primary btn-sm"><i class="fas fa-upload"></i> Upload</button>
            </div>
            <div class="card-body" style="padding:0;">
                @php
                $uploadedDocs = $student->documents->keyBy('doc_type');
                @endphp
                @foreach($docLabels as $type => $label)
                @php $doc = $uploadedDocs->get($type); @endphp
                <div style="display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid #f1f5f9;font-size:13px;">
                    <div style="display:flex;align-items:center;gap:8px;">
                        <i class="fas {{ $doc ? 'fa-check-circle' : 'fa-circle' }}" style="color:{{ $doc ? ($doc->status=='verified'?'#22c55e':'#f59e0b') : '#e2e8f0' }};"></i>
                        <span style="color:#374151;">{{ $label }}</span>
                    </div>
                    @if($doc)
                    <div style="display:flex;align-items:center;gap:6px;">
                        <span class="badge {{ $doc->status=='verified'?'badge-green':($doc->status=='rejected'?'badge-red':'badge-yellow') }}">{{ ucfirst($doc->status) }}</span>
                        <a href="{{ asset('uploads/documents/'.$doc->filename) }}" target="_blank" class="btn btn-outline btn-sm btn-icon" title="View"><i class="fas fa-eye"></i></a>
                        @if($doc->status !== 'verified')
                        <form method="POST" action="{{ route('admin.doc.verify',$doc) }}" style="display:inline;">
                            @csrf @method('PUT')
                            <input type="hidden" name="status" value="verified">
                            <button type="submit" class="btn btn-sm" style="background:#dcfce7;color:#15803d;border:none;padding:4px 8px;font-size:11px;">Verify</button>
                        </form>
                        @endif
                    </div>
                    @else
                    <span style="font-size:11px;color:#cbd5e1;">Not uploaded</span>
                    @endif
                </div>
                @endforeach
            </div>
        </div>

        <!-- Activity Timeline -->
        <div class="card">
            <div class="card-header"><h3><i class="fas fa-history" style="color:var(--red);margin-right:8px;"></i>Activity Timeline</h3></div>
            <div class="card-body" style="padding:0 16px;">
                <div class="pipeline">
                    @forelse($student->pipeline as $p)
                    @php $psi = \App\Models\Student::stages()[$p->stage] ?? ['label'=>$p->stage,'icon'=>'fa-circle','color'=>'#94a3b8']; @endphp
                    <div class="pipeline-item">
                        <div class="pipeline-dot" style="background:{{ $psi['color'] }};"><i class="fas {{ $psi['icon'] }}" style="font-size:11px;"></i></div>
                        <div class="pipeline-text">
                            <div class="stage">{{ $psi['label'] }}</div>
                            @if($p->notes)<div class="note">{{ $p->notes }}</div>@endif
                            <div class="meta">{{ $p->completed_at?->format('d M Y, h:i A') }} {{ $p->updatedBy ? '· by '.$p->updatedBy->name : '' }}</div>
                        </div>
                    </div>
                    @empty
                    <div style="padding:16px 0;color:#94a3b8;font-size:13px;">No activity recorded.</div>
                    @endforelse
                </div>
            </div>
        </div>

        <!-- Test Performance -->
        <div class="card">
            <div class="card-header"><h3><i class="fas fa-chart-bar" style="color:var(--red);margin-right:8px;"></i>Test Performance</h3></div>
            <div class="card-body" style="padding:0;">
                @forelse($student->testResults as $r)
                <div style="display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid #f1f5f9;font-size:13px;">
                    <div>
                        <div style="font-weight:600;color:#0f172a;">{{ $r->test?->title }}</div>
                        <div style="font-size:11px;color:#94a3b8;">{{ $r->test?->test_date?->format('d M Y') }}</div>
                    </div>
                    <div style="text-align:right;">
                        @if($r->marks_obtained !== null)
                        <div style="font-size:18px;font-weight:900;color:{{ $r->percentage()>=60?'#22c55e':'#dc2626' }};">{{ $r->marks_obtained }}/{{ $r->test?->total_marks }}</div>
                        <div style="font-size:11px;color:#94a3b8;">{{ $r->percentage() }}%</div>
                        @else
                        <span class="badge badge-gray">Pending</span>
                        @endif
                    </div>
                </div>
                @empty
                <div style="padding:20px;text-align:center;color:#94a3b8;font-size:13px;">No tests recorded.</div>
                @endforelse
            </div>
        </div>
    </div>
</div>

<!-- Fee Modal -->
<div class="modal-backdrop" id="feeModal" onclick="if(event.target==this)this.classList.remove('open')">
    <div class="modal">
        <h3><i class="fas fa-rupee-sign" style="color:var(--red);margin-right:8px;"></i>Add Fee Record</h3>
        <form method="POST" action="{{ route('admin.student.fee.add',$student) }}">
            @csrf
            <div class="form-grid form-grid-2">
                <div class="form-group"><label>Amount (₹) *</label><input type="number" name="amount" required></div>
                <div class="form-group"><label>Type</label>
                    <select name="type">
                        @foreach(['admission'=>'Admission Fee','monthly'=>'Monthly Fee','exam'=>'Exam Fee','visa'=>'Visa Fee','other'=>'Other'] as $k=>$v)
                        <option value="{{ $k }}">{{ $v }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group"><label>Status</label>
                    <select name="status">
                        <option value="pending">Pending</option>
                        <option value="paid">Paid</option>
                        <option value="partial">Partial</option>
                    </select>
                </div>
                <div class="form-group"><label>Payment Mode</label>
                    <select name="payment_mode">
                        <option value="">Select</option>
                        @foreach(['cash'=>'Cash','upi'=>'UPI','bank'=>'Bank Transfer','online'=>'Online'] as $k=>$v)
                        <option value="{{ $k }}">{{ $v }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group"><label>Due Date</label><input type="date" name="due_date"></div>
                <div class="form-group"><label>Paid Date</label><input type="date" name="paid_date"></div>
                <div class="form-group"><label>Receipt No.</label><input name="receipt_no"></div>
                <div class="form-group"><label>Notes</label><input name="notes"></div>
            </div>
            <div style="display:flex;gap:10px;margin-top:16px;">
                <button type="submit" class="btn btn-primary"><i class="fas fa-save"></i> Save</button>
                <button type="button" onclick="document.getElementById('feeModal').classList.remove('open')" class="btn btn-outline">Cancel</button>
            </div>
        </form>
    </div>
</div>

<!-- Document Upload Modal -->
<div class="modal-backdrop" id="docModal" onclick="if(event.target==this)this.classList.remove('open')">
    <div class="modal">
        <h3><i class="fas fa-upload" style="color:var(--red);margin-right:8px;"></i>Upload Document</h3>
        <form method="POST" action="{{ route('admin.student.doc.upload',$student) }}" enctype="multipart/form-data">
            @csrf
            <div class="form-grid" style="gap:14px;">
                <div class="form-group"><label>Document Type *</label>
                    <select name="doc_type" required>
                        @foreach($docLabels as $k=>$v)
                        <option value="{{ $k }}">{{ $v }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group"><label>File * (max 10MB)</label><input type="file" name="file" required></div>
                <div class="form-group"><label>Remarks</label><input name="remarks" placeholder="Optional note"></div>
            </div>
            <div style="display:flex;gap:10px;margin-top:16px;">
                <button type="submit" class="btn btn-primary"><i class="fas fa-upload"></i> Upload</button>
                <button type="button" onclick="document.getElementById('docModal').classList.remove('open')" class="btn btn-outline">Cancel</button>
            </div>
        </form>
    </div>
</div>
@endsection