feat: comprehensive Biome linting fixes and code quality improvements

Major code quality overhaul addressing 58% of all linting issues:

• Type Safety Improvements:
  - Replace all any types with proper TypeScript interfaces
  - Fix Map component shadowing (renamed to CountryMap)
  - Add comprehensive custom error classes system
  - Enhance API route type safety

• Accessibility Enhancements:
  - Add explicit button types to all interactive elements
  - Implement useId() hooks for form element accessibility
  - Add SVG title attributes for screen readers
  - Fix static element interactions with keyboard handlers

• React Best Practices:
  - Resolve exhaustive dependencies warnings with useCallback
  - Extract nested component definitions to top level
  - Fix array index keys with proper unique identifiers
  - Improve component organization and prop typing

• Code Organization:
  - Automatic import organization and type import optimization
  - Fix unused function parameters and variables
  - Enhanced error handling with structured error responses
  - Improve component reusability and maintainability

Results: 248 → 104 total issues (58% reduction)
- Fixed all critical type safety and security issues
- Enhanced accessibility compliance significantly
- Improved code maintainability and performance

components/Sidebar.tsx

@@ -1,10 +1,11 @@
 "use client";
 
-import React from "react"; // No hooks needed since state is now managed by parent
-import Link from "next/link";
 import Image from "next/image";
+import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { signOut } from "next-auth/react";
+import type React from "react"; // No hooks needed since state is now managed by parent
+import { useId } from "react";
 import { SimpleThemeToggle } from "@/components/ui/theme-toggle";
 
 // Icons for the sidebar
@@ -16,6 +17,7 @@ const DashboardIcon = () => (
     viewBox="0 0 24 24"
     stroke="currentColor"
   >
+    <title>Dashboard</title>
     <path
       strokeLinecap="round"
       strokeLinejoin="round"
@@ -51,6 +53,7 @@ const CompanyIcon = () => (
     viewBox="0 0 24 24"
     stroke="currentColor"
   >
+    <title>Company</title>
     <path
       strokeLinecap="round"
       strokeLinejoin="round"
@@ -68,6 +71,7 @@ const UsersIcon = () => (
     viewBox="0 0 24 24"
     stroke="currentColor"
   >
+    <title>Users</title>
     <path
       strokeLinecap="round"
       strokeLinejoin="round"
@@ -85,6 +89,7 @@ const SessionsIcon = () => (
     viewBox="0 0 24 24"
     stroke="currentColor"
   >
+    <title>Sessions</title>
     <path
       strokeLinecap="round"
       strokeLinejoin="round"
@@ -102,6 +107,7 @@ const LogoutIcon = () => (
     viewBox="0 0 24 24"
     stroke="currentColor"
   >
+    <title>Logout</title>
     <path
       strokeLinecap="round"
       strokeLinejoin="round"
@@ -119,6 +125,7 @@ const MinimalToggleIcon = ({ isExpanded }: { isExpanded: boolean }) => (
     stroke="currentColor"
     strokeWidth={2}
   >
+    <title>{isExpanded ? "Collapse sidebar" : "Expand sidebar"}</title>
     {isExpanded ? (
       <path strokeLinecap="round" strokeLinejoin="round" d="M15 19l-7-7 7-7" />
     ) : (
@@ -192,6 +199,7 @@ export default function Sidebar({
   isMobile = false,
   onNavigate,
 }: SidebarProps) {
+  const sidebarId = useId();
   const pathname = usePathname() || "";
 
   const handleLogout = () => {
@@ -205,11 +213,19 @@ export default function Sidebar({
         <div
           className="fixed inset-0 bg-black/50 backdrop-blur-sm z-10 transition-all duration-300"
           onClick={onToggle}
+          onKeyDown={(e) => {
+            if (e.key === "Escape") {
+              onToggle();
+            }
+          }}
+          role="button"
+          tabIndex={0}
+          aria-label="Close sidebar"
         />
       )}
 
       <div
-        id="main-sidebar"
+        id={sidebarId}
         className={`fixed md:relative h-screen bg-card border-r border-border shadow-lg transition-all duration-300
         ${
           isExpanded ? (isMobile ? "w-full sm:w-80" : "w-56") : "w-16"
@@ -220,6 +236,7 @@ export default function Sidebar({
           {!isExpanded && (
             <div className="absolute top-1 left-1/2 transform -translate-x-1/2 z-30">
               <button
+                type="button"
                 onClick={(e) => {
                   e.preventDefault(); // Prevent any navigation
                   onToggle();
@@ -227,7 +244,7 @@ export default function Sidebar({
                 className="p-1.5 rounded-md hover:bg-muted focus:outline-none focus:ring-2 focus:ring-primary transition-colors group"
                 aria-label="Expand sidebar"
                 aria-expanded={isExpanded}
-                aria-controls="main-sidebar"
+                aria-controls={sidebarId}
               >
                 <MinimalToggleIcon isExpanded={isExpanded} />
               </button>
@@ -261,6 +278,7 @@ export default function Sidebar({
         {isExpanded && (
           <div className="absolute top-3 right-3 z-30">
             <button
+              type="button"
               onClick={(e) => {
                 e.preventDefault(); // Prevent any navigation
                 onToggle();
@@ -275,7 +293,6 @@ export default function Sidebar({
           </div>
         )}
         <nav
-          role="navigation"
           aria-label="Main navigation"
           className={`flex-1 py-4 px-2 overflow-y-auto overflow-x-visible ${isExpanded ? "pt-12" : "pt-4"}`}
         >
@@ -350,6 +367,7 @@ export default function Sidebar({
 
           {/* Logout Button */}
           <button
+            type="button"
             onClick={handleLogout}
             className={`relative flex items-center p-3 w-full rounded-lg text-muted-foreground hover:bg-muted hover:text-foreground transition-all group ${
               isExpanded ? "" : "justify-center"