fix: restore and stabilize tab navigation with Alpine.js

- Fixed navigation blockage by moving Alpine state to body scope
- Resolved CSS display conflicts between legacy .active class and x-show
- Synchronized legacy auth logic with Alpine global state
- Redirected legacy switchTab calls to Alpine events
- Removed obsolete tabs.js and updated home section initialization
- Added E2E navigation test placeholder

templates/base.html

@@ -23,7 +23,6 @@
     <script src="/static/js/anime-details.js?v=1.12" defer></script>
     <script src="/static/js/series-search.js?v=1.11" defer></script>
     <script src="/static/js/recommendations.js?v=1.11" defer></script>
-    <script src="/static/js/tabs.js?v=1.11" defer></script>
     <script src="/static/js/watchlist.js?v=1.11" defer></script>
     <script src="/static/js/watchlist-ui.js?v=1.11" defer></script>
     <script src="/static/js/main.js?v=1.11" defer></script>

templates/components/header.html

@@ -26,9 +26,8 @@
     <p style="color: #00d9ff; margin: 0 0 10px 0;">👋 Bienvenue! <a href="/login" style="color: #00d9ff; text-decoration: underline;">Connectez-vous</a> pour télécharger des vidéos</p>
 </div>
 
-<!-- Tabs - Shown only when authenticated -->
-<div id="mainTabs" class="tabs" x-show="isAuthenticated" x-cloak style="visibility: visible;">
-    <button class="tab" :class="{ 'active': activeTab === 'home' }" @click="activeTab = 'home'">
+<div id="mainTabs" class="tabs" x-show="isAuthenticated" x-cloak style="visibility: visible; display: flex;">
+    <button class="tab" :class="{ 'active': activeTab === 'home' }" @click="activeTab = 'home'; if (typeof loadHomeContent === 'function') loadHomeContent()">
         <svg style="width:16px;height:16px;vertical-align:middle;margin-right:5px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"></path>
         </svg>

templates/components/home_section.html

@@ -1,5 +1,5 @@
 <!-- Home Section: Recommendations & Latest Releases -->
-<div id="tab-home" class="tab-content active">
+<div id="tab-home" class="tab-content" x-show="activeTab === 'home'" x-init="if (activeTab === 'home') loadHomeContent()">
     <!-- Loading State -->
     <div id="homeLoading" class="loading-spinner">Chargement des recommandations...</div>