const toast = document.querySelector(".toast");
const showToast = (goal) => {
  toast.textContent = `${goal} mode selected — your box is almost ready.`;
  toast.classList.add("show");
  window.setTimeout(() => toast.classList.remove("show"), 3200);
};

document.querySelectorAll(".meal-card").forEach((card) => {
  const action = card.querySelector(".card-action");
  action.addEventListener("click", () => showToast(card.dataset.goal));
  card.addEventListener("keydown", (event) => {
    if ((event.key === "Enter" || event.key === " ") && event.target === card) {
      event.preventDefault();
      showToast(card.dataset.goal);
    }
  });
});