// ========================================
// プレステージアップグレード定義
// ========================================

const PRESTIGE_UPGRADES = [
  {
    id: 'hull_reinforce',
    name: '鋼の身体',
    desc: '最大HPを増加させる',
    icon: '🛡️',
    category: 'survival',
    maxLevel: 10,
    cost: (lv) => lv + 1,
    bonus: (lv) => ({ hpMult: 1 + lv * 0.15 }),
    effectText: (lv) => lv === 0 ? '最大HP +15% / Lv' : `最大HP +${lv * 15}%`,
  },
  {
    id: 'combat_instinct',
    name: '戦闘本能',
    desc: '基本攻撃力を増加させる',
    icon: '⚔️',
    category: 'combat',
    maxLevel: 10,
    cost: (lv) => lv + 1,
    bonus: (lv) => ({ atkMult: 1 + lv * 0.12 }),
    effectText: (lv) => lv === 0 ? '基本ATK +12% / Lv' : `基本ATK +${lv * 12}%`,
  },
  {
    id: 'reflex_boost',
    name: '反応強化',
    desc: '攻撃速度を増加させる',
    icon: '⚡',
    category: 'combat',
    maxLevel: 10,
    cost: (lv) => lv + 1,
    bonus: (lv) => ({ spdAdd: lv * 0.12 }),
    effectText: (lv) => lv === 0 ? '基本SPD +0.12 / Lv' : `基本SPD +${(lv * 0.12).toFixed(2)}`,
  },
  {
    id: 'salvage_expert',
    name: 'サルベージ術',
    desc: '戦闘後のスクラップ獲得量を増加させる',
    icon: '💰',
    category: 'utility',
    maxLevel: 5,
    cost: (lv) => (lv + 1) * 2,
    bonus: (lv) => ({ scrapMult: 1 + lv * 0.25 }),
    effectText: (lv) => lv === 0 ? 'スクラップ獲得 +25% / Lv' : `スクラップ獲得 +${lv * 25}%`,
  },
  {
    id: 'field_medic',
    name: '応急処置',
    desc: '回復に必要なスクラップを軽減する',
    icon: '🩹',
    category: 'utility',
    maxLevel: 5,
    cost: (lv) => (lv + 1) * 2,
    bonus: (lv) => ({ healCostMult: Math.max(0.25, 1 - lv * 0.15) }),
    effectText: (lv) => lv === 0 ? '回復コスト -15% / Lv' : `回復コスト -${lv * 15}%`,
  },
  {
    id: 'startup_funds',
    name: '初期資金',
    desc: '拠点帰還時にスクラップを持った状態から再開する',
    icon: '💎',
    category: 'utility',
    maxLevel: 5,
    cost: (lv) => (lv + 1) * 3,
    bonus: (lv) => ({ startScrap: lv * 100 }),
    effectText: (lv) => lv === 0 ? '初期スクラップ +100 / Lv' : `初期スクラップ +${lv * 100}`,
  },
  {
    id: 'socket_mastery',
    name: 'ソケット習熟',
    desc: '初期装備のスロット数を増やす',
    icon: '🔩',
    category: 'combat',
    maxLevel: 3,
    cost: (lv) => (lv + 1) * 5,
    bonus: (lv) => ({ extraSocket: lv }),
    effectText: (lv) => lv === 0 ? '初期武器スロット +1 / Lv' : `初期武器スロット +${lv}`,
  },
  {
    id: 'fortune_hunter',
    name: '幸運の手',
    desc: '伝説・ユニーク武器のドロップ確率を上げる',
    icon: '🍀',
    category: 'utility',
    maxLevel: 3,
    cost: (lv) => (lv + 1) * 4,
    bonus: (lv) => ({ legendaryDropBonus: lv * 0.05 }),
    effectText: (lv) => lv === 0 ? '伝説武器ドロップ率 +5% / Lv' : `伝説武器ドロップ率 +${lv * 5}%`,
  },
];

// ========================================
// ボーナス計算関数
// ========================================

