Alert Banner UI

<div
        class="max-w-xl w-full bg-indigo-600 p-6 rounded-[2rem] flex items-center justify-between text-white shadow-2xl shadow-indigo-200">
        <div class="flex items-center gap-5">
            <div class="w-12 h-12 bg-white/10 rounded-2xl flex items-center justify-center">
                <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                        d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
                </svg>
            </div>
            <div>
                <p class="font-bold text-sm">Security Update Available</p>
                <p class="text-xs opacity-70">A new patch is ready for your local environment.</p>
            </div>
        </div>
        <button
            class="bg-white text-indigo-600 px-5 py-2.5 rounded-xl font-bold text-xs hover:bg-indigo-50 transition-all active:scale-95">Update
            Now</button>
    </div>