<div class="flex flex-col items-center justify-center min-h-screen px-4 space-y-4">
<!-- Success Alert -->
<div class="flex items-center p-4 bg-green-100 dark:bg-green-900 border-l-4 border-green-500 dark:border-green-400 text-green-700 dark:text-green-200 w-full max-w-md rounded-r-lg">
<svg class="w-6 h-6 mr-2 rtl:mr-0 rtl:ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
</svg>
<span class="text-start">Success: Operation completed successfully!</span>
</div>
<!-- Error Alert -->
<div class="flex items-center p-4 bg-red-100 dark:bg-red-900 border-l-4 border-red-500 dark:border-red-400 text-red-700 dark:text-red-200 w-full max-w-md rounded-r-lg">
<svg class="w-6 h-6 mr-2 rtl:mr-0 rtl:ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
</svg>
<span class="text-start">Error: Something went wrong.</span>
</div>
<!-- Warning Alert -->
<div class="flex items-center p-4 bg-yellow-100 dark:bg-yellow-900 border-l-4 border-yellow-500 dark:border-yellow-400 text-yellow-700 dark:text-yellow-200 w-full max-w-md rounded-r-lg">
<svg class="w-6 h-6 mr-2 rtl:mr-0 rtl:ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
<span class="text-start">Warning: Proceed with caution.</span>
</div>
<!-- Info Alert -->
<div class="flex items-center p-4 bg-blue-100 dark:bg-blue-900 border-l-4 border-blue-500 dark:border-blue-400 text-blue-700 dark:text-blue-200 w-full max-w-md rounded-r-lg">
<svg class="w-6 h-6 mr-2 rtl:mr-0 rtl:ml-2" 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>
<span class="text-start">Info: Here's some information for you.</span>
</div>
</div>