const getPrestigeBonuses = (upgradeLevels = {}) => {
  let hpMult = 1.0, atkMult = 1.0, spdAdd = 0;
  let scrapMult = 1.0, healCostMult = 1.0;
  let startScrap = 0, extraSocket = 0, legendaryDropBonus = 0;

  for (const upg of PRESTIGE_UPGRADES) {
    const lv = upgradeLevels[upg.id] || 0;
    if (lv === 0) continue;
    const b = upg.bonus(lv);
    if (b.hpMult != null)             hpMult *= b.hpMult;
    if (b.atkMult != null)            atkMult *= b.atkMult;
    if (b.spdAdd != null)             spdAdd += b.spdAdd;
    if (b.scrapMult != null)          scrapMult *= b.scrapMult;
    if (b.healCostMult != null)       healCostMult = Math.min(healCostMult, b.healCostMult);
    if (b.startScrap != null)         startScrap += b.startScrap;
    if (b.extraSocket != null)        extraSocket += b.extraSocket;
    if (b.legendaryDropBonus != null) legendaryDropBonus += b.legendaryDropBonus;
  }
  return { hpMult, atkMult, spdAdd, scrapMult, healCostMult, startScrap, extraSocket, legendaryDropBonus };
};

// 獲得プレステージポイント計算
const calcPrestigePoints = (reachedFloor) => Math.max(1, Math.floor(reachedFloor / 3));

// ========================================
// プレステージタブ表示コンポーネント
// ========================================

const CATEGORY_LABELS = {
  survival: { label: '生存強化', color: 'text-green-400', border: 'border-green-800' },
  combat:   { label: '戦闘強化', color: 'text-red-400',   border: 'border-red-800'   },
  utility:  { label: 'ユーティリティ', color: 'text-cyan-400', border: 'border-cyan-800' },
};

