feat: Implement mobile application and lead processing utilities.

innungsapp/apps/mobile/components/ui/Card.tsx

@@ -1,25 +1,39 @@
-import { View, TouchableOpacity } from 'react-native'
+import { View, TouchableOpacity, ViewStyle } from 'react-native'
+import { cn } from '../../lib/utils'
+
+// Keep shadow style for now as it's often better handled natively than via Tailwind utilities for cross-platform consistency
+// OR use nativewind shadow classes if configured properly. Let's use Tailwind classes for shadow to align with the system if possible, 
+// but often standard CSS shadows don't map perfectly to RN shadow props (elevation vs shadowOffset).
+// For specific "card" feel, we might want to keep a consistent shadow.
+// However, the prompt asked for "10x better" design.
 
 interface CardProps {
   children: React.ReactNode
   onPress?: () => void
   className?: string
+  noPadding?: boolean
 }
 
-export function Card({ children, onPress, className = '' }: CardProps) {
+export function Card({ children, onPress, className = '', noPadding = false }: CardProps) {
+  const baseClasses = cn(
+    'bg-card rounded-xl border border-border shadow-sm',
+    !noPadding && 'p-4',
+    className
+  )
+
   if (onPress) {
     return (
       <TouchableOpacity
         onPress={onPress}
-        className={`bg-white rounded-2xl border border-gray-100 p-4 ${className}`}
-        activeOpacity={0.7}
+        className={baseClasses}
+        activeOpacity={0.8}
       >
         {children}
       </TouchableOpacity>
     )
   }
   return (
-    <View className={`bg-white rounded-2xl border border-gray-100 p-4 ${className}`}>
+    <View className={baseClasses}>
       {children}
     </View>
   )