Update card component styles for improved layout and consistency

- Adjusted padding and gap settings in the Card component for a more cohesive appearance.
- Enhanced the DataTableCard component by refining its class properties to ensure better alignment and visual consistency.

web/src/lib/components/data-table/data-table-card.svelte

@@ -19,7 +19,7 @@
 	} = $props();
 </script>
 
-<Card.Root class={cn('overflow-hidden rounded-lg border border-border shadow-sm', className)}>
+<Card.Root class={cn('gap-0 py-0 overflow-hidden rounded-lg border border-border shadow-sm', className)}>
 	{#if title}
 		<div class="border-b border-border bg-muted/40 px-4 py-3">
 			<Card.Title class="text-base font-semibold">{title}</Card.Title>

web/src/lib/components/ui/card/card.svelte

@@ -15,7 +15,7 @@
 	bind:this={ref}
 	data-slot="card"
 	data-size={size}
-	class={cn("ring-foreground/10 bg-card text-card-foreground gap-0 overflow-hidden rounded-xl py-0 text-sm ring-1 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-0 data-[size=sm]:py-0 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col", className)}
+	class={cn("ring-foreground/10 bg-card text-card-foreground gap-4 overflow-hidden rounded-xl py-4 text-sm ring-1 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col", className)}
 	{...restProps}
 >
 	{@render children?.()}