diff --git a/AppImage/components/network-metrics.tsx b/AppImage/components/network-metrics.tsx
index 0d9386a..ae8a59f 100644
--- a/AppImage/components/network-metrics.tsx
+++ b/AppImage/components/network-metrics.tsx
@@ -3,7 +3,7 @@
 import { useState } from "react"
 import { Card, CardContent, CardHeader, CardTitle } from "./ui/card"
 import { Badge } from "./ui/badge"
-import { Dialog, DialogContent, DialogHeader, DialogTitle } from "./ui/dialog"
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from "./ui/dialog"
 import { Wifi, Activity, Network, Router, AlertCircle, Zap } from "lucide-react"
 import useSWR from "swr"
 import { NetworkTrafficChart } from "./network-traffic-chart"
@@ -688,6 +688,9 @@ export function NetworkMetrics() {
               <Router className="h-5 w-5" />
               {selectedInterface?.name} - Interface Details
             </DialogTitle>
+            <DialogDescription>
+              View detailed information and network traffic statistics for this interface
+            </DialogDescription>
             {selectedInterface?.status.toLowerCase() === "up" && selectedInterface?.vm_type !== "vm" && (
               <div className="flex justify-end pt-2">
                 <Select value={modalTimeframe} onValueChange={(value: any) => setModalTimeframe(value)}>
diff --git a/AppImage/components/virtual-machines.tsx b/AppImage/components/virtual-machines.tsx
index 85c211e..5d82ec5 100644
--- a/AppImage/components/virtual-machines.tsx
+++ b/AppImage/components/virtual-machines.tsx
@@ -7,7 +7,7 @@ import { Card, CardContent, CardHeader, CardTitle } from "./ui/card"
 import { Badge } from "./ui/badge"
 import { Progress } from "./ui/progress"
 import { Button } from "./ui/button"
-import { Dialog, DialogContent, DialogHeader, DialogTitle } from "./ui/dialog"
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from "./ui/dialog"
 import {
   Server,
   Play,
@@ -1044,7 +1044,6 @@ export function VirtualMachines() {
       >
         <DialogContent
           className="max-w-4xl h-[95vh] sm:h-[90vh] flex flex-col p-0 overflow-hidden"
-          aria-describedby="vm-dialog-description"
           key={selectedVM?.vmid || "no-vm"}
         >
           {currentView === "main" ? (
@@ -1100,9 +1099,10 @@ export function VirtualMachines() {
                     )}
                   </div>
                 </DialogTitle>
-                <p id="vm-dialog-description" className="sr-only">
-                  Virtual machine details and controls for {selectedVM?.name}
-                </p>
+                <DialogDescription>
+                  View and manage configuration, resources, and status for this virtual machine
+                </DialogDescription>
+                {/* </CHANGE> */}
               </DialogHeader>
 
               <div className="flex-1 overflow-y-auto px-6 py-4">