<template>
    <div
      class="flex flex-col items-center justify-center text-center text-gray-800 min-h-screen"
    >
      <h1 class="text-4xl md:text-5xl font-extrabold mb-4">🎂 Undangan Ulang Tahun 🎂</h1>
      <p class="text-lg mb-6">Hai <span class="font-semibold">{{ guestName }}</span>!</p>
      <p class="text-lg mb-8">Yuk, datang ke acara ulang tahun <span class="font-bold">{{ childName }}</span>!</p>
      <button
        @click="$emit('open-invitation')"
        class="bg-orange-500 hover:bg-orange-600 text-white px-6 py-3 rounded-full text-lg shadow-md transition"
      >
        Buka Undangan
      </button>
    </div>
  </template>
  
  <script setup>
  defineProps({
    childName: String,
    guestName: String,
  })
  </script>
  