const PrestigeTab = ({ prestigeData, onBuyUpgrade }) => {
  const { points = 0, totalEarned = 0, upgrades = {} } = prestigeData;
  const bonuses = getPrestigeBonuses(upgrades);

  const grouped = {};
  for (const upg of PRESTIGE_UPGRADES) {
    if (!grouped[upg.category]) grouped[upg.category] = [];
    grouped[upg.category].push(upg);
  }

  return (
    <div className="p-10 lg:p-16 max-w-5xl mx-auto w-full space-y-10 animate-fade-in-up">
      {/* ヘッダー */}
      <div>
        <h2 className="text-2xl font-bold border-b border-gray-700 pb-4 text-orange-400 flex items-center gap-3">
          <Trophy size={28} /> プレステージ (Prestige)
        </h2>
        <p className="text-gray-500 text-sm mt-3">
          探索中に敗北すると <span className="text-orange-400 font-bold">プレステージポイント</span> を獲得できます。ポイントを使って永続的な強化を解放しましょう。
        </p>
      </div>

      {/* ポイント表示 */}
      <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
        <div className="bg-orange-900/20 border border-orange-700/50 rounded-xl p-5 text-center shadow-[0_0_15px_rgba(251,146,60,0.15)]">
          <div className="text-xs text-orange-400 font-bold tracking-widest mb-1">所持ポイント</div>
          <div className="text-4xl font-black text-orange-300">{points}</div>
          <div className="text-xs text-gray-500 mt-1">PP</div>
        </div>
        <div className="bg-gray-800 border border-gray-700 rounded-xl p-5 text-center">
          <div className="text-xs text-gray-400 font-bold tracking-widest mb-1">累計獲得</div>
          <div className="text-4xl font-black text-gray-300">{totalEarned}</div>
          <div className="text-xs text-gray-500 mt-1">PP TOTAL</div>
        </div>
        <div className="bg-gray-800 border border-gray-700 rounded-xl p-5 text-sm space-y-1">
          <div className="text-xs text-gray-400 font-bold tracking-widest mb-2">現在のボーナス</div>
          {bonuses.hpMult > 1 && <div className="flex justify-between"><span className="text-gray-400">最大HP</span><span className="text-green-400 font-bold">x{bonuses.hpMult.toFixed(2)}</span></div>}
          {bonuses.atkMult > 1 && <div className="flex justify-between"><span className="text-gray-400">攻撃力</span><span className="text-red-400 font-bold">x{bonuses.atkMult.toFixed(2)}</span></div>}
          {bonuses.spdAdd > 0 && <div className="flex justify-between"><span className="text-gray-400">速度</span><span className="text-blue-400 font-bold">+{bonuses.spdAdd.toFixed(2)}</span></div>}
          {bonuses.scrapMult > 1 && <div className="flex justify-between"><span className="text-gray-400">スクラップ</span><span className="text-yellow-400 font-bold">x{bonuses.scrapMult.toFixed(2)}</span></div>}
          {bonuses.startScrap > 0 && <div className="flex justify-between"><span className="text-gray-400">初期所持</span><span className="text-yellow-400 font-bold">+{bonuses.startScrap}</span></div>}
          {Object.keys(upgrades).filter(k => (upgrades[k] || 0) > 0).length === 0 && (
            <div className="text-gray-600 text-center py-1">まだ強化なし</div>
          )}
        </div>
      </div>

      {/* アップグレードグループ */}
      {Object.entries(grouped).map(([cat, upgs]) => {
        const catInfo = CATEGORY_LABELS[cat];
        return (
          <section key={cat}>
            <h3 className={`text-lg font-bold mb-4 ${catInfo.color}`}>{catInfo.label}</h3>
            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
              {upgs.map(upg => {
                const currentLevel = upgrades[upg.id] || 0;
                const isMaxed = currentLevel >= upg.maxLevel;
                const nextCost = isMaxed ? null : upg.cost(currentLevel);
                const canAfford = !isMaxed && points >= nextCost;

                return (
                  <div
                    key={upg.id}
                    className={`bg-gray-800 border rounded-xl p-5 transition-all ${
                      isMaxed ? 'border-orange-600/50 bg-orange-900/10' :
                      canAfford ? 'border-gray-600 hover:border-orange-600/50' :
                      'border-gray-700 opacity-70'
                    }`}
                  >
                    <div className="flex items-start gap-4">
                      <div className="text-3xl shrink-0 w-12 h-12 flex items-center justify-center bg-gray-900 rounded-lg">
                        {upg.icon}
                      </div>
                      <div className="flex-1 min-w-0">
                        <div className="flex items-center justify-between mb-1">
                          <span className={`font-bold text-base ${isMaxed ? 'text-orange-400' : 'text-gray-200'}`}>
                            {upg.name}
                          </span>
                          <span className={`text-xs font-bold px-2 py-0.5 rounded ${isMaxed ? 'bg-orange-900/50 text-orange-400' : 'bg-gray-700 text-gray-400'}`}>
                            Lv {currentLevel} / {upg.maxLevel}
                          </span>
                        </div>
                        <div className="text-xs text-gray-500 mb-2">{upg.desc}</div>
                        <div className="text-sm text-cyan-300 font-bold mb-3">
                          {upg.effectText(currentLevel)}
                        </div>

                        {/* レベルバー */}
                        <div className="w-full bg-gray-700 h-1.5 rounded-full overflow-hidden mb-3">
                          <div
                            className="h-full bg-orange-500 rounded-full transition-all"
                            style={{ width: `${(currentLevel / upg.maxLevel) * 100}%` }}
                          />
                        </div>

                        {isMaxed ? (
                          <div className="text-center text-orange-400 font-bold text-sm">MAX LEVEL</div>
                        ) : (
                          <button
                            onClick={() => onBuyUpgrade(upg.id)}
                            disabled={!canAfford}
                            className={`w-full py-2 rounded-lg font-bold text-sm transition-all ${
                              canAfford
                                ? 'bg-orange-600 hover:bg-orange-500 text-white shadow-lg shadow-orange-900/50'
                                : 'bg-gray-700 text-gray-500 cursor-not-allowed'
                            }`}
                          >
                            強化する ({nextCost} PP)
                          </button>
                        )}
                      </div>
                    </div>
                  </div>
                );
              })}
            </div>
          </section>
        );
      })}

      {/* 獲得レート説明 */}
      <div className="bg-gray-800/50 border border-gray-700 rounded-xl p-5 text-sm text-gray-400">
        <div className="font-bold text-gray-300 mb-2">📌 プレステージポイント獲得レート</div>
        <div>到達階層 ÷ 3（端数切捨て、最低1）で計算されます。</div>
        <div className="mt-1 flex gap-6 flex-wrap text-xs text-gray-500">
          <span>F10 → 3PP</span>
          <span>F20 → 6PP</span>
          <span>F30 → 10PP</span>
          <span>F50 → 16PP</span>
        </div>
      </div>
    </div>
  );
};