// Daily Activities System with Anti-Cheat Trivia - FIXED VERSION
let triviaTimer = null;
let triviaTimeRemaining = 150; // 2:30 minutes
let currentTriviaQuestion = 0;
let triviaScore = 0;
let userPoints = parseInt(localStorage.getItem('conchPoints') || '250');

// Popup tracking
let popupTimer = null;
let hasSeenPopup = localStorage.getItem('hasSeenActivitiesPopup') === 'true';
let lastPopupDate = localStorage.getItem('lastActivitiesPopupDate');
let hasUsedActivities = localStorage.getItem('hasUsedDailyActivities') === 'true';

// Trivia questions bank
const triviaQuestions = [
  {
    question: "Which island is home to the famous swimming pigs?",
    options: ["Nassau", "Big Major Cay (Pig Beach)", "Paradise Island", "Grand Bahama"],
    correct: 1,
    explanation: "Big Major Cay, also known as Pig Beach, is home to the famous swimming pigs of the Bahamas!"
  },
  {
    question: "What is the national bird of the Bahamas?",
    options: ["Flamingo", "Pelican", "Hummingbird", "Chickcharnie"],
    correct: 0,
    explanation: "The Caribbean Flamingo is the national bird of the Bahamas, often seen in flocks around the islands."
  },
  {
    question: "How many islands make up the Bahamas?",
    options: ["Around 200", "Over 500", "About 700", "More than 1000"],
    correct: 2,
    explanation: "The Bahamas consists of about 700 islands and cays, though only about 30 are inhabited."
  },
  {
    question: "What is the traditional Bahamian currency?",
    options: ["Bahamian Dollar", "Caribbean Peso", "Conch Shell", "Island Token"],
    correct: 0,
    explanation: "The Bahamian Dollar (BSD) is the official currency, equal in value to the US Dollar."
  },
  {
    question: "Which famous explorer is believed to have first landed in the Bahamas?",
    options: ["Vasco da Gama", "Christopher Columbus", "Ferdinand Magellan", "Sir Francis Drake"],
    correct: 1,
    explanation: "Christopher Columbus is believed to have made his first landfall in the New World in the Bahamas in 1492."
  }
];

// Daily activity completion tracking
const activityStatus = {
  trivia: localStorage.getItem('triviaCompleted') === getToday(),
  folklore: localStorage.getItem('folkloreCompleted') === getToday(),
  jokes: localStorage.getItem('jokesCompleted') === getToday(),
  puzzle: localStorage.getItem('puzzleCompleted') === getToday()
};

function getToday() {
  return new Date().toISOString().split('T')[0];
}

// MAIN DAILY ACTIVITIES INITIALIZATION
function initializeDailyActivities() {
  console.log('🎯 Initializing daily activities system...');
  
  // 1. Fix daily activities tab
  fixDailyActivitiesTab();
  
  // 2. Fix daily activities panel
  fixDailyActivitiesPanel();
  
  // 3. Fix trivia modal
  fixTriviaModal();
  
  // 4. Fix other activity modals
  fixActivityModals();
  
  console.log('✅ Daily activities system initialized!');
}

// Fix daily activities tab
function fixDailyActivitiesTab() {
  const activitiesTab = document.getElementById('dailyActivitiesTab');
  if (!activitiesTab) {
    console.log('⚠️ Daily activities tab not found');
    return;
  }
  
  // Remove existing listeners by cloning
  const newActivitiesTab = activitiesTab.cloneNode(true);
  activitiesTab.parentNode.replaceChild(newActivitiesTab, activitiesTab);
  
  newActivitiesTab.addEventListener('click', (e) => {
    e.preventDefault();
    e.stopPropagation();
    
    // Mark as used when panel is opened
    markActivitiesAsUsed();
    
    const tabContentArea = document.getElementById('tabContentArea');
    if (tabContentArea) {
      const isHidden = tabContentArea.classList.contains('hidden');
      
      if (isHidden) {
        tabContentArea.classList.remove('hidden');
      } else {
        tabContentArea.classList.add('hidden');
      }
    }
  });
  
  console.log('✅ Fixed daily activities tab');
}

