Fix invoice print for tablets/phones: open dedicated print page instead of window.print()

- Registration wizard now opens /invoices/{uuid}/print in new tab instead of printing whole page
- Print view redesigned: mobile-responsive layout, touch-friendly 48px buttons, proper viewport
- Share button (Web Share API) shows on mobile devices that support it
- Print-receipt-button component changed from window.open popup to target=_blank link
- Added min-height 48px to all action buttons for touch accessibility
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

resources/views/components/ui/print-receipt-button.blade.php

-@props(['route', 'size' => 'md'])
+@props(['route', 'size' => 'md', 'label' => null])
 
 @php
     $sizeClasses = match($size) {
-        'sm' => 'px-3 py-2 text-sm gap-1.5',
-        'lg' => 'px-6 py-3 text-base gap-2.5',
-        default => 'px-4 py-2.5 text-sm gap-2',
+        'sm' => 'px-3 py-2 text-sm gap-1.5 min-h-[36px]',
+        'lg' => 'px-6 py-3 text-base gap-2.5 min-h-[48px]',
+        default => 'px-4 py-2.5 text-sm gap-2 min-h-[44px]',
     };
 @endphp
 
-<button
-    type="button"
-    x-data
-    @click="
-        const win = window.open('{{ $route }}', '_blank', 'width=350,height=600,scrollbars=yes,resizable=yes');
-        if (win) {
-            win.focus();
-        }
-    "
-    {{ $attributes->merge(['class' => "inline-flex items-center justify-center {$sizeClasses} bg-green-600 text-white rounded-lg font-medium hover:bg-green-700 active:bg-green-800 active:scale-[0.97] focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2 transition-all"]) }}
+<a
+    href="{{ $route }}"
+    target="_blank"
+    {{ $attributes->merge(['class' => "inline-flex items-center justify-center {$sizeClasses} bg-green-600 text-white rounded-lg font-medium hover:bg-green-700 active:bg-green-800 active:scale-[0.97] focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2 transition-all no-underline"]) }}
 >
     <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z"/>
     </svg>
-    {{ __('طباعة الإيصال') }}
-</button>
+    {{ $label ?? __('طباعة الإيصال') }}
+</a>

resources/views/livewire/receptionist/new-registration-wizard.blade.php

 <div>
-    <style>
-        @media print {
-            nav, aside, .sidebar, header, [data-topbar], .print\:hidden { display: none !important; }
-            main { margin: 0 !important; padding: 0 !important; width: 100% !important; }
-            body { background: white !important; }
-            #printable-invoice { border: none !important; box-shadow: none !important; border-radius: 0 !important; padding: 0 !important; max-width: 100% !important; }
-        }
-    </style>
 
     {{-- Header --}}
     <div class="flex items-center justify-between mb-6 print:hidden">
@@ -946,20 +938,20 @@ class="inline-flex items-center gap-2 px-8 py-3 min-h-16 bg-green-600 text-white
             </div>
 
             {{-- Actions --}}
-            <div class="flex items-center justify-center gap-4 mt-6 print:hidden">
-                <button onclick="window.print()"
-                        class="inline-flex items-center gap-2 px-6 py-3 bg-gray-800 text-white rounded-lg hover:bg-gray-900 text-base font-medium transition-colors">
+            <div class="flex flex-col sm:flex-row items-stretch sm:items-center justify-center gap-3 mt-6 print:hidden">
+                <a href="{{ route('invoices.print', $invoice_uuid) }}" target="_blank"
+                   class="inline-flex items-center justify-center gap-2 px-6 py-3 min-h-[48px] bg-gray-800 text-white rounded-lg hover:bg-gray-900 active:bg-gray-950 text-base font-medium transition-colors">
                     <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z"/>
                     </svg>
                     {{ __('طباعة الفاتورة') }}
-                </button>
+                </a>
                 <a href="{{ route('receptionist.new-registration') }}" wire:navigate
-                   class="inline-flex items-center gap-2 px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-base font-medium transition-colors">
+                   class="inline-flex items-center justify-center gap-2 px-6 py-3 min-h-[48px] bg-blue-600 text-white rounded-lg hover:bg-blue-700 active:bg-blue-800 text-base font-medium transition-colors">
                     {{ __('تسجيل آخر') }}
                 </a>
                 <a href="{{ route('receptionist.dashboard') }}" wire:navigate
