@extends('layouts.dashboard')

@section('title', 'My Certificates & Credentials | AICDS')

@section('dashboard_content')

<div class="card p-4 border rounded-4 shadow-sm bg-white mb-4">
    <div class="d-flex justify-content-between align-items-center mb-3">
        <h5 class="fw-bold mb-0">My Earned Certificates</h5>
        <a href="{{ route('certificates.verify') }}" class="btn btn-sm btn-outline-primary rounded-pill">Verify Any Certificate</a>
    </div>

    @if($certificates->count() > 0)
        <div class="table-responsive">
            <table class="table table-hover align-middle mb-0">
                <thead class="table-light">
                    <tr>
                        <th>Certificate No</th>
                        <th>Title / Credential</th>
                        <th>Type</th>
                        <th>Issue Date</th>
                        <th>Status</th>
                        <th>Verification Code</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($certificates as $cert)
                        <tr>
                            <td><code>{{ $cert->certificate_number }}</code></td>
                            <td class="fw-bold text-dark">{{ $cert->title }}</td>
                            <td><span class="badge bg-secondary-subtle text-secondary text-uppercase">{{ str_replace('_', ' ', $cert->certificate_type) }}</span></td>
                            <td>{{ $cert->issue_date->format('M d, Y') }}</td>
                            <td>
                                <span class="badge {{ $cert->status === 'valid' ? 'bg-success' : 'bg-danger' }} text-uppercase">
                                    {{ $cert->status }}
                                </span>
                            </td>
                            <td><code class="text-primary">{{ $cert->verification_code }}</code></td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        <div class="mt-4">{{ $certificates->links() }}</div>
    @else
        <div class="text-center py-5">
            <i class="icofont-certificate display-4 text-muted mb-3 d-block"></i>
            <h5 class="fw-bold">No Certificates Issued Yet</h5>
            <p class="text-muted small">Certificates are automatically awarded upon verified completion of accredited AICDS workshops, conference presentations, or active membership tenure.</p>
        </div>
    @endif
</div>

@endsection