// ✅ Game Card Renderer — যেকোনো Game-লিস্ট থেকে HTML কার্ড বানায়
function renderGameCards(container, games) {
    // ✅ শুধু আসল Playable Game রাখা হচ্ছে (যাদের gameCode/gameID
    // আছে) — "slot" Category-র কিছু Entry আসলে Vendor-তালিকা,
    // Game না, সেগুলো বাদ পড়বে
    const playable = (games || []).filter(g => (g.gameCode || g.gameID || g.code));

    if (playable.length === 0) {
        container.innerHTML = '<div class="col-span-3 text-center text-gray-500 text-xs py-6">কোনো Game পাওয়া যায়নি।</div>';
        return;
    }
    container.innerHTML = playable.map(g => {
        const code = g.gameCode || g.gameID || g.code || '';
        const name = (g.gameNameEn || g.name || g.slotsName || 'Game').replace(/"/g, '&quot;');
        const img = g.img || g.imgUrl || g.imageUrl || g.image || g.vendorImg || '';
        const vendor = g.vendorCode || g.vendor || '';
        const fav = isFavGame(code);
        const safeCode = code.replace(/'/g, "\\'");
        const safeName = name.replace(/'/g, "\\'");
        const safeImg = (img || '').replace(/'/g, "\\'");
        const safeVendor = (vendor || '').replace(/'/g, "\\'");
        return `
            <div class="real-game-card h-32" onclick="launchRealGame('${safeCode}', '${safeName}')">
                <img src="${img}" alt="${name}" loading="lazy" onerror="this.style.display='none'">
                <div class="fav-heart ${fav ? 'active' : ''}" onclick="toggleFavGame('${safeCode}', '${safeName}', '${safeImg}', '${safeVendor}', this)">
                    <i class="fa-solid fa-heart"></i>
                </div>
                ${vendor ? `<span class="vendor-badge">${vendor}</span>` : ''}
                <div class="name-strip">${name}</div>
            </div>
        `;
    }).join('');
}