-                   class="inline-flex items-center gap-2 px-6 py-3 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-base font-medium transition-colors">
+                   class="inline-flex items-center justify-center gap-2 px-6 py-3 min-h-[48px] bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 active:bg-gray-300 text-base font-medium transition-colors">
                     {{ __('العودة للاستقبال') }}
                 </a>
             </div>

resources/views/print/invoice.blade.php

@@ -2,6 +2,7 @@
 <html dir="rtl" lang="ar">
 <head>
     <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>{{ __('فاتورة') }} - {{ $invoice->number }}</title>
     @php
         $branding = app(\App\Domain\Shared\Services\SettingsService::class);
@@ -11,183 +12,319 @@
         $academyName = app()->bound('current_academy') ? app('current_academy')->name_ar : 'الكابتن';
         $branch = \App\Domain\Identity\Models\Branch::where('academy_id', app('current_academy')?->id)->first();
     @endphp
+    <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&display=swap" rel="stylesheet">
     <style>
         * { margin: 0; padding: 0; box-sizing: border-box; }
-        body { font-family: 'Cairo', 'Noto Sans Arabic', sans-serif; direction: rtl; padding: 30px; font-size: 13px; color: #333; }
-        .header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 30px; padding-bottom: 20px; border-bottom: 2px solid {{ $brandPrimary }}; }
-        .header h1 { font-size: 24px; color: {{ $brandPrimary }}; }
-        .header .meta { text-align: left; font-size: 12px; color: #666; }
-        .header .meta p { margin-bottom: 3px; }
+        body {
+            font-family: 'Cairo', 'Noto Sans Arabic', sans-serif;
+            direction: rtl;
+            font-size: 14px;
+            color: #333;
+            background: #f3f4f6;
+            padding: 16px;
+        }
+        .invoice-wrapper {
+            max-width: 700px;
+            margin: 0 auto;
+            background: white;
+            border-radius: 12px;
+            box-shadow: 0 1px 3px rgba(0,0,0,0.1);
+            overflow: hidden;
+        }
+        .header {
+            display: flex;
+            justify-content: space-between;
+            align-items: flex-start;
+            padding: 20px;
+            border-bottom: 3px solid {{ $brandPrimary }};
+            gap: 12px;
+            flex-wrap: wrap;
+        }
         .header .brand { display: flex; align-items: center; gap: 12px; }
-        .header .brand img { height: 50px; object-fit: contain; }
-        .parties { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-bottom: 25px; }
-        .party { padding: 15px; background: #f8fafc; border-radius: 8px; }
-        .party h3 { font-size: 12px; color: #64748b; margin-bottom: 8px; text-transform: uppercase; }
-        .party p { margin-bottom: 3px; }
-        table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
-        th { background: {{ $brandPrimary }}; color: white; padding: 10px 12px; text-align: right; font-size: 12px; }
-        td { padding: 10px 12px; border-bottom: 1px solid #e2e8f0; }
-        .totals { margin-right: auto; width: 280px; }
-        .totals .row { display: flex; justify-content: space-between; padding: 6px 0; font-size: 13px; }
+        .header .brand img { height: 45px; object-fit: contain; }
+        .header .brand h1 { font-size: 20px; color: {{ $brandPrimary }}; margin: 0; }
+        .header .meta { text-align: left; font-size: 12px; color: #666; min-width: 140px; }
+        .header .meta p { margin-bottom: 3px; }
+
+        .parties {
+            display: grid;
+            grid-template-columns: 1fr 1fr;
+            gap: 16px;
+            padding: 16px 20px;
+        }
+        .party { padding: 12px; background: #f8fafc; border-radius: 8px; }
+        .party h3 { font-size: 11px; color: #64748b; margin-bottom: 6px; text-transform: uppercase; font-weight: 600; }
+        .party p { margin-bottom: 2px; font-size: 13px; }
+
+        .items-table { padding: 0 20px 16px; overflow-x: auto; }
+        table { width: 100%; border-collapse: collapse; min-width: 400px; }
+        th { background: {{ $brandPrimary }}; color: white; padding: 10px 12px; text-align: right; font-size: 12px; font-weight: 600; }
+        td { padding: 10px 12px; border-bottom: 1px solid #e2e8f0; font-size: 13px; }
+        tr:last-child td { border-bottom: none; }
+
+        .totals-section { padding: 16px 20px; border-top: 1px solid #e2e8f0; }
+        .totals { margin-right: auto; width: 100%; max-width: 280px; }
+        .totals .row { display: flex; justify-content: space-between; padding: 5px 0; font-size: 13px; }
         .totals .row.total { font-weight: bold; font-size: 16px; border-top: 2px solid #333; padding-top: 10px; margin-top: 5px; }
-        .status-badge { display: inline-block; padding: 3px 12px; border-radius: 12px; font-size: 11px; font-weight: bold; }
+        .totals .row.paid { color: #166534; }
+        .totals .row.due { color: #dc2626; font-weight: bold; }
+
+        .payments-section { padding: 0 20px 16px; }
+        .payments-section h3 { font-size: 14px; margin-bottom: 8px; font-weight: 600; }
+
+        .status-badge {
+            display: inline-block;
+            padding: 3px 12px;
+            border-radius: 12px;
+            font-size: 11px;
+            font-weight: bold;
+        }
         .status-paid { background: #dcfce7; color: #166534; }
-        .status-sent { background: #dbeafe; color: #1e40af; }
+        .status-sent, .status-pending { background: #dbeafe; color: #1e40af; }
         .status-overdue { background: #fef2f2; color: #991b1b; }
         .status-partially_paid { background: #fef9c3; color: #854d0e; }
-        .payments { margin-top: 20px; }
-        .payments h3 { font-size: 14px; margin-bottom: 10px; }
-        .footer { margin-top: 40px; text-align: center; font-size: 11px; color: #94a3b8; border-top: 1px solid #e2e8f0; padding-top: 15px; }
-        .no-print { margin-bottom: 15px; }
-        @media print { .no-print { display: none; } body { padding: 15px; } }
+        .status-draft { background: #f3f4f6; color: #374151; }
+        .status-cancelled { background: #f3f4f6; color: #6b7280; }
+
+        .footer {
+            padding: 16px 20px;
+            text-align: center;
+            font-size: 11px;
+            color: #94a3b8;
+            border-top: 1px solid #e2e8f0;
+        }
+
+        .actions {
+            padding: 16px 20px;
+            display: flex;
+            justify-content: center;
+            gap: 12px;
+            flex-wrap: wrap;
+        }
+        .btn {
+            display: inline-flex;
+            align-items: center;
+            justify-content: center;
+            gap: 8px;
+            padding: 12px 24px;
+            min-height: 48px;
+            border: none;
+            border-radius: 8px;
+            font-size: 15px;
+            font-weight: 600;
+            cursor: pointer;
+            font-family: inherit;
+            text-decoration: none;
+            transition: background 0.15s;
+            -webkit-tap-highlight-color: transparent;
+        }
+        .btn-print { background: {{ $brandPrimary }}; color: white; }
+        .btn-print:active { opacity: 0.85; }
+        .btn-share { background: #f3f4f6; color: #374151; }
+        .btn-share:active { background: #e5e7eb; }
+
+        /* Mobile adjustments */
+        @media (max-width: 600px) {
+            body { padding: 8px; }
+            .header { padding: 16px; flex-direction: column; gap: 12px; }
+            .header .meta { text-align: right; }
+            .parties { grid-template-columns: 1fr; gap: 10px; padding: 12px 16px; }
+            .items-table { padding: 0 12px 12px; }
+            th, td { padding: 8px 6px; font-size: 12px; }
+            .totals-section { padding: 12px 16px; }
+            .totals { max-width: 100%; }
+            .actions { padding: 12px 16px; }
+            .btn { width: 100%; padding: 14px 20px; }
+            .footer { padding: 12px 16px; }
+        }
+
+        @media print {
+            body { background: white; padding: 10px; }
+            .invoice-wrapper { box-shadow: none; border-radius: 0; }
+            .actions { display: none !important; }
+            .items-table { overflow: visible; }
+            table { min-width: unset; }
+        }
     </style>
 </head>
 <body>
-    <div class="no-print">
-        <button onclick="window.print()" style="padding: 8px 20px; background: {{ $brandPrimary }}; color: white; border: none; border-radius: 6px; cursor: pointer;">{{ __('طباعة') }}</button>
-    </div>
+    <div class="invoice-wrapper">
+        <div class="header">
+            <div class="brand">
+                @if($brandLogo)
+                <img src="{{ Storage::disk('public')->url($brandLogo) }}" alt="{{ $academyName }}">
+                @endif
+                <div>
+                    <h1>{{ __('فاتورة') }}</h1>
+                    <p style="color: #64748b; margin-top: 2px; font-size: 13px;">{{ $academyName }}</p>
+                    @if($branch)
+                    <p style="color: #94a3b8; font-size: 11px;">{{ $branch->name_ar }}</p>
+                    @endif
+                </div>
+            </div>
+            <div class="meta">
+                <p><strong>{{ __('رقم الفاتورة') }}:</strong> {{ $invoice->number }}</p>
+                <p><strong>{{ __('التاريخ') }}:</strong> {{ $invoice->issue_date ?? $invoice->created_at?->format('Y-m-d') }}</p>
+                @if($invoice->due_date)
+                <p><strong>{{ __('الاستحقاق') }}:</strong> {{ $invoice->due_date }}</p>
+                @endif
+                <p style="margin-top: 5px;">
+                    @php $statusValue = $invoice->status?->value ?? $invoice->status ?? 'draft'; @endphp
+                    <span class="status-badge status-{{ $statusValue }}">{{ __($statusValue) }}</span>
+                </p>
+            </div>
+        </div>
 
-    <div class="header">
-        <div class="brand">
-            @if($brandLogo)
-            <img src="{{ Storage::disk('public')->url($brandLogo) }}" alt="{{ $academyName }}">
-            @endif
-            <div>
-                <h1>{{ __('فاتورة') }}</h1>
-                <p style="color: #64748b; margin-top: 4px;">{{ $academyName }}</p>
+        <div class="parties">
+            <div class="party">
+                <h3>{{ __('العميل') }}</h3>
+                @if($invoice->billable)
+                <p><strong>{{ $invoice->billable->full_name ?? $invoice->billable->name_ar ?? $invoice->billable->person?->name_ar ?? '-' }}</strong></p>
+                @if($invoice->billable->phone ?? $invoice->billable->person?->phone ?? null)
+                <p dir="ltr" style="color: #666;">{{ $invoice->billable->phone ?? $invoice->billable->person?->phone }}</p>
+                @endif
+                @endif
+            </div>
+            <div class="party">
+                <h3>{{ __('من') }}</h3>
+                <p><strong>{{ $academyName }}</strong></p>
                 @if($branch)
-                <p style="color: #64748b; font-size: 11px;">{{ $branch->name_ar }}</p>
                 @if($branch->address)
-                <p style="color: #94a3b8; font-size: 11px;">{{ $branch->address }}</p>
+                <p style="color: #666;">{{ $branch->address }}</p>
                 @endif
                 @if($branch->phone)
-                <p style="color: #94a3b8; font-size: 11px;" dir="ltr">{{ $branch->phone }}</p>
+                <p dir="ltr" style="color: #666;">{{ $branch->phone }}</p>
                 @endif
                 @endif
             </div>
         </div>
-        <div class="meta">
-            <p><strong>{{ __('رقم الفاتورة') }}:</strong> {{ $invoice->number }}</p>
-            <p><strong>{{ __('التاريخ') }}:</strong> {{ $invoice->issue_date ?? $invoice->created_at?->format('Y-m-d') }}</p>
-            @if($invoice->due_date)
-            <p><strong>{{ __('تاريخ الاستحقاق') }}:</strong> {{ $invoice->due_date }}</p>
-            @endif
-            <p style="margin-top: 5px;">
-                <span class="status-badge status-{{ $invoice->status }}">{{ __($invoice->status) }}</span>
-            </p>
-        </div>
-    </div>
 
-    <div class="parties">
-        <div class="party">
-            <h3>{{ __('العميل') }}</h3>
-            @if($invoice->billable)
-            <p><strong>{{ $invoice->billable->full_name ?? $invoice->billable->name_ar ?? '-' }}</strong></p>
-            @if($invoice->billable->phone ?? null)
-            <p dir="ltr">{{ $invoice->billable->phone }}</p>
-            @endif
-            @endif
-        </div>
-        <div class="party">
-            <h3>{{ __('تفاصيل') }}</h3>
-            @if($invoice->notes)
-            <p>{{ $invoice->notes }}</p>
-            @endif
+        <div class="items-table">
+            <table>
+                <thead>
+                    <tr>
+                        <th>#</th>
+                        <th>{{ __('الوصف') }}</th>
+                        <th>{{ __('الكمية') }}</th>
+                        <th>{{ __('سعر الوحدة') }}</th>
+                        <th>{{ __('الإجمالي') }}</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    @forelse($invoice->items as $i => $item)
+                    <tr>
+                        <td>{{ $i + 1 }}</td>
+                        <td>{{ $item->description }}</td>
+                        <td>{{ $item->quantity }}</td>
+                        <td dir="ltr">{{ format_money($item->unit_price) }}</td>
+                        <td dir="ltr">{{ format_money($item->total_amount) }}</td>
+                    </tr>
+                    @empty
+                    <tr><td colspan="5" style="text-align: center; color: #999;">{{ __('لا توجد بنود') }}</td></tr>
+                    @endforelse
+                </tbody>
+            </table>
         </div>
-    </div>
 
-    <table>
-        <thead>
-            <tr>
-                <th>#</th>
-                <th>{{ __('الوصف') }}</th>
-                <th>{{ __('الكمية') }}</th>
-                <th>{{ __('سعر الوحدة') }}</th>
-                <th>{{ __('الإجمالي') }}</th>
-            </tr>
-        </thead>
-        <tbody>
-            @forelse($invoice->items as $i => $item)
-            <tr>
-                <td>{{ $i + 1 }}</td>
-                <td>{{ $item->description }}</td>
-                <td>{{ $item->quantity }}</td>
-                <td dir="ltr">{{ format_money($item->unit_price) }}</td>
-                <td dir="ltr">{{ format_money($item->total_amount) }}</td>
-            </tr>
-            @empty
-            <tr><td colspan="5" style="text-align: center; color: #999;">{{ __('لا توجد بنود') }}</td></tr>
-            @endforelse
-        </tbody>
-    </table>
-
-    <div class="totals">
-        <div class="row">
-            <span>{{ __('المجموع الفرعي') }}</span>
-            <span dir="ltr">{{ format_money($invoice->subtotal_amount ?? $invoice->total_amount) }}</span>
-        </div>
-        @if($invoice->discount_amount > 0)
-        <div class="row">
-            <span>{{ __('الخصم') }}</span>
-            <span dir="ltr" style="color: #dc2626;">-{{ format_money($invoice->discount_amount) }}</span>
-        </div>
-        @endif
-        @if(($invoice->service_fee_amount ?? 0) > 0)
-        <div class="row">
-            <span>{{ __('رسوم الخدمة') }}</span>
-            <span dir="ltr">{{ format_money($invoice->service_fee_amount) }}</span>
+        <div class="totals-section">
+            <div class="totals">
+                <div class="row">
+                    <span>{{ __('المجموع الفرعي') }}</span>
+                    <span dir="ltr">{{ format_money($invoice->subtotal_amount ?? $invoice->total_amount) }}</span>
+                </div>
+                @if($invoice->discount_amount > 0)
+                <div class="row">
+                    <span>{{ __('الخصم') }}</span>
+                    <span dir="ltr" style="color: #dc2626;">-{{ format_money($invoice->discount_amount) }}</span>
+                </div>
+                @endif
+                @if(($invoice->service_fee_amount ?? 0) > 0)
+                <div class="row">
+                    <span>{{ __('رسوم الخدمة') }}</span>
+                    <span dir="ltr">{{ format_money($invoice->service_fee_amount) }}</span>
+                </div>
+                @endif
+                @if($invoice->tax_amount > 0)
+                <div class="row">
+                    <span>{{ __('الضريبة') }}</span>
+                    <span dir="ltr">{{ format_money($invoice->tax_amount) }}</span>
+                </div>
+                @endif
+                <div class="row total">
+                    <span>{{ __('الإجمالي') }}</span>
+                    <span dir="ltr">{{ format_money($invoice->total_amount) }}</span>
+                </div>
+                @if($invoice->paid_amount > 0)
+                <div class="row paid">
+                    <span>{{ __('المدفوع') }}</span>
+                    <span dir="ltr">{{ format_money($invoice->paid_amount) }}</span>
+                </div>
+                <div class="row due">
+                    <span>{{ __('المتبقي') }}</span>
+                    <span dir="ltr">{{ format_money($invoice->due_amount) }}</span>
+                </div>
+                @endif
+            </div>
         </div>
-        @endif
-        @if($invoice->tax_amount > 0)
-        <div class="row">
-            <span>{{ __('الضريبة') }}</span>
-            <span dir="ltr">{{ format_money($invoice->tax_amount) }}</span>
+
+        @if($invoice->payments && $invoice->payments->count())
+        <div class="payments-section">
+            <h3>{{ __('المدفوعات') }}</h3>
+            <table>
+                <thead>
+                    <tr>
+                        <th>{{ __('التاريخ') }}</th>
+                        <th>{{ __('الطريقة') }}</th>
+                        <th>{{ __('المبلغ') }}</th>
+                        <th>{{ __('الحالة') }}</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    @foreach($invoice->payments as $payment)
+                    <tr>
+                        <td dir="ltr">{{ $payment->created_at?->format('Y-m-d') }}</td>
+                        <td>{{ __($payment->method) }}</td>
+                        <td dir="ltr">{{ format_money($payment->amount) }}</td>
+                        <td>{{ __($payment->status) }}</td>
+                    </tr>
+                    @endforeach
+                </tbody>
+            </table>
         </div>
         @endif
-        <div class="row total">
-            <span>{{ __('الإجمالي') }}</span>
-            <span dir="ltr">{{ format_money($invoice->total_amount) }}</span>
-        </div>
-        @if($invoice->paid_amount > 0)
-        <div class="row" style="color: #166534;">
-            <span>{{ __('المدفوع') }}</span>
-            <span dir="ltr">{{ format_money($invoice->paid_amount) }}</span>
-        </div>
-        <div class="row" style="font-weight: bold; color: #dc2626;">
-            <span>{{ __('المتبقي') }}</span>
-            <span dir="ltr">{{ format_money($invoice->due_amount) }}</span>
+
+        <div class="footer">
+            {{ $receiptFooter }}
         </div>
-        @endif
-    </div>
 
-    @if($invoice->payments && $invoice->payments->count())
-    <div class="payments">
-        <h3>{{ __('المدفوعات') }}</h3>
-        <table>
-            <thead>
-                <tr>
-                    <th>{{ __('التاريخ') }}</th>
-                    <th>{{ __('الطريقة') }}</th>
-                    <th>{{ __('المبلغ') }}</th>
-                    <th>{{ __('الحالة') }}</th>
-                </tr>
-            </thead>
-            <tbody>
-                @foreach($invoice->payments as $payment)
-                <tr>
-                    <td dir="ltr">{{ $payment->created_at?->format('Y-m-d') }}</td>
-                    <td>{{ __($payment->method) }}</td>
-                    <td dir="ltr">{{ format_money($payment->amount) }}</td>
-                    <td>{{ __($payment->status) }}</td>
-                </tr>
-                @endforeach
-            </tbody>
-        </table>
+        <div class="actions">
+            <button onclick="window.print()" class="btn btn-print">
+                <svg width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z"/>
+                </svg>
+                {{ __('طباعة') }}
+            </button>
+            <button onclick="shareInvoice()" class="btn btn-share" id="share-btn" style="display:none;">
+                <svg width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.684 13.342C8.886 12.938 9 12.482 9 12c0-.482-.114-.938-.316-1.342m0 2.684a3 3 0 110-2.684m0 2.684l6.632 3.316m-6.632-6l6.632-3.316m0 0a3 3 0 105.367-2.684 3 3 0 00-5.367 2.684zm0 9.316a3 3 0 105.368 2.684 3 3 0 00-5.368-2.684z"/>
+                </svg>
+                {{ __('مشاركة') }}
+            </button>
+        </div>
     </div>
-    @endif
 
-    <div class="footer">
-        {{ $receiptFooter }}
-    </div>
+    <script>
+        if (navigator.share) {
+            document.getElementById('share-btn').style.display = 'inline-flex';
+        }
+        function shareInvoice() {
+            if (navigator.share) {
+                navigator.share({
+                    title: '{{ __("فاتورة") }} {{ $invoice->number }}',
+                    url: window.location.href
+                }).catch(function() {});
+            }
+        }
+    </script>
 </body>
 </html>