feat: Enhance UX with animations, loaders, fixes, and doc updates

- Animations: Added global page transitions and smooth sidebar toggle
- Loaders: Implemented branded Loader component and page loading states
- Fixes: Resolved hook order violations in Maps/Dashboard; fixed Layout import
- Docs: Updated README with correct demo credentials and feature list

src/components/PageTransition.jsx

@@ -0,0 +1,23 @@
+import React, { useEffect, useState } from 'react';
+import { useLocation } from 'react-router-dom';
+
+const PageTransition = ({ children }) => {
+    const location = useLocation();
+    const [displayLocation, setDisplayLocation] = useState(location);
+    const [transitionStage, setTransitionStage] = useState('fadeIn');
+
+    // Simple Fade In animation on mount/route change
+    // Note: For complex exit animations, we'd need a more robust library like framer-motion.
+    // Given the constraints and desire for "speed", a quick fade-in is often best.
+
+    return (
+        <div
+            key={location.pathname}
+            className="animate-in fade-in slide-in-from-bottom-4 duration-500 ease-out fill-mode-forwards"
+        >
+            {children}
+        </div>
+    );
+};
+
+export default PageTransition;