<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
    <meta charset="UTF-8">
    <title>شهادة موزع معتمد - {{ $license->buyer_name }}</title>
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800;900&family=Amiri:wght@400;700&display=swap');
        * { margin: 0; padding: 0; box-sizing: border-box; }
        @page { size: A4 landscape; margin: 0; }
        body {
            font-family: 'Cairo', sans-serif;
            background: #fff;
            display: flex; flex-direction: column;
            justify-content: center; align-items: center;
            min-height: 100vh; padding: 20px;
        }
        @media print {
            body { padding: 0; }
            .no-print { display: none !important; }
            .certificate-wrapper { box-shadow: none; }
        }
        @media screen {
            body { background: #f0f0f0; }
            .certificate-wrapper { box-shadow: 0 10px 40px rgba(0,0,0,0.2); }
        }
        .certificate-wrapper {
            width: 1050px; height: 740px; position: relative;
            background: #fff;
        }
        .certificate-frame {
            position: absolute; top: 12px; left: 12px; right: 12px; bottom: 12px;
            border: 3px solid #c9a84c; padding: 8px;
        }
        .certificate-inner {
            border: 1.5px solid #c9a84c; width: 100%; height: 100%;
            position: relative; overflow: hidden;
        }
        .corner { position: absolute; width: 80px; height: 80px; border: 2px solid #c9a84c; }
        .corner-tl { top: 8px; left: 8px; border-right: none; border-bottom: none; }
        .corner-tr { top: 8px; right: 8px; border-left: none; border-bottom: none; }
        .corner-bl { bottom: 8px; left: 8px; border-right: none; border-top: none; }
        .corner-br { bottom: 8px; right: 8px; border-left: none; border-top: none; }
        .watermark {
            position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
            font-size: 120px; font-weight: 900; color: rgba(201,168,76,0.06);
            letter-spacing: 10px; white-space: nowrap; pointer-events: none; z-index: 0;
        }
        .certificate-content {
            position: relative; z-index: 1; text-align: center;
            padding: 30px 50px 20px; height: 100%;
            display: flex; flex-direction: column; justify-content: space-between;
        }
        .cert-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
        .cert-logo { font-size: 1.3em; font-weight: 900; color: #1a1a2e; letter-spacing: 1px; }
        .cert-number { font-size: 0.8em; color: #888; direction: ltr; font-family: monospace; }
        .cert-title-area { margin-bottom: 5px; }
        .cert-badge {
            display: inline-block; background: linear-gradient(135deg, #c9a84c, #e8d490, #c9a84c);
            color: #1a1a2e; font-size: 0.75em; font-weight: 700;
            padding: 4px 25px; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 8px;
        }
        .cert-main-title { font-family: 'Amiri', serif; font-size: 2.5em; font-weight: 700; color: #1a1a2e; margin: 5px 0; line-height: 1.2; }
        .cert-subtitle { font-size: 1em; color: #555; font-weight: 600; }
        .gold-line { width: 200px; height: 2px; background: linear-gradient(90deg, transparent, #c9a84c, transparent); margin: 10px auto; }
        .cert-name-section { margin: 5px 0; }
        .cert-presented { font-size: 0.95em; color: #666; margin-bottom: 5px; }
        .cert-name {
            font-family: 'Amiri', serif; font-size: 2.2em; font-weight: 700; color: #c9a84c;
            border-bottom: 2px solid #c9a84c; display: inline-block; padding: 0 40px 5px; min-width: 350px;
        }
        .cert-email { font-size: 0.85em; color: #888; margin-top: 5px; direction: ltr; }
        .cert-description { font-size: 0.9em; color: #444; line-height: 1.7; max-width: 700px; margin: 8px auto; }
        .cert-details { display: flex; justify-content: center; gap: 40px; margin: 8px 0; }
        .cert-detail-item { text-align: center; }
        .cert-detail-label { font-size: 0.7em; color: #999; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 2px; }
        .cert-detail-value { font-size: 0.85em; font-weight: 700; color: #1a1a2e; direction: ltr; }
        .cert-footer { display: flex; justify-content: space-between; align-items: flex-end; padding: 0 30px; }
        .cert-seal {
            width: 90px; height: 90px; border: 3px solid #c9a84c; border-radius: 50%;
            display: flex; flex-direction: column; align-items: center; justify-content: center;
            background: rgba(201,168,76,0.05);
        }
        .cert-seal-icon { font-size: 28px; margin-bottom: 2px; }
        .cert-seal-text { font-size: 0.55em; font-weight: 800; color: #c9a84c; letter-spacing: 1px; }
        .cert-signature { text-align: center; }
        .cert-sig-line { width: 180px; border-bottom: 1.5px solid #333; margin-bottom: 5px; }
        .cert-sig-label { font-size: 0.75em; color: #666; }
        .cert-qr-area { text-align: center; }
        .cert-verify-code { font-family: monospace; font-size: 0.7em; color: #999; direction: ltr; margin-top: 3px; letter-spacing: 1px; }
        .cert-verify-url { font-size: 0.65em; color: #aaa; direction: ltr; }
        .action-bar {
            display: flex; gap: 12px; justify-content: center; margin-bottom: 20px;
        }
        .action-bar a, .action-bar button {
            padding: 10px 30px; border: none; border-radius: 5px;
            font-size: 1em; font-weight: 700; cursor: pointer;
            font-family: 'Cairo', sans-serif; text-decoration: none; display: inline-block;
        }
        .btn-gold { background: #c9a84c; color: #fff; }
        .btn-gray { background: #666; color: #fff; }
        .btn-gold:hover, .btn-gray:hover { opacity: 0.9; }
    </style>
</head>
<body>

<div class="action-bar no-print">
    <button class="btn-gold" onclick="window.print()">طباعة / حفظ PDF</button>
    <a class="btn-gray" href="/admin/certificate/{{ $license->id }}">رجوع للمعاينة</a>
</div>

<div class="certificate-wrapper">
    <div class="certificate-frame">
        <div class="certificate-inner">
            <div class="corner corner-tl"></div>
            <div class="corner corner-tr"></div>
            <div class="corner corner-bl"></div>
            <div class="corner corner-br"></div>
            <div class="watermark">AUTHORIZED</div>

            <div class="certificate-content">
                <div class="cert-header">
                    <div class="cert-logo">{{ $certSettings['cert_company_name'] ?? $siteName ?? 'سكريبت كلمات الأغاني' }}</div>
                    <div class="cert-number">CERT-{{ str_pad($license->id, 5, '0', STR_PAD_LEFT) }}</div>
                </div>
                <div class="cert-title-area">
                    <div class="cert-badge">{{ $certSettings['cert_badge_text'] ?? 'AUTHORIZED RESELLER' }}</div>
                    <div class="cert-main-title">{{ $certSettings['cert_title'] ?? 'شهادة موزع معتمد' }}</div>
                    <div class="cert-subtitle">{{ $certSettings['cert_subtitle'] ?? 'Authorized Reseller Certificate' }}</div>
                </div>
                <div class="gold-line"></div>
                <div class="cert-name-section">
                    <div class="cert-presented">{{ $certSettings['cert_presented_text'] ?? 'تشهد هذه الوثيقة أن' }}</div>
                    <div class="cert-name">{{ $license->buyer_name }}</div>
                    <div class="cert-email">{{ $license->buyer_email }}</div>
                </div>
                <div class="cert-description">
                    {{ $certSettings['cert_description'] ?? 'موزع معتمد ومرخّص لإعادة بيع وتوزيع المنتج، وله كامل الصلاحيات في تعديل وتخصيص المنتج وإعادة تسميته بعلامته التجارية، وفقاً لشروط وأحكام اتفاقية الترخيص.' }}
                </div>
                <div class="cert-details">
                    <div class="cert-detail-item">
                        <div class="cert-detail-label">رقم الترخيص</div>
                        <div class="cert-detail-value">{{ $license->license_key }}</div>
                    </div>
                    <div class="cert-detail-item">
                        <div class="cert-detail-label">تاريخ الإصدار</div>
                        <div class="cert-detail-value">{{ $license->activated_at ? \Carbon\Carbon::parse($license->activated_at)->format('Y-m-d') : \Carbon\Carbon::parse($license->created_at)->format('Y-m-d') }}</div>
                    </div>
                    <div class="cert-detail-item">
                        <div class="cert-detail-label">تاريخ الانتهاء</div>
                        <div class="cert-detail-value">{{ $license->expires_at ? \Carbon\Carbon::parse($license->expires_at)->format('Y-m-d') : 'غير محدد (مدى الحياة)' }}</div>
                    </div>
                    @if($license->domain)
                    <div class="cert-detail-item">
                        <div class="cert-detail-label">الدومين</div>
                        <div class="cert-detail-value">{{ $license->domain }}</div>
                    </div>
                    @endif
                </div>
                <div class="gold-line"></div>
                <div class="cert-footer">
                    <div class="cert-seal">
                        <div class="cert-seal-icon">★</div>
                        <div class="cert-seal-text">{{ $certSettings['cert_seal_text_1'] ?? 'معتمد' }}</div>
                        <div class="cert-seal-text">{{ $certSettings['cert_seal_text_2'] ?? 'VERIFIED' }}</div>
                    </div>
                    <div class="cert-signature">
                        <div class="cert-sig-line"></div>
                        <div class="cert-sig-label">{{ $certSettings['cert_signature_label'] ?? 'التوقيع والختم' }}</div>
                    </div>
                    <div class="cert-qr-area">
                        <div class="cert-verify-code">{{ strtoupper(substr(md5($license->license_key . $license->id), 0, 12)) }}</div>
                        <div class="cert-verify-url">رمز التحقق من الشهادة</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
</html>
