feat: Implement initial mobile application structure including IPTV features, authentication, routing, and theming.

lib/mobile/features/iptv/widgets/mobile_live_tv_tab.dart

@@ -0,0 +1,290 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:google_fonts/google_fonts.dart';
+import '../../../../features/iptv/providers/xtream_provider.dart';
+import '../../../../features/iptv/providers/settings_provider.dart';
+import '../../../../features/iptv/providers/favorites_provider.dart';
+import '../screens/mobile_player_screen.dart';
+import '../../../../core/models/iptv_models.dart';
+import '../../../../core/models/playlist_config.dart';
+import '../../../../core/theme/app_colors.dart';
+import '../../theme/mobile_theme.dart';
+import '../../../../core/widgets/components/ui_components.dart'; // For images/CachedNetworkImage if needed
+
+class MobileLiveTVTab extends ConsumerStatefulWidget {
+  final PlaylistConfig playlist;
+  const MobileLiveTVTab({super.key, required this.playlist});
+
+  @override
+  ConsumerState<MobileLiveTVTab> createState() => _MobileLiveTVTabState();
+}
+
+class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
+  String? _selectedCategory;
+  final TextEditingController _searchController = TextEditingController();
+  String _searchQuery = '';
+  bool _showFavoritesOnly = false;
+
+  @override
+  void initState() {
+    super.initState();
+    _searchController.addListener(() {
+      setState(() {
+        _searchQuery = _searchController.text.toLowerCase();
+      });
+    });
+  }
+
+  @override
+  void dispose() {
+    _searchController.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final channelsAsync = ref.watch(liveChannelsByPlaylistProvider(widget.playlist));
+    final favorites = ref.watch(favoritesProvider);
+    final settings = ref.watch(iptvSettingsProvider);
+
+    return Scaffold(
+      backgroundColor: AppColors.background,
+      body: channelsAsync.when(
+        loading: () => const Center(child: CircularProgressIndicator()),
+        error: (e, s) => Center(child: Text('Error: $e')),
+        data: (groupedChannels) {
+          // Prepare categories
+          var categories = groupedChannels.keys.toList();
+          if (settings.liveTvKeywords.isNotEmpty) {
+            categories = categories.where((cat) => settings.matchesLiveTvFilter(cat)).toList();
+          }
+          categories.sort();
+
+          // Prepare channels
+          List<Channel> displayedChannels = [];
+          if (_searchQuery.isNotEmpty) {
+            displayedChannels = groupedChannels.values.expand((l) => l)
+                .where((c) => c.name.toLowerCase().contains(_searchQuery))
+                .toList();
+          } else if (_showFavoritesOnly) {
+            displayedChannels = groupedChannels.values.expand((l) => l)
+                .where((c) => favorites.contains(c.streamId))
+                .toList();
+          } else {
+            // Default to first category if none selected
+            if (_selectedCategory == null && categories.isNotEmpty) {
+               _selectedCategory = categories.first;
+            }
+            if (_selectedCategory != null) {
+              displayedChannels = groupedChannels[_selectedCategory] ?? [];
+            }
+          }
+
+          return SafeArea(
+            bottom: false, // For bottom nav
+            child: Column(
+              children: [
+                // Search Bar
+                Padding(
+                  padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+                  child: Container(
+                    height: 48,
+                    decoration: BoxDecoration(
+                      color: AppColors.surface,
+                      borderRadius: BorderRadius.circular(12),
+                    ),
+                    padding: const EdgeInsets.symmetric(horizontal: 12),
+                    child: Row(
+                      children: [
+                        const Icon(Icons.search, color: AppColors.textSecondary),
+                        const SizedBox(width: 8),
+                        Expanded(
+                          child: TextField(
+                            controller: _searchController,
+                            style: const TextStyle(color: AppColors.textPrimary),
+                            decoration: const InputDecoration(
+                              hintText: 'Search channels',
+                              border: InputBorder.none,
+                              isDense: true,
+                            ),
+                          ),
+                        ),
+                        if (_searchQuery.isNotEmpty)
+                          GestureDetector(
+                            onTap: () => _searchController.clear(),
+                            child: const Icon(Icons.close, color: AppColors.textSecondary),
+                          ),
+                      ],
+                    ),
+                  ),
+                ),
+
+                // Categories (Chips)
+                if (_searchQuery.isEmpty && !_showFavoritesOnly)
+                  SizedBox(
+                    height: 40,
+                    child: ListView.separated(
+                      padding: const EdgeInsets.symmetric(horizontal: 16),
+                      scrollDirection: Axis.horizontal,
+                      itemCount: categories.length,
+                      separatorBuilder: (_, __) => const SizedBox(width: 8),
+                      itemBuilder: (context, index) {
+                        final category = categories[index];
+                        final isSelected = category == _selectedCategory;
+                        return ChoiceChip(
+                          label: Text(category),
+                          selected: isSelected,
+                          onSelected: (bool selected) {
+                            if (selected) {
+                              setState(() {
+                                _selectedCategory = category;
+                              });
+                            }
+                          },
+                          backgroundColor: AppColors.surface,
+                          selectedColor: AppColors.primary,
+                          labelStyle: TextStyle(
+                            color: isSelected ? Colors.white : AppColors.textSecondary,
+                            fontWeight: isSelected ? FontWeight.w600 : FontWeight.w400,
+                            fontSize: 12,
+                          ),
+                          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
+                          side: BorderSide.none,
+                          showCheckmark: false,
+                        );
+                      },
+                    ),
+                  ),
+                
+                // Content Switcher (Favorites button etc)
+                Padding(
+                  padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+                  child: Row(
+                    children: [
+                      Text(
+                        _searchQuery.isNotEmpty ? 'Search Results' : 
+                        _showFavoritesOnly ? 'Favorites' : 
+                        _selectedCategory ?? 'All Channels',
+                        style: const TextStyle(
+                          color: AppColors.textPrimary, 
+                          fontWeight: FontWeight.bold,
+                          fontSize: 16,
+                        ),
+                      ),
+                      const Spacer(),
+                      IconButton(
+                        icon: Icon(
+                          _showFavoritesOnly ? Icons.favorite : Icons.favorite_border,
+                          color: _showFavoritesOnly ? AppColors.error : AppColors.textSecondary,
+                        ),
+                        onPressed: () => setState(() => _showFavoritesOnly = !_showFavoritesOnly),
+                      ),
+                    ],
+                  ),
+                ),
+
+                // Channel List
+                Expanded(
+                  child: displayedChannels.isEmpty
+                      ? Center(
+                          child: Text(
+                            'No channels found',
+                            style: GoogleFonts.inter(color: AppColors.textSecondary),
+                          ),
+                        )
+                      : ListView.separated(
+                          padding: const EdgeInsets.fromLTRB(16, 0, 16, 80), // Bottom padding for FAB/Nav
+                          itemCount: displayedChannels.length,
+                          separatorBuilder: (_, __) => const SizedBox(height: 12),
+                          itemBuilder: (context, index) {
+                            final channel = displayedChannels[index];
+                            return _MobileChannelTile(
+                              channel: channel,
+                              onTap: () => _playChannel(context, channel),
+                            );
+                          },
+                        ),
+                ),
+              ],
+            ),
+          );
+        },
+      ),
+    );
+  }
+
+  void _playChannel(BuildContext context, Channel channel) {
+    Navigator.of(context).push(
+      MaterialPageRoute(
+        builder: (context) => MobilePlayerScreen(
+          streamId: channel.streamId,
+          title: channel.name,
+          playlist: widget.playlist,
+          streamType: StreamType.live,
+        ),
+      ),
+    );
+  }
+}
+
+class _MobileChannelTile extends StatelessWidget {
+  final Channel channel;
+  final VoidCallback onTap;
+
+  const _MobileChannelTile({required this.channel, required this.onTap});
+
+  @override
+  Widget build(BuildContext context) {
+    final iconUrl = channel.streamIcon.isNotEmpty && channel.streamIcon.startsWith('http') 
+        ? '/api/xtream/${channel.streamIcon}' 
+        : null;
+
+    return InkWell(
+      onTap: onTap,
+      borderRadius: BorderRadius.circular(12),
+      child: Container(
+        padding: const EdgeInsets.all(8),
+        decoration: BoxDecoration(
+          color: AppColors.surface,
+          borderRadius: BorderRadius.circular(12),
+        ),
+        child: Row(
+          children: [
+            // Icon
+            Container(
+              width: 50,
+              height: 50,
+              decoration: BoxDecoration(
+                color: Colors.black26,
+                borderRadius: BorderRadius.circular(8),
+              ),
+              child: iconUrl != null
+                  ? Image.network(
+                      iconUrl, 
+                      fit: BoxFit.contain,
+                      errorBuilder: (_, __, ___) => const Icon(Icons.tv, color: Colors.white24),
+                    )
+                  : const Icon(Icons.tv, color: Colors.white24),
+            ),
+            const SizedBox(width: 12),
+            // Name
+            Expanded(
+              child: Text(
+                channel.name,
+                style: const TextStyle(
+                  color: AppColors.textPrimary,
+                  fontWeight: FontWeight.w500,
+                  fontSize: 14,
+                ),
+                maxLines: 2,
+                overflow: TextOverflow.ellipsis,
+              ),
+            ),
+            // Play Icon
+            const Icon(Icons.play_circle_outline, color: AppColors.primary),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/mobile/features/iptv/widgets/mobile_movies_tab.dart

@@ -0,0 +1,271 @@
+import 'dart:async';
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import '../../../../core/models/playlist_config.dart';
+import '../../../../core/theme/app_colors.dart';
+import '../../../../core/theme/app_theme.dart';
+import '../../../../core/widgets/components/hero_carousel.dart';
+import '../../../../core/widgets/components/ui_components.dart';
+import '../../../../features/iptv/providers/watch_history_provider.dart';
+import '../../../../features/iptv/models/xtream_models.dart';
+import '../../../../features/iptv/providers/xtream_provider.dart';
+import '../../../../features/iptv/providers/settings_provider.dart';
+import '../screens/mobile_player_screen.dart';
+
+class MobileMoviesTab extends ConsumerStatefulWidget {
+  final PlaylistConfig playlist;
+  const MobileMoviesTab({super.key, required this.playlist});
+
+  @override
+  ConsumerState<MobileMoviesTab> createState() => _MobileMoviesTabState();
+}
+
+class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
+  final ScrollController _scrollController = ScrollController();
+  final TextEditingController _searchController = TextEditingController();
+  final List<Movie> _movies = [];
+  List<Movie>? _searchResults;
+  String _searchQuery = '';
+  bool _isLoading = false;
+  bool _isSearching = false;
+  bool _hasMore = true;
+  int _currentOffset = 0;
+  static const int _pageSize = 50; // Smaller page size for mobile
+  Timer? _searchDebounce;
+
+  @override
+  void initState() {
+    super.initState();
+    _loadMoreMovies();
+    _scrollController.addListener(_onScroll);
+  }
+
+  @override
+  void dispose() {
+    _scrollController.dispose();
+    _searchController.dispose();
+    _searchDebounce?.cancel();
+    super.dispose();
+  }
+
+  void _onScroll() {
+    if (_scrollController.position.pixels >=
+        _scrollController.position.maxScrollExtent * 0.8) {
+      _loadMoreMovies();
+    }
+  }
+
+  void _onSearchChanged(String query) {
+    _searchDebounce?.cancel();
+    setState(() {
+      _searchQuery = query;
+      if (query.isEmpty) {
+        _searchResults = null;
+        _isSearching = false;
+      }
+    });
+    
+    if (query.length >= 2) {
+      _searchDebounce = Timer(const Duration(milliseconds: 500), () {
+        _performSearch(query);
+      });
+    }
+  }
+
+  Future<void> _performSearch(String query) async {
+    if (query.isEmpty) return;
+    setState(() => _isSearching = true);
+    
+    try {
+      final service = ref.read(xtreamServiceProvider(widget.playlist));
+      final results = await service.searchMovies(query);
+      
+      if (mounted && _searchQuery == query) {
+        setState(() {
+          _searchResults = results;
+          _isSearching = false;
+        });
+      }
+    } catch (e) {
+      if (mounted) setState(() => _isSearching = false);
+    }
+  }
+
+  Future<void> _loadMoreMovies() async {
+    if (_isLoading || !_hasMore) return;
+
+    setState(() => _isLoading = true);
+
+    try {
+      final service = ref.read(xtreamServiceProvider(widget.playlist));
+      final newMovies = await service.getMoviesPaginated(
+        offset: _currentOffset,
+        limit: _pageSize,
+      );
+
+      if (mounted) {
+        setState(() {
+          _movies.addAll(newMovies);
+          _currentOffset += _pageSize;
+          _hasMore = newMovies.length == _pageSize;
+          _isLoading = false;
+        });
+      }
+    } catch (e) {
+      if (mounted) setState(() => _isLoading = false);
+    }
+  }
+
+  void _playMovie(Movie movie) {
+    ref.read(watchHistoryProvider.notifier).markMovieWatched(movie.streamId);
+    
+    Navigator.push(
+      context,
+      MaterialPageRoute(
+        builder: (context) => MobilePlayerScreen(
+          streamId: movie.streamId,
+          title: movie.name,
+          playlist: widget.playlist,
+          streamType: StreamType.vod,
+          containerExtension: movie.containerExtension ?? 'mp4',
+        ),
+      ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final settings = ref.watch(iptvSettingsProvider);
+    final watchHistory = ref.watch(watchHistoryProvider);
+    
+    List<Movie> displayMovies;
+    if (_searchQuery.isNotEmpty && _searchResults != null) {
+      displayMovies = _searchResults!;
+    } else {
+      displayMovies = settings.moviesKeywords.isEmpty
+          ? _movies
+          : _movies.where((m) => settings.matchesMoviesFilter(m.categoryName)).toList();
+    }
+
+    // Hero Items
+    final heroItems = _movies.take(3).map((m) => HeroItem(
+      id: m.streamId,
+      title: m.name,
+      imageUrl: m.streamIcon ?? '',
+      subtitle: m.rating != null ? '${m.rating} ★' : null,
+      onMoreInfo: () => _playMovie(m),
+    )).toList();
+
+    return SafeArea(
+      bottom: false,
+      child: CustomScrollView(
+        controller: _scrollController,
+        slivers: [
+          // Header & Search
+          SliverToBoxAdapter(
+            child: Padding(
+              padding: const EdgeInsets.all(16),
+              child: Container(
+                height: 40,
+                decoration: BoxDecoration(
+                  color: AppColors.surface,
+                  borderRadius: BorderRadius.circular(12),
+                  border: Border.all(color: AppColors.border),
+                ),
+                padding: const EdgeInsets.symmetric(horizontal: 12),
+                child: Row(
+                  children: [
+                    const Icon(Icons.search, size: 20, color: AppColors.textSecondary),
+                    const SizedBox(width: 8),
+                    Expanded(
+                      child: TextField(
+                        controller: _searchController,
+                        style: const TextStyle(fontSize: 14, color: AppColors.textPrimary),
+                        decoration: const InputDecoration(
+                          hintText: 'Search Movies',
+                          border: InputBorder.none,
+                          isDense: true,
+                          contentPadding: EdgeInsets.only(bottom: 11),
+                        ),
+                        onChanged: _onSearchChanged,
+                      ),
+                    ),
+                    if (_isSearching)
+                      const SizedBox(width: 12, height: 12, child: CircularProgressIndicator(strokeWidth: 2)),
+                    if (_searchQuery.isNotEmpty)
+                      GestureDetector(
+                        onTap: () {
+                           _searchController.clear();
+                           _onSearchChanged('');
+                        },
+                        child: const Icon(Icons.close, size: 16, color: AppColors.textSecondary),
+                      ),
+                  ],
+                ),
+              ),
+            ),
+          ),
+
+          // Hero Section (Only if not searching)
+          if (_searchQuery.isEmpty && heroItems.isNotEmpty)
+            SliverToBoxAdapter(
+              child: Padding(
+                padding: const EdgeInsets.only(bottom: 16),
+                child: SizedBox(
+                   height: 250, // Reduced height for mobile hero
+                   child: HeroCarousel(
+                     items: heroItems,
+                     onTap: (item) {
+                       final movie = _movies.firstWhere((element) => element.streamId == item.id);
+                       _playMovie(movie);
+                     },
+                   ),
+                ),
+              ),
+            ),
+          
+          // Grid
+          SliverPadding(
+            padding: const EdgeInsets.fromLTRB(16, 0, 16, 80), // Bottom padding for nav
+            sliver: SliverGrid(
+              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+                crossAxisCount: 2, // 2 columns for mobile
+                crossAxisSpacing: 12,
+                mainAxisSpacing: 16,
+                childAspectRatio: 0.65, // Standard poster ratio
+              ),
+              delegate: SliverChildBuilderDelegate(
+                (context, index) {
+                  if (index >= displayMovies.length) return null;
+                  final movie = displayMovies[index];
+                  final isWatched = watchHistory.isMovieWatched(movie.streamId);
+                  
+                  return MediaCard(
+                    title: movie.name,
+                    imageUrl: movie.streamIcon,
+                    subtitle: movie.rating != null ? '${movie.rating} ★' : null,
+                    rating: movie.rating,
+                    isWatched: isWatched,
+                    onTap: () => _playMovie(movie),
+                    onLongPress: () {
+                      ref.read(watchHistoryProvider.notifier).toggleMovieWatched(movie.streamId);
+                    },
+                  );
+                },
+                childCount: displayMovies.length,
+              ),
+            ),
+          ),
+          
+          if (_isLoading)
+            const SliverToBoxAdapter(
+              child: Padding(
+                padding: EdgeInsets.all(24),
+                child: Center(child: CircularProgressIndicator()),
+              ),
+            ),
+        ],
+      ),
+    );
+  }
+}

lib/mobile/features/iptv/widgets/mobile_series_tab.dart

@@ -0,0 +1,268 @@
+import 'dart:async';
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import '../../../../core/models/playlist_config.dart';
+import '../../../../core/theme/app_colors.dart';
+import '../../../../core/theme/app_theme.dart';
+import '../../../../core/widgets/components/hero_carousel.dart';
+import '../../../../core/widgets/components/ui_components.dart';
+import '../../../../features/iptv/models/xtream_models.dart';
+import '../../../../features/iptv/providers/xtream_provider.dart';
+import '../../../../features/iptv/providers/settings_provider.dart';
+import '../screens/mobile_series_detail_screen.dart';
+
+class MobileSeriesTab extends ConsumerStatefulWidget {
+  final PlaylistConfig playlist;
+  const MobileSeriesTab({super.key, required this.playlist});
+
+  @override
+  ConsumerState<MobileSeriesTab> createState() => _MobileSeriesTabState();
+}
+
+class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
+  final ScrollController _scrollController = ScrollController();
+  final TextEditingController _searchController = TextEditingController();
+  final List<Series> _series = [];
+  List<Series>? _searchResults;
+  String _searchQuery = '';
+  bool _isLoading = false;
+  bool _isSearching = false;
+  bool _hasMore = true;
+  int _currentOffset = 0;
+  static const int _pageSize = 50; 
+  Timer? _searchDebounce;
+
+  @override
+  void initState() {
+    super.initState();
+    _loadMoreSeries();
+    _scrollController.addListener(_onScroll);
+  }
+
+  @override
+  void dispose() {
+    _scrollController.dispose();
+    _searchController.dispose();
+    _searchDebounce?.cancel();
+    super.dispose();
+  }
+
+  void _onScroll() {
+    if (_scrollController.position.pixels >=
+        _scrollController.position.maxScrollExtent * 0.8) {
+      _loadMoreSeries();
+    }
+  }
+
+  void _onSearchChanged(String query) {
+    _searchDebounce?.cancel();
+    setState(() {
+      _searchQuery = query;
+      if (query.isEmpty) {
+        _searchResults = null;
+        _isSearching = false;
+      }
+    });
+    
+    if (query.length >= 2) {
+      _searchDebounce = Timer(const Duration(milliseconds: 500), () {
+        _performSearch(query);
+      });
+    }
+  }
+
+  Future<void> _performSearch(String query) async {
+    if (query.isEmpty) return;
+    setState(() => _isSearching = true);
+    
+    try {
+      final service = ref.read(xtreamServiceProvider(widget.playlist));
+      final results = await service.searchSeries(query);
+      
+      if (mounted && _searchQuery == query) {
+        setState(() {
+          _searchResults = results;
+          _isSearching = false;
+        });
+      }
+    } catch (e) {
+      if (mounted) setState(() => _isSearching = false);
+    }
+  }
+
+  Future<void> _loadMoreSeries() async {
+    if (_isLoading || !_hasMore) return;
+
+    setState(() => _isLoading = true);
+
+    try {
+      final service = ref.read(xtreamServiceProvider(widget.playlist));
+      final newSeries = await service.getSeriesPaginated(
+        offset: _currentOffset,
+        limit: _pageSize,
+      );
+
+      if (mounted) {
+        setState(() {
+          _series.addAll(newSeries);
+          _currentOffset += _pageSize;
+          _hasMore = newSeries.length == _pageSize;
+          _isLoading = false;
+        });
+      }
+    } catch (e) {
+      if (mounted) setState(() => _isLoading = false);
+    }
+  }
+
+  void _openSeries(Series series) {
+    Navigator.push(
+      context,
+      MaterialPageRoute(
+        builder: (context) => MobileSeriesDetailScreen(
+          series: series,
+          playlist: widget.playlist,
+        ),
+      ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final settings = ref.watch(iptvSettingsProvider);
+    
+    List<Series> displaySeries;
+    if (_searchQuery.isNotEmpty && _searchResults != null) {
+      displaySeries = _searchResults!;
+    } else {
+      displaySeries = settings.seriesKeywords.isEmpty
+          ? _series
+          : _series.where((s) => settings.matchesSeriesFilter(s.categoryName)).toList();
+    }
+
+    // Hero Items
+    final heroItems = _series.take(3).map((s) => HeroItem(
+      id: s.seriesId.toString(),
+      title: s.name,
+      imageUrl: s.cover ?? '',
+      subtitle: s.rating != null ? '${s.rating} ★' : null,
+      onMoreInfo: () => _openSeries(s),
+    )).toList();
+
+    return SafeArea(
+      bottom: false,
+      child: CustomScrollView(
+        controller: _scrollController,
+        slivers: [
+          // Header & Search
+          SliverToBoxAdapter(
+            child: Padding(
+              padding: const EdgeInsets.all(16),
+              child: Container(
+                height: 40,
+                decoration: BoxDecoration(
+                  color: AppColors.surface,
+                  borderRadius: BorderRadius.circular(12),
+                  border: Border.all(color: AppColors.border),
+                ),
+                padding: const EdgeInsets.symmetric(horizontal: 12),
+                child: Row(
+                  children: [
+                    const Icon(Icons.search, size: 20, color: AppColors.textSecondary),
+                    const SizedBox(width: 8),
+                    Expanded(
+                      child: TextField(
+                        controller: _searchController,
+                        style: const TextStyle(fontSize: 14, color: AppColors.textPrimary),
+                        decoration: const InputDecoration(
+                          hintText: 'Search Series',
+                          border: InputBorder.none,
+                          isDense: true,
+                          contentPadding: EdgeInsets.only(bottom: 11),
+                        ),
+                        onChanged: _onSearchChanged,
+                      ),
+                    ),
+                    if (_isSearching)
+                      const SizedBox(width: 12, height: 12, child: CircularProgressIndicator(strokeWidth: 2)),
+                    if (_searchQuery.isNotEmpty)
+                      GestureDetector(
+                        onTap: () {
+                           _searchController.clear();
+                           _onSearchChanged('');
+                        },
+                        child: const Icon(Icons.close, size: 16, color: AppColors.textSecondary),
+                      ),
+                  ],
+                ),
+              ),
+            ),
+          ),
+
+          // Hero Section
+          if (_searchQuery.isEmpty && heroItems.isNotEmpty)
+            SliverToBoxAdapter(
+              child: Padding(
+                padding: const EdgeInsets.only(bottom: 16),
+                child: SizedBox(
+                   height: 250,
+                   child: HeroCarousel(
+                     items: heroItems,
+                     onTap: (item) {
+                       // Find series by title fallback if ID logic differs (Series ID is int usually, Hero is Str)
+                       // But here we rely on passing the correct string ID or using the closure directly if possible.
+                       // HeroCarousel onTap returns HeroItem. 
+                       // We must map it back. 
+                       try {
+                         final series = _series.firstWhere((s) => s.seriesId.toString() == item.id);
+                         _openSeries(series);
+                       } catch (e) {
+                         // Fallback logic not critical for now, assume ID matches
+                       }
+                     },
+                   ),
+                ),
+              ),
+            ),
+          
+          // Grid
+          SliverPadding(
+            padding: const EdgeInsets.fromLTRB(16, 0, 16, 80),
+            sliver: SliverGrid(
+              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+                crossAxisCount: 2,
+                crossAxisSpacing: 12,
+                mainAxisSpacing: 16,
+                childAspectRatio: 0.65,
+              ),
+              delegate: SliverChildBuilderDelegate(
+                (context, index) {
+                  if (index >= displaySeries.length) return null;
+                  final series = displaySeries[index];
+                  
+                  return MediaCard(
+                    title: series.name,
+                    imageUrl: series.cover,
+                    subtitle: series.rating != null ? '${series.rating} ★' : null,
+                    rating: series.rating,
+                    placeholderIcon: Icons.tv,
+                    onTap: () => _openSeries(series),
+                  );
+                },
+                childCount: displaySeries.length,
+              ),
+            ),
+          ),
+          
+          if (_isLoading)
+            const SliverToBoxAdapter(
+              child: Padding(
+                padding: EdgeInsets.all(24),
+                child: Center(child: CircularProgressIndicator()),
+              ),
+            ),
+        ],
+      ),
+    );
+  }
+}

lib/mobile/features/iptv/widgets/mobile_settings_tab.dart

@@ -0,0 +1,318 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:go_router/go_router.dart';
+import 'package:google_fonts/google_fonts.dart';
+import '../../../../features/auth/providers/auth_provider.dart';
+import '../../../../features/iptv/providers/settings_provider.dart';
+import '../../../../core/providers/theme_provider.dart';
+import '../../../../core/theme/app_colors.dart';
+
+class MobileSettingsTab extends ConsumerStatefulWidget {
+  const MobileSettingsTab({super.key});
+
+  @override
+  ConsumerState<MobileSettingsTab> createState() => _MobileSettingsTabState();
+}
+
+class _MobileSettingsTabState extends ConsumerState<MobileSettingsTab> {
+  late TextEditingController _liveTvController;
+  late TextEditingController _moviesController;
+  late TextEditingController _seriesController;
+  bool _initialized = false;
+
+  @override
+  void initState() {
+    super.initState();
+    _liveTvController = TextEditingController();
+    _moviesController = TextEditingController();
+    _seriesController = TextEditingController();
+  }
+
+  @override
+  void dispose() {
+    _liveTvController.dispose();
+    _moviesController.dispose();
+    _seriesController.dispose();
+    super.dispose();
+  }
+
+  void _syncControllers(IptvSettings settings) {
+    if (!_initialized || _liveTvController.text != settings.liveTvCategoryFilter) {
+      _liveTvController.text = settings.liveTvCategoryFilter;
+    }
+    if (!_initialized || _moviesController.text != settings.moviesCategoryFilter) {
+      _moviesController.text = settings.moviesCategoryFilter;
+    }
+    if (!_initialized || _seriesController.text != settings.seriesCategoryFilter) {
+      _seriesController.text = settings.seriesCategoryFilter;
+    }
+    _initialized = true;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final currentUser = ref.watch(authProvider).currentUser;
+    final settings = ref.watch(iptvSettingsProvider);
+    final themeState = ref.watch(themeProvider);
+    final themeNotifier = ref.read(themeProvider.notifier);
+    final isDark = Theme.of(context).brightness == Brightness.dark;
+    
+    WidgetsBinding.instance.addPostFrameCallback((_) {
+      if (!_initialized) _syncControllers(settings);
+    });
+
+    return SafeArea(
+      child: ListView(
+        padding: const EdgeInsets.all(16),
+        children: [
+          // Header
+         Padding(
+            padding: const EdgeInsets.only(bottom: 24),
+            child: Text(
+              'Settings',
+              style: Theme.of(context).textTheme.headlineMedium,
+            ),
+          ),
+
+          // User Profile
+          Container(
+            padding: const EdgeInsets.all(16),
+            decoration: BoxDecoration(
+              color: AppColors.surface,
+              borderRadius: BorderRadius.circular(16),
+            ),
+            child: Row(
+              children: [
+                CircleAvatar(
+                  backgroundColor: AppColors.primary.withOpacity(0.2),
+                  child: Text(
+                    currentUser?.username.substring(0, 1).toUpperCase() ?? 'U',
+                    style: const TextStyle(fontWeight: FontWeight.bold, color: AppColors.primary),
+                  ),
+                ),
+                const SizedBox(width: 16),
+                Expanded(
+                  child: Column(
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    children: [
+                      Text(
+                        currentUser?.username ?? 'Guest',
+                        style: const TextStyle(
+                          fontSize: 16,
+                          fontWeight: FontWeight.bold,
+                          color: AppColors.textPrimary,
+                        ),
+                      ),
+                      if (currentUser?.isAdmin ?? false)
+                        Container(
+                          margin: const EdgeInsets.only(top: 4),
+                          padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
+                          decoration: BoxDecoration(
+                            color: AppColors.primary.withOpacity(0.2),
+                            borderRadius: BorderRadius.circular(4),
+                          ),
+                          child: const Text('ADMIN', style: TextStyle(fontSize: 10, color: AppColors.primary, fontWeight: FontWeight.bold)),
+                        ),
+                    ],
+                  ),
+                ),
+              ],
+            ),
+          ),
+          const SizedBox(height: 24),
+
+          // Appearance
+          _SectionHeader(title: 'Appearance'),
+          Container(
+            decoration: BoxDecoration(
+              color: AppColors.surface,
+              borderRadius: BorderRadius.circular(16),
+            ),
+            child: Column(
+              children: [
+                SwitchListTile(
+                  title: const Text('Dark Mode', style: TextStyle(color: AppColors.textPrimary)),
+                  secondary:  Icon(isDark ? Icons.dark_mode : Icons.light_mode, color: AppColors.primary),
+                  value: isDark,
+                  onChanged: (_) => themeNotifier.toggleTheme(),
+                  activeColor: AppColors.primary,
+                ),
+              ],
+            ),
+          ),
+          const SizedBox(height: 24),
+
+          // Content Filters
+          _SectionHeader(title: 'Content Filters'),
+          Container(
+            decoration: BoxDecoration(
+              color: AppColors.surface,
+              borderRadius: BorderRadius.circular(16),
+            ),
+            padding: const EdgeInsets.all(16),
+            child: Column(
+              children: [
+                _FilterInput(
+                  label: 'Live TV Keywords',
+                  icon: Icons.live_tv,
+                  controller: _liveTvController,
+                  onChanged: (val) => ref.read(iptvSettingsProvider.notifier).setLiveTvFilter(val),
+                ),
+                const Divider(height: 24),
+                _FilterInput(
+                  label: 'Movies Keywords',
+                  icon: Icons.movie,
+                  controller: _moviesController,
+                  onChanged: (val) => ref.read(iptvSettingsProvider.notifier).setMoviesFilter(val),
+                ),
+                const Divider(height: 24),
+                _FilterInput(
+                  label: 'Series Keywords',
+                  icon: Icons.tv,
+                  controller: _seriesController,
+                  onChanged: (val) => ref.read(iptvSettingsProvider.notifier).setSeriesFilter(val),
+                ),
+              ],
+            ),
+          ),
+          const SizedBox(height: 24),
+
+          // Actions
+          if (currentUser?.isAdmin ?? false)
+            _SettingsButton(
+              icon: Icons.admin_panel_settings,
+              label: 'Admin Panel',
+              onTap: () => context.go('/admin'),
+            ),
+          const SizedBox(height: 12),
+          _SettingsButton(
+            icon: Icons.playlist_play,
+            label: 'Change Playlist',
+            onTap: () => context.go('/playlists'),
+          ),
+          const SizedBox(height: 32),
+          
+          FilledButton.icon(
+             onPressed: () {
+               ref.read(authProvider.notifier).logout();
+               context.go('/login');
+             },
+             style: FilledButton.styleFrom(
+               backgroundColor: AppColors.error.withOpacity(0.1),
+               foregroundColor: AppColors.error,
+               minimumSize: const Size(double.infinity, 50),
+             ),
+             icon: const Icon(Icons.logout),
+             label: const Text('Logout'),
+          ),
+          const SizedBox(height: 100),
+        ],
+      ),
+    );
+  }
+}
+
+class _SectionHeader extends StatelessWidget {
+  final String title;
+  const _SectionHeader({required this.title});
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.only(left: 8, bottom: 8),
+      child: Text(
+        title,
+        style: GoogleFonts.inter(
+          fontSize: 14,
+          fontWeight: FontWeight.w600,
+          color: AppColors.textSecondary,
+        ),
+      ),
+    );
+  }
+}
+
+class _FilterInput extends StatelessWidget {
+  final String label;
+  final IconData icon;
+  final TextEditingController controller;
+  final ValueChanged<String> onChanged;
+
+  const _FilterInput({
+    required this.label,
+    required this.icon,
+    required this.controller,
+    required this.onChanged,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      children: [
+        Icon(icon, size: 20, color: AppColors.textSecondary),
+        const SizedBox(width: 12),
+        Expanded(
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              Text(label, style: const TextStyle(fontSize: 12, color: AppColors.textSecondary)),
+              TextField(
+                controller: controller,
+                style: const TextStyle(fontSize: 14, color: AppColors.textPrimary),
+                decoration: const InputDecoration(
+                  isDense: true,
+                  contentPadding: EdgeInsets.symmetric(vertical: 4),
+                  border: InputBorder.none,
+                  hintText: 'e.g. FR, HD',
+                ),
+                onChanged: onChanged,
+              ),
+            ],
+          ),
+        ),
+      ],
+    );
+  }
+}
+
+class _SettingsButton extends StatelessWidget {
+  final IconData icon;
+  final String label;
+  final VoidCallback onTap;
+
+  const _SettingsButton({
+    required this.icon,
+    required this.label,
+    required this.onTap,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return InkWell(
+      onTap: onTap,
+      borderRadius: BorderRadius.circular(12),
+      child: Container(
+        padding: const EdgeInsets.all(16),
+        decoration: BoxDecoration(
+          color: AppColors.surface,
+          borderRadius: BorderRadius.circular(12),
+        ),
+        child: Row(
+          children: [
+            Icon(icon, color: AppColors.textPrimary),
+            const SizedBox(width: 16),
+            Text(
+              label,
+              style: const TextStyle(
+                fontWeight: FontWeight.w600,
+                color: AppColors.textPrimary,
+              ),
+            ),
+            const Spacer(),
+            const Icon(Icons.chevron_right, color: AppColors.textSecondary),
+          ],
+        ),
+      ),
+    );
+  }
+}