// Fix daily activities panel
function fixDailyActivitiesPanel() {
  const panel = document.getElementById('dailyActivitiesPanel');
  if (!panel) {
    console.log('⚠️ Daily activities panel not found');
    return;
  }
  
  // Update points display
  const pointsElement = panel.querySelector('#userPoints');
  if (pointsElement) {
    pointsElement.textContent = `${userPoints} Conch Points`;
  }
  
  console.log('✅ Fixed daily activities panel');
}

// Fix trivia modal
function fixTriviaModal() {
  const triviaBtn = document.getElementById('dailyTriviaBtn');
  const triviaModal = document.getElementById('triviaModal');
  
  if (!triviaBtn || !triviaModal) {
    console.log('⚠️ Trivia elements not found');
    return;
  }
  
  // Remove existing listeners by cloning
  const newTriviaBtn = triviaBtn.cloneNode(true);
  triviaBtn.parentNode.replaceChild(newTriviaBtn, triviaBtn);
  
  newTriviaBtn.addEventListener('click', (e) => {
    e.preventDefault();
    e.stopPropagation();
    
    startTrivia();
  });
  
  console.log('✅ Fixed trivia modal');
}

// Fix other activity modals
function fixActivityModals() {
  const modals = [
    { id: 'folkloreModal', btnId: 'dailyFolkloreBtn', closeId: 'closeFolkloreBtn' },
    { id: 'jokesModal', btnId: 'dailyJokesBtn', closeId: 'closeJokesBtn' },
    { id: 'puzzleModal', btnId: 'dailyPuzzleBtn', closeId: 'closePuzzleBtn' }
  ];
  
  modals.forEach(({ id, btnId, closeId }) => {
    const modal = document.getElementById(id);
    const btn = document.getElementById(btnId);
    const closeBtn = document.getElementById(closeId);
    
    if (btn && modal) {
      // Remove existing listeners by cloning
      const newBtn = btn.cloneNode(true);
      btn.parentNode.replaceChild(newBtn, btn);
      
      newBtn.addEventListener('click', (e) => {
        e.preventDefault();
        e.stopPropagation();
        
        markActivitiesAsUsed();
        
        // Check completion status based on modal type
        let completed = false;
        let message = '';
        
        if (id === 'folkloreModal') {
          completed = activityStatus.folklore;
          message = 'You\\'ve already read today\\'s folklore! Come back tomorrow.';
        } else if (id === 'jokesModal') {
          completed = activityStatus.jokes;
          message = 'You\\'ve already enjoyed today\\'s jokes! Come back tomorrow.';
        } else if (id === 'puzzleModal') {
          completed = activityStatus.puzzle;
          message = 'You\\'ve already solved today\\'s puzzle! Come back tomorrow.';
        }
        
        if (completed) {
          showNotification(message, 'info');
          return;
        }
        
        modal.classList.remove('hidden');
        document.body.style.overflow = 'hidden';
        
        // Hide daily activities panel
        const tabContentArea = document.getElementById('tabContentArea');
        if (tabContentArea) {
          tabContentArea.classList.add('hidden');
        }
      });
    }
    
    if (closeBtn && modal) {
      // Remove existing listeners by cloning
      const newCloseBtn = closeBtn.cloneNode(true);
      closeBtn.parentNode.replaceChild(newCloseBtn, closeBtn);
      
      newCloseBtn.addEventListener('click', (e) => {
        e.preventDefault();
        modal.classList.add('hidden');
        document.body.style.overflow = '';
      });
    }
  });
  
  console.log('✅ Fixed activity modals');
}

