{{-- File: resources/views/restaurant/includes/qr_code_data.blade.php --}}

@if($restaurant->qrCodes && $restaurant->qrCodes->count() > 0)
<div class="row g-3">
    @foreach($restaurant->qrCodes->sortByDesc('is_default') as $qrCode)
    <div class="col-md-6 col-lg-4">
        <div class="card border-0 shadow-sm {{ $qrCode->is_default ? 'border-primary' : '' }}">
            <div class="card-body">
                <div class="d-flex justify-content-between align-items-start mb-3">
                    <div>
                        @if($qrCode->is_default)
                        <span class="badge bg-primary-transparent fs-11 fw-semibold mb-2">
                            <i class="ri-star-line me-1"></i>Default
                        </span>
                        @endif
                        <h6 class="fw-semibold mb-1">{{ $qrCode->name }}</h6>
                        <span class="badge bg-{{ $qrCode->type === 'restaurant_profile' ? 'info' : ($qrCode->type === 'menu' ? 'success' : ($qrCode->type === 'contact' ? 'warning' : 'secondary')) }}-transparent fs-11">
                            {{ $qrCode->type_name }}
                        </span>
                    </div>
                    <div class="dropdown">
                        <button class="btn btn-light btn-sm" type="button" data-bs-toggle="dropdown">
                            <i class="ri-more-2-line"></i>
                        </button>
                        <ul class="dropdown-menu dropdown-menu-end">
                            <li>
                                <a class="dropdown-item" href="javascript:void(0)"
                                    data-id="{{ $qrCode->id }}"
                                    data-name="{{ $qrCode->name }}"
                                    data-type="{{ $qrCode->type }}"
                                    data-qr-url="{{ $qrCode->qr_url }}"
                                    data-size="{{ $qrCode->settings['size'] ?? 300 }}"
                                    data-is-active="{{ $qrCode->is_active ? 1 : 0 }}"
                                    data-is-default="{{ $qrCode->is_default ? 1 : 0 }}"
                                    data-bs-toggle="modal"
                                    data-bs-target="#editQrCodeModal">
                                    <i class="ri-edit-line me-2"></i>Edit
                                </a>
                            </li>
                            <li>
                                <button class="dropdown-item download-qr-btn" data-qr-id="{{ $qrCode->id }}">
                                    <i class="ri-download-line me-2"></i>Download
                                </button>
                            </li>
                            <li>
                                <a class="dropdown-item" href="javascript:void(0)"
                                    data-id="{{ $qrCode->id }}"
                                    data-bs-toggle="modal"
                                    data-bs-target="#regenerateQrModal">
                                    <i class="ri-refresh-line me-2"></i>Regenerate
                                </a>
                            </li>
                            @if(!$qrCode->is_default)
                            <li>
                                <a class="dropdown-item" href="javascript:void(0)"
                                    data-id="{{ $qrCode->id }}"
                                    data-bs-toggle="modal"
                                    data-bs-target="#setDefaultQrModal">
                                    <i class="ri-star-line me-2"></i>Set as Default
                                </a>
                            </li>
                            @endif
                            <li>
                                <hr class="dropdown-divider">
                            </li>
                            <li>
                                <a class="dropdown-item text-danger" href="javascript:void(0)"
                                    data-id="{{ $qrCode->id }}"
                                    data-bs-toggle="modal"
                                    data-bs-target="#deleteQrModal">
                                    <i class="ri-delete-bin-line me-2"></i>Delete
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>

                {{-- QR Code Image --}}
                <div class="text-center mb-3">
                    @if($qrCode->qr_code_path && file_exists(public_path($qrCode->qr_code_path)))
                    <img src="{{ asset($qrCode->qr_code_path) }}"
                        alt="{{ $qrCode->name }}"
                        class="img-fluid rounded"
                        style="max-width: 150px; max-height: 150px;">
                    @else
                    <div class="bg-light rounded d-flex align-items-center justify-content-center"
                        style="width: 150px; height: 150px; margin: 0 auto;">
                        <i class="ri-qr-code-line fs-1 text-muted"></i>
                    </div>
                    @endif
                </div>

                {{-- QR Code Info --}}
                <div class="row g-2 mb-3">
                    <div class="col-6">
                        <div class="d-flex align-items-center">
                            <i class="ri-eye-line text-muted me-2"></i>
                            <div>
                                <p class="text-muted fs-12 mb-0">Scans</p>
                                <p class="fw-semibold fs-14 mb-0">{{ $qrCode->scan_count }}</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-6">
                        <div class="d-flex align-items-center">
                            <i class="ri-time-line text-muted me-2"></i>
                            <div>
                                <p class="text-muted fs-12 mb-0">Status</p>
                                <span class="badge bg-{{ $qrCode->is_active ? 'success' : 'danger' }}-transparent fs-10">
                                    {{ $qrCode->is_active ? 'Active' : 'Inactive' }}
                                </span>
                            </div>
                        </div>
                    </div>
                </div>

                {{-- Last Scanned --}}
                @if($qrCode->last_scanned_at)
                <div class="mb-3">
                    <p class="text-muted fs-12 mb-1">Last Scanned</p>
                    <p class="fs-12 mb-0">{{ $qrCode->last_scanned_at->diffForHumans() }}</p>
                </div>
                @endif

                {{-- URL Preview --}}
                <div class="mb-3">
                    <p class="text-muted fs-12 mb-1">Target URL</p>
                    <p class="fs-12 mb-0 text-break">
                        <a href="{{ $qrCode->qr_url }}" target="_blank" class="text-decoration-none">
                            {{ Str::limit($qrCode->qr_url, 40) }}
                            <i class="ri-external-link-line fs-10 ms-1"></i>
                        </a>
                    </p>
                </div>

                {{-- Quick Actions --}}
                <div class="d-flex gap-2">
                    <button class="btn btn-primary-light btn-sm flex-fill download-qr-btn" data-qr-id="{{ $qrCode->id }}">
                        <i class="ri-download-line me-1"></i>Download
                    </button>
                    <button class="btn btn-secondary-light btn-sm share-qr-btn" data-qr-id="{{ $qrCode->id }}">
                        <i class="ri-share-line"></i>
                    </button>
                </div>
            </div>
        </div>
    </div>
    @endforeach
</div>
@else
{{-- Empty State --}}
<div class="text-center py-5">
    <div class="mb-4">
        <i class="ri-qr-code-line" style="font-size: 4rem; color: #e9ecef;"></i>
    </div>
    <h6 class="text-muted mb-2">No QR Codes Created Yet</h6>
    <p class="text-muted fs-14 mb-3">Create your first QR code to help customers easily access your restaurant information.</p>
    <!-- <button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#qrCodeModal">
        <i class="ri-add-line me-1"></i>Create First QR Code
    </button> -->
</div>
@endif