Refactor error handling in SendDialog component

- Replaced the Alert component with a custom error display using a div for better styling and user experience.
- Updated the error message presentation to enhance visibility and maintain consistency with the overall UI design.

These changes improve the user feedback mechanism in the SendDialog, ensuring errors are communicated effectively.

src/modules/wallet/components/SendDialog.vue

@@ -9,7 +9,6 @@ import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'
 import { Textarea } from '@/components/ui/textarea'
 import { Label } from '@/components/ui/label'
-import { Alert, AlertDescription } from '@/components/ui/alert'
 import { Send, AlertCircle, Loader2 } from 'lucide-vue-next'
 import { FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form'
 
@@ -150,12 +149,10 @@ const destinationType = computed(() => {
           </FormItem>
         </FormField>
 
-        <Alert v-if="error" variant="destructive">
+        <div v-if="error" class="flex items-start gap-2 p-3 bg-destructive/15 text-destructive rounded-lg">
-          <AlertCircle class="h-4 w-4" />
+          <AlertCircle class="h-4 w-4 mt-0.5" />
-          <AlertDescription>
+          <span class="text-sm">{{ error }}</span>
-            {{ error }}
+        </div>
-          </AlertDescription>
-        </Alert>
 
         <div class="flex gap-2 pt-4">
           <Button