feat: introduce XtreamServiceMobile for IPTV API interactions and DnsFallbackInterceptor for network robustness.

lib/mobile/widgets/mobile_scaffold.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import '../../core/theme/app_colors.dart';
+import 'tv_focusable.dart';
 
 class MobileScaffold extends ConsumerWidget {
   final Widget child;
@@ -17,39 +18,72 @@ class MobileScaffold extends ConsumerWidget {
   @override
   Widget build(BuildContext context, WidgetRef ref) {
     return Scaffold(
-      extendBody: true, // Allow content behind nav bar if transparent
       backgroundColor: AppColors.background,
-      body: child,
-      bottomNavigationBar: Container(
+      body: Column(
+        children: [
+          // Top Navigation Bar (TV Friendly)
+          Container(
+            padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 16),
+            decoration: BoxDecoration(
+              color: AppColors.surface,
+              boxShadow: [
+                BoxShadow(
+                  color: Colors.black.withOpacity(0.3),
+                  blurRadius: 8,
+                  offset: const Offset(0, 2),
+                ),
+              ],
+            ),
+            child: SafeArea(
+              bottom: false,
+              child: Row(
+                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+                children: [
+                  _buildNavItem(0, 'Live TV', Icons.tv),
+                  _buildNavItem(1, 'Films', Icons.movie),
+                  _buildNavItem(2, 'Séries', Icons.video_library),
+                  _buildNavItem(3, 'Paramètres', Icons.settings),
+                ],
+              ),
+            ),
+          ),
+          
+          // Main Content
+          Expanded(child: child),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildNavItem(int index, String label, IconData icon) {
+    final isSelected = currentIndex == index;
+    return TVFocusable(
+      onPressed: () => onIndexChanged(index),
+      scale: 1.1,
+      borderRadius: BorderRadius.circular(8),
+      child: Container(
+        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
         decoration: BoxDecoration(
-          border: Border(top: BorderSide(color: AppColors.border.withOpacity(0.5), width: 0.5)),
+          color: isSelected ? AppColors.primary.withOpacity(0.15) : null,
+          borderRadius: BorderRadius.circular(8),
+          border: isSelected ? Border.all(color: AppColors.primary.withOpacity(0.5)) : null,
         ),
-        child: BottomNavigationBar(
-          currentIndex: currentIndex,
-          onTap: onIndexChanged,
-          backgroundColor: AppColors.surface.withOpacity(0.95), // Highly opaque for readability
-          type: BottomNavigationBarType.fixed,
-          showSelectedLabels: true,
-          showUnselectedLabels: true,
-          items: const [
-            BottomNavigationBarItem(
-              icon: Icon(Icons.tv),
-              label: 'Live',
+        child: Row(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Icon(
+              icon, 
+              color: isSelected ? AppColors.primary : AppColors.textSecondary,
+              size: 20,
             ),
-            BottomNavigationBarItem(
-              icon: Icon(Icons.movie_outlined),
-              activeIcon: Icon(Icons.movie),
-              label: 'Movies',
-            ),
-            BottomNavigationBarItem(
-              icon: Icon(Icons.video_library_outlined),
-              activeIcon: Icon(Icons.video_library),
-              label: 'Series',
-            ),
-            BottomNavigationBarItem(
-              icon: Icon(Icons.settings_outlined),
-              activeIcon: Icon(Icons.settings),
-              label: 'Settings',
+            const SizedBox(width: 8),
+            Text(
+              label,
+              style: TextStyle(
+                color: isSelected ? AppColors.primary : AppColors.textSecondary,
+                fontWeight: isSelected ? FontWeight.bold : FontWeight.w500,
+                fontSize: 14,
+              ),
             ),
           ],
         ),

lib/mobile/widgets/tv_focusable.dart

@@ -0,0 +1,130 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import '../../../../core/theme/app_colors.dart';
+
+class TVFocusable extends StatefulWidget {
+  final Widget child;
+  final VoidCallback? onPressed;
+  final VoidCallback? onFocus;
+  final FocusNode? focusNode;
+  final bool autofocus;
+  final double scale;
+  final double borderWidth;
+  final Color focusColor;
+  final BorderRadius? borderRadius;
+
+  const TVFocusable({
+    super.key,
+    required this.child,
+    this.onPressed,
+    this.onFocus,
+    this.focusNode,
+    this.autofocus = false,
+    this.scale = 1.05,
+    this.borderWidth = 3.0,
+    this.focusColor = Colors.white,
+    this.borderRadius,
+  });
+
+  @override
+  State<TVFocusable> createState() => _TVFocusableState();
+}
+
+class _TVFocusableState extends State<TVFocusable> {
+  late FocusNode _node;
+  bool _isFocused = false;
+
+  @override
+  void initState() {
+    super.initState();
+    _node = widget.focusNode ?? FocusNode();
+    _node.addListener(_onFocusChanged);
+  }
+
+  @override
+  void dispose() {
+    if (widget.focusNode == null) {
+      _node.dispose();
+    } else {
+      _node.removeListener(_onFocusChanged);
+    }
+    super.dispose();
+  }
+
+  void _onFocusChanged() {
+    if (_node.hasFocus != _isFocused) {
+      setState(() => _isFocused = _node.hasFocus);
+      if (_isFocused) {
+        widget.onFocus?.call();
+        _scrollToVisible();
+      }
+    }
+  }
+
+  void _scrollToVisible() {
+    WidgetsBinding.instance.addPostFrameCallback((_) {
+      if (!mounted) return;
+      Scrollable.ensureVisible(
+        context,
+        alignment: 0.5, // Center the item
+        duration: const Duration(milliseconds: 300),
+        curve: Curves.easeInOut,
+      );
+    });
+  }
+
+  void _handlePress() {
+    widget.onPressed?.call();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Focus(
+      focusNode: _node,
+      autofocus: widget.autofocus,
+      onKeyEvent: (node, event) {
+        if (event is KeyDownEvent) {
+          final key = event.logicalKey;
+          if (key == LogicalKeyboardKey.select ||
+              key == LogicalKeyboardKey.enter ||
+              key == LogicalKeyboardKey.space ||
+              key == LogicalKeyboardKey.gameButtonA ||
+              key == LogicalKeyboardKey.numpadEnter) {
+            _handlePress();
+            return KeyEventResult.handled;
+          }
+        }
+        return KeyEventResult.ignored;
+      },
+      child: GestureDetector(
+        onTap: _handlePress,
+        child: TweenAnimationBuilder<double>(
+          duration: const Duration(milliseconds: 200),
+          curve: Curves.easeOut,
+          tween: Tween<double>(
+            begin: 1.0,
+            end: _isFocused ? widget.scale : 1.0,
+          ),
+          builder: (context, scale, child) {
+            return Transform.scale(
+              scale: scale,
+              child: Container(
+                foregroundDecoration: _isFocused
+                    ? BoxDecoration(
+                        border: Border.all(
+                          color: widget.focusColor,
+                          width: widget.borderWidth,
+                        ),
+                        borderRadius: widget.borderRadius ?? BorderRadius.circular(12),
+                      )
+                    : null,
+                child: child,
+              ),
+            );
+          },
+          child: widget.child,
+        ),
+      ),
+    );
+  }
+}