import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../../providers.dart';
import '../../game/models.dart';
import '../../game/enums.dart';
import '../../utils.dart';
import '../../game/config.dart';

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

  @override
  Widget build(BuildContext context) {
    return Consumer<BattleProvider>(
      builder: (context, battleProvider, child) {
        final player = battleProvider.player;
        return Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              const Text(
                "Equipped Items",
                style: TextStyle(
                  fontSize: ThemeConfig.fontSizeHeader,
                  fontWeight: ThemeConfig.fontWeightBold,
                ),
              ),
              const SizedBox(height: 8),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: EquipmentSlot.values
                    .where((slot) => slot != EquipmentSlot.consumable)
                    .map((slot) {
                      final item = player.equipment[slot];
                      return Expanded(
                        child: InkWell(
                          onTap: item != null
                              ? () => _showUnequipConfirmationDialog(
                                  context,
                                  battleProvider,
                                  item,
                                )
                              : null,
                          child: Card(
                            color: item != null
                                ? ThemeConfig.equipmentCardBg
                                : ThemeConfig.emptySlotBg,
                            shape:
                                item != null && item.rarity != ItemRarity.magic
                                ? RoundedRectangleBorder(
                                    side: BorderSide(
                                      color: ItemUtils.getRarityColor(
                                        item.rarity,
                                      ),
                                      width: 2.0,
                                    ),
                                    borderRadius: BorderRadius.circular(4.0),
                                  )
                                : null,
                            child: Stack(
                              children: [
                                // Slot Name
                                Positioned(
                                  right: 4,
                                  top: 4,
                                  child: Text(
                                    slot.name.toUpperCase(),
                                    style: const TextStyle(
                                      fontSize: ThemeConfig.fontSizeTiny,
                                      fontWeight: ThemeConfig.fontWeightBold,
                                      color: Colors.white30,
                                    ),
                                  ),
                                ),
                                // Faded Icon
                                Positioned(
                                  left: 4,
                                  top: 4,
                                  child: Opacity(
                                    opacity: item != null ? 0.5 : 0.2,
                                    child: Image.asset(
                                      ItemUtils.getIconPath(slot),
                                      width: 40,
                                      height: 40,
                                      fit: BoxFit.contain,
                                      filterQuality: FilterQuality.high,
                                    ),
                                  ),
                                ),
                                // Content
                                Center(
                                  child: Padding(
                                    padding: const EdgeInsets.all(4.0),
                                    child: Column(
                                      mainAxisAlignment:
                                          MainAxisAlignment.center,
                                      children: [
                                        const SizedBox(height: 12),
                                        FittedBox(
                                          fit: BoxFit.scaleDown,
                                          child: Text(
                                            item?.name ?? AppStrings.emptySlot,
                                            textAlign: TextAlign.center,
                                            style: TextStyle(
                                              fontSize:
                                                  ThemeConfig.fontSizeSmall,
                                              fontWeight:
                                                  ThemeConfig.fontWeightBold,
                                              color: item != null
                                                  ? ItemUtils.getRarityColor(
                                                      item.rarity,
                                                    )
                                                  : ThemeConfig.textColorGrey,
                                            ),
                                            maxLines: 2,
                                            overflow: TextOverflow.ellipsis,
                                          ),
                                        ),
                                        if (item != null)
                                          FittedBox(
                                            fit: BoxFit.scaleDown,
                                            child: _buildItemStatText(item),
                                          ),
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ),
                      );
                    })
                    .toList(),
              ),
            ],
          ),
        );
      },
    );
  }

  void _showUnequipConfirmationDialog(
    BuildContext context,
    BattleProvider provider,
    Item itemToUnequip,
  ) {
    final player = provider.player;

    // Calculate predicted stats
    final currentMaxHp = player.totalMaxHp;
    final currentAtk = player.totalAtk;
    final currentDef = player.totalDefense;
    final currentHp = player.hp;

    // Predict new stats (Subtract item bonuses)
    int newMaxHp = currentMaxHp - itemToUnequip.hpBonus;
    int newAtk = currentAtk - itemToUnequip.atkBonus;
    int newDef = currentDef - itemToUnequip.armorBonus;

    // Predict HP (Percentage Logic)
    double ratio = currentMaxHp > 0 ? currentHp / currentMaxHp : 0.0;
    int newHp = (newMaxHp * ratio).toInt();
    if (newHp < 0) newHp = 0;
    if (newHp > newMaxHp) newHp = newMaxHp;

    showDialog(
      context: context,
      builder: (ctx) => AlertDialog(
        title: const Text("Unequip Item"),
        content: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text(
              "${AppStrings.unequip} ${itemToUnequip.name}?",
              style: const TextStyle(fontWeight: ThemeConfig.fontWeightBold),
            ),
            const SizedBox(height: 16),
            _buildStatChangeRow("Max HP", currentMaxHp, newMaxHp),
            _buildStatChangeRow("Current HP", currentHp, newHp),
            _buildStatChangeRow(AppStrings.atk, currentAtk, newAtk),
            _buildStatChangeRow(AppStrings.def, currentDef, newDef),
          ],
        ),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(ctx),
            child: const Text(AppStrings.cancel),
          ),
          ElevatedButton(
            onPressed: () {
              provider.unequipItem(itemToUnequip);
              Navigator.pop(ctx);
            },
            child: const Text(AppStrings.confirm),
          ),
        ],
      ),
    );
  }

  Widget _buildStatChangeRow(String label, int oldVal, int newVal) {
    int diff = newVal - oldVal;
    Color color = diff > 0
        ? ThemeConfig.statDiffPositive
        : (diff < 0
              ? ThemeConfig.statDiffNegative
              : ThemeConfig.statDiffNeutral);
    String diffText = diff > 0 ? "(+$diff)" : (diff < 0 ? "($diff)" : "");

    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 4.0),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(label),
          Row(
            children: [
              Text(
                "$oldVal",
                style: const TextStyle(color: ThemeConfig.textColorGrey),
              ),
              const Icon(
                Icons.arrow_right,
                size: 16,
                color: ThemeConfig.textColorGrey,
              ),
              Text(
                "$newVal",
                style: const TextStyle(fontWeight: ThemeConfig.fontWeightBold),
              ),
              const SizedBox(width: 4),
              Text(
                diffText,
                style: TextStyle(
                  color: color,
                  fontSize: 12,
                  fontWeight: ThemeConfig.fontWeightBold,
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildItemStatText(Item item) {
    List<String> stats = [];
    if (item.atkBonus > 0) stats.add("+${item.atkBonus} ${AppStrings.atk}");
    if (item.hpBonus > 0) stats.add("+${item.hpBonus} ${AppStrings.hp}");
    if (item.armorBonus > 0) stats.add("+${item.armorBonus} ${AppStrings.def}");
    if (item.luck > 0) stats.add("+${item.luck} ${AppStrings.luck}");

    // Include effects
    List<String> effectTexts = item.effects.map((e) => e.description).toList();

    if (stats.isEmpty && effectTexts.isEmpty) return const SizedBox.shrink();

    return Column(
      children: [
        if (stats.isNotEmpty)
          Padding(
            padding: const EdgeInsets.only(top: 2.0, bottom: 2.0),
            child: Text(
              stats.join(", "),
              style: const TextStyle(
                fontSize: ThemeConfig.fontSizeSmall,
                color: ThemeConfig.statAtkColor,
              ),
              textAlign: TextAlign.center,
            ),
          ),
        if (effectTexts.isNotEmpty)
          Padding(
            padding: const EdgeInsets.only(bottom: 2.0),
            child: Text(
              effectTexts.join("\n"),
              style: const TextStyle(
                fontSize: ThemeConfig.fontSizeTiny,
                color: ThemeConfig.rarityLegendary,
              ),
            ),
          ),
      ],
    );
  }
}