import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:slrpg_app/l10n/app_localizations.dart';

import '../../../../core/theme/app_theme.dart';
import '../../../../core/constants/asset_paths.dart';

class WelcomeScreen extends StatelessWidget {
  const WelcomeScreen({super.key});

  @override
  Widget build(BuildContext context) {
    final l10n = AppLocalizations.of(context)!;

    return Scaffold(
      body: Stack(
        children: [
          Positioned.fill(
            child: Image.asset(
              AssetPaths.bgStreetParkDay,
              fit: BoxFit.cover,
            ),
          ),
          Positioned.fill(
            child: Container(
              color: Colors.black.withValues(alpha: 0.7),
            ),
          ),
          SafeArea(
            child: Padding(
              padding: const EdgeInsets.all(24),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: [
                  const Spacer(),
                  Container(
                    width: 100,
                    height: 100,
                    decoration: BoxDecoration(
                      color: AppTheme.primaryColor.withValues(alpha: 0.9),
                      shape: BoxShape.circle,
                      boxShadow: [
                        BoxShadow(
                            color: AppTheme.primaryColor.withValues(alpha: 0.5),
                            blurRadius: 20)
                      ],
                    ),
                    child: const Icon(Icons.fitness_center,
                        size: 56, color: Colors.black),
                  ),
                  const SizedBox(height: 32),
                  Text(
                    l10n.enterTheArena,
                    style: Theme.of(context).textTheme.headlineMedium?.copyWith(
                          color: Colors.white70,
                          letterSpacing: 2,
                        ),
                    textAlign: TextAlign.center,
                  ),
                  Text(
                    'S.L.R.P.G.',
                    style: Theme.of(context).textTheme.displayLarge?.copyWith(
                      color: AppTheme.primaryColor,
                      fontWeight: FontWeight.bold,
                      shadows: [
                        const Shadow(color: Colors.black, blurRadius: 10)
                      ],
                    ),
                    textAlign: TextAlign.center,
                  ),
                  const SizedBox(height: 16),
                  Text(
                    l10n.introText,
                    style: TextStyle(
                        fontSize: 16, height: 1.5, color: Colors.white),
                    textAlign: TextAlign.center,
                  ),
                  const SizedBox(height: 48),
                  _FeatureItem(
                    icon: Icons.shield,
                    title: l10n.featureArmorTitle,
                    description: l10n.featureArmorDesc,
                  ),
                  const SizedBox(height: 16),
                  _FeatureItem(
                    icon: Icons.videogame_asset,
                    title: l10n.featureMonstersTitle,
                    description: l10n.featureMonstersDesc,
                  ),
                  const SizedBox(height: 16),
                  _FeatureItem(
                    icon: Icons.inventory_2,
                    title: l10n.featureLootTitle,
                    description: l10n.featureLootDesc,
                  ),
                  const Spacer(),
                  ElevatedButton(
                    onPressed: () => context.go('/onboarding/bodyweight'),
                    style: ElevatedButton.styleFrom(
                      backgroundColor: AppTheme.primaryColor,
                      padding: const EdgeInsets.symmetric(vertical: 20),
                    ),
                    child: Text(l10n.beginJourney,
                        style: TextStyle(
                            fontWeight: FontWeight.bold, letterSpacing: 1)),
                  ),
                  const SizedBox(height: 16),
                  TextButton(
                    onPressed: () => context.go('/login'),
                    child: Text(l10n.loginPrompt,
                        style: TextStyle(color: Colors.white54)),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

class _FeatureItem extends StatelessWidget {
  final IconData icon;
  final String title;
  final String description;

  const _FeatureItem({
    required this.icon,
    required this.title,
    required this.description,
  });

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Container(
          width: 48,
          height: 48,
          decoration: BoxDecoration(
            color: AppTheme.primaryColor.withValues(alpha: 0.2),
            borderRadius: BorderRadius.circular(12),
          ),
          child: Icon(
            icon,
            color: AppTheme.primaryColor,
            size: 24,
          ),
        ),
        const SizedBox(width: 16),
        Expanded(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                title,
                style: Theme.of(context).textTheme.bodyLarge?.copyWith(
                      fontWeight: FontWeight.bold,
                    ),
              ),
              Text(
                description,
                style: Theme.of(context).textTheme.bodyMedium,
              ),
            ],
          ),
        ),
      ],
    );
  }
}
