import 'package:flutter/material.dart';
import '../utils/colors.dart';
import 'game_screen.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: ZenColors.appBackground,
      body: SafeArea(
        child: Padding(
          padding: const EdgeInsets.all(20.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              // Game Title
              const Text(
                'ZenTap',
                style: TextStyle(
                  color: ZenColors.primaryText,
                  fontSize: 48,
                  fontWeight: FontWeight.bold,
                  letterSpacing: 2.0,
                ),
              ),
              const SizedBox(height: 10),
              
              // Subtitle
              Text(
                'A stress relief tapping game',
                style: TextStyle(
                  color: ZenColors.secondaryText,
                  fontSize: 18,
                  fontStyle: FontStyle.italic,
                ),
              ),
              const SizedBox(height: 60),
              
              // Play Button
              _buildMenuButton(
                context,
                'Play',
                'Tap to earn Relaxation Points',
                Icons.play_arrow,
                () => _navigateToGame(context, false),
              ),
              const SizedBox(height: 20),
              
              // Zen Mode Button
              _buildMenuButton(
                context,
                'Zen Mode',
                'Pure relaxation, no score',
                Icons.self_improvement,
                () => _navigateToGame(context, true),
              ),
              const SizedBox(height: 40),
              
              // Settings hint
              Text(
                'Tap anywhere to feel the calm',
                style: TextStyle(
                  color: ZenColors.mutedText,
                  fontSize: 14,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildMenuButton(
    BuildContext context,
    String title,
    String subtitle,
    IconData icon,
    VoidCallback onPressed,
  ) {
    return Container(
      width: double.infinity,
      margin: const EdgeInsets.symmetric(horizontal: 20),
      child: ElevatedButton(
        onPressed: onPressed,
        style: ElevatedButton.styleFrom(
          backgroundColor: ZenColors.buttonBackground,
          foregroundColor: ZenColors.buttonText,
          padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 30),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(15),
          ),
          elevation: 8,
        ),
        child: Row(
          children: [
            Icon(
              icon,
              size: 32,
              color: ZenColors.buttonText,
            ),
            const SizedBox(width: 20),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    title,
                    style: const TextStyle(
                      fontSize: 22,
                      fontWeight: FontWeight.bold,
                      color: ZenColors.buttonText,
                    ),
                  ),
                  const SizedBox(height: 4),
                  Text(
                    subtitle,
                    style: TextStyle(
                      fontSize: 14,
                      color: ZenColors.buttonText.withValues(alpha: 0.8),
                    ),
                  ),
                ],
              ),
            ),
            Icon(
              Icons.arrow_forward_ios,
              color: ZenColors.buttonText.withValues(alpha: 0.7),
              size: 20,
            ),
          ],
        ),
      ),
    );
  }

  void _navigateToGame(BuildContext context, bool isZenMode) {
    Navigator.of(context).push(
      MaterialPageRoute(
        builder: (context) => GameScreen(isZenMode: isZenMode),
      ),
    );
  }
}