@extends('layouts.admin')

@section('title', trans('admin.Dashboard'))
@section('page-title', trans('admin.Overview'))
@section('page-subtitle', trans('admin.instructor snapshot'))

@section('content')

<section class="dpage active">
    <div class="page-head">
        <div>
            <h2>{{ trans('admin.Welcome back') }}, {{ auth('user')->user()->name }} 👋</h2>
            <p>{{ trans('admin.instructor snapshot') }}</p>
        </div>
    </div>

    <div class="stat-grid">
        <div class="stat-card">
            <div class="stat-top">
                <div class="stat-ic" style="background:var(--primary-soft);color:var(--primary-ink);">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 5.5C4 4.7 4.7 4 5.5 4H16a4 4 0 014 4v12H7.5A3.5 3.5 0 014 16.5v-11z"/><path d="M4 16.5A3.5 3.5 0 017.5 20H20"/></svg>
                </div>
            </div>
            <div class="stat-val">{{ $stats['courses'] }}</div>
            <div class="stat-label">{{ trans('admin.My courses') }}</div>
        </div>
        <div class="stat-card">
            <div class="stat-top">
                <div class="stat-ic" style="background:var(--gold-soft);color:var(--gold-ink);">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M2 9l10-5 10 5-10 5-10-5z"/><path d="M6 11v5c0 1.7 2.7 3 6 3s6-1.3 6-3v-5"/><path d="M22 9v6"/></svg>
                </div>
            </div>
            <div class="stat-val">{{ $stats['students'] }}</div>
            <div class="stat-label">{{ trans('admin.Total students') }}</div>
        </div>
        <div class="stat-card">
            <div class="stat-top">
                <div class="stat-ic" style="background:var(--green-soft);color:var(--green);">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12l2 2 4-4"/><rect x="3" y="4" width="18" height="17" rx="2.5"/><path d="M3 9h18"/></svg>
                </div>
            </div>
            <div class="stat-val">{{ $stats['live_exams'] }} / {{ $stats['exams'] }}</div>
            <div class="stat-label">{{ trans('admin.Live exams') }}</div>
        </div>
        <div class="stat-card">
            <div class="stat-top">
                <div class="stat-ic" style="background:var(--red-soft);color:var(--coral);">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 3l7 3.5v5c0 4.6-3 8.4-7 9.5-4-1.1-7-4.9-7-9.5v-5L12 3z"/></svg>
                </div>
            </div>
            <div class="stat-val">{{ $stats['rating'] ? number_format($stats['rating'], 1) : '—' }}</div>
            <div class="stat-label">{{ trans('admin.Average rating') }}</div>
        </div>
    </div>

    <div class="stat-grid" style="margin-top:16px;">
        <div class="stat-card">
            <div class="stat-top">
                <div class="stat-ic" style="background:var(--primary-soft);color:var(--primary-ink);">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 1v22M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6"/></svg>
                </div>
            </div>
            <div class="stat-val">{{ number_format($stats['revenue'], 0) }}</div>
            <div class="stat-label">{{ trans('admin.Estimated revenue') }}</div>
        </div>
        <div class="stat-card">
            <div class="stat-top">
                <div class="stat-ic" style="background:var(--gold-soft);color:var(--gold-ink);">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 3"/></svg>
                </div>
            </div>
            <div class="stat-val">{{ $stats['pass_rate'] !== null ? $stats['pass_rate'] . '%' : '—' }}</div>
            <div class="stat-label">{{ trans('admin.Average pass rate') }}</div>
        </div>
    </div>

    <div class="two-col" style="margin-top:16px;">
        <div class="card">
            <div class="card-head">
                <div><h3>{{ trans('admin.Enrollments') }}</h3><div class="sub">{{ trans('admin.Last 6 months') }}</div></div>
            </div>
            <div class="chart-wrap">
                <svg viewBox="0 0 560 200" preserveAspectRatio="none">
                    <defs>
                        <linearGradient id="growthFill" x1="0" y1="0" x2="0" y2="1">
                            <stop offset="0%" stop-color="var(--primary)" stop-opacity="0.28"/>
                            <stop offset="100%" stop-color="var(--primary)" stop-opacity="0"/>
                        </linearGradient>
                    </defs>
                    <g stroke="var(--border)" stroke-width="1">
                        <line x1="0" y1="20" x2="560" y2="20"/><line x1="0" y1="70" x2="560" y2="70"/>
                        <line x1="0" y1="120" x2="560" y2="120"/><line x1="0" y1="170" x2="560" y2="170"/>
                    </g>
                    <polygon points="{{ $growthPoints }} 560,200 0,200" fill="url(#growthFill)"/>
                    <polyline points="{{ $growthPoints }}" fill="none" stroke="var(--primary)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
                </svg>
                <div class="chart-legend">
                    <div class="lg"><span class="dot" style="background:var(--primary);"></span> {{ trans('admin.Enrollments') }}</div>
                    @foreach($enrollmentGrowth as $point)
                        <span style="font-family:var(--font-mono);font-size:11px;color:var(--text-faint);margin-right:10px;">{{ $point['label'] }}: {{ $point['count'] }}</span>
                    @endforeach
                </div>
            </div>
        </div>

        <div class="card">
            <div class="card-head"><h3>{{ trans('admin.My latest courses') }}</h3><a href="{{ route('dashboard.courses.index') }}" class="btn btn-ghost btn-sm">{{ trans('admin.Show') }}</a></div>
            <div style="padding:8px 22px 18px;">
                @forelse($latestCourses as $course)
                    <div style="display:flex;align-items:center;gap:12px;padding:9px 0;">
                        @if($course->getImage())
                        <div class="cell-avatar" style="width:34px;height:34px;border-radius:8px;">
                            <img src="{{ $course->getImage() }}" alt="" style="width:100%;height:100%;object-fit:cover;border-radius:8px;">
                        </div>
                        @endif
                        <div style="flex:1;">
                            <b style="font-size:12.5px;">{{ $course->title }}</b>
                            <div style="font-size:11px;color:var(--text-faint);">{{ $course->students_count }} {{ trans('admin.Students') }} · {{ $course->ratings_avg_rating ? '★ ' . number_format($course->ratings_avg_rating, 1) : '—' }}</div>
                        </div>
                        @if($course->status === 'published')
                            <span class="pill pill-green">{{ trans('admin.Published') }}</span>
                        @else
                            <span class="pill pill-muted">{{ trans('admin.Draft') }}</span>
                        @endif
                    </div>
                @empty
                    <div class="empty-state"><div class="ic">🎓</div><b>{{ trans('admin.No courses yet') }}</b></div>
                @endforelse
            </div>
        </div>
    </div>

    <div class="two-col" style="margin-top:16px;">
        <div class="card">
            <div class="card-head"><h3>{{ trans('admin.Latest exam results') }}</h3></div>
            <div class="table-wrap">
                @if($latestResults->isEmpty())
                    <div class="empty-state"><div class="ic">📝</div><b>{{ trans('admin.No exam results yet') }}</b></div>
                @else
                    <table class="dtable">
                        <thead><tr><th>{{ trans('admin.Student') }}</th><th>{{ trans('admin.Exam') }}</th><th>{{ trans('admin.Score') }}</th></tr></thead>
                        <tbody>
                        @foreach($latestResults as $result)
                            <tr>
                                <td><b>{{ $result->student->user->name ?? '—' }}</b></td>
                                <td>{{ $result->exam->title ?? '—' }}</td>
                                <td>{{ $result->score }}%</td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                @endif
            </div>
        </div>
    </div>
</section>

@endsection