Fix accessibility violations and improve user feedback in React components

[Copilot]

Several React components violated WCAG 2.1 guidelines and lacked proper user feedback patterns. Screen readers couldn't identify interactive elements, keyboard navigation was broken, and async operations provided no visual feedback.

Changes

Semantic HTML for interactive elements

• EnhancedDashboard.tsx: Changed widget add control from <div onClick> to <button>
• Enables keyboard navigation (Tab, Enter, Space) and proper screen reader announcements

ARIA labels for icon-only buttons

• Added descriptive labels to close buttons in ReportsDashboard.tsx, StockAdjustment.tsx, PurchaseOrderForm.tsx
• Added contextual labels to trend indicators in EnhancedDashboard.tsx

// Before: Screen reader announces only "button"
<button onClick={handleClose}>×</button>

// After: Screen reader announces "Close error message button"
<button onClick={handleClose} aria-label="Close error message">×</button>

Loading states for async operations

• OfflineBanner.tsx: Added disabled state and loading text to retry button
• Prevents double-submission and provides immediate feedback

Accessible confirmation dialogs

• ProjectList.tsx: Replaced native confirm() with ConfirmDialog component
• Implements focus trap, keyboard support (Tab, Escape), and proper ARIA attributes

// Before: Native confirm, no accessibility features
if (!confirm('Delete project?')) return;

// After: Full keyboard support, focus management, ARIA roles
const { confirm, ConfirmDialogComponent } = useConfirm({
  title: 'Delete Project',
  message: 'This action cannot be undone.',
  variant: 'danger'
});
const confirmed = await confirm();

WCAG 2.1 Compliance

• Level A: 1.1.1 (Non-text Content), 2.1.1 (Keyboard), 4.1.2 (Name, Role, Value)
• Level AA: 2.4.3 (Focus Order), 3.3.1 (Error Identification)

Documentation

Added docs/USABILITY_IMPROVEMENTS.md with detailed accessibility guidelines and code patterns for future development.

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.