Initial commit: Full project structure

- Backend: NestJS with Docker
- Frontend: Next.js with Docker
- Nginx configuration for reverse proxy
- PostgreSQL setup
- Docker compose for orchestration
- Development environment configuration

frontend/src/components/ui/OrganizationCard.tsx

@@ -0,0 +1,38 @@
+// src/components/ui/OrganizationCard.tsx
+import React from 'react';
+import { Building2, Beaker, ChevronRight } from 'lucide-react';
+import { Organization } from '@/types';
+
+interface OrganizationCardProps {
+  organization: Organization;
+  onSelect: (id: string) => void;
+}
+
+export const OrganizationCard: React.FC<OrganizationCardProps> = ({
+  organization,
+  onSelect,
+}) => {
+  const Icon = organization.type === 'CLINIC' ? Building2 : Beaker;
+  const typeText = organization.type === 'CLINIC' ? 'Dental Clinic' : 'Dental Lab';
+
+  return (
+    <button
+      onClick={() => onSelect(organization.id)}
+      className="w-full bg-white p-6 rounded-xl shadow-sm border border-gray-200 hover:border-primary-300 hover:shadow-md transition-all text-left flex items-center gap-4 group"
+    >
+      <div className="p-3 bg-primary-50 rounded-lg text-primary-600">
+        <Icon className="h-8 w-8" />
+      </div>
+      <div className="flex-1">
+        <h3 className="text-lg font-semibold text-gray-900">{organization.name}</h3>
+        <p className="text-sm text-gray-500">{typeText}</p>
+        {organization.plan && (
+          <p className="text-xs text-gray-400 mt-1">
+            Plan: {organization.plan.name} • {organization.plan.maxUsers} users
+          </p>
+        )}
+      </div>
+      <ChevronRight className="h-5 w-5 text-gray-400 group-hover:text-primary-600 transition-colors" />
+    </button>
+  );
+};