// --- UI DEL PANEL DE ASCENSIÓN ---

// Toggle panel de ascensión
function toggleAscensionPanel() {
    audioSystem.playClick();
    const panel = document.getElementById('ascension-panel');
    if (panel) {
        const isVisible = panel.classList.contains('visible');
        if (isVisible) {
            panel.classList.remove('visible');
            removeFocusTrap(panel);
        } else {
            renderAscensionPanel();
            panel.classList.add('visible');
            setupFocusTrap(panel, toggleAscensionPanel);
        }
    }
}

// Renderizar contenido del panel de ascensión
function renderAscensionPanel() {
    const content = document.getElementById('ascension-content');
    if (!content) return;

    const castaDisponible = getCastaDisponible();
    const poderTotal = calcularPoderTotal();
    const dificultad = calcularEscaladoDificultad();

    let html = `
        <div class="ascension-header">
            <h2>🐙 Estado Profundo</h2>
            <div class="ascension-stats">
                <span class="casta-display">⚜️ Casta: <strong>${castaDisponible}</strong></span>
                <span class="ascension-count">Ascensiones: ${gameState.ascensionCount}</span>
            </div>
        </div>

        <div class="difficulty-info">
            <h4>Escalado de Dificultad (Poder: ${poderTotal})</h4>
            <div class="difficulty-bars">
                <div class="diff-stat">
                    <span>IA Growth:</span>
                    <span class="diff-value">+${(dificultad.aiGrowthBonus * 100).toFixed(0)}%</span>
                </div>
                <div class="diff-stat">
                    <span>Rivales inicio:</span>
                    <span class="diff-value">+${(dificultad.rivalStartBonus / 1000).toFixed(0)}K</span>
                </div>
                <div class="diff-stat">
                    <span>Coste edificios:</span>
                    <span class="diff-value">x${dificultad.costMultiplier.toFixed(2)}</span>
                </div>
            </div>
            ${renderDifficultyResetButton()}
        </div>

        <div class="privilegios-container">
    `;

    // Renderizar privilegios por tier
    const tiers = [
        { num: 1, name: 'Básicos', range: '1-5 ⚜️' },
        { num: 2, name: 'Intermedios', range: '10-25 ⚜️' },
        { num: 3, name: 'Avanzados', range: '50-100 ⚜️' },
        { num: 4, name: 'Elite', range: '200-500 ⚜️' }
    ];

    for (const tier of tiers) {
        const tierPrivs = Object.values(privilegiosData).filter(p => p.tier === tier.num);
        if (tierPrivs.length === 0) continue;

        html += `
            <div class="tier-section tier-${tier.num}">
                <h3>Tier ${tier.num}: ${tier.name} <span class="tier-range">(${tier.range})</span></h3>
                <div class="privilegios-grid">
        `;

        for (const priv of tierPrivs) {
            const owned = gameState.privilegiosComprados.includes(priv.id);
            const canAfford = castaDisponible >= priv.cost;
            const statusClass = owned ? 'owned' : (canAfford ? 'available' : 'locked');

            html += `
                <div class="privilegio-card ${statusClass}" data-priv-id="${priv.id}">
                    <div class="priv-emoji">${priv.emoji}</div>
                    <div class="priv-name">${priv.name}</div>
                    <div class="priv-desc">${priv.desc}</div>
                    <div class="priv-cost">${owned ? '✓ Comprado' : `${priv.cost} ⚜️`}</div>
                    ${!owned ? `<button class="btn btn--sm btn--gold priv-buy-btn" onclick="buyPrivilegio('${priv.id}')" ${!canAfford ? 'disabled' : ''}>
                        ${canAfford ? 'Comprar' : 'Sin fondos'}
                    </button>` : ''}
                </div>
            `;
        }

        html += `
                </div>
            </div>
        `;
    }

    // Sección de eliminar rival si tiene el privilegio
    if (gameState.privilegiosComprados.includes('golpe_estado') && !gameState.eliminatedRival) {
        html += `
            <div class="golpe-estado-section">
                <h3>⚔️ Golpe de Estado</h3>
                <p>Elige un rival para eliminar de este run:</p>
                <div class="rival-buttons">
                    <button class="btn btn--sm btn--danger" onclick="eliminarRival('pp')">${partidos.pp.emoji} ${partidos.pp.name}</button>
                    <button class="btn btn--sm btn--danger" onclick="eliminarRival('vox')">${partidos.vox.emoji} ${partidos.vox.name}</button>
                    <button class="btn btn--sm btn--danger" onclick="eliminarRival('podemos')">${partidos.podemos.emoji} ${partidos.podemos.name}</button>
                </div>
            </div>
        `;
    } else if (gameState.eliminatedRival) {
        const eliminated = partidos[gameState.eliminatedRival];
        html += `
            <div class="golpe-estado-section eliminated">
                <h3>⚔️ Rival Eliminado</h3>
                <p>${eliminated.emoji} ${eliminated.name} ha sido eliminado de este run.</p>
            </div>
        `;
    }

    html += `</div>`;

    // Bonuses activos
    const bonuses = calcularBonusesPrivilegios();
    const activeBonuses = [];

    if (bonuses.vpsMultiplier > 0) activeBonuses.push(`+${(bonuses.vpsMultiplier * 100).toFixed(0)}% VPS`);
    if (bonuses.costReduction > 0) activeBonuses.push(`-${(bonuses.costReduction * 100).toFixed(0)}% coste edificios`);
    if (bonuses.clickBonus > 0) activeBonuses.push(`+${bonuses.clickBonus} voto/click`);
    if (bonuses.startingVotes > 0) activeBonuses.push(`+${(bonuses.startingVotes / 1000).toFixed(0)}K votos inicio`);
    if (bonuses.baseVps > 0) activeBonuses.push(`+${bonuses.baseVps} VPS base`);
    if (bonuses.rivalGrowthReduction > 0) activeBonuses.push(`-${(bonuses.rivalGrowthReduction * 100).toFixed(0)}% growth rivales`);
    if (bonuses.negativeEventReduction > 0) activeBonuses.push(`-${(bonuses.negativeEventReduction * 100).toFixed(0)}% eventos negativos`);
    if (bonuses.upgradeEffectiveness > 0) activeBonuses.push(`+${(bonuses.upgradeEffectiveness * 100).toFixed(0)}% efectividad upgrades`);
    if (bonuses.castaMultiplier > 0) activeBonuses.push(`+${(bonuses.castaMultiplier * 100).toFixed(0)}% Casta ganada`);
    if (bonuses.unlockedBuildings.length > 0) activeBonuses.push(`${bonuses.unlockedBuildings.length} edificios desbloqueados`);
    if (bonuses.eliminateRival) activeBonuses.push(`Eliminar 1 rival/run`);

    if (activeBonuses.length > 0) {
        html += `
            <div class="active-bonuses">
                <h4>Bonuses Activos:</h4>
                <div class="bonus-list">
                    ${activeBonuses.map(b => `<span class="bonus-tag">${b}</span>`).join('')}
                </div>
            </div>
        `;
    }

    content.innerHTML = html;
}

