<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Class X Social Science Sample Paper Generator</title>
    <link href="img/logo1.jpg" rel="icon">
    <!-- Add jsPDF library -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
   <style>
        :root {
            --primary: #4361ee;
            --primary-dark: #3f37c9;
            --secondary: #4895ef;
            --danger: #f72585;
            --success: #4cc9f0;
            --light: #f8f9fa;
            --dark: #212529;
            --gray: #6c757d;
            --border-radius: 12px;
            --box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
            --transition: all 0.3s ease;
        }

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }

        body {
            background: linear-gradient(135deg, #f5f7fa 0%, #e2e8f0 100%);
            min-height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 20px;
            color: var(--dark);
            line-height: 1.6;
        }

        .container {
            width: 100%;
            max-width: 900px;
            background: white;
            border-radius: var(--border-radius);
            box-shadow: var(--box-shadow);
            overflow: hidden;
            transition: var(--transition);
            animation: fadeIn 0.5s ease-out;
        }

        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        .header {
            background: linear-gradient(135deg, var(--primary), var(--primary-dark));
            color: white;
            padding: 30px 20px;
            text-align: center;
            position: relative;
            overflow: hidden;
        }

        .header::before {
            content: '';
            position: absolute;
            top: -50px;
            right: -50px;
            width: 150px;
            height: 150px;
            background: rgba(255, 255, 255, 0.1);
            border-radius: 50%;
        }

        .header h1 {
            font-size: 2rem;
            margin-bottom: 10px;
            font-weight: 700;
            position: relative;
            z-index: 1;
        }

        .header p {
            font-size: 1rem;
            opacity: 0.9;
            position: relative;
            z-index: 1;
        }

        .content-area {
            padding: 30px;
        }

        .hidden {
            display: none !important;
        }

        .btn {
            display: inline-block;
            padding: 12px 28px;
            border-radius: 50px;
            font-weight: 600;
            cursor: pointer;
            transition: var(--transition);
            border: none;
            text-align: center;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
            margin: 10px 5px;
        }

        .btn-primary {
            background: var(--primary);
            color: white;
        }

        .btn-primary:hover {
            background: var(--primary-dark);
            transform: translateY(-2px);
            box-shadow: 0 8px 15px rgba(67, 97, 238, 0.3);
        }

        .btn-success {
            background: var(--success);
            color: white;
        }

        .btn-success:hover {
            background: #3ab0d6;
            transform: translateY(-2px);
            box-shadow: 0 8px 15px rgba(76, 201, 240, 0.3);
        }

        .btn-danger {
            background: var(--danger);
            color: white;
        }

        .btn-danger:hover {
            background: #d3166b;
            transform: translateY(-2px);
            box-shadow: 0 8px 15px rgba(247, 37, 133, 0.3);
        }

        .btn-group {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 10px;
            margin: 20px 0;
        }

        .section-title {
            text-align: center;
            margin-bottom: 25px;
            color: var(--primary-dark);
            font-size: 1.5rem;
            position: relative;
            padding-bottom: 10px;
        }

        .section-title::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 80px;
            height: 3px;
            background: var(--secondary);
            border-radius: 3px;
        }

        .checkbox-container {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
            gap: 15px;
            margin: 25px 0;
        }

        .checkbox-item {
            display: flex;
            align-items: center;
        }

        .checkbox-item input {
            margin-right: 10px;
            width: 18px;
            height: 18px;
            cursor: pointer;
        }

        .checkbox-item label {
            cursor: pointer;
            font-size: 0.95rem;
        }

        .generated-paper {
            padding: 30px;
        }

        .paper-header {
            text-align: center;
            margin-bottom: 30px;
            border-bottom: 2px solid var(--primary);
            padding-bottom: 20px;
        }

        .paper-header h2 {
            color: var(--primary-dark);
            margin-bottom: 5px;
            font-size: 1.8rem;
        }

        .paper-header h3 {
            color: var(--gray);
            margin-bottom: 5px;
            font-size: 1.2rem;
            font-weight: 500;
        }

        .paper-meta {
            display: flex;
            justify-content: space-between;
            margin-bottom: 25px;
            padding-bottom: 15px;
            border-bottom: 1px solid #eee;
            font-weight: 500;
        }

        .instructions {
            margin-bottom: 30px;
            padding: 20px;
            background: #f8f9fa;
            border-radius: var(--border-radius);
        }

        .instructions ol {
            padding-left: 20px;
            margin-top: 10px;
        }

        .instructions li {
            margin-bottom: 8px;
        }

        .question-section {
            margin-bottom: 30px;
        }

        .section-heading {
            font-weight: 600;
            color: var(--primary-dark);
            margin-bottom: 15px;
            padding-bottom: 5px;
            border-bottom: 1px solid #eee;
        }

        .question {
            margin-bottom: 20px;
            page-break-inside: avoid;
        }

        .question-text {
            font-weight: 500;
            margin-bottom: 8px;
        }

        .option {
            margin-left: 20px;
            margin-bottom: 5px;
        }

        .action-buttons {
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            gap: 15px;
            margin-top: 40px;
        }

        @media (max-width: 768px) {
            .header h1 {
                font-size: 1.6rem;
            }
            
            .content-area {
                padding: 20px;
            }
            
            .checkbox-container {
                grid-template-columns: 1fr;
            }
            
            .btn {
                padding: 10px 20px;
                font-size: 0.9rem;
            }
            
            .paper-header h2 {
                font-size: 1.4rem;
            }
            
            .paper-header h3 {
                font-size: 1rem;
            }
        }

        @media (max-width: 480px) {
            .header {
                padding: 20px 15px;
            }
            
            .section-title {
                font-size: 1.3rem;
            }
            
            .paper-meta {
                flex-direction: column;
                gap: 10px;
            }
            
            .action-buttons {
                flex-direction: column;
                align-items: center;
            }
            
            .btn {
                width: 100%;
                max-width: 250px;
            }
        }

        @media print {
            body {
                background: none;
                padding: 0;
            }
            
            .container {
                box-shadow: none;
                max-width: 100%;
            }
            
            .action-buttons {
                display: none;
            }
            
            .question {
                page-break-inside: avoid;
            }
        }
    </style>
    
    <style>
        /* Ensure header styling is preserved */
        .header {
            background: linear-gradient(135deg, #4361ee, #3f37c9) !important;
            color: white !important;
            padding: 30px 20px !important;
            text-align: center !important;
            position: relative !important;
            overflow: hidden !important;
            width: 100% !important;
        }
        
        .header h1, .header h2, .header h3 {
            color: white !important;
            font-weight: bold !important;
        }
        
        .temp-pdf-container {
            font-family: Arial, sans-serif;
            line-height: 1.5;
        }
        
        .temp-pdf-container * {
            max-width: 100% !important;
            background-color: white !important;
            color: black !important;
        }
        
        /* Page break control */
        .question {
            page-break-inside: avoid;
            break-inside: avoid;
        }
        
        .question-section {
            page-break-after: auto;
        }
        
        @media print {
            body {
                margin: 0 !important;
                padding: 0 !important;
                background: white !important;
            }
            .container {
                width: 100% !important;
                margin: 0 !important;
                padding: 0 !important;
                box-shadow: none !important;
            }
            .header {
                -webkit-print-color-adjust: exact !important;
                print-color-adjust: exact !important;
            }
        }
         /* Home icon styles */
        .home-icon {
            position: absolute;
            top: 20px;
            left: 20px;
            color: white;
            font-size: 24px;
            cursor: pointer;
            transition: var(--transition);
            z-index: 2;
        }

        .home-icon:hover {
            transform: scale(1.1);
            color: rgba(255, 255, 255, 0.8);
        }
        @media (max-width: 480px) {
            .home-icon {
                font-size: 20px;
                top: 15px;
                left: 15px;
            }
        }

        @media print {
            .home-icon {
                display: none;
            }
        }
    </style>
</head>
<body>
    <div class="container" id="startContainer">
        <div class="header">
            <a href="cbse-class-9-to-12-exam-paper-generator.html" class="home-icon">
                <i class="fas fa-home"></i>
            </a>
            <h1>Class X Social Science</h1>
            <p>Generate Customized Sample Papers</p>
        </div>
        
        <div class="content-area">
            <div id="startScreen">
                <h2 class="section-title">Social Science Paper Generator</h2>
                <div class="btn-group">
                    <button class="btn btn-primary" onclick="showChapterSelection()">Start Generating</button>
                </div>
            </div>

            <div id="chapterSelection" class="hidden">
                <h2 class="section-title">Select Chapters for Social Science</h2>
                <form id="chapterForm">
                    <div class="checkbox-container">
                        <div class="checkbox-item">
                            <input type="checkbox" id="fullPaper" name="chapter" value="Full Paper" onchange="toggleChapters()">
                            <label for="fullPaper">Full Paper (All Chapters)</label>
                        </div>
                        <!-- History Chapters -->
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter1" name="chapter" value="Chapter 1">
                            <label for="chapter1">1. The Rise of Nationalism in Europe</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter2" name="chapter" value="Chapter 2">
                            <label for="chapter2">2. Nationalism in India</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter3" name="chapter" value="Chapter 3">
                            <label for="chapter3">3. The Making of a Global World</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter4" name="chapter" value="Chapter 4">
                            <label for="chapter4">4. The Age of Industrialisation</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter5" name="chapter" value="Chapter 5">
                            <label for="chapter5">5. Work, Life and Leisure</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter6" name="chapter" value="Chapter 6">
                            <label for="chapter6">6. Print Culture and the Modern World</label>
                        </div>
                        
                        <!-- Geography Chapters -->
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter7" name="chapter" value="Chapter 7">
                            <label for="chapter7">7. Resources and Development</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter8" name="chapter" value="Chapter 8">
                            <label for="chapter8">8. Forest and Wildlife Resources</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter9" name="chapter" value="Chapter 9">
                            <label for="chapter9">9. Water Resources</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter10" name="chapter" value="Chapter 10">
                            <label for="chapter10">10. Agriculture</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter11" name="chapter" value="Chapter 11">
                            <label for="chapter11">11. Minerals and Energy Resources</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter12" name="chapter" value="Chapter 12">
                            <label for="chapter12">12. Manufacturing Industries</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter13" name="chapter" value="Chapter 13">
                            <label for="chapter13">13. Life Lines of National Economy</label>
                        </div>
                        
                        <!-- Political Science Chapters -->
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter14" name="chapter" value="Chapter 14">
                            <label for="chapter14">14. Power Sharing</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter15" name="chapter" value="Chapter 15">
                            <label for="chapter15">15. Federalism</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter16" name="chapter" value="Chapter 16">
                            <label for="chapter16">16. Democracy and Diversity</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter17" name="chapter" value="Chapter 17">
                            <label for="chapter17">17. Gender, Religion and Caste</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter18" name="chapter" value="Chapter 18">
                            <label for="chapter18">18. Popular Struggles and Movements</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter19" name="chapter" value="Chapter 19">
                            <label for="chapter19">19. Political Parties</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter20" name="chapter" value="Chapter 20">
                            <label for="chapter20">20. Outcomes of Democracy</label>
                        </div>
                        
                        <!-- Economics Chapters -->
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter21" name="chapter" value="Chapter 21">
                            <label for="chapter21">21. Development</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter22" name="chapter" value="Chapter 22">
                            <label for="chapter22">22. Sectors of the Indian Economy</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter23" name="chapter" value="Chapter 23">
                            <label for="chapter23">23. Money and Credit</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter24" name="chapter" value="Chapter 24">
                            <label for="chapter24">24. Globalisation and the Indian Economy</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter25" name="chapter" value="Chapter 25">
                            <label for="chapter25">25. Consumer Rights</label>
                        </div>
                    </div>
                </form>
                <div class="btn-group">
                    <button class="btn btn-danger" onclick="backToStart()">Back to Start</button>
                    <button class="btn btn-success" onclick="promptSchoolName()">Generate Paper</button>
                </div>
            </div>
        </div>
    </div>

    <div class="container hidden" id="generatedPaperContainer"></div>

    <script>
        // Initialize jsPDF
        const { jsPDF } = window.jspdf;
        
        let schoolName = '';
        let questionCounter = 1;
        let sessionYear = '';

        const questions = {
            socialScience: {
                "Chapter 1": { // The Rise of Nationalism in Europe
                    mcq: [ 
                        { question: "Who was proclaimed the first King of united Italy?", options: ["Victor Emmanuel II", "Giuseppe Garibaldi", "Count Cavour", "Giuseppe Mazzini"], answer: "Victor Emmanuel II" },
                        { question: "Which treaty recognized Greece as an independent nation?", options: ["Treaty of Vienna", "Treaty of Constantinople", "Treaty of Versailles", "Treaty of Paris"], answer: "Treaty of Constantinople" }
                    ],
                    twoMark: [ 
                        "What was the role of culture in the development of nationalism in Europe?",
                        "Name two measures introduced by the French Revolutionaries to create a sense of collective identity."
                    ],
                    threeMark: [ 
                        "Explain the significance of the Frankfurt Parliament.",
                        "Describe the role of women in nationalist struggles."
                    ],
                    fiveMark: [ 
                        "Discuss the process of unification of Germany.",
                        "Analyze the impact of Napoleonic reforms on Europe."
                    ],
                    caseStudy: [ 
                        { case: "Case Study on the Greek War of Independence", questions: ["When did the Greek War of Independence begin?", "What was the role of poets and artists in this war?"] }
                    ],
                    map: [ 
                        { map: "Map of Europe in 1815", questions: ["Identify France on the map.", "Locate the German Confederation."] }
                    ]
                },
                "Chapter 2": { // Nationalism in India
                    mcq: [ 
                        { question: "Who was the writer of 'Hind Swaraj'?", options: ["Mahatma Gandhi", "Jawaharlal Nehru", "Bal Gangadhar Tilak", "Rabindranath Tagore"], answer: "Mahatma Gandhi" },
                        { question: "When was the Non-Cooperation Movement launched?", options: ["1919", "1920", "1921", "1922"], answer: "1920" }
                    ],
                    twoMark: [ 
                        "What was the Rowlatt Act?",
                        "Name two methods used by Gandhiji in the freedom struggle."
                    ],
                    threeMark: [ 
                        "Explain the significance of the Salt March.",
                        "Describe the impact of the First World War on India."
                    ],
                    fiveMark: [ 
                        "Discuss the different strands within the Civil Disobedience Movement.",
                        "Analyze the role of different social groups in the Non-Cooperation Movement."
                    ],
                    caseStudy: [ 
                        { case: "Case Study on the Jallianwala Bagh Massacre", questions: ["When did the Jallianwala Bagh massacre occur?", "What was its impact on the national movement?"] }
                    ],
                    map: [ 
                        { map: "Map of India showing important centers of national movement", questions: ["Identify Champaran on the map.", "Locate Dandi."] }
                    ]
                },
                // ... (other chapters follow similar pattern with updated content)
                "Chapter 25": { // Consumer Rights
                    mcq: [ 
                        { question: "When was the Consumer Protection Act enacted in India?", options: ["1985", "1986", "1987", "1988"], answer: "1986" },
                        { question: "Which logo is used for standard products in India?", options: ["ISI", "AGMARK", "FPO", "ECO"], answer: "ISI" }
                    ],
                    twoMark: [ 
                        "What is COPRA?",
                        "Name two consumer rights."
                    ],
                    threeMark: [ 
                        "Explain the need for consumer awareness.",
                        "Describe the role of consumer forums."
                    ],
                    fiveMark: [ 
                        "Discuss the various ways in which consumers are exploited in the market.",
                        "Analyze the importance of consumer movements in India."
                    ],
                    caseStudy: [ 
                        { case: "Case Study on misleading advertisements", questions: ["What are misleading advertisements?", "How can consumers protect themselves from such advertisements?"] }
                    ],
                    map: [ 
                        { map: "Map showing consumer courts in India", questions: ["Identify the National Consumer Commission on the map.", "Locate your state consumer commission."] }
                    ]
                }
            }
        };

        function getRandomQuestions(selectedChapters, type, count) {
            let allQuestions = [];

            if (selectedChapters.includes("Full Paper")) {
                for (let chapter in questions.socialScience) {
                    if (questions.socialScience[chapter][type]) {
                        allQuestions = allQuestions.concat(questions.socialScience[chapter][type]);
                    }
                }
            } else {
                selectedChapters.forEach(chapter => {
                    if (questions.socialScience[chapter] && questions.socialScience[chapter][type]) {
                        allQuestions = allQuestions.concat(questions.socialScience[chapter][type]);
                    }
                });
            }

            allQuestions = allQuestions.sort(() => Math.random() - 0.5);
            return allQuestions.slice(0, count);
        }

        function showChapterSelection() {
            document.getElementById('startScreen').classList.add('hidden');
            document.getElementById('chapterSelection').classList.remove('hidden');
        }

        function toggleChapters() {
            const fullPaperCheckbox = document.getElementById('fullPaper');
            const checkboxes = document.querySelectorAll('input[name="chapter"]:not(#fullPaper)');
            checkboxes.forEach(cb => cb.disabled = fullPaperCheckbox.checked);
        }

        function backToStart() {
            document.getElementById('generatedPaperContainer').classList.add('hidden');
            document.getElementById('startContainer').classList.remove('hidden');
            document.getElementById('chapterSelection').classList.add('hidden');
            document.getElementById('startScreen').classList.remove('hidden');
            questionCounter = 1;
        }

        function promptSchoolName() {
            schoolName = prompt("Write your school/institute name").toUpperCase();
            if (!schoolName) {
                alert("School/Institute name is required!");
            } else {
                promptSession();
            }
        }

        function promptSession() {
            sessionYear = prompt("Enter the academic session (e.g., 2023-24)").toUpperCase();
            if (!sessionYear) {
                alert("Academic session is required!");
            } else {
                generatePaper();
            }
        }

        function generatePaper() {
            document.getElementById('startContainer').classList.add('hidden');
            const generatedPaperContainer = document.getElementById('generatedPaperContainer');
            generatedPaperContainer.classList.remove('hidden');
            generatedPaperContainer.innerHTML = '';
            
            let paperContent = `
                <div class="header">
                    <h2>${schoolName}</h2>
                </div>
                <div class="content-area">
                    <div class="paper-header">
                        <h3>SOCIAL SCIENCE-087</h3>
                        <h3>CLASS - X</h3>
                        <h3>Session: ${sessionYear}</h3>
                    </div>
                    <div class="paper-meta">
                        <div>Max. Marks: 80</div>
                        <div>Time Allowed: 3 hours</div>
                    </div>
                    <div class="instructions">
                        <p><strong>General Instructions:</strong></p>
                        <p>Read the following instructions carefully and follow them:</p>
                        <ol>
                            <li>The question paper comprises SX Sections – A, B, C, D, E and F. There are 37 questions in the Question paper. All questions are compulsory.</li>
                            <li>Section A – From questions 1 to 20 are MCQs of 1 mark each.</li>
                            <li>Section B – Question no. 21 to 24 are Very Short Answer Type Questions, carrying 2 marks each. Answer to each question should not exceed 40 words.</li>
                            <li>Section C contains Q.25 to Q.29 are Short Answer Type Questions, carrying 3 marks each. Answer to each question should not exceed 60 words.</li>
                            <li>Section D – Question no. 30 to 33 are long answer type questions, carrying 5 marks each. Answer to each question should not exceed 120 words.</li>
                            <li>Section E - Questions no from 34 to 36 are case based questions with three sub questions and are of 4 marks each. Answer to each question should not exceed 100 words.</li>
                            <li>Section F – Question no. 37 is map based, carrying 5 marks with two parts, 37a from History (2 marks) and 37b from Geography (3 marks).</li>
                        </ol>
                    </div>
            `;

            const selectedChapters = document.getElementById('fullPaper').checked 
                ? ["Full Paper"] 
                : Array.from(document.querySelectorAll('input[name="chapter"]:checked')).map(cb => cb.value);

            // Section A - MCQs (20 questions)
            const mcqs = getRandomQuestions(selectedChapters, 'mcq', 20);
            paperContent += `
                <div class="question-section">
                    <h4 class="section-heading">Section A - Multiple Choice Questions (1 mark each)</h4>
                    <p>Question 1 to 20 are multiple choice questions. Only one of the choices is correct. Select and write the correct choice as well as the answer to these questions.</p>
            `;
            mcqs.forEach((q, i) => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. ${q.question}</p>
                        ${q.options.map((opt, j) => 
                            `<p class="option">${String.fromCharCode(65 + j)}. ${opt}</p>`
                        ).join('')}
                    </div>
                `;
            });

            // Section B - Very Short Answer (4 questions)
            const twoMarks = getRandomQuestions(selectedChapters, 'twoMark', 4);
            paperContent += `
                </div>
                <div class="question-section">
                    <h4 class="section-heading">Section B - Very Short Answer Questions (2 marks each)</h4>
                    <p>Question No. 21 to 24 are very short answer questions. Answer to each question should not exceed 40 words.</p>
            `;
            twoMarks.forEach(q => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. ${q}</p>
                    </div>
                `;
            });

            // Section C - Short Answer (5 questions)
            const threeMarks = getRandomQuestions(selectedChapters, 'threeMark', 5);
            paperContent += `
                </div>
                <div class="question-section">
                    <h4 class="section-heading">Section C - Short Answer Questions (3 marks each)</h4>
                    <p>Question No. 25 to 29 are short answer questions. Answer to each question should not exceed 60 words.</p>
            `;
            threeMarks.forEach(q => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. ${q}</p>
                    </div>
                `;
            });

            // Section D - Long Answer (4 questions)
            const fiveMarks = getRandomQuestions(selectedChapters, 'fiveMark', 4);
            paperContent += `
                </div>
                <div class="question-section">
                    <h4 class="section-heading">Section D - Long Answer Questions (5 marks each)</h4>
                    <p>Question No. 30 to 33 are long answer questions. Answer to each question should not exceed 120 words.</p>
            `;
            fiveMarks.forEach(q => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. ${q}</p>
                    </div>
                `;
            });

            // Section E - Case Studies (3 questions)
            const caseStudies = getRandomQuestions(selectedChapters, 'caseStudy', 3);
            paperContent += `
                </div>
                <div class="question-section">
                    <h4 class="section-heading">Section E - Case Study Based Questions (4 marks each)</h4>
                    <p>Question No. 34 to 36 are case-based questions with three sub questions each. Answer to each question should not exceed 100 words.</p>
            `;
            caseStudies.forEach(cs => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. ${cs.case}</p>
                        ${cs.questions.map((subQ, j) => 
                            `<p class="option">${j + 1}. ${subQ}</p>`
                        ).join('')}
                    </div>
                `;
            });

            // Section F - Map Skill (1 question)
            const mapQuestions = getRandomQuestions(selectedChapters, 'map', 1);
            paperContent += `
                </div>
                <div class="question-section">
                    <h4 class="section-heading">Section F - Map Skill Based Question (5 marks)</h4>
                    <p>Question No. 37 is map based, carrying 5 marks with two parts, 37a from History (2 marks) and 37b from Geography (3 marks).</p>
            `;
            mapQuestions.forEach(mapQ => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. ${mapQ.map}</p>
                        ${mapQ.questions.map((subQ, j) => 
                            `<p class="option">${j + 1}. ${subQ}</p>`
                        ).join('')}
                    </div>
                `;
            });

            // Add buttons below the generated paper
            paperContent += `
                    </div>
                    <div class="action-buttons">
                        <button class="btn btn-primary" onclick="downloadPDF()">Download as PDF</button>
                        <button class="btn btn-success" onclick="window.print()">Print</button>
                        <button class="btn btn-danger" onclick="backToStart()">Back to Start</button>
                    </div>
                </div>
            `;

            generatedPaperContainer.innerHTML = paperContent;
        }

        async function downloadPDF() {
            const element = document.getElementById('generatedPaperContainer');
            
            // Create a temporary div with optimized settings
            const tempDiv = document.createElement('div');
            tempDiv.style.position = 'absolute';
            tempDiv.style.left = '-9999px';
            tempDiv.style.width = '794px'; // A4 width in pXels (210mm)
            tempDiv.style.backgroundColor = 'white';
            tempDiv.style.padding = '20px';
            tempDiv.innerHTML = element.innerHTML;
            document.body.appendChild(tempDiv);

            try {
                const pdf = new jsPDF('p', 'mm', 'a4');
                const pageWidth = pdf.internal.pageSize.getWidth() - 25.4; // 0.5" margins
                const pageHeight = pdf.internal.pageSize.getHeight() - 25.4;
                
                // Split content into pages
                let position = 12.7; // Start with 0.5" top margin
                let remainingHeight = tempDiv.scrollHeight;
                let pageNum = 1;
                
                while (remainingHeight > 0) {
                    // Capture the current page section
                    const canvas = await html2canvas(tempDiv, {
                        scale: 2,
                        windowHeight: pageHeight * 3.78, // mm to px
                        windowWidth: pageWidth * 3.78,
                        y: position * 3.78, // mm to px
                        height: pageHeight * 3.78,
                        useCORS: true,
                        backgroundColor: '#ffffff',
                        logging: false
                    });

                    const imgData = canvas.toDataURL('image/jpeg', 0.92);
                    
                    // Add page to PDF
                    if (pageNum > 1) {
                        pdf.addPage('a4', 'portrait');
                    }
                    
                    pdf.addImage(imgData, 'JPEG', 12.7, 12.7, pageWidth, canvas.height * pageWidth / canvas.width);
                    
                    position += pageHeight;
                    remainingHeight -= pageHeight * 3.78; // px
                    pageNum++;
                }

                document.body.removeChild(tempDiv);
                pdf.save(`${schoolName}_Social_Science_Paper.pdf`);
                
            } catch (error) {
                console.error('PDF generation error:', error);
                alert('Error generating PDF. Please try again.');
                document.body.removeChild(tempDiv);
            }
        }
    </script>
</body>
</html>