import 'package:flutter/material.dart';
import 'package:kmobile/features/profile/preferences/theme_mode_dialog.dart';
import 'language_dialog.dart';
import 'color_theme_dialog.dart';
import '../../../l10n/app_localizations.dart';
import 'package:kmobile/features/auth/controllers/theme_cubit.dart';
import 'package:kmobile/features/auth/controllers/theme_state.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

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

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

    return Scaffold(
      appBar: AppBar(
        title: Text(loc.preferences),
      ),
      body: BlocBuilder<ThemeCubit, ThemeState>(
        builder: (context, state) {
          return Stack(
            children: [
              ListView(
                padding:
                    const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
                children: [
                  // Language Selection
                  Card(
                    margin: const EdgeInsets.only(bottom: 10),
                    child: ListTile(
                      leading: const Icon(Icons.language),
                      title: Text(loc.language),
                      trailing: const Icon(Icons.chevron_right),
                      onTap: () {
                        showDialog(
                          context: context,
                          builder: (_) => const LanguageDialog(),
                        );
                      },
                    ),
                  ),
                  //Theme Mode Switch (Light/Dark)
                  Card(
                    margin: const EdgeInsets.only(bottom: 10),
                    child: ListTile(
                      leading: const Icon(Icons.brightness_6),
                      title: Text(AppLocalizations.of(context).themeMode),
                      trailing: const Icon(Icons.chevron_right),
                      onTap: () {
                        showThemeModeDialog(context);
                      },
                    ),
                  ),
                  //Color_Theme_Selection
                  Card(
                    margin: const EdgeInsets.only(bottom: 10),
                    child: ListTile(
                        leading: const Icon(Icons.color_lens),
                        title: Text(AppLocalizations.of(context).themeColor),
                        trailing: const Icon(Icons.chevron_right),
                        onTap: () {
                          showDialog(
                            context: context,
                            builder: (_) => const ColorThemeDialog(),
                          );
                        }),
                  ),
                ],
              ),
              IgnorePointer(
                child: Center(
                  child: Opacity(
                    opacity: 0.07, // Reduced opacity
                    child: ClipOval(
                      child: Image.asset(
                        'assets/images/logo.png',
                        width: 200, // Adjust size as needed
                        height: 200, // Adjust size as needed
                      ),
                    ),
                  ),
                ),
              ),
            ],
          );
        },
      ),
    );
  }
}