import 'package:flutter/material.dart';
import 'package:playmaker/classe/home.config.dart';
import 'package:playmaker/grafico%20de%20pizza/grafico.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('PlayMaker'),
        backgroundColor: HomeConfig.primaryColor,
        foregroundColor: Colors.white,
        leading: IconButton(
          icon: const Icon(Icons.person),
          onPressed: () {},
        ),
      ),
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.all(20.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              // Primeira linha com 2 cards
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  // Card 1 - Estatísticas de Basquete
                  _buildStatCard(
                    title: 'Mais Pontos',
                    playerName: 'Michael Jordan',
                    statValue: '34.5',
                    statLabel: 'PPG',
                    color: Colors.blue[800]!,
                    icon: Icons.sports_basketball,
                    isHighlighted: true,
                  ),
                  
                  SizedBox(width: 20),
                  
                  // Card 2 - Estatísticas de Futebol
                  _buildStatCard(
                    title: 'Mais Assistências',
                    playerName: 'magic Johnson',
                    statValue: '12.8',
                    statLabel: 'APG',
                    color: Colors.green[800]!,
                    icon: Icons.sports_soccer,
                    isHighlighted: false,
                  ),
                ],
              ),
              
              SizedBox(height: 20),
              
              // Segunda linha com 2 cards
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  // Card 3 - Estatísticas de Tênis
                  _buildStatCard(
                    title: 'Mais Rebotes',
                    playerName: 'Denis Rodman',
                    statValue: '15.3',
                    statLabel: 'RPG',
                    color: Colors.purple[800]!,
                    icon: Icons.sports_tennis,
                    isHighlighted: false,
                  ),
                  
                  SizedBox(width: 20),
                  
                  // Card 4 - Estatísticas de Vôlei
                    PieChartCard(
                    title: 'DESEMPENHO',
                    subtitle: 'Vitórias vs Derrotas',
                    backgroundColor: Colors.red[800]!,
                    onTap: () {
                      print('Gráfico clicado!');
                    },
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }

  // Método para criar cards de estatísticas
  Widget _buildStatCard({
    required String title,
    required String playerName,
    required String statValue,
    required String statLabel,
    required Color color,
    required IconData icon,
    bool isHighlighted = false,
  }) {
    return Container(
      width: HomeConfig.cardwidthPadding,
      height: HomeConfig.cardheightPadding,
      child: Card(
        elevation: isHighlighted ? 12 : 8,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(20),
          side: isHighlighted 
            ? BorderSide(color: Colors.amber, width: 2)
            : BorderSide.none,
        ),
        child: Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(20),
            gradient: LinearGradient(
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              colors: [
                color.withOpacity(0.9),
                color.withOpacity(0.7),
              ],
            ),
            boxShadow: [
              BoxShadow(
                color: color.withOpacity(0.3),
                blurRadius: 15,
                spreadRadius: 2,
              ),
            ],
          ),
          child: Padding(
            padding: const EdgeInsets.all(20.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                // Cabeçalho com título e ícone
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Expanded(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            title.toUpperCase(),
                            style: TextStyle(
                              fontSize: 14,
                              fontWeight: FontWeight.bold,
                              color: Colors.white.withOpacity(0.9),
                              letterSpacing: 1.5,
                            ),
                          ),
                          SizedBox(height: 5),
                          Text(
                            playerName,
                            style: TextStyle(
                              fontSize: 18,
                              fontWeight: FontWeight.bold,
                              color: Colors.white,
                            ),
                            maxLines: 1,
                            overflow: TextOverflow.ellipsis,
                          ),
                        ],
                      ),
                    ),
                    if (isHighlighted)
                      Container(
                        padding: EdgeInsets.all(8),
                        decoration: BoxDecoration(
                          color: Colors.amber,
                          shape: BoxShape.circle,
                        ),
                        child: Icon(
                          Icons.star,
                          size: 20,
                          color: Colors.white,
                        ),
                      ),
                  ],
                ),
                
                SizedBox(height: 10),
                
                // Ícone do esporte
                Container(
                  width: 60,
                  height: 60,
                  decoration: BoxDecoration(
                    color: Colors.white.withOpacity(0.2),
                    shape: BoxShape.circle,
                  ),
                  child: Icon(
                    icon,
                    size: 30,
                    color: Colors.white,
                  ),
                ),
                
                Spacer(),
                
                // Estatística central
                Center(
                  child: Column(
                    children: [
                      Text(
                        statValue,
                        style: TextStyle(
                          fontSize: 42,
                          fontWeight: FontWeight.bold,
                          color: Colors.white,
                          height: 1,
                        ),
                      ),
                      SizedBox(height: 5),
                      Text(
                        statLabel.toUpperCase(),
                        style: TextStyle(
                          fontSize: 14,
                          color: Colors.white.withOpacity(0.8),
                          letterSpacing: 2,
                        ),
                      ),
                    ],
                  ),
                ),
                
                Spacer(),
                
                // Rodapé com botão
                Container(
                  width: double.infinity,
                  padding: EdgeInsets.symmetric(vertical: 12),
                  decoration: BoxDecoration(
                    color: Colors.white.withOpacity(0.2),
                    borderRadius: BorderRadius.circular(15),
                  ),
                  child: Center(
                    child: Text(
                      'VER DETALHES',
                      style: TextStyle(
                        color: Colors.white,
                        fontWeight: FontWeight.bold,
                        fontSize: 14,
                        letterSpacing: 1,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}