// ignore_for_file: unused_import

import 'package:flutter/material.dart';
import 'package:kmobile/features/card/screens/block_card_screen.dart';
import 'package:kmobile/features/card/screens/card_details_screen.dart';
import 'package:kmobile/features/card/screens/card_pin_change_details_screen.dart';
import 'package:material_symbols_icons/material_symbols_icons.dart';
import '../../../l10n/app_localizations.dart';

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

  @override
  State<CardManagementScreen> createState() => _CardManagementScreen();
}

class _CardManagementScreen extends State<CardManagementScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(
          AppLocalizations.of(context).cardManagement,
        ),
        centerTitle: false,
      ),
      body: Stack(
        children: [
          ListView(
            children: [
              CardManagementTile(
                icon: Symbols.add,
                label: AppLocalizations.of(context).applyDebitCard,
                onTap: () {},
                disabled: true, // Add this
              ),
              Divider(height: 1, color: Theme.of(context).dividerColor),
              CardManagementTile(
                icon: Symbols.remove_moderator,
                label: AppLocalizations.of(context).blockUnblockCard,
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => const BlockCardScreen(),
                    ),
                  );
                },
                disabled: true,
              ),
              Divider(height: 1, color: Theme.of(context).dividerColor),
              CardManagementTile(
                icon: Symbols.password_2,
                label: AppLocalizations.of(context).changeCardPin,
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => const CardPinChangeDetailsScreen(),
                    ),
                  );
                },
                disabled: false,
              ),
              Divider(height: 1, color: Theme.of(context).dividerColor),
              CardManagementTile(
                icon: Symbols.payment_card,
                label: AppLocalizations.of(context).viewCardDeatils,
                onTap: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => const CardDetailsScreen(),
                    ),
                  );
                },
                disabled: false,
              ),
              Divider(height: 1, color: Theme.of(context).dividerColor),
            ],
          ),
          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
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

class CardManagementTile extends StatelessWidget {
  final IconData icon;
  final String label;
  final VoidCallback onTap;
  final bool disabled;

  const CardManagementTile({
    super.key,
    required this.icon,
    required this.label,
    required this.onTap,
    this.disabled = false,
  });

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    return ListTile(
      leading: Icon(
        icon,
        color: disabled ? theme.disabledColor : null,
      ),
      title: Text(
        label,
        style: TextStyle(
          color: disabled ? theme.disabledColor : null,
        ),
      ),
      trailing: Icon(
        Symbols.arrow_right,
        size: 20,
        color: disabled ? theme.disabledColor : null,
      ),
      onTap: disabled ? null : onTap,
    );
  }
}
