<!DOCTYPE html>
<html dir="rtl" lang="ar">
<head>
    <meta charset="UTF-8">
    <title>{{ __('شهادة حضور') }}</title>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body { font-family: 'Cairo', 'Noto Sans Arabic', sans-serif; direction: rtl; display: flex; justify-content: center; align-items: center; min-height: 100vh; background: #f0f0f0; padding: 20px; }
        .certificate { width: 800px; min-height: 560px; background: white; border: 8px solid #1e40af; border-radius: 4px; padding: 50px; text-align: center; position: relative; }
        .certificate::before { content: ''; position: absolute; inset: 8px; border: 2px solid #93c5fd; border-radius: 2px; pointer-events: none; }
        .logo { font-size: 16px; color: #64748b; margin-bottom: 10px; }
        h1 { font-size: 32px; color: #1e40af; margin-bottom: 5px; }
        .subtitle { font-size: 14px; color: #64748b; margin-bottom: 30px; }
        .recipient { font-size: 24px; font-weight: bold; color: #1e293b; margin-bottom: 10px; }
        .details { font-size: 14px; color: #475569; line-height: 2; margin-bottom: 25px; }
        .stats { display: flex; justify-content: center; gap: 40px; margin-bottom: 30px; }
        .stat { text-align: center; }
        .stat .value { font-size: 28px; font-weight: bold; color: #1e40af; }
        .stat .label { font-size: 12px; color: #64748b; }
        .footer { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 30px; padding-top: 20px; }
        .signature { text-align: center; }
        .signature .line { width: 150px; border-bottom: 1px solid #333; margin-bottom: 5px; }
        .signature .label { font-size: 11px; color: #64748b; }
        .date { font-size: 12px; color: #64748b; }
        .no-print { position: fixed; top: 20px; right: 20px; }
        @media print { body { background: white; padding: 0; } .no-print { display: none; } .certificate { border-width: 4px; } }
    </style>
</head>
<body>
    <div class="no-print">
        <button onclick="window.print()" style="padding: 8px 20px; background: #1e40af; color: white; border: none; border-radius: 6px; cursor: pointer; font-family: inherit;">{{ __('طباعة الشهادة') }}</button>
    </div>

    <div class="certificate">
        <p class="logo">{{ app()->bound('current_academy') ? app('current_academy')->name_ar : 'الكابتن' }}</p>
        <h1>{{ __('شهادة حضور') }}</h1>
        <p class="subtitle">{{ __('تشهد الأكاديمية بأن') }}</p>

        <p class="recipient">{{ $participant->full_name }}</p>

        <div class="details">
            <p>{{ __('قد أتم بنجاح حضور برنامج') }}</p>
            <p><strong>{{ $enrollment->trainingGroup?->program?->name_ar ?? '-' }}</strong></p>
            <p>{{ __('المجموعة') }}: {{ $enrollment->trainingGroup?->name_ar ?? '-' }}</p>
        </div>

        <div class="stats">
            <div class="stat">
                <p class="value">{{ $stats->total ?? 0 }}</p>
                <p class="label">{{ __('إجمالي الحصص') }}</p>
            </div>
            <div class="stat">
                <p class="value">{{ $stats->attended ?? 0 }}</p>
                <p class="label">{{ __('حصص الحضور') }}</p>
            </div>
            <div class="stat">
                <p class="value">{{ $rate }}%</p>
                <p class="label">{{ __('نسبة الحضور') }}</p>
            </div>
        </div>

        <div class="footer">
            <div class="signature">
                <div class="line"></div>
                <p class="label">{{ __('التوقيع') }}</p>
            </div>
            <div class="date">
                {{ __('تاريخ الإصدار') }}: {{ now()->format('Y-m-d') }}
            </div>
        </div>
    </div>
</body>
</html>