// SCROLL TO TOP BUTTON FIX
function fixScrollToTopButton() {
  let scrollBtn = document.getElementById('scrollToTopBtn');
  
  // If button doesn't exist, create it
  if (!scrollBtn) {
    scrollBtn = document.createElement('button');
    scrollBtn.id = 'scrollToTopBtn';
    scrollBtn.className = 'fixed bottom-8 right-8 w-12 h-12 bg-[var(--primary-color)] hover:bg-[var(--primary-button-hover-bg-color)] text-white rounded-full shadow-lg hover:shadow-xl transition-all duration-300 z-[50] opacity-0 translate-y-2 pointer-events-none';
    scrollBtn.innerHTML = '<i class="fas fa-chevron-up" aria-hidden="true"></i>';
    scrollBtn.setAttribute('aria-label', 'Scroll to top');
    document.body.appendChild(scrollBtn);
    console.log('📤 Created scroll to top button');
  }
  
  // Remove existing event listeners by cloning
  const newScrollBtn = scrollBtn.cloneNode(true);
  scrollBtn.parentNode.replaceChild(newScrollBtn, scrollBtn);
  scrollBtn = newScrollBtn;
  
  // Add click functionality
  scrollBtn.addEventListener('click', (e) => {
    e.preventDefault();
    window.scrollTo({ top: 0, behavior: 'smooth' });
  });
  
  // Show/hide on scroll
  const handleScroll = () => {
    if (window.scrollY > 300) {
      scrollBtn.classList.remove('opacity-0', 'translate-y-2', 'pointer-events-none');
      scrollBtn.classList.add('opacity-100', 'translate-y-0', 'pointer-events-auto');
    } else {
      scrollBtn.classList.add('opacity-0', 'translate-y-2', 'pointer-events-none');
      scrollBtn.classList.remove('opacity-100', 'translate-y-0', 'pointer-events-auto');
    }
  };
  
  window.removeEventListener('scroll', handleScroll);
  window.addEventListener('scroll', handleScroll);
  handleScroll(); // Initial check
  
  console.log('✅ Fixed scroll to top button');
}

function updatePointsDisplay() {
  const pointsElements = document.querySelectorAll('#userPoints, .user-points');
  pointsElements.forEach(element => {
    if (element) {
      element.textContent = `${userPoints} Conch Points`;
    }
  });
  localStorage.setItem('conchPoints', userPoints.toString());
}

function updateActivityStatus() {
  // Update status indicators
  const indicators = {
    triviaStatus: activityStatus.trivia,
    folkloreStatus: activityStatus.folklore,
    jokesStatus: activityStatus.jokes,
    puzzleStatus: activityStatus.puzzle
  };

  Object.entries(indicators).forEach(([id, completed]) => {
    const elements = document.querySelectorAll(`#${id}`);
    elements.forEach(element => {
      if (element) {
        element.className = completed 
          ? 'w-3 h-3 bg-gray-400 rounded-full'
          : 'w-3 h-3 bg-green-400 rounded-full animate-pulse';
      }
    });
  });

  // Update progress
  const completed = Object.values(activityStatus).filter(Boolean).length;
  const progressElement = document.getElementById('progressBar');
  const completedElement = document.getElementById('activitiesCompleted');
  if (progressElement) {
    progressElement.style.width = `${(completed / 4) * 100}%`;
  }
  if (completedElement) {
    completedElement.textContent = `${completed}/4`;
  }
}

function showNotification(message, type = 'info') {
  const bgColor = type === 'success' ? 'bg-green-500' : 
                  type === 'error' ? 'bg-red-500' : 
                  'bg-blue-500';
  
  const notification = document.createElement('div');
  notification.className = `fixed top-4 right-4 ${bgColor} text-white px-6 py-3 rounded-lg shadow-lg z-[101] transform translate-x-full transition-transform duration-300`;
  notification.innerHTML = `
    <div class="flex items-center">
      <i class="fas fa-${type === 'success' ? 'check-circle' : type === 'error' ? 'exclamation-triangle' : 'info-circle'} mr-2"></i>
      <span>${message}</span>
    </div>
  `;
  
  document.body.appendChild(notification);
  
  setTimeout(() => notification.classList.remove('translate-x-full'), 100);
  
  setTimeout(() => {
    notification.classList.add('translate-x-full');
    setTimeout(() => {
      if (document.body.contains(notification)) {
        document.body.removeChild(notification);
      }
    }, 300);
  }, 3000);
}

