<script setup>
import { Info } from "lucide-vue-next";

defineProps({ message: { type: String, default: "" } });
</script>

<template>
  <Transition
    enter-active-class="transition duration-300 ease-out"
    enter-from-class="opacity-0 translate-y-2"
    leave-active-class="transition duration-200 ease-in"
    leave-to-class="opacity-0 translate-y-2"
  >
    <div
      v-if="message"
      class="fixed top-5 right-5 bg-blue-900 text-white px-6 py-3 rounded-2xl shadow-2xl z-50 flex items-center gap-3 border border-blue-400"
    >
      <Info class="w-4 h-4" />
      {{ message }}
    </div>
  </Transition>
</template>
