{{-- Classic Theme: Traditional header bar, clean white body (SW, Alshhabi) --}}
<div style="direction:rtl;background:#f0f2f5;padding:40px 0;font-family:'Tahoma','Arial',sans-serif;text-align:right">
    <div
        style="max-width:560px;margin:auto;background:#ffffff;border-radius:8px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,0.08)">

        {{-- Header --}}
        <div style="background:{{ $primaryColor }};padding:22px 28px;text-align:center">
            <h1 style="margin:0;font-size:22px;font-weight:700;color:#ffffff;letter-spacing:0.5px">{{ $siteName }}
            </h1>
        </div>

        {{-- Subject bar --}}
        <div style="background:{{ $primaryDark }};padding:12px 28px">
            <h2 style="margin:0;font-size:16px;font-weight:600;color:rgba(255,255,255,0.9)">{{ $subjectLine }}</h2>
        </div>

        {{-- Body --}}
        <div style="padding:32px 28px 16px">
            <p style="margin:0 0 18px;font-size:15px;line-height:1.8;color:#333">{{ $introLine }}</p>

            {{-- Code box --}}
            <div style="text-align:center;margin:28px 0 32px">
                <div
                    style="display:inline-block;background:#1e293b;color:#fff;font-size:30px;letter-spacing:10px;padding:18px 32px;border-radius:8px;font-weight:700;font-family:'Courier New',monospace">
                    {{ $code }}</div>
                <div style="margin-top:14px;font-size:12px;color:#888">⏳ الكود صالح لمدة 5 دقائق</div>
            </div>

            @if (!empty($activationUrl))
                <div style="margin:10px 0 32px;text-align:center">
                    <a href="{{ $activationUrl }}" target="_blank"
                        style="background:{{ $secondaryColor }};color:#fff;text-decoration:none;padding:14px 32px;border-radius:6px;display:inline-block;font-size:15px;font-weight:600">
                        تفعيل الحساب الآن
                    </a>
                    <div style="margin-top:14px;font-size:11px;color:#666">
                        أو انسخ الرابط:
                        <span
                            style="direction:ltr;display:block;margin-top:4px;color:{{ $primaryColor }};word-break:break-all;font-size:10px">{{ $activationUrl }}</span>
                    </div>
                </div>
            @endif

            <hr style="border:none;border-top:1px solid #e5e7eb;margin:12px 0 18px">
            <p style="font-size:12px;color:#999;margin:0;line-height:1.6">هذه رسالة آلية. إذا لم تطلب هذا الكود، يمكنك
                تجاهل الرسالة.</p>
        </div>

        {{-- Footer --}}
        <div style="padding:16px 28px;text-align:center;background:#fafbfc;border-top:1px solid #f0f1f3">
            <p style="margin:0;font-size:11px;color:#94a3b8">© {{ date('Y') }} {{ $siteName }}. جميع الحقوق
                محفوظة.</p>
        </div>
    </div>
</div>