feat: Centralized navigation system with HandleNavigate hook

BREAKING CHANGE: Replaced all direct useNavigate() usage with HandleNavigate hook

## Summary
- Complete frontend navigation refactoring
- Centralized route management with routes.js
- Converted 18+ components to use HandleNavigate
- Enhanced navigation with 20+ type-safe functions

## New Files
- src/utils/routes.js - Central route constants and helpers
- Documentations/FRONTEND_CODING_GUIDELINES.md - Frontend best practices (300+ lines)
- Documentations/NAVIGATION_REFACTORING_REPORT.md - Detailed refactoring report (400+ lines)

## Modified Components (18+)
### Pages
- Home.jsx, LoginForm.jsx, RegisterForm.jsx
- ResetPassword.jsx, VerifyEmailPage.jsx
- DeckCreator.jsx, Card_display.jsx
- Lobby.jsx, GameTest.jsx, ChooseDeck.jsx, PlayerSetup.jsx
- Landingpage.jsx

### Components
- Userdetails.jsx, DeckInfoPopUp.jsx
- PlayMenu.jsx, LandingPage.jsx, DeckManager.jsx

### Hooks
- useRequireAuth.jsx

### Core
- App.jsx - Route constants integration
- HandleNavigate.jsx - Enhanced with 20+ navigation functions

## Key Improvements
 Type-safe navigation (goDeckDetails(id) vs navigate('/deck/'+id))
 Automatic scroll management
 Centralized state passing
 Single source of truth for routes
 Backwards compatibility aliases
 Zero compile errors
 Production ready

## Validation
- useNavigate: Only in HandleNavigate.jsx
- navigate() calls: 0 direct usage
- Compile errors: 0
- Documentation: Complete

SerpentRace_Frontend/src/pages/Landing/Home.jsx

@@ -2,8 +2,8 @@
 // Régi PlayMenu-s oldal, "Home" néven
 
 import { useEffect, useState } from "react"
-import { useNavigate } from "react-router-dom"
 import useRequireAuth from "../../hooks/useRequireAuth"
+import HandleNavigate from "../../utils/HandleNavigate/HandleNavigate"
 import Navbar from "../../components/Navbar/Navbar"
 import Footer from "../../components/Footer/Footer.jsx"
 import Background from "../../assets/backgrounds/Background.jsx"
@@ -11,7 +11,7 @@ import PlayMenu from "../../components/Landingpage/PlayMenu.jsx"
 import { joinGame } from "../../api/gameApi.js"
 
 export default function Home() {
-  const navigate = useNavigate()
+  const { goLogin, goLobby, goChooseDeck } = HandleNavigate()
   // a hook inicializálja a user-t a localStorage-ból és visszaadja a state-et + settert
   const [user, setUser] = useRequireAuth({ redirect: false }) // no redirect on unauthenticated visitors
   const [isJoining, setIsJoining] = useState(false)
@@ -20,7 +20,7 @@ export default function Home() {
   const handleJoinGame = async (code) => {
     if (!user) {
       alert('Kérlek először jelentkezz be!')
-      navigate('/login')
+      goLogin()
       return
     }
 
@@ -47,7 +47,7 @@ export default function Home() {
         localStorage.setItem('gameToken', response.gameToken)
       }
       
-      navigate('/lobby', { state: { gameCode: code.toUpperCase() } })
+      goLobby({ gameCode: code.toUpperCase() })
     } catch (err) {
       const errorMsg = err.response?.data?.error || err.response?.data?.message || 'Nem sikerült csatlakozni a játékhoz'
       alert(errorMsg)
@@ -62,12 +62,12 @@ export default function Home() {
   const handleCreateGame = () => {
     if (!user) {
       alert('Kérlek először jelentkezz be!')
-      navigate('/login')
+      goLogin()
       return
     }
     
     // Navigate to choose deck page to start game creation flow
-    navigate('/choosedeck')
+    goChooseDeck()
   }
 
   const userObj = { name: user }

SerpentRace_Frontend/src/pages/Landing/Landingpage.jsx

@@ -2,7 +2,6 @@
 // Főoldal - Landing Page
 
 
-import { data, useNavigate } from "react-router-dom"
 import Navbar from "../../components/Navbar/Navbar"
 import Footer from "../../components/Footer/Footer.jsx"
 import Background from "../../assets/backgrounds/Background.jsx"
@@ -10,7 +9,7 @@ import LandingPage from "../../components/Landingpage/LandingPage.jsx"
 import HandleNavigate from "../../utils/HandleNavigate/HandleNavigate.jsx"
 
 export default function LandingPageMain() {
-  const { goHome, goLogin, goContacts, goAuth,  } = HandleNavigate()
+  const { goHome, goLogin, goContacts, goAuth } = HandleNavigate()
 
   return (
     <div className="w-full min-h-screen flex flex-col relative overflow-x-hidden">