document.addEventListener('DOMContentLoaded', function() {
    const lightMode = document.getElementById('lightMode');
    const darkMode = document.getElementById('darkMode');
    const body = document.body;

    // Set initial theme based on system preference
    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
        body.classList.add('dark-mode');
        darkMode.style.display = 'none';
        lightMode.style.display = 'block';
    } else {
        body.classList.remove('dark-mode');
        darkMode.style.display = 'block';
        lightMode.style.display = 'none';
    }

    // Toggle theme functions
    lightMode.addEventListener('click', () => {
        body.classList.remove('dark-mode');
        darkMode.style.display = 'block';
        lightMode.style.display = 'none';
        localStorage.setItem('theme', 'light');
    });
    
    darkMode.addEventListener('click', () => {
        body.classList.add('dark-mode');
        darkMode.style.display = 'none';
        lightMode.style.display = 'block';
        localStorage.setItem('theme', 'dark');
    });

    // Check for saved theme preference
    const savedTheme = localStorage.getItem('theme');
    if (savedTheme) {
        if (savedTheme === 'dark') {
            body.classList.add('dark-mode');
            darkMode.style.display = 'none';
            lightMode.style.display = 'block';
        } else {
            body.classList.remove('dark-mode');
            darkMode.style.display = 'block';
            lightMode.style.display = 'none';
        }
    }
}); 
function createPaperCard(paper) {
    return `
        <div class="paper-card">
            <h2 class="paper-title">${paper.title}</h2>
            <div class="paper-authors">
                ${paper.authors.split(', ').map(author => 
                    `<span class="author-name">${author}</span>`
                ).join('')}
            </div>
            <div class="paper-abstract">
                ${paper.abstract}
            </div>
            <div class="paper-meta">
                <div class="meta-info">
                    <span class="meta-item">
                        <span class="meta-icon">📅</span>
                        ${paper.published}
                    </span>
                    <span class="meta-item">
                        <span class="meta-icon">🏷️</span>
                        ${paper.categories.join(', ')}
                    </span>
                </div>
                <div class="paper-actions">
                    <button onclick="analyzeWithAI('${paper.pdf_link}')" class="action-button analyze-btn">
                        <span>🔍</span> Analyze with AI
                    </button>
                    <button onclick="downloadPaper('${paper.pdf_link}', '${paper.title}')" class="action-button download-btn">
                        <span>📥</span> Download PDF
                    </button>
                </div>
            </div>
        </div>
    `;
}