Configuración inicial del proyecto: estructura de directorios y dependencias mínimas instaladas

components/common/Loading.tsx

@@ -0,0 +1,30 @@
+export function Loading() {
+  return (
+    <div className="flex items-center justify-center p-8 min-h-[200px]">
+      <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-turo-accent" />
+    </div>
+  );
+}
+
+export function LoadingSkeleton() {
+  return (
+    <div className="animate-pulse space-y-4 p-4">
+      <div className="h-4 bg-gray-200 rounded w-3/4" />
+      <div className="h-4 bg-gray-200 rounded w-1/2" />
+      <div className="h-4 bg-gray-200 rounded w-5/6" />
+    </div>
+  );
+}
+
+export function CardSkeleton() {
+  return (
+    <div className="animate-pulse border rounded-lg p-6 space-y-4">
+      <div className="h-48 bg-gray-200 rounded" />
+      <div className="space-y-2">
+        <div className="h-4 bg-gray-200 rounded w-3/4" />
+        <div className="h-4 bg-gray-200 rounded w-1/2" />
+      </div>
+    </div>
+  );
+}
+