@php
    $classes = "pointer-events-none absolute bg-white transform -translate-y-12 z-50 p-3 max-w-sm rounded-lg shadow-lg ring-1 ring-black ring-opacity-5";
@endphp
<div {{ $attributes->merge(['class'=>$classes]) }} x-cloak
    x-transition:enter="transform ease-out duration-300 transition "
    x-transition:enter-start="-translate-y-12 opacity-0 sm:translate-y-0 sm:translate-x-2"
    x-transition:enter-end="translate-y-0 opacity-100 sm:translate-x-0"
    x-transition:leave="transition ease-in duration-100"
    x-transition:leave-start="opacity-100"
    x-transition:leave-end="opacity-0">
    {{ $slot }}
</div>