{!! Theme::section('pdfsign.menu') !!}
 
<style type="text/css">
 .box.community-history{display:none;}
 .pdfsign-wrap{max-width:980px;}
 .pdfsign-card{background:#fff;border:1px solid #ddd;border-radius:10px;padding:16px;}
 .pdfsign-muted{color:#64748b;font-size:13px;}
 .pdfsign-row{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start;}
 .pdfsign-col{flex:1;min-width:280px;}
 .pdfsign-linkbtn{display:inline-block;padding:10px 14px;background:#f1f5f9;color:#0f172a;border:1px solid #e2e8f0;border-radius:8px;text-decoration:none;}
 .pdfsign-table{width:100%;border-collapse:collapse;font-size:13px;}
 .pdfsign-table th,.pdfsign-table td{border-bottom:1px solid #e2e8f0;padding:8px 6px;vertical-align:top;}
 .pdfsign-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:12px;border:1px solid #e2e8f0;background:#f8fafc;color:#0f172a;}
 .pdfsign-badge.invited{background:#fff7ed;border-color:#fed7aa;color:#9a3412;}
 .pdfsign-badge.opened{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8;}
 .pdfsign-badge.signed{background:#ecfdf5;border-color:#a7f3d0;color:#065f46;}
 .pdfsign-dtwrap{display:inline-flex;flex-direction:column;line-height:1.25;vertical-align:middle;}
 .pdfsign-table .js-local-time{display:inline;margin-left:4px;}
</style>

<div style="padding:15px;">
    @php
        $fmt = function ($v) {
            $s = is_string($v) ? trim($v) : (empty($v) ? '' : (string) $v);
            if ($s === '' || $s === '0000-00-00 00:00:00') return '-';
            try {
                return \Carbon\Carbon::parse($s)->format('M j Y, g:ia');
            } catch (\Throwable $e) {
                return $s;
            }
        };

        $pdfSignSlug = null;
        if (\Auth::check()) {
            $pdfSignSlug = (int) (\Auth::user()->visiting_community ?? 0);
        }
        if ($pdfSignSlug === null && isset($slug)) {
            $pdfSignSlug = (int) $slug;
        }
        if ($pdfSignSlug <= 0) {
            $pdfSignSlug = 75;
        }

        // Convert DB datetime string to UTC ISO8601 for client-side timezone rendering.
        // IMPORTANT: DB values are treated as UTC to avoid double-shifting.
        $isoUtc = function ($v) {
            $s = is_string($v) ? trim($v) : (empty($v) ? '' : (string) $v);
            if ($s === '' || $s === '0000-00-00 00:00:00') return '';
            try {
                return \Carbon\Carbon::parse($s, 'UTC')->toIso8601String();
            } catch (\Throwable $e) {
                return '';
            }
        };
    @endphp
    <span class="resize-editor-screen-btn resize-editor-screen-btn-open"><i class="fa fa-arrows-alt" aria-hidden="true"></i></span>

    <div style="display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap;">
        <div>
            <h2 style="margin-bottom: 10px; margin-top: 0px; font-size: 20px;">Recipients Status</h2>
            <div class="pdfsign-muted">
                 Document Token ID: <strong>{{ $token }}</strong> <br />
                 
                 <div style="margin-top:6px;">Document Title: <strong>{{ !empty($document->document_title) ? $document->document_title : ($document->original_filename ?: 'PDF Document') }}</strong></div>
               
               <div style="font-size: 13px;margin-top:10px;">
                    Document prepared by: <strong>{{ !empty($preparedByName) ? $preparedByName : '-' }}</strong>
                </div>
            </div>
        </div>
        <div style="display:flex;gap:10px;flex-wrap:wrap;">
            <!--<a class="pdfsign-linkbtn" href="{{ $historyUrl }}">Back to History</a>-->
            @php
                $invStatus = (string) ($document->signing_status ?? '');
                $invSent = in_array($invStatus, ['invited', 'in_progress', 'completed'], true);
            @endphp
            @if(!empty($canManageInvites) && $canManageInvites)
                @if($invSent)
                    <span class="pdfsign-linkbtn" style="cursor:not-allowed;opacity:.65;">Invited</span>
                @else
                    <a class="pdfsign-linkbtn" href="{{ $inviteManageUrl }}">Invite / Manage</a>
                @endif
            @endif
        </div>
    </div>

    <div class="pdfsign-wrap" style="margin-top:16px;">
        <div class="pdfsign-card">
            <div style="font-weight:600;margin-bottom:8px;">Summary</div>
            <div class="pdfsign-muted" style="line-height:1.6;">
                <span><strong>Total:</strong> {{ $stats['total'] ?? 0 }}</span>
                <span style="opacity:.5;">&nbsp;|&nbsp;</span>
                <span>
                    <strong>Invited:</strong> {{ $stats['invited'] ?? 0 }}
                </span>
                <span style="opacity:.5;">&nbsp;|&nbsp;</span>
                <span>
                    <strong>Opened:</strong> {{ $stats['opened'] ?? 0 }}
                </span>
                <span style="opacity:.5;">&nbsp;|&nbsp;</span>
                <span>
                    <strong>Signed:</strong> {{ $stats['signed'] ?? 0 }}
                </span>
            </div>

            <div style="height:1px;background:#e2e8f0;margin:14px 0;"></div>

            <div style="font-weight:600;margin-bottom:8px;">Recipients</div>
            @if (empty($recipients) || count($recipients) === 0)
                <div class="pdfsign-muted">No recipients invited yet.</div>
            @else
                <div style="overflow:auto;">
                    <table class="pdfsign-table">
                        <thead>
                            <tr>
                                <th>Email/Status</th>                                
                                <th>Invited</th>
                                <th>Opened</th>
                                <th>Signed</th>
                                <!--<th>Invite Link</th>-->
                                <th>Download</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($recipients as $r)
                                @php
                                    $st = (string)($r->status ?? 'invited');
                                    $cls = $st !== '' ? $st : 'invited';
                                    $inviteUrl = route('community.pdf-sign.invite.show', ['slug' => $pdfSignSlug, 'inviteToken' => $r->invite_token]);
                                    $downloadUrl = route('community.pdf-sign.recipient.download', ['slug' => $pdfSignSlug, 'token' => $token, 'recipientId' => $r->id]);

                                    $selfEmailNorm = !empty($currentEmail) ? strtolower(trim((string)$currentEmail)) : '';
                                    $rowEmailNorm = !empty($r->email) ? strtolower(trim((string)$r->email)) : '';
                                    $selfId = !empty($currentUserId) ? (int) $currentUserId : 0;
                                    $rowUserId = !empty($r->user_id) ? (int) $r->user_id : 0;
                                    $isSelfRow = (\Auth::check() && (($selfId > 0 && $rowUserId > 0 && $selfId === $rowUserId) || ($selfEmailNorm !== '' && $rowEmailNorm !== '' && $selfEmailNorm === $rowEmailNorm)));
                                    $isRowSigned = !empty($r->signed_at) || ((string)($r->status ?? '') === 'signed');
                                @endphp
                                <tr>
                                    <td>
                                        {{ $r->email }}
                                        <br />
                                        <span class="pdfsign-badge {{ $cls }}">{{ $st }} </span>
                                    </td>
                                    <td>
                                        <span class="js-local-date" data-utc="{{ $isoUtc($r->invited_at ?? null) }}">{{ $fmt($r->invited_at ?? null) }}</span>
                                        <span class="js-local-time" data-utc="{{ $isoUtc($r->invited_at ?? null) }}"></span>
                                    </td>
                                    <td>
                                        <span class="js-local-date" data-utc="{{ $isoUtc($r->opened_at ?? null) }}">{{ $fmt($r->opened_at ?? null) }}</span>
                                        <span class="js-local-time" data-utc="{{ $isoUtc($r->opened_at ?? null) }}"></span>
                                    </td>
                                    <td>
                                        @if($isSelfRow && !$isRowSigned && !empty($r->invite_token))
                                            <div style="margin-top:6px;">
                                                <a href="{{ $inviteUrl }}" class="pdfsign-linkbtn" style="padding:6px 10px;background:#e11d48;border-color:#e11d48;color:#fff;">Sign now</a>
                                            </div>
                                        @else
                                            <span class="js-local-date" data-utc="{{ $isoUtc($r->signed_at ?? null) }}">{{ $fmt($r->signed_at ?? null) }}</span>
                                            <span class="js-local-time" data-utc="{{ $isoUtc($r->signed_at ?? null) }}"></span>
                                        @endif
                                        @if (!empty($r->signed_ip))
                                            <span style="display:block">
                                                <i class="fa fa-map-marker" aria-hidden="true"></i> {{ $r->signed_ip }}
                                            </span>
                                        @endif
                                    </td>
                                    <!--<td style="white-space:nowrap;"><a href="{{ $inviteUrl }}" target="_blank" rel="noopener">Open</a></td>-->
                                    <td style="white-space:nowrap; text-align:center;">
                                        @if(!empty($r->signed_at))
                                            <a href="{{ $downloadUrl }}"><i class="fa fa-file-pdf-o" aria-hidden="true"></i></a>
                                        @else
                                            <span style="opacity:.7;">-</span>
                                        @endif
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            @endif
        </div>
    </div>
</div>

<script>
(function(){
    function parseIso(iso){
        if (!iso) return null;
        var d = new Date(iso);
        if (isNaN(d.getTime())) return null;
        return d;
    }

    function lowerAmPm(s){
        return String(s).replace(/\s?(AM|PM)\b/g, function(m){ return m.toLowerCase(); });
    }

    function formatDate(d){
        try {
            return new Intl.DateTimeFormat(undefined, {
                year: 'numeric',
                month: 'short',
                day: 'numeric'
            }).format(d);
        } catch (e) {
            return d.toLocaleDateString();
        }
    }

    function formatTime(d){
        try {
            var s = new Intl.DateTimeFormat(undefined, {
                hour: 'numeric',
                minute: '2-digit'
            }).format(d);
            return lowerAmPm(s);
        } catch (e) {
            return lowerAmPm(d.toLocaleTimeString());
        }
    }

    var dateNodes = document.querySelectorAll('.js-local-date[data-utc]');
    for (var i = 0; i < dateNodes.length; i++) {
        var el = dateNodes[i];
        var iso = (el.getAttribute('data-utc') || '').trim();
        var d = parseIso(iso);
        if (!d) continue;
        var out = formatDate(d);
        if (out) el.textContent = out;
    }

    var timeNodes = document.querySelectorAll('.js-local-time[data-utc]');
    for (var j = 0; j < timeNodes.length; j++) {
        var tEl = timeNodes[j];
        var tIso = (tEl.getAttribute('data-utc') || '').trim();
        var td = parseIso(tIso);
        if (!td) continue;
        var tout = formatTime(td);
        if (!tout) continue;
        // Default: keep time inline. If wrapped in .pdfsign-dtwrap, stack it under date.
        try {
            if (tEl.closest && tEl.closest('.pdfsign-dtwrap')) {
                tEl.style.display = 'block';
                tEl.style.marginLeft = '0';
            }
        } catch (e) {}
        tEl.textContent = tout;
    }
})();
</script>