import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../providers/battle_provider.dart';
import '../game/model/item.dart';
import '../game/enums.dart';
import '../utils/item_utils.dart';
import '../game/config/theme_config.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("Inventory & Stats")),
      body: Consumer<BattleProvider>(
        builder: (context, battleProvider, child) {
          final player = battleProvider.player;

          return Column(
            children: [
              // Player Stats Header
              Card(
                margin: const EdgeInsets.all(16.0),
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Column(
                    children: [
                      Text(
                        player.name,
                        style: Theme.of(context).textTheme.headlineSmall,
                      ),
                      const SizedBox(height: 8),
                      Text("Stage: ${battleProvider.stage}"),
                      const Divider(),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                        children: [
                          _buildStatItem(
                            "HP",
                            "${player.hp}/${player.totalMaxHp}",
                          ),
                          _buildStatItem("ATK", "${player.totalAtk}"),
                          _buildStatItem("DEF", "${player.totalDefense}"),
                          _buildStatItem("Shield", "${player.armor}"),
                          _buildStatItem(
                            "Gold",
                            "${player.gold} G",
                            color: ThemeConfig.statGoldColor,
                          ),
                          _buildStatItem(
                            "Luck",
                            "${player.totalLuck}",
                            color: ThemeConfig.statLuckColor,
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
              ),

              // Equipped Items Section (Slot based)
              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.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 (Top Right)
                                  Positioned(
                                    right: 4,
                                    top: 4,
                                    child: Text(
                                      slot.name.toUpperCase(),
                                      style: const TextStyle(
                                        fontSize: ThemeConfig.fontSizeTiny,
                                        fontWeight: ThemeConfig.fontWeightBold,
                                        color: Colors.white30,
                                      ),
                                    ),
                                  ),
                                  // Faded Icon (Top Left)
                                  Positioned(
                                    left: 4,
                                    top: 4,
                                    child: Opacity(
                                      opacity: item != null ? 0.2 : 0.1,
                                      child: Icon(
                                        ItemUtils.getIcon(slot),
                                        size: 40,
                                        color: item != null
                                            ? ItemUtils.getColor(slot)
                                            : ThemeConfig.textColorGrey,
                                      ),
                                    ),
                                  ),
                                  // Content
                                  Center(
                                    child: Padding(
                                      padding: const EdgeInsets.all(4.0),
                                      child: Column(
                                        mainAxisAlignment:
                                            MainAxisAlignment.center,
                                        children: [
                                          const SizedBox(
                                            height: 12,
                                          ), // Spacing for top elements
                                          FittedBox(
                                            fit: BoxFit.scaleDown,
                                            child: Text(
                                              item?.name ?? "Empty",
                                              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(),
                    ),
                  ],
                ),
              ),

              // Inventory (Bag) Section
              Padding(
                padding: const EdgeInsets.symmetric(
                  horizontal: 16.0,
                  vertical: 8.0,
                ),
                child: Align(
                  alignment: Alignment.centerLeft,
                  child: Text(
                    "Bag (${player.inventory.length}/${player.maxInventorySize})",
                    style: const TextStyle(
                      fontSize: ThemeConfig.fontSizeHeader,
                      fontWeight: ThemeConfig.fontWeightBold,
                    ),
                  ),
                ),
              ),
              Expanded(
                child: GridView.builder(
                  padding: const EdgeInsets.all(16.0),
                  gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 4,
                    crossAxisSpacing: 8.0,
                    mainAxisSpacing: 8.0,
                  ),
                  itemCount: player.maxInventorySize,
                  itemBuilder: (context, index) {
                    if (index < player.inventory.length) {
                      final item = player.inventory[index];
                      return InkWell(
                        onTap: () {
                          // Show Action Dialog instead of direct Equip
                          _showItemActionDialog(context, battleProvider, item);
                        },
                        child: Card(
                          color: ThemeConfig.inventoryCardBg,
                          shape: item.rarity != ItemRarity.magic
                              ? RoundedRectangleBorder(
                                  side: BorderSide(
                                    color: ItemUtils.getRarityColor(
                                      item.rarity,
                                    ),
                                    width: 2.0,
                                  ),
                                  borderRadius: BorderRadius.circular(4.0),
                                )
                              : null,
                          child: Stack(
                            children: [
                              // Faded Icon in Top-Left
                              Positioned(
                                left: 4,
                                top: 4,
                                child: Opacity(
                                  opacity: 0.2,
                                  child: Icon(
                                    ItemUtils.getIcon(item.slot),
                                    size: 40,
                                    color: ItemUtils.getColor(item.slot),
                                  ),
                                ),
                              ),
                              // Centered Content
                              Center(
                                child: Padding(
                                  padding: const EdgeInsets.all(4.0),
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                      FittedBox(
                                        fit: BoxFit.scaleDown,
                                        child: Text(
                                          item.name,
                                          textAlign: TextAlign.center,
                                          style: TextStyle(
                                            fontSize: ThemeConfig.fontSizeSmall,
                                            fontWeight: ThemeConfig.fontWeightBold,
                                            color: ItemUtils.getRarityColor(
                                              item.rarity,
                                            ),
                                          ),
                                          maxLines: 2,
                                          overflow: TextOverflow.ellipsis,
                                        ),
                                      ),
                                      FittedBox(
                                        fit: BoxFit.scaleDown,
                                        child: _buildItemStatText(item),
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                      );
                    } else {
                      // Empty slot
                      return Container(
                        decoration: BoxDecoration(
                          border: Border.all(color: ThemeConfig.textColorGrey),
                          color: ThemeConfig.emptySlotBg,
                        ),
                        child: const Center(
                          child: Icon(Icons.add_box, color: ThemeConfig.textColorGrey),
                        ),
                      );
                    }
                  },
                ),
              ),
            ],
          );
        },
      ),
    );
  }

  Widget _buildStatItem(String label, String value, {Color? color}) {
    return Column(
      children: [
        Text(label, style: const TextStyle(color: ThemeConfig.textColorGrey, fontSize: 12)),
        Text(
          value,
          style: TextStyle(
            fontWeight: ThemeConfig.fontWeightBold,
            fontSize: 16,
            color: color,
          ),
        ),
      ],
    );
  }

  /// Shows a menu with actions for the selected item (Equip, Discard, etc.)
  void _showItemActionDialog(
    BuildContext context,
    BattleProvider provider,
    Item item,
  ) {
    bool isShop = provider.currentStage.type == StageType.shop;

    showDialog(
      context: context,
      builder: (ctx) => SimpleDialog(
        title: Text("${item.name} Actions"),
        children: [
          SimpleDialogOption(
            onPressed: () {
              Navigator.pop(ctx);
              _showEquipConfirmationDialog(context, provider, item);
            },
            child: const Padding(
              padding: EdgeInsets.symmetric(vertical: 8.0),
              child: Row(
                children: [
                  Icon(Icons.shield, color: ThemeConfig.btnDefendActive),
                  SizedBox(width: 10),
                  Text("Equip"),
                ],
              ),
            ),
          ),
          if (isShop)
            SimpleDialogOption(
              onPressed: () {
                Navigator.pop(ctx);
                _showSellConfirmationDialog(context, provider, item);
              },
              child: Padding(
                padding: const EdgeInsets.symmetric(vertical: 8.0),
                child: Row(
                  children: [
                    const Icon(Icons.attach_money, color: ThemeConfig.statGoldColor),
                    const SizedBox(width: 10),
                    Text("Sell (${item.price} G)"),
                  ],
                ),
              ),
            ),
          SimpleDialogOption(
            onPressed: () {
              Navigator.pop(ctx);
              _showDiscardConfirmationDialog(context, provider, item);
            },
            child: const Padding(
              padding: EdgeInsets.symmetric(vertical: 8.0),
              child: Row(
                children: [
                  Icon(Icons.delete, color: ThemeConfig.btnActionActive),
                  SizedBox(width: 10),
                  Text("Discard"),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  void _showSellConfirmationDialog(
    BuildContext context,
    BattleProvider provider,
    Item item,
  ) {
    showDialog(
      context: context,
      builder: (ctx) => AlertDialog(
        title: const Text("Sell Item"),
        content: Text("Sell ${item.name} for ${item.price} G?"),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(ctx),
            child: const Text("Cancel"),
          ),
          ElevatedButton(
            style: ElevatedButton.styleFrom(backgroundColor: ThemeConfig.statGoldColor),
            onPressed: () {
              provider.sellItem(item);
              Navigator.pop(ctx);
            },
            child: const Text("Sell", style: TextStyle(color: Colors.black)),
          ),
        ],
      ),
    );
  }

  void _showDiscardConfirmationDialog(
    BuildContext context,
    BattleProvider provider,
    Item item,
  ) {
    showDialog(
      context: context,
      builder: (ctx) => AlertDialog(
        title: const Text("Discard Item"),
        content: Text("Are you sure you want to discard ${item.name}?"),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(ctx),
            child: const Text("Cancel"),
          ),
          ElevatedButton(
            style: ElevatedButton.styleFrom(backgroundColor: ThemeConfig.btnActionActive),
            onPressed: () {
              provider.discardItem(item);
              Navigator.pop(ctx);
            },
            child: const Text("Discard"),
          ),
        ],
      ),
    );
  }

  void _showEquipConfirmationDialog(
    BuildContext context,
    BattleProvider provider,
    Item newItem,
  ) {
    final player = provider.player;
    final oldItem = player.equipment[newItem.slot];

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

    // Predict new stats
    int newMaxHp = currentMaxHp - (oldItem?.hpBonus ?? 0) + newItem.hpBonus;
    int newAtk = currentAtk - (oldItem?.atkBonus ?? 0) + newItem.atkBonus;
    int newDef = currentDef - (oldItem?.armorBonus ?? 0) + newItem.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("Change Equipment"),
        content: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text(
              "Equip ${newItem.name}?",
              style: const TextStyle(fontWeight: ThemeConfig.fontWeightBold),
            ),
            if (oldItem != null)
              Text(
                "Replaces ${oldItem.name}",
                style: const TextStyle(fontSize: 12, color: ThemeConfig.textColorGrey),
              ),
            const SizedBox(height: 16),
            _buildStatChangeRow("Max HP", currentMaxHp, newMaxHp),
            _buildStatChangeRow("Current HP", currentHp, newHp),
            _buildStatChangeRow("ATK", currentAtk, newAtk),
            _buildStatChangeRow("DEF", currentDef, newDef),
            _buildStatChangeRow(
              "LUCK",
              player.totalLuck,
              player.totalLuck - (oldItem?.luck ?? 0) + newItem.luck,
            ),
          ],
        ),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(ctx),
            child: const Text("Cancel"),
          ),
          ElevatedButton(
            onPressed: () {
              provider.equipItem(newItem);
              Navigator.pop(ctx);
            },
            child: const Text("Confirm"),
          ),
        ],
      ),
    );
  }

  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(
              "Unequip ${itemToUnequip.name}?",
              style: const TextStyle(fontWeight: ThemeConfig.fontWeightBold),
            ),
            const SizedBox(height: 16),
            _buildStatChangeRow("Max HP", currentMaxHp, newMaxHp),
            _buildStatChangeRow("Current HP", currentHp, newHp),
            _buildStatChangeRow("ATK", currentAtk, newAtk),
            _buildStatChangeRow("DEF", currentDef, newDef),
          ],
        ),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(ctx),
            child: const Text("Cancel"),
          ),
          ElevatedButton(
            onPressed: () {
              provider.unequipItem(itemToUnequip);
              Navigator.pop(ctx);
            },
            child: const Text("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} ATK");
    if (item.hpBonus > 0) stats.add("+${item.hpBonus} HP");
    if (item.armorBonus > 0) stats.add("+${item.armorBonus} DEF");
    if (item.luck > 0) stats.add("+${item.luck} 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),
            ),
          ),
      ],
    );
  }
}