// Comprar privilegio desde UI
function buyPrivilegio(privId) {
    if (comprarPrivilegio(privId)) {
        audioSystem.playUnlock();
        renderAscensionPanel();
        // Actualizar display si está visible
        if (typeof updateDisplay === 'function') {
            updateDisplay();
        }
    } else {
        audioSystem.playError();
    }
}

// Renderizar botón de reset de dificultad
function renderDifficultyResetButton() {
    const resets = gameState.dificultadResetCount || 0;
    const maxResets = 5;

    if (resets >= maxResets) {
        return `
            <div class="difficulty-reset">
                <span class="reset-maxed">Dificultad reducida al mínimo (${resets}/${maxResets})</span>
            </div>
        `;
    }

    const nextReduction = Math.pow(0.5, resets + 1) * 100;
    return `
        <div class="difficulty-reset">
            <button class="btn btn--sm btn--warning" onclick="confirmDifficultyReset()">
                Reducir Dificultad (${resets}/${maxResets})
            </button>
            <span class="reset-info">Reduce el poder a ${nextReduction.toFixed(0)}%</span>
        </div>
    `;
}

// Confirmar reset de dificultad
function confirmDifficultyReset() {
    const resets = gameState.dificultadResetCount || 0;
    const currentPower = Math.pow(0.5, resets) * 100;
    const nextPower = Math.pow(0.5, resets + 1) * 100;

    const confirmed = confirm(
        `¿Reducir la dificultad?\n\n` +
        `Poder actual: ${currentPower.toFixed(0)}%\n` +
        `Poder después: ${nextPower.toFixed(0)}%\n\n` +
        `Los rivales empezarán con menos votos y crecerán más lento.\n` +
        `(No pierdes privilegios, solo reduce su impacto en la dificultad)`
    );

    if (confirmed) {
        if (typeof resetEscaladoDificultad === 'function' && resetEscaladoDificultad()) {
            audioSystem.playUnlock();
            renderAscensionPanel();
        }
    }
}

// Inicializar referencias y eventos del panel
function initAscensionUI() {
    // El panel se inicializa cuando se carga index.html
    const closeBtn = document.querySelector('#ascension-panel .close-btn');
    if (closeBtn) {
        closeBtn.onclick = toggleAscensionPanel;
    }
}
