import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:sidak_desa_mobile/core/const/app_colors.dart';
import 'package:sidak_desa_mobile/core/widgets/app_button.dart';
import 'package:sidak_desa_mobile/core/widgets/app_textfield.dart';
import 'package:sidak_desa_mobile/core/widgets/app_textfield_password.dart';
import 'package:sidak_desa_mobile/presentation/controllers/login_controller.dart';
import 'package:sidak_desa_mobile/presentation/views/pages/forgotpassword_page.dart';

class LoginScreen extends StatefulWidget {
  const LoginScreen({super.key});

  @override
  State<LoginScreen> createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {
  final TextEditingController emailController = TextEditingController();
  final TextEditingController passwordController = TextEditingController();

  final LoginController controller = Get.put(LoginController());

  static const Color primaryColor = Color(0xFF0B7D77);
  static const Color accentColor = Color(0xFFFF8C32);
  static const Color backgroundColor = Color(0xFFF4F7F8);
  static const Color textDarkColor = Color(0xFF1E293B);
  static const Color textSoftColor = Color(0xFF64748B);

  @override
  void dispose() {
    emailController.dispose();
    passwordController.dispose();
    super.dispose();
  }

  void login() {
    final email = emailController.text.trim();
    final password = passwordController.text;

    if (email.isEmpty || password.isEmpty) {
      Get.snackbar(
        'Data Belum Lengkap',
        'Email dan password wajib diisi.',
        backgroundColor: Colors.red,
        colorText: Colors.white,
        snackPosition: SnackPosition.BOTTOM,
        margin: const EdgeInsets.all(16),
        borderRadius: 12,
      );
      return;
    }

    controller.login(email: email, password: password);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: backgroundColor,
      body: SafeArea(
        child: Stack(
          children: [
            Container(
              height: 310,
              decoration: const BoxDecoration(
                gradient: LinearGradient(
                  begin: Alignment.topLeft,
                  end: Alignment.bottomRight,
                  colors: [Color(0xFF0B7D77), Color(0xFF0FA39A)],
                ),
                borderRadius: BorderRadius.only(
                  bottomLeft: Radius.circular(36),
                  bottomRight: Radius.circular(36),
                ),
              ),
            ),

            SingleChildScrollView(
              padding: const EdgeInsets.fromLTRB(22, 28, 22, 24),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: [
                  const SizedBox(height: 8),

                  Column(
                    children: [
                      Container(
                        width: 250,
                        height: 102,
                        padding: const EdgeInsets.all(16),
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(30),
                          boxShadow: const [
                            BoxShadow(
                              color: Color.fromRGBO(0, 0, 0, 0.12),
                              blurRadius: 22,
                              offset: Offset(0, 10),
                            ),
                          ],
                        ),
                        child: Image.asset(
                          'assets/images/logo.png',
                          fit: BoxFit.contain,
                        ),
                      ),

                      const SizedBox(height: 20),

                      const Text(
                        'Selamat Datang',
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          fontSize: 27,
                          height: 1.2,
                          fontWeight: FontWeight.w800,
                          color: Colors.white,
                        ),
                      ),

                      const SizedBox(height: 8),

                      const Text(
                        'Silakan masuk untuk melanjutkan ke aplikasi SIDAK Desa.',
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          fontSize: 14,
                          height: 1.5,
                          color: Color.fromRGBO(255, 255, 255, 0.88),
                        ),
                      ),
                    ],
                  ),

                  const SizedBox(height: 34),

                  Container(
                    padding: const EdgeInsets.all(22),
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.circular(28),
                      boxShadow: const [
                        BoxShadow(
                          color: Color.fromRGBO(0, 0, 0, 0.08),
                          blurRadius: 24,
                          offset: Offset(0, 12),
                        ),
                      ],
                    ),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.stretch,
                      children: [
                        Center(
                          child: Image.asset(
                            'assets/images/ilustrasi.png',
                            width: 190,
                            fit: BoxFit.contain,
                          ),
                        ),

                        const SizedBox(height: 22),

                        const Text(
                          'Masuk Akun',
                          style: TextStyle(
                            fontSize: 20,
                            fontWeight: FontWeight.w800,
                            color: textDarkColor,
                          ),
                        ),

                        const SizedBox(height: 6),

                        const Text(
                          'Gunakan email dan password yang sudah terdaftar.',
                          style: TextStyle(
                            fontSize: 13,
                            height: 1.5,
                            color: textSoftColor,
                          ),
                        ),

                        const SizedBox(height: 24),

                        const Text(
                          'Email',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.w600,
                            color: textDarkColor,
                          ),
                        ),

                        const SizedBox(height: 8),

                        AppTextField(
                          hintText: 'Masukkan email',
                          keyboardType: TextInputType.emailAddress,
                          controller: emailController,
                          textInputAction: TextInputAction.next,
                        ),

                        const SizedBox(height: 18),

                        const Text(
                          'Password',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.w600,
                            color: textDarkColor,
                          ),
                        ),

                        const SizedBox(height: 8),

                        AppTextFieldPassword(
                          hintText: 'Masukkan password',
                          controller: passwordController,
                          textInputAction: TextInputAction.done,
                        ),

                        const SizedBox(height: 12),

                        Align(
                          alignment: Alignment.centerRight,
                          child: GestureDetector(
                            onTap: () {
                              Get.to(() => const ForgotPasswordPage());
                            },
                            child: const Text(
                              'Lupa kata sandi?',
                              style: TextStyle(
                                color: primaryColor,
                                fontSize: 14,
                                fontWeight: FontWeight.w700,
                              ),
                            ),
                          ),
                        ),

                        const SizedBox(height: 26),

                        Obx(
                          () => controller.isLoading.value
                              ? const SizedBox(
                                  height: 54,
                                  child: Center(
                                    child: CircularProgressIndicator(
                                      color: primaryColor,
                                    ),
                                  ),
                                )
                              : SizedBox(
                                  height: 54,
                                  child: AppButton(
                                    text: 'Masuk',
                                    onPressed: login,
                                  ),
                                ),
                        ),
                      ],
                    ),
                  ),

                  const SizedBox(height: 22),

                  const Text(
                    'Pastikan data login Anda benar sebelum masuk ke aplikasi.',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      fontSize: 12,
                      height: 1.5,
                      color: textSoftColor,
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}