content: import 'package:flutter/material.dart';
  import 'package:iconsax/iconsax.dart';
  import 'package:go_router/go_router.dart';
  import 'package:package_info_plus/package_info_plus.dart';
  import 'package:url_launcher/url_launcher.dart';
  
  class AboutScreen extends StatelessWidget {
    const AboutScreen({super.key});
  
    @override
    Widget build(BuildContext context) {
      final colorScheme = Theme.of(context).colorScheme;
      final textTheme = Theme.of(context).textTheme;
  
      return Scaffold(
        appBar: AppBar(
          leading: IconButton.filledTonal(
            onPressed: () => context.pop(),
            icon: const Icon(Iconsax.arrow_left_2),
          ),
          title: const Text('About'),
          forceMaterialTransparency: true,
        ),
        body: ListView(
          children: [
            // Hero Section
            Container(
              height: 350,
              decoration: BoxDecoration(
                gradient: LinearGradient(
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                  colors: [
                    colorScheme.primaryContainer,
                    colorScheme.primaryContainer.withOpacity(0.8),
                  ],
                ),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Container(
                    padding: const EdgeInsets.all(16),
                    decoration: BoxDecoration(
                      color: colorScheme.surface.withOpacity(0.1),
                      borderRadius: BorderRadius.circular(24),
                    ),
                    child: Image.asset(
                      'assets/icons/app_icon-modified-2.png',
                      height: 120,
                      width: 120,
                    ),
                  ),
                  const SizedBox(height: 24),
                  Text(
                    'ShonenX',
                    style: textTheme.headlineLarge?.copyWith(
                      fontWeight: FontWeight.bold,
                      color: colorScheme.onPrimaryContainer,
                    ),
                  ),
                  const SizedBox(height: 8),
                  Text(
                    'Your Gateway to Anime Streaming',
                    style: textTheme.bodyLarge?.copyWith(
                      color: colorScheme.onPrimaryContainer.withOpacity(0.8),
                    ),
                  ),
                  const SizedBox(height: 12),
                  FutureBuilder<PackageInfo>(
                    future: PackageInfo.fromPlatform(),
                    builder: (context, snapshot) {
                      final info = snapshot.data;
                      return Container(
                        padding: const EdgeInsets.symmetric(
                          horizontal: 16,
                          vertical: 8,
                        ),
                        decoration: BoxDecoration(
                          color: colorScheme.surface.withOpacity(0.2),
                          borderRadius: BorderRadius.circular(20),
                        ),
                        child: Text(
                          info != null
                              ? 'Version ${info.version} (${info.buildNumber})'
                              : 'Loading version info...',
                          style: textTheme.bodyMedium?.copyWith(
                            color: colorScheme.onPrimaryContainer,
                            fontWeight: FontWeight.w500,
                          ),
                        ),
                      );
                    },
                  ),
                ],
              ),
            ),
  
            // About Section
            Padding(
              padding: const EdgeInsets.all(24),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    'About ShonenX',
                    style: textTheme.headlineSmall?.copyWith(
                      fontWeight: FontWeight.bold,
                      color: colorScheme.onSurface,
                    ),
                  ),
                  const SizedBox(height: 16),
                  Text(
                    'ShonenX is a passion project built with Flutter, designed to provide anime enthusiasts with a seamless streaming experience. The app leverages various providers through the Consumet API to bring you the latest and greatest anime content.',
                    style: textTheme.bodyLarge?.copyWith(
                      color: colorScheme.onSurface.withOpacity(0.8),
                      height: 1.6,
                    ),
                  ),
                  const SizedBox(height: 32),
  
                  // Developer Section
                  _buildInfoCard(
                    context,
                    icon: Iconsax.code,
                    title: 'Developer',
                    content: 'Roshan',
                    subtitle: 'Passionate Flutter Developer',
                  ),
  
                  const SizedBox(height: 16),
  
                  // Technology Section
                  _buildInfoCard(
                    context,
                    icon: Iconsax.mobile_programming,
                    title: 'Built with',
                    content: 'Flutter',
                    subtitle: 'Cross-platform mobile framework',
                  ),
  
                  const SizedBox(height: 16),
  
                  // API Section
                  _buildInfoCard(
                    context,
                    icon: Iconsax.global,
                    title: 'Powered by',
                    content: 'Consumet API',
                    subtitle: 'Multi-provider anime streaming API',
                  ),
  
                  const SizedBox(height: 16),
  
                  // Open Source Section
                  _buildInfoCard(
                    context,
                    icon: Iconsax.heart,
                    title: 'Open Source',
                    content: 'MIT License',
                    subtitle: 'Free and open source software',
                  ),
  
                  const SizedBox(height: 32),
  
                  // Features Section
                  Text(
                    'Features',
                    style: textTheme.headlineSmall?.copyWith(
                      fontWeight: FontWeight.bold,
                      color: colorScheme.onSurface,
                    ),
                  ),
                  const SizedBox(height: 16),
  
                  _buildFeatureItem(
                    context,
                    icon: Iconsax.play,
                    title: 'High Quality Streaming',
                    description: 'Multiple quality options for optimal viewing',
                  ),
  
                  _buildFeatureItem(
                    context,
                    icon: Iconsax.search_normal,
                    title: 'Advanced Search',
                    description: 'Find your favorite anime quickly and easily',
                  ),
  
                  _buildFeatureItem(
                    context,
                    icon: Iconsax.bookmark,
                    title: 'Favorites & Watchlist',
                    description: 'Keep track of what you want to watch',
                  ),
  
                  _buildFeatureItem(
                    context,
                    icon: Iconsax.mobile,
                    title: 'Cross Platform',
                    description: 'Available on Android and Windows',
                  ),
  
                  const SizedBox(height: 32),
  
                  // Contact/Support Section
                  Text(
                    'Support & Contact',
                    style: textTheme.headlineSmall?.copyWith(
                      fontWeight: FontWeight.bold,
                      color: colorScheme.onSurface,
                    ),
                  ),
                  const SizedBox(height: 16),
  
                  Row(
                    children: [
                      Expanded(
                        child: _buildActionButton(
                          context,
                          icon: Iconsax.code_1,
                          label: 'Source Code',
                          onTap: () =>
                              _launchUrl('https://github.com/roshancodespace/ShonenX'),
                        ),
                      ),
                      const SizedBox(width: 16),
                      Expanded(
                        child: _buildActionButton(
                          context,
                          icon: Iconsax.message,
                          label: 'Report Issue',
                          onTap: () => _launchUrl(
                              'https://github.com/roshancodespace/ShonenX/issues'),
                        ),
                      ),
                    ],
                  ),
  
                  const SizedBox(height: 32),
  
                  // Legal Section
                  Container(
                    padding: const EdgeInsets.all(20),
                    decoration: BoxDecoration(
                      color: colorScheme.surfaceContainerHighest.withOpacity(0.3),
                      borderRadius: BorderRadius.circular(16),
                    ),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Row(
                          children: [
                            Icon(
                              Iconsax.info_circle,
                              color: colorScheme.onSurfaceVariant,
                              size: 20,
                            ),
                            const SizedBox(width: 12),
                            Text(
                              'Legal Notice',
                              style: textTheme.titleMedium?.copyWith(
                                fontWeight: FontWeight.w600,
                                color: colorScheme.onSurfaceVariant,
                              ),
                            ),
                          ],
                        ),
                        const SizedBox(height: 12),
                        Text(
                          'ShonenX does not host any content. All anime content is provided by third-party sources through the Consumet API. Please respect copyright laws and support official anime distributors.',
                          style: textTheme.bodySmall?.copyWith(
                            color: colorScheme.onSurfaceVariant.withOpacity(0.8),
                            height: 1.5,
                          ),
                        ),
                      ],
                    ),
                  ),
  
                  const SizedBox(height: 32),
  
                  // Footer
                  Center(
                    child: Text(
                      'Made with ❤️ by Roshan\n© 2025 ShonenX',
                      textAlign: TextAlign.center,
                      style: textTheme.bodySmall?.copyWith(
                        color: colorScheme.onSurface.withOpacity(0.6),
                        height: 1.5,
                      ),
                    ),
                  ),
  
                  const SizedBox(height: 24),
                ],
              ),
            ),
          ],
        ),
      );
    }
  
    Widget _buildInfoCard(
      BuildContext context, {
      required IconData icon,
      required String title,
      required String content,
      required String subtitle,
    }) {
      final colorScheme = Theme.of(context).colorScheme;
      final textTheme = Theme.of(context).textTheme;
  
      return Container(
        padding: const EdgeInsets.all(20),
        decoration: BoxDecoration(
          color: colorScheme.surfaceContainerHighest.withOpacity(0.3),
          borderRadius: BorderRadius.circular(16),
          border: Border.all(
            color: colorScheme.outline.withOpacity(0.1),
          ),
        ),
        child: Row(
          children: [
            Container(
              padding: const EdgeInsets.all(12),
              decoration: BoxDecoration(
                color: colorScheme.primary.withOpacity(0.1),
                borderRadius: BorderRadius.circular(12),
              ),
              child: Icon(
                icon,
                color: colorScheme.primary,
                size: 24,
              ),
            ),
            const SizedBox(width: 16),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    title,
                    style: textTheme.bodySmall?.copyWith(
                      color: colorScheme.onSurface.withOpacity(0.6),
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                  const SizedBox(height: 4),
                  Text(
                    content,
                    style: textTheme.titleMedium?.copyWith(
                      fontWeight: FontWeight.w600,
                      color: colorScheme.onSurface,
                    ),
                  ),
                  const SizedBox(height: 2),
                  Text(
                    subtitle,
                    style: textTheme.bodySmall?.copyWith(
                      color: colorScheme.onSurface.withOpacity(0.7),
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      );
    }
  
    Widget _buildFeatureItem(
      BuildContext context, {
      required IconData icon,
      required String title,
      required String description,
    }) {
      final colorScheme = Theme.of(context).colorScheme;
      final textTheme = Theme.of(context).textTheme;
  
      return Padding(
        padding: const EdgeInsets.only(bottom: 16),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              padding: const EdgeInsets.all(8),
              decoration: BoxDecoration(
                color: colorScheme.primary.withOpacity(0.1),
                borderRadius: BorderRadius.circular(8),
              ),
              child: Icon(
                icon,
                color: colorScheme.primary,
                size: 20,
              ),
            ),
            const SizedBox(width: 16),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    title,
                    style: textTheme.titleSmall?.copyWith(
                      fontWeight: FontWeight.w600,
                      color: colorScheme.onSurface,
                    ),
                  ),
                  const SizedBox(height: 4),
                  Text(
                    description,
                    style: textTheme.bodySmall?.copyWith(
                      color: colorScheme.onSurface.withOpacity(0.7),
                      height: 1.4,
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      );
    }
  
    Widget _buildActionButton(
      BuildContext context, {
      required IconData icon,
      required String label,
      required VoidCallback onTap,
    }) {
      final colorScheme = Theme.of(context).colorScheme;
      final textTheme = Theme.of(context).textTheme;
  
      return Material(
        color: colorScheme.primary.withOpacity(0.1),
        borderRadius: BorderRadius.circular(12),
        child: InkWell(
          onTap: onTap,
          borderRadius: BorderRadius.circular(12),
          child: Padding(
            padding: const EdgeInsets.all(16),
            child: Column(
              children: [
                Icon(
                  icon,
                  color: colorScheme.primary,
                  size: 24,
                ),
                const SizedBox(height: 8),
                Text(
                  label,
                  style: textTheme.bodySmall?.copyWith(
                    fontWeight: FontWeight.w600,
                    color: colorScheme.primary,
                  ),
                ),
              ],
            ),
          ),
        ),
      );
    }
  
    Future<void> _launchUrl(String url) async {
      final Uri uri = Uri.parse(url);
      if (await canLaunchUrl(uri)) {
        await launchUrl(uri);
      }
    }
  }
  