Enhance customer and profit analysis dialogs UI/UX

Revamps the customer details dialog with improved layout, animations, and clearer stats breakdown. Upgrades the profit analysis modal with animated cards, clearer tier breakdown, and improved cost/margin/profit explanations. Also increases recent activity fetch limit, fixes quote hydration in dashboard content, and minor animation tweak in order table.

components/dashboard/content.tsx

@@ -38,7 +38,13 @@ export default function Content({ username, orderStats }: ContentProps) {
   const [error, setError] = useState<string | null>(null);
   const { toast } = useToast();
 
-  const [randomQuote, setRandomQuote] = useState(getRandomQuote());
+  // Initialize with a default quote to match server-side rendering, then randomize on client
+  const [randomQuote, setRandomQuote] = useState({ text: "Loading wisdom...", author: "..." });
+
+  useEffect(() => {
+    // Determine quote on client-side to avoid hydration mismatch
+    setRandomQuote(getRandomQuote());
+  }, []);
 
   const fetchTopProducts = async () => {
     try {

components/dashboard/recent-activity.tsx

@@ -25,7 +25,7 @@ export default function RecentActivity() {
     useEffect(() => {
         async function fetchRecentOrders() {
             try {
-                const data = await clientFetch("/orders?limit=5&sortBy=orderDate&sortOrder=desc");
+                const data = await clientFetch("/orders?limit=10&sortBy=orderDate&sortOrder=desc");
                 setActivities(data.orders || []);
             } catch (error) {
                 console.error("Failed to fetch recent activity:", error);