PlayMaker/lib/widgets/login_widgets.dart

import 'package:flutter/material.dart';
import 'package:playmaker/controllers/login_controller.dart';
import 'package:playmaker/pages/RegisterPage.dart';
import 'package:playmaker/classe/theme.dart'; // 👇 IMPORT DO TEMA
import '../utils/size_extension.dart'; 

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

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // Usamos um Stack para controlar a sobreposição exata
        Stack(
          alignment: Alignment.center,
          children: [
            // 1. A Imagem (Aumentada para 320)
            SizedBox(
              width: 320 * context.sf,
              height: 350 * context.sf,
              child: Image.asset(
                'assets/playmaker-logos.png',
                fit: BoxFit.contain,
              ),
            ),
            // 2. O Texto "subido" para dentro da área da imagem
            Positioned(
              bottom: 5 * context.sf, // Ajusta este valor para aproximar/afastar do centro da logo
              child: Column(
                children: [
                  Text(
                    'BasketTrack',
                    style: TextStyle(
                      fontSize: 36 * context.sf,
                      fontWeight: FontWeight.bold,
                      color: Theme.of(context).colorScheme.onSurface,
                    ),
                  ),
                  SizedBox(height: 4 * context.sf),
                  Text(
                    'Gere as tuas equipas e estatísticas',
                    style: TextStyle(
                      fontSize: 16 * context.sf,
                      color: Colors.grey,
                      fontWeight: FontWeight.w500,
                    ),
                    textAlign: TextAlign.center,
                  ),
                ],
              ),
            ),
          ],
        ),
        // Espaço extra para não bater nos campos de login logo a seguir
        SizedBox(height: 10 * context.sf),
      ],
    );
  }
}

class LoginFormFields extends StatelessWidget {
  final LoginController controller;

  const LoginFormFields({super.key, required this.controller});

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        TextField(
          controller: controller.emailController,
          style: TextStyle(fontSize: 15 * context.sf, color: Theme.of(context).colorScheme.onSurface),
          decoration: InputDecoration(
            labelText: 'E-mail',
            labelStyle: TextStyle(fontSize: 15 * context.sf),
            prefixIcon: Icon(Icons.email_outlined, size: 22 * context.sf, color: AppTheme.primaryRed), // 👇 Cor do tema
            errorText: controller.emailError, 
            border: OutlineInputBorder(borderRadius: BorderRadius.circular(12 * context.sf)),
            focusedBorder: OutlineInputBorder(
              borderRadius: BorderRadius.circular(12 * context.sf),
              borderSide: BorderSide(color: AppTheme.primaryRed, width: 2), // 👇 Cor do tema ao focar
            ),
            contentPadding: EdgeInsets.symmetric(vertical: 18 * context.sf, horizontal: 16 * context.sf),
          ),
          keyboardType: TextInputType.emailAddress,
        ),
        SizedBox(height: 20 * context.sf),
        TextField(
          controller: controller.passwordController,
          obscureText: controller.obscurePassword,
          style: TextStyle(fontSize: 15 * context.sf, color: Theme.of(context).colorScheme.onSurface),
          decoration: InputDecoration(
            labelText: 'Palavra-passe',
            labelStyle: TextStyle(fontSize: 15 * context.sf),
            prefixIcon: Icon(Icons.lock_outlined, size: 22 * context.sf, color: AppTheme.primaryRed), // 👇 Cor do tema
            errorText: controller.passwordError,
            focusedBorder: OutlineInputBorder(
              borderRadius: BorderRadius.circular(12 * context.sf),
              borderSide: BorderSide(color: AppTheme.primaryRed, width: 2), // 👇 Cor do tema ao focar
            ),
            suffixIcon: IconButton(
              icon: Icon(
                controller.obscurePassword ? Icons.visibility_outlined : Icons.visibility_off_outlined,
                size: 22 * context.sf,
                color: Colors.grey,
              ),
              onPressed: controller.togglePasswordVisibility,
            ),
            border: OutlineInputBorder(borderRadius: BorderRadius.circular(12 * context.sf)),
            contentPadding: EdgeInsets.symmetric(vertical: 18 * context.sf, horizontal: 16 * context.sf),
          ),
        ),
      ],
    );
  }
}

class LoginButton extends StatelessWidget {
  final LoginController controller;
  final VoidCallback onLoginSuccess;

  const LoginButton({super.key, required this.controller, required this.onLoginSuccess});

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: double.infinity,
      height: 58 * context.sf,
      child: ElevatedButton(
        onPressed: controller.isLoading ? null : () async {
          final success = await controller.login();
          if (success) onLoginSuccess();
        },
        style: ElevatedButton.styleFrom(
          backgroundColor: AppTheme.primaryRed, // 👇 Usando a cor do tema
          foregroundColor: Colors.white,
          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(14 * context.sf)),
          elevation: 3,
        ),
        child: controller.isLoading
            ? SizedBox(
                width: 28 * context.sf, height: 28 * context.sf,
                child: const CircularProgressIndicator(strokeWidth: 3, valueColor: AlwaysStoppedAnimation<Color>(Colors.white)),
              )
            : Text('Entrar', style: TextStyle(fontSize: 18 * context.sf, fontWeight: FontWeight.bold)),
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: double.infinity,
      height: 58 * context.sf,
      child: OutlinedButton(
        onPressed: () {
          Navigator.push(context, MaterialPageRoute(builder: (context) => const RegisterPage()));
        },
        style: OutlinedButton.styleFrom(
          foregroundColor: AppTheme.primaryRed, // 👇 Usando a cor do tema
          side: BorderSide(color: AppTheme.primaryRed, width: 2 * context.sf), // 👇 Usando a cor do tema
          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(14 * context.sf)),
        ),
        child: Text('Criar Conta', style: TextStyle(fontSize: 18 * context.sf, fontWeight: FontWeight.bold)),
      ),
    );
  }
}