fix: make agent cards clickable

src/components/agents/AgentList.tsx

@@ -79,8 +79,15 @@ export default function AgentList() {
         {agents.map((agent) => (
           <div
             key={agent.id}
-            className="flex items-start justify-between gap-4 rounded-lg border border-gray-200 bg-white p-4"
+            className="group relative rounded-lg border border-gray-200 bg-white p-4 transition hover:border-blue-300 hover:shadow-sm focus-within:border-blue-400 focus-within:ring-2 focus-within:ring-blue-100"
           >
+            <Link
+              to={`/agents/${agent.id}/edit`}
+              aria-label={`Edit ${agent.name}`}
+              className="absolute inset-0 rounded-lg focus-visible:outline-none"
+            />
+
+            <div className="pointer-events-none relative z-10 flex items-start justify-between gap-4">
               <div className="min-w-0 flex-1">
                 <div className="flex items-center gap-2">
                   <span className="text-sm font-medium">{agent.name}</span>
@@ -105,14 +112,8 @@ export default function AgentList() {
                 )}
               </div>
 
-            <div className="flex shrink-0 items-center gap-2">
-              <Link
-                to={`/agents/${agent.id}/edit`}
-                className="rounded bg-gray-200 px-3 py-1 text-xs text-gray-700 hover:bg-gray-300"
-              >
-                Edit
-              </Link>
               {!agent.is_default && (
+                <div className="pointer-events-auto shrink-0">
                   <button
                     type="button"
                     onClick={() => setAgentToDelete(agent)}
@@ -120,6 +121,7 @@ export default function AgentList() {
                   >
                     Delete
                   </button>
+                </div>
               )}
             </div>
           </div>