// Popup Management Functions
function shouldShowPopup() {
  const today = getToday();
  
  // Always show if user hasn't used activities yet and hasn't seen popup today
  if (!hasUsedActivities && (!hasSeenPopup || lastPopupDate !== today)) {
    return true;
  }
  
  // Show if new content is available (new day) and user has used activities before
  if (hasUsedActivities && lastPopupDate !== today) {
    return true;
  }
  
  return false;
}

function showActivitiesPopup() {
  const popup = document.getElementById('activitiesPopup');
  if (popup && shouldShowPopup()) {
    popup.classList.remove('scale-0', 'opacity-0', 'pointer-events-none');
    popup.classList.add('scale-100', 'opacity-100', 'pointer-events-auto');
    
    // Add bounce animation
    popup.style.animation = 'bounce 0.6s ease-out';
    
    // Mark as seen for today
    localStorage.setItem('hasSeenActivitiesPopup', 'true');
    localStorage.setItem('lastActivitiesPopupDate', getToday());
    hasSeenPopup = true;
    lastPopupDate = getToday();
    
    // Auto-hide after 8 seconds if not interacted with
    setTimeout(() => {
      hideActivitiesPopup();
    }, 8000);
  }
}

function hideActivitiesPopup() {
  const popup = document.getElementById('activitiesPopup');
  if (popup) {
    popup.classList.add('scale-0', 'opacity-0', 'pointer-events-none');
    popup.classList.remove('scale-100', 'opacity-100', 'pointer-events-auto');
    popup.style.animation = '';
  }
}

function startPeriodicPopup() {
  // Clear any existing timer
  if (popupTimer) {
    clearInterval(popupTimer);
  }
  
  // Show popup immediately if conditions are met
  setTimeout(() => {
    showActivitiesPopup();
  }, 3000); // Show after 3 seconds on page load
  
  // Then show periodically every 45 seconds until user interacts
  popupTimer = setInterval(() => {
    if (shouldShowPopup() && !hasUsedActivities) {
      showActivitiesPopup();
    } else {
      clearInterval(popupTimer);
      popupTimer = null;
    }
  }, 45000); // Every 45 seconds
}

function markActivitiesAsUsed() {
  hasUsedActivities = true;
  localStorage.setItem('hasUsedDailyActivities', 'true');
  hideActivitiesPopup();
  
  // Stop periodic popup
  if (popupTimer) {
    clearInterval(popupTimer);
    popupTimer = null;
  }
}

// Secure Trivia System
function startTrivia() {
  if (activityStatus.trivia) {
    showNotification('You\'ve already completed today\'s trivia! Come back tomorrow.', 'info');
    return;
  }

  // Mark as used
  markActivitiesAsUsed();

  const modal = document.getElementById('triviaModal');
  modal.classList.remove('hidden');
  
  // Disable page interactions
  document.body.style.overflow = 'hidden';
  
  // Hide daily activities panel
  const tabContentArea = document.getElementById('tabContentArea');
  if (tabContentArea) {
    tabContentArea.classList.add('hidden');
  }
  
  // Start anti-cheat timer
  triviaTimeRemaining = 150;
  startTriviaTimer();
  
  // Block common cheat methods
  blockCheating();
  
  // Load first question
  loadTriviaQuestion(0);
  
  // Initialize trivia questions functionality
  initializeTriviaQuestions();
}

