script.js

// Tiny singleton state
const Store = {
    cart: JSON.parse(localStorage.getItem('bbCart') || '[]'),
    menu: [],
    filter: 'all',
    search: ''
};
// Italias Romanos Too menu
const dummyMenu = [
    { id: 1, name: "12\" Cheese Pizza", price: 12.00, category: "pizza", desc: "Classic hand-tossed crust, house red sauce, mozzarella.", img: "http://static.photos/pizza/640x360/1" },
    { id: 2, name: "14\" Pepperoni Pizza", price: 16.50, category: "pizza", desc: "Loaded with crispy pepperoni on our signature cheese pie.", img: "http://static.photos/pizza/640x360/2" },
    { id: 3, name: "Meat Lovers Pizza", price: 19.00, category: "pizza", desc: "Pepperoni, sausage, bacon, ham on thick crust.", img: "http://static.photos/pizza/640x360/3" },
    { id: 4, name: "Spaghetti & Meatballs", price: 11.00, category: "pasta", desc: "House-made marinara, three giant meatballs, garlic bread.", img: "http://static.photos/food/640x360/4" },
    { id: 5, name: "Fettuccine Alfredo", price: 10.50, category: "pasta", desc: "Creamy parmesan sauce, fettuccine, parsley.", img: "http://static.photos/food/640x360/5" },
    { id: 6, name: "Italian Sub", price: 9.50, category: "sandwiches", desc: "Ham, salami, pepperoni, provolone, lettuce, tomato, Italian dressing.", img: "http://static.photos/food/640x360/6" },
    { id: 7, name: "Meatball Sub", price: 9.00, category: "sandwiches", desc: "Meatballs, marinara, mozzarella on toasted hoagie.", img: "http://static.photos/food/640x360/7" },
    { id: 8, name: "Saturday Breakfast Skillet", price: 8.50, category: "breakfast", desc: "Two eggs, hash browns, sausage, cheddar, toast.", img: "http://static.photos/food/640x360/8" },
    { id: 9, name: "Sunday Pancakes", price: 7.00, category: "breakfast", desc: "Three fluffy pancakes, maple syrup, butter.", img: "http://static.photos/food/640x360/9" },
    { id: 10, name: "Tiramisu", price: 5.50, category: "dessert", desc: "Coffee-soaked ladyfingers, mascarpone, cocoa.", img: "http://static.photos/food/640x360/10" },
    { id: 11, name: "Cannoli", price: 4.50, category: "dessert", desc: "Crispy shell, sweet ricotta, chocolate chips.", img: "http://static.photos/food/640x360/11" }
];
Store.menu = dummyMenu;

// Render menu
function renderMenu() {
    const grid = document.getElementById('menuGrid');
    const empty = document.getElementById('emptyState');
    const filtered = Store.menu.filter(item => {
        const matchesFilter = Store.filter === 'all' || item.category === Store.filter || (Store.filter === 'vegan' && item.vegan);
        const matchesSearch = item.name.toLowerCase().includes(Store.search.toLowerCase()) || item.desc.toLowerCase().includes(Store.search.toLowerCase());
        return matchesFilter && matchesSearch;
    });

    if (filtered.length === 0) {
        grid.innerHTML = '';
        empty.classList.remove('hidden');
        return;
    }
    empty.classList.add('hidden');
    grid.innerHTML = filtered.map(item => `
        <div class="bg-white dark:bg-gray-800 rounded-2xl shadow-md card-hover overflow-hidden">
            <img src="${item.img}" alt="${item.name}" class="w-full h-40 object-cover">
            <div class="p-4">
                <div class="flex justify-between items-start">
                    <h3 class="text-lg font-semibold">${item.name}</h3>
                    <span class="text-orange-500 font-bold">$${item.price.toFixed(2)}</span>
                </div>
                <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">${item.desc}</p>
                <button data-id="${item.id}" class="addBtn mt-4 w-full px-4 py-2 rounded-full bg-orange-500 hover:bg-orange-600 text-white text-sm font-semibold transition">Add to Cart</button>
            </div>
        </div>
    `);
    document.querySelectorAll('.addBtn').forEach(btn => btn.addEventListener('click', addToCart));
}
// Cart logic removed – Italias Romanos Too is call-in only
// Filters
document.querySelectorAll('.filter-btn').forEach(btn => {
    btn.addEventListener('click', e => {
        document.querySelector('.filter-btn.active').classList.remove('active');
        e.target.classList.add('active');
        Store.filter = e.target.dataset.filter;
        renderMenu();
    });
});

// Search
document.getElementById('searchInput').addEventListener('input', e => {
    Store.search = e.target.value;
    renderMenu();
});
// Theme toggle
const themeBtn = document.getElementById('themeToggle');
const html = document.documentElement;
if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
    html.classList.add('dark');
    themeBtn.innerHTML = '<i data-feather="sun" class="w-5 h-5"></i>';
} else {
    html.classList.remove('dark');
    themeBtn.innerHTML = '<i data-feather="moon" class="w-5 h-5"></i>';
}
themeBtn.addEventListener('click', () => {
    const isDark = html.classList.toggle('dark');
    localStorage.theme = isDark ? 'dark' : 'light';
    themeBtn.innerHTML = isDark ? '<i data-feather="sun" class="w-5 h-5"></i>' : '<i data-feather="moon" class="w-5 h-5"></i>';
    feather.replace();
});
// Init
renderMenu();