<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Class X 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">
        <!-- Home icon added here -->
            <a href="cbse-class-9-to-12-exam-paper-generator.html" class="home-icon">
                <i class="fas fa-home"></i>
            </a>
            <h1>Class X Science</h1>
            <p>Generate Customized Sample Papers</p>
        </div>
        
        <div class="content-area">
            <div id="startScreen">
                <h2 class="section-title">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 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>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter1" name="chapter" value="Chapter 1">
                            <label for="chapter1">1. Chemical Reactions and Equations</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter2" name="chapter" value="Chapter 2">
                            <label for="chapter2">2. Acids, Bases and Salts</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter3" name="chapter" value="Chapter 3">
                            <label for="chapter3">3. Metals and Non-metals</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter4" name="chapter" value="Chapter 4">
                            <label for="chapter4">4. Carbon and its Compounds</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter5" name="chapter" value="Chapter 5">
                            <label for="chapter5">5. Periodic Classification of Elements</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter6" name="chapter" value="Chapter 6">
                            <label for="chapter6">6. Life Processes</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter7" name="chapter" value="Chapter 7">
                            <label for="chapter7">7. Control and Coordination</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter8" name="chapter" value="Chapter 8">
                            <label for="chapter8">8. How do Organisms Reproduce</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter9" name="chapter" value="Chapter 9">
                            <label for="chapter9">9. Heredity and Evolution</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter10" name="chapter" value="Chapter 10">
                            <label for="chapter10">10. Light-Reflection and Refraction</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter11" name="chapter" value="Chapter 11">
                            <label for="chapter11">11. Human Eye and Colourful World</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter12" name="chapter" value="Chapter 12">
                            <label for="chapter12">12. Electricity</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter13" name="chapter" value="Chapter 13">
                            <label for="chapter13">13. Magnetic Effects of Electric Current</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter14" name="chapter" value="Chapter 14">
                            <label for="chapter14">14. Sources of Energy</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter15" name="chapter" value="Chapter 15">
                            <label for="chapter15">15. Our Environment</label>
                        </div>
                        <div class="checkbox-item">
                            <input type="checkbox" id="chapter16" name="chapter" value="Chapter 16">
                            <label for="chapter16">16. Management of Natural Resources</label>
                        </div>
                    </div>
                </form>
                <div id="message" class="hidden"></div>
                <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 = {
            science: {
                "Chapter 1": {
                    mcq: [ 
                        { question: "Which of the following is a chemical change?", options: ["Melting of ice", "Dissolving salt in water", "Burning of paper", "Breaking of glass"], answer: "Burning of paper" },
                        { question: "What type of reaction is: 2H₂ + O₂ → 2H₂O?", options: ["Decomposition", "Combination", "Displacement", "Double displacement"], answer: "Combination" },
                        { question: "Which gas is evolved when zinc reacts with dilute hydrochloric acid?", options: ["Oxygen", "Hydrogen", "Carbon dioxide", "Nitrogen"], answer: "Hydrogen" },
                        { question: "What is the chemical formula of rust?", options: ["FeO", "Fe₂O₃", "Fe₃O₄", "Fe(OH)₃"], answer: "Fe₂O₃" },
                        { question: "Which of these is an example of endothermic reaction?", options: ["Respiration", "Photosynthesis", "Combustion", "Neutralization"], answer: "Photosynthesis" }
                    ],
                    assertion: [ 
                        { statement1: "A chemical reaction involves rearrangement of atoms.", statement2: "Mass is conserved in a chemical reaction.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Both true" },
                        { statement1: "Corrosion is a beneficial process.", statement2: "Rancidity can be prevented by adding antioxidants.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Only statement 2 is true" }
                    ],
                    twoMark: [ 
                        "Write the balanced chemical equation for the reaction between sodium hydroxide and hydrochloric acid.",
                        "Why is respiration considered an exothermic reaction?",
                        "What is the difference between displacement and double displacement reactions?",
                        "Explain the process of corrosion with an example."
                    ],
                    threeMark: [ 
                        "Explain the types of chemical reactions with examples.",
                        "What is rancidity? Mention two methods to prevent it.",
                        "Write balanced equations for: (i) Photosynthesis (ii) Respiration (iii) Combustion of methane"
                    ],
                    fiveMark: [ 
                        "Explain the various types of chemical reactions with suitable examples.",
                        "Discuss the importance of balancing chemical equations with examples.",
                        "Describe the process of corrosion and methods to prevent it."
                    ],
                    caseStudy: [ 
                        { case: "A student observed that when a piece of magnesium ribbon is burnt in air, it forms a white powder. When this powder is dissolved in water, it forms a solution which turns red litmus blue.", questions: ["Identify the white powder formed.", "Write the chemical equation for the reaction.", "Why does the solution turn red litmus blue?"] }
                    ]
                },
                "Chapter 2": {
                    mcq: [ 
                        { question: "Which of these is a strong acid?", options: ["Acetic acid", "Citric acid", "Hydrochloric acid", "Carbonic acid"], answer: "Hydrochloric acid" },
                        { question: "The pH of a neutral solution is:", options: ["0", "7", "10", "14"], answer: "7" },
                        { question: "Which gas is evolved when acids react with metal carbonates?", options: ["Hydrogen", "Oxygen", "Carbon dioxide", "Nitrogen"], answer: "Carbon dioxide" },
                        { question: "What is the common name of sodium hydroxide?", options: ["Baking soda", "Washing soda", "Caustic soda", "Bleaching powder"], answer: "Caustic soda" },
                        { question: "Which of these salts is used in plaster of Paris?", options: ["Calcium carbonate", "Calcium sulphate", "Calcium chloride", "Calcium nitrate"], answer: "Calcium sulphate" }
                    ],
                    assertion: [ 
                        { statement1: "Acids turn blue litmus red.", statement2: "Bases turn red litmus blue.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Both true" },
                        { statement1: "All acids contain hydrogen ions.", statement2: "All bases contain hydroxide ions.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Only statement 1 is true" }
                    ],
                    twoMark: [ 
                        "What happens when an acid reacts with a metal carbonate? Give an example.",
                        "Why does distilled water not conduct electricity whereas rainwater does?",
                        "What is the pH range of acidic and basic solutions?",
                        "Give two uses of baking soda."
                    ],
                    threeMark: [ 
                        "Explain the process of neutralization with an example.",
                        "What is a universal indicator? How is it useful?",
                        "Describe the preparation of bleaching powder with chemical equation."
                    ],
                    fiveMark: [ 
                        "Explain the properties and uses of acids and bases with examples.",
                        "Discuss the importance of pH in everyday life.",
                        "Describe the preparation, properties and uses of washing soda and baking soda."
                    ],
                    caseStudy: [ 
                        { case: "A farmer found that the soil in his field is too acidic. He was advised to add slaked lime to the soil. After some time, the yield of his crops improved.", questions: ["Why was the soil acidic?", "Why was slaked lime added?", "What would have happened if quick lime was added instead?"] }
                    ]
                },
                // ... (other chapters follow similar pattern with updated content)
                "Chapter 16": {
                    mcq: [ 
                        { question: "Which of these is a non-renewable resource?", options: ["Solar energy", "Wind energy", "Coal", "Tidal energy"], answer: "Coal" },
                        { question: "Chipko movement was related to:", options: ["Water conservation", "Forest conservation", "Wildlife protection", "Soil conservation"], answer: "Forest conservation" },
                        { question: "Which of these is not a method of water conservation?", options: ["Rainwater harvesting", "Drip irrigation", "Deforestation", "Building check dams"], answer: "Deforestation" },
                        { question: "Sustainable development means:", options: ["Development for present generation only", "Development without environmental concern", "Development that meets present needs without compromising future generations", "Development only for future generations"], answer: "Development that meets present needs without compromising future generations" },
                        { question: "Which of these is a fossil fuel?", options: ["Biogas", "Petroleum", "Hydrogen", "Alcohol"], answer: "Petroleum" }
                    ],
                    assertion: [ 
                        { statement1: "Forests are biodiversity hotspots.", statement2: "Forests help in maintaining ecological balance.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Both true" },
                        { statement1: "Dams are always beneficial for the environment.", statement2: "Water harvesting increases groundwater level.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Only statement 2 is true" }
                    ],
                    twoMark: [ 
                        "What are the three R's of waste management?",
                        "Why should we conserve forests? Give two reasons.",
                        "What is rainwater harvesting?",
                        "Give two examples of fossil fuels."
                    ],
                    threeMark: [ 
                        "Explain the advantages of water harvesting.",
                        "What are the problems associated with construction of large dams?",
                        "Describe the Chipko movement and its significance."
                    ],
                    fiveMark: [ 
                        "Explain the importance of sustainable management of natural resources.",
                        "Discuss the various methods of water conservation.",
                        "Describe the role of individuals in conservation of natural resources."
                    ],
                    caseStudy: [ 
                        { case: "A village was facing acute water shortage. The villagers decided to implement rainwater harvesting techniques. Within a year, the groundwater level increased and their problems were solved.", questions: ["What is rainwater harvesting?", "How does it help in increasing groundwater level?", "What other methods can be used for water conservation?"] }
                    ]
                }
            }
        };

        function getRandomQuestions(selectedChapters, type, count) {
            let allQuestions = [];

            if (selectedChapters.includes("Full Paper")) {
                for (let chapter in questions.science) {
                    if (questions.science[chapter][type]) {
                        allQuestions = allQuestions.concat(questions.science[chapter][type]);
                    }
                }
            } else {
                selectedChapters.forEach(chapter => {
                    if (questions.science[chapter] && questions.science[chapter][type]) {
                        allQuestions = allQuestions.concat(questions.science[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>SCIENCE-086</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>All questions would be compulsory. However, an internal choice of approximately 33% would be provided. 50% marks are to be allotted to competency-based questions.</li>
                            <li>Section A would have 16 simple/complex MCQs and 04 Assertion-Reasoning type questions carrying 1 mark each.</li>
                            <li>Section B would have 6 Short Answer (SA) type questions carrying 02 marks each.</li>
                            <li>Section C would have 7 Short Answer (SA) type questions carrying 03 marks each.</li>
                            <li>Section D would have 3 Long Answer (LA) type questions carrying 05 marks each.</li>
                            <li>Section E would have 3 source based/case based/passage based/integrated units of assessment (04 marks each) with sub-parts of the values of 1/2/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
            const mcqs = getRandomQuestions(selectedChapters, 'mcq', 16);
            paperContent += `
                <div class="question-section">
                    <h4 class="section-heading">Section A - Multiple Choice Questions (1 mark each)</h4>
                    <p>Question 1 to 16 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 A - Assertion Reasoning
            const assertions = getRandomQuestions(selectedChapters, 'assertion', 4);
            paperContent += `
                    <h4 class="section-heading" style="margin-top: 30px;">Section A - Assertion Reasoning Questions (1 mark each)</h4>
                    <p>Question No. 17 to 20 consist of two statements – Assertion (A) and Reason (R). Answer these questions by selecting the appropriate option given below:</p>
            `;
            assertions.forEach((q, i) => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. Assertion: ${q.statement1}</p>
                        <p class="option">Reason: ${q.statement2}</p>
                        ${q.options.map((opt, j) => 
                            `<p class="option">${String.fromCharCode(65 + j)}. ${opt}</p>`
                        ).join('')}
                    </div>
                `;
            });

            // Section B - 2 marks
            const twoMarks = getRandomQuestions(selectedChapters, 'twoMark', 6);
            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 26 are very short answer questions</p>
            `;
            twoMarks.forEach(q => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. ${q}</p>
                    </div>
                `;
            });

            // Section C - 3 marks
            const threeMarks = getRandomQuestions(selectedChapters, 'threeMark', 7);
            paperContent += `
                </div>
                <div class="question-section">
                    <h4 class="section-heading">Section C - Short Answer Questions (3 marks each)</h4>
                    <p>Question No. 27 to 33 are short answer questions</p>
            `;
            threeMarks.forEach(q => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. ${q}</p>
                    </div>
                `;
            });

            // Section D - 5 marks
            const fiveMarks = getRandomQuestions(selectedChapters, 'fiveMark', 3);
            paperContent += `
                </div>
                <div class="question-section">
                    <h4 class="section-heading">Section D - Long Answer Questions (5 marks each)</h4>
                    <p>Question No. 34 to 36 are long answer questions</p>
            `;
            fiveMarks.forEach(q => {
                paperContent += `
                    <div class="question">
                        <p class="question-text">${questionCounter++}. ${q}</p>
                    </div>
                `;
            });

            // Section E - Case Studies
            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. 37 to 39 are case-based/data-based questions.</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>
                `;
            });

            // 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}_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>