function initializeTriviaQuestions() {
  const triviaModal = document.getElementById('triviaModal');
  if (!triviaModal) return;
  
  // Add close functionality for Escape key
  const handleEscape = (e) => {
    if (e.key === 'Escape') {
      endTrivia(false);
      document.removeEventListener('keydown', handleEscape);
    }
  };
  document.addEventListener('keydown', handleEscape);
  
  // Find next button if it exists
  const nextBtn = triviaModal.querySelector('#nextTriviaBtn');
  if (nextBtn) {
    const newNextBtn = nextBtn.cloneNode(true);
    nextBtn.parentNode.replaceChild(newNextBtn, nextBtn);
    
    newNextBtn.addEventListener('click', (e) => {
      e.preventDefault();
      nextTriviaQuestion();
    });
  }
}

function blockCheating() {
  // Disable right-click context menu
  document.addEventListener('contextmenu', preventCheat);
  
  // Disable common keyboard shortcuts
  document.addEventListener('keydown', preventCheatKeys);
  
  // Detect tab switching/window blur
  window.addEventListener('blur', handleTabSwitch);
  window.addEventListener('focus', handleTabReturn);
}

function preventCheat(e) {
  if (document.getElementById('triviaModal').classList.contains('hidden')) return;
  e.preventDefault();
  showCheatWarning();
}

function preventCheatKeys(e) {
  if (document.getElementById('triviaModal').classList.contains('hidden')) return;
  
  const key = e.key;
  const ctrl = e.ctrlKey;
  const shift = e.shiftKey;
  const alt = e.altKey;
  
  if (
    key === 'F12' ||
    key === 'F5' ||
    (ctrl && key === 'r') ||
    (ctrl && shift && key === 'I') ||
    (ctrl && shift && key === 'J') ||
    (ctrl && key === 't') ||
    (ctrl && key === 'w') ||
    (alt && key === 'Tab')
  ) {
    e.preventDefault();
    showCheatWarning();
  }
}

function handleTabSwitch() {
  if (!document.getElementById('triviaModal').classList.contains('hidden')) {
    showCheatWarning();
    // Add penalty time
    triviaTimeRemaining -= 30;
    if (triviaTimeRemaining <= 0) {
      endTrivia(false);
    }
  }
}

function handleTabReturn() {
  // User returned to tab during trivia
}

function showCheatWarning() {
  const warning = document.createElement('div');
  warning.className = 'fixed top-4 right-4 bg-red-500 text-white p-4 rounded-xl shadow-2xl z-[10000] animate-bounce';
  warning.innerHTML = `
    <div class="flex items-center space-x-2">
      <i class="fas fa-exclamation-triangle"></i>
      <span class="font-bold">No cheating! Stay focused!</span>
    </div>
  `;
  document.body.appendChild(warning);
  
  setTimeout(() => {
    if (warning.parentNode) {
      warning.parentNode.removeChild(warning);
    }
  }, 3000);
}

function startTriviaTimer() {
  triviaTimer = setInterval(() => {
    triviaTimeRemaining--;
    updateTriviaTimer();
    
    if (triviaTimeRemaining <= 0) {
      endTrivia(false);
    }
  }, 1000);
}

function updateTriviaTimer() {
  const minutes = Math.floor(triviaTimeRemaining / 60);
  const seconds = triviaTimeRemaining % 60;
  const timerElement = document.getElementById('triviaTimer');
  if (timerElement) {
    timerElement.textContent = `${minutes}:${seconds.toString().padStart(2, '0')}`;
    
    // Color warning when time is low
    if (triviaTimeRemaining <= 30) {
      timerElement.className = 'font-bold text-red-300 animate-pulse';
    } else if (triviaTimeRemaining <= 60) {
      timerElement.className = 'font-bold text-yellow-300';
    }
  }
}

