@if(!empty($showSetupWizard) && $showSetupWizard)
<div class="modal fade" id="vendorSetupWizard" tabindex="-1" data-bs-backdrop="static">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content border-0 shadow-lg vd-wizard-modal">
            <div class="modal-header border-0 pb-0">
                <div>
                    <span class="badge bg-primary bg-opacity-10 text-primary rounded-pill mb-2">Welcome Setup</span>
                    <h4 class="fw-bold mb-0">Welcome to Gletra, {{ auth()->user()->name }}!</h4>
                    <p class="text-muted mb-0 small">Complete these steps to launch your store successfully.</p>
                </div>
                <form action="{{ route('vendor.setup-wizard.dismiss') }}" method="POST">
                    @csrf
                    <button type="submit" class="btn-close" aria-label="Close"></button>
                </form>
            </div>
            <div class="modal-body pt-4">
                <div class="row g-3">
                    <div class="col-md-6">
                        <div class="vd-wizard-step {{ $vendor->logo ? 'vd-wizard-done' : '' }}">
                            <span class="vd-wizard-num">1</span>
                            <div>
                                <strong>Upload Shop Logo</strong>
                                <p class="small text-muted mb-2">Build brand trust with your logo.</p>
                                <a href="{{ route('vendor.profile.index') }}" class="btn btn-sm btn-outline-primary">Go to Profile</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="vd-wizard-step {{ $vendor->banner ? 'vd-wizard-done' : '' }}">
                            <span class="vd-wizard-num">2</span>
                            <div>
                                <strong>Add Shop Banner</strong>
                                <p class="small text-muted mb-2">Make your storefront stand out.</p>
                                <a href="{{ route('vendor.profile.index') }}" class="btn btn-sm btn-outline-primary">Upload Banner</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="vd-wizard-step">
                            <span class="vd-wizard-num">3</span>
                            <div>
                                <strong>Add Your First Product</strong>
                                <p class="small text-muted mb-2">Start selling — up to 30 products as Basic Vendor.</p>
                                <a href="{{ route('vendor.products.create') }}" class="btn btn-sm btn-primary">Add Product</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="vd-wizard-step">
                            <span class="vd-wizard-num">4</span>
                            <div>
                                <strong>Complete KYC (Optional Now)</strong>
                                <p class="small text-muted mb-2">Unlock unlimited products & withdrawals.</p>
                                <a href="{{ route('vendor.kyc.index') }}" class="btn btn-sm btn-outline-success">Start KYC</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer border-0 pt-0">
                <form action="{{ route('vendor.setup-wizard.dismiss') }}" method="POST" class="ms-auto">
                    @csrf
                    <button type="submit" class="btn btn-primary rounded-pill px-4">Get Started</button>
                </form>
            </div>
        </div>
    </div>
</div>
@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function () {
    var el = document.getElementById('vendorSetupWizard');
    if (el) new bootstrap.Modal(el).show();
});
</script>
@endpush
@endif