// ===== MODAL FUNCTIONS - defined immediately (available before DOM ready) =====
window.openSubscribeModal = function(planId, planName, planPrice) {
    var modal = document.getElementById('subscribeModal');
    if (!modal) { setTimeout(function() { window.openSubscribeModal(planId, planName, planPrice); }, 100); return; }
    var planIdEl = document.getElementById('modalPlanId');
    if (planIdEl) { planIdEl.value = planId; }
    var planInfo = document.getElementById('modalPlanInfo');
    if (planInfo) { planInfo.textContent = planName + ' - $' + parseFloat(planPrice).toFixed(2); }
    var authStep = document.getElementById('modalAuthStep');
    if (authStep) { authStep.classList.remove('hidden'); }
    var payStep = document.getElementById('modalPaymentStep');
    if (payStep) { payStep.classList.add('hidden'); }
    modal.classList.add('active');
    document.body.style.overflow = 'hidden';
    // Show login tab by default
    var loginTab = document.querySelector('.modal-tab-btn[data-tab="login"]');
    if (loginTab) {
        document.querySelectorAll('.modal-tab-btn').forEach(function(b) { b.classList.remove('active'); });
        loginTab.classList.add('active');
        document.querySelectorAll('.modal-tab-content').forEach(function(c) { c.classList.remove('active'); });
        var loginContent = document.getElementById('modalTabLogin');
        if (loginContent) { loginContent.classList.add('active'); }
    }
};

window.closeSubscribeModal = function() {
    var modal = document.getElementById('subscribeModal');
    if (!modal) { return; }
    modal.classList.remove('active');
    document.body.style.overflow = '';
};