feat: modernize main list pages from tables to card-based rows

New shared ListItemCard component: icon avatar, title/subtitle, trailing
badges/actions, chevron affordance when linked to a detail page. Applied
to the 9 primary data-list pages (Bienenstaende, Voelker, Koeniginnen,
Honigchargen, Aufgaben, Lager, Produkte, Inventar, Wiederkehrende
Aufgaben), replacing the plain HTML tables with the same rounded-card
list aesthetic already used elsewhere in the app (inspections,
treatments, varroa, etc.), for a consistent look across the whole
product. Admin/settings tables (Benutzer, Webhooks, Audit-Log, Import)
intentionally left as tables per user's scoping choice.

ApiCore-Frontend/src/app/(app)/apiaries/page.tsx

@@ -11,6 +11,7 @@ import { Badge } from "@/components/ui/badge";
 import { Input } from "@/components/ui/input";
 import { PageHeader } from "@/components/page-header";
 import { EmptyState } from "@/components/empty-state";
+import { ListItemCard } from "@/components/list-item-card";
 import {
   Select,
   SelectContent,
@@ -18,14 +19,6 @@ import {
   SelectTrigger,
   SelectValue,
 } from "@/components/ui/select";
-import {
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
-} from "@/components/ui/table";
 
 export default function ApiariesPage() {
   const [status, setStatus] = useState<ApiaryStatus | "">("");
@@ -92,32 +85,22 @@ export default function ApiariesPage() {
       ) : null}
 
       {apiaries && apiaries.length > 0 ? (
-        <Table>
-          <TableHeader>
-            <TableRow>
-              <TableHead>Name</TableHead>
-              <TableHead>Standort</TableHead>
-              <TableHead>Status</TableHead>
-            </TableRow>
-          </TableHeader>
-          <TableBody>
-            {apiaries.map((apiary) => (
-              <TableRow key={apiary.id}>
-                <TableCell>
-                  <Link className="underline" href={`/apiaries/${apiary.id}`}>
-                    {apiary.name}
-                  </Link>
-                </TableCell>
-                <TableCell>{apiary.location ?? "—"}</TableCell>
-                <TableCell>
-                  <Badge variant={apiary.status === "ACTIVE" ? "default" : "secondary"}>
-                    {apiary.status === "ACTIVE" ? "Aktiv" : "Inaktiv"}
-                  </Badge>
-                </TableCell>
-              </TableRow>
-            ))}
-          </TableBody>
-        </Table>
+        <div className="flex flex-col gap-2">
+          {apiaries.map((apiary) => (
+            <ListItemCard
+              key={apiary.id}
+              href={`/apiaries/${apiary.id}`}
+              icon={MapPin}
+              title={apiary.name}
+              subtitle={apiary.location ?? "—"}
+              trailing={
+                <Badge variant={apiary.status === "ACTIVE" ? "default" : "secondary"}>
+                  {apiary.status === "ACTIVE" ? "Aktiv" : "Inaktiv"}
+                </Badge>
+              }
+            />
+          ))}
+        </div>
       ) : null}
     </main>
   );