function loadTriviaQuestion(questionIndex) {
  const question = triviaQuestions[questionIndex];
  currentTriviaQuestion = questionIndex;
  
  // Update progress
  const currentQElement = document.getElementById('currentQ');
  const progressElement = document.getElementById('triviaProgress');
  if (currentQElement) currentQElement.textContent = questionIndex + 1;
  if (progressElement) progressElement.style.width = `${((questionIndex + 1) / triviaQuestions.length) * 100}%`;
  
  // Load question
  const questionElement = document.getElementById('triviaQuestion');
  questionElement.innerHTML = `
    <h3 class="text-xl font-bold text-gray-800 mb-4">${question.question}</h3>
    <div class="space-y-3">
      ${question.options.map((option, index) => `
        <button class="trivia-option w-full text-left p-4 rounded-xl border-2 border-gray-200 hover:border-blue-400 hover:bg-blue-50 transition-all" data-answer="${index === question.correct ? 'correct' : 'wrong'}" data-index="${index}">
          ${String.fromCharCode(65 + index)}) ${option}
        </button>
      `).join('')}
    </div>
  `;
  
  // Add click handlers to new options
  document.querySelectorAll('.trivia-option').forEach(button => {
    button.addEventListener('click', handleTriviaAnswer);
  });
  
  // Hide feedback
  const feedbackElement = document.getElementById('triviaFeedback');
  if (feedbackElement) feedbackElement.classList.add('hidden');
  
  const nextBtn = document.getElementById('nextTriviaBtn');
  if (nextBtn) {
    nextBtn.disabled = true;
    nextBtn.textContent = questionIndex >= triviaQuestions.length - 1 ? 'Finish Quiz' : 'Next Question';
  }
}

function handleTriviaAnswer(e) {
  const isCorrect = e.target.getAttribute('data-answer') === 'correct';
  const selectedIndex = parseInt(e.target.getAttribute('data-index'));
  const question = triviaQuestions[currentTriviaQuestion];
  
  // Disable all options
  document.querySelectorAll('.trivia-option').forEach(button => {
    button.disabled = true;
    button.classList.remove('hover:border-blue-400', 'hover:bg-blue-50');
    
    const buttonIndex = parseInt(button.getAttribute('data-index'));
    if (buttonIndex === question.correct) {
      button.classList.add('border-green-500', 'bg-green-50');
    } else if (buttonIndex === selectedIndex && !isCorrect) {
      button.classList.add('border-red-500', 'bg-red-50');
    }
  });
  
  if (isCorrect) {
    triviaScore++;
  }
  
  // Show feedback
  const feedbackElement = document.getElementById('triviaFeedback');
  const feedbackContent = document.getElementById('feedbackContent');
  
  if (feedbackContent) {
    feedbackContent.innerHTML = `
      <div class="flex items-center space-x-3 mb-3">
        <div class="w-8 h-8 rounded-full flex items-center justify-center ${isCorrect ? 'bg-green-100' : 'bg-red-100'}">
          <i class="fas ${isCorrect ? 'fa-check text-green-600' : 'fa-times text-red-600'}"></i>
        </div>
        <span class="font-bold text-lg ${isCorrect ? 'text-green-800' : 'text-red-800'}">
          ${isCorrect ? 'Correct!' : 'Incorrect!'}
        </span>
      </div>
      <p class="text-gray-700">${question.explanation}</p>
    `;
  }
  
  if (feedbackElement) {
    feedbackElement.className = `mb-6 p-4 rounded-xl ${isCorrect ? 'bg-green-50 border border-green-200' : 'bg-red-50 border border-red-200'}`;
    feedbackElement.classList.remove('hidden');
  }
  
  // Enable next button
  const nextBtn = document.getElementById('nextTriviaBtn');
  if (nextBtn) {
    nextBtn.disabled = false;
  }
}

function nextTriviaQuestion() {
  if (currentTriviaQuestion >= triviaQuestions.length - 1) {
    endTrivia(true);
  } else {
    loadTriviaQuestion(currentTriviaQuestion + 1);
  }
}

function endTrivia(completed) {
  // Clear timer
  if (triviaTimer) {
    clearInterval(triviaTimer);
    triviaTimer = null;
  }
  
  // Remove cheat protection
  document.removeEventListener('contextmenu', preventCheat);
  document.removeEventListener('keydown', preventCheatKeys);
  window.removeEventListener('blur', handleTabSwitch);
  window.removeEventListener('focus', handleTabReturn);
  
  // Re-enable page
  document.body.style.overflow = '';
  
  if (completed) {
    // Award points based on score
    const pointsEarned = triviaScore * 10; // 10 points per correct answer
    userPoints += pointsEarned;
    updatePointsDisplay();
    
    // Mark as completed
    localStorage.setItem('triviaCompleted', getToday());
    activityStatus.trivia = true;
    updateActivityStatus();
    
    // Show completion message
    showNotification(`Trivia completed! You scored ${triviaScore}/${triviaQuestions.length} and earned ${pointsEarned} points!`, 'success');
  } else {
    showNotification('Time\'s up! Try again tomorrow.', 'error');
  }
  
  // Close modal
  document.getElementById('triviaModal').classList.add('hidden');
  
  // Reset trivia state
  currentTriviaQuestion = 0;
  triviaScore = 0;
  triviaTimeRemaining = 150;
}

// Initialize everything
function init() {
  updatePointsDisplay();
  updateActivityStatus();
  
  // Fix scroll to top button
  setTimeout(() => {
    fixScrollToTopButton();
  }, 200);
  
  // Initialize daily activities system
  initializeDailyActivities();
  
  // Start periodic popup system
  startPeriodicPopup();
  
  // Popup Event Listeners
  const closePopupBtn = document.getElementById('closeActivitiesPopup');
  if (closePopupBtn) {
    const newClosePopupBtn = closePopupBtn.cloneNode(true);
    closePopupBtn.parentNode.replaceChild(newClosePopupBtn, closePopupBtn);
    
    newClosePopupBtn.addEventListener('click', (e) => {
      e.stopPropagation();
      hideActivitiesPopup();
    });
  }
  
  const tryActivitiesBtn = document.getElementById('tryActivitiesBtn');
  if (tryActivitiesBtn) {
    const newTryActivitiesBtn = tryActivitiesBtn.cloneNode(true);
    tryActivitiesBtn.parentNode.replaceChild(newTryActivitiesBtn, tryActivitiesBtn);
    
    newTryActivitiesBtn.addEventListener('click', (e) => {
      e.stopPropagation();
      markActivitiesAsUsed();
      // Show daily activities panel
      document.getElementById('tabContentArea').classList.remove('hidden');
    });
  }
  
  // Close panels when clicking outside
  document.addEventListener('click', (e) => {
    const tabArea = document.getElementById('tabContentArea');
    const dailyBtn = document.getElementById('dailyActivitiesTab');
    const popup = document.getElementById('activitiesPopup');
    
    if (tabArea && !tabArea.contains(e.target) && dailyBtn && !dailyBtn.contains(e.target)) {
      tabArea.classList.add('hidden');
    }
    
    // Close popup when clicking outside
    if (popup && !popup.contains(e.target) && dailyBtn && !dailyBtn.contains(e.target)) {
      hideActivitiesPopup();
    }
  });
  
  // Setup reward claim buttons
  setupRewardButtons();
  
  // Setup puzzle functionality
  setupPuzzleFunctionality();
  
  console.log('🎉 Page initialized with WORKING daily activities and scroll to top!');
}

// Setup reward claim buttons
function setupRewardButtons() {
  // Folklore reward
  const folkloreBtn = document.getElementById('claimFolkloreBtn');
  if (folkloreBtn) {
    const newFolkloreBtn = folkloreBtn.cloneNode(true);
    folkloreBtn.parentNode.replaceChild(newFolkloreBtn, folkloreBtn);
    
    newFolkloreBtn.addEventListener('click', () => {
      userPoints += 20;
      updatePointsDisplay();
      localStorage.setItem('folkloreCompleted', getToday());
      activityStatus.folklore = true;
      updateActivityStatus();
      document.getElementById('folkloreModal').classList.add('hidden');
      document.body.style.overflow = '';
      showNotification('Folklore read! You earned 20 points!', 'success');
    });
  }
  
  // Jokes reward
  const jokesBtn = document.getElementById('claimJokesBtn');
  if (jokesBtn) {
    const newJokesBtn = jokesBtn.cloneNode(true);
    jokesBtn.parentNode.replaceChild(newJokesBtn, jokesBtn);
    
    newJokesBtn.addEventListener('click', () => {
      userPoints += 15;
      updatePointsDisplay();
      localStorage.setItem('jokesCompleted', getToday());
      activityStatus.jokes = true;
      updateActivityStatus();
      document.getElementById('jokesModal').classList.add('hidden');
      document.body.style.overflow = '';
      showNotification('Jokes enjoyed! You earned 15 points!', 'success');
    });
  }
}

// Setup puzzle functionality
function setupPuzzleFunctionality() {
  const hintBtn = document.getElementById('hintBtn');
  if (hintBtn) {
    const newHintBtn = hintBtn.cloneNode(true);
    hintBtn.parentNode.replaceChild(newHintBtn, hintBtn);
    
    newHintBtn.addEventListener('click', () => {
      document.getElementById('hintDisplay').classList.remove('hidden');
      newHintBtn.style.display = 'none';
    });
  }
  
  const submitBtn = document.getElementById('submitPuzzleBtn');
  if (submitBtn) {
    const newSubmitBtn = submitBtn.cloneNode(true);
    submitBtn.parentNode.replaceChild(newSubmitBtn, submitBtn);
    
    newSubmitBtn.addEventListener('click', () => {
      const answer = document.getElementById('puzzleAnswer').value.toUpperCase().trim();
      const correct = answer === 'NASSAU';
      const resultElement = document.getElementById('puzzleResult');
      const resultContent = document.getElementById('puzzleResultContent');
      
      if (correct) {
        const basePoints = 30;
        const hintPenalty = document.getElementById('hintDisplay').classList.contains('hidden') ? 0 : 5;
        const pointsEarned = basePoints - hintPenalty;
        
        userPoints += pointsEarned;
        updatePointsDisplay();
        localStorage.setItem('puzzleCompleted', getToday());
        activityStatus.puzzle = true;
        updateActivityStatus();
        
        if (resultContent) {
          resultContent.innerHTML = `
            <div class="bg-green-50 border border-green-200 text-green-800 p-4 rounded-xl">
              <i class="fas fa-check-circle text-2xl mb-2"></i>
              <h4 class="font-bold mb-2">Correct! 🎉</h4>
              <p>You earned ${pointsEarned} points!</p>
            </div>
          `;
        }
        
        setTimeout(() => {
          document.getElementById('puzzleModal').classList.add('hidden');
          document.body.style.overflow = '';
        }, 3000);
      } else {
        if (resultContent) {
          resultContent.innerHTML = `
            <div class="bg-red-50 border border-red-200 text-red-800 p-4 rounded-xl">
              <i class="fas fa-times-circle text-2xl mb-2"></i>
              <h4 class="font-bold mb-2">Try Again!</h4>
              <p>That's not quite right. Think about the capital city!</p>
            </div>
          `;
        }
      }
      
      if (resultElement) {
        resultElement.classList.remove('hidden');
      }
    });
  }
}

function teardown() {
  // Clear any running timers
  if (triviaTimer) {
    clearInterval(triviaTimer);
    triviaTimer = null;
  }
  
  if (popupTimer) {
    clearInterval(popupTimer);
    popupTimer = null;
  }
  
  // Remove event listeners
  document.removeEventListener('contextmenu', preventCheat);
  document.removeEventListener('keydown', preventCheatKeys);
  window.removeEventListener('blur', handleTabSwitch);
  window.removeEventListener('focus', handleTabReturn);
  
  // Reset body overflow
  document.body.style.overflow = '';
}

// Export functions for the page system
export { init, teardown };