<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Flashcard System with Pagination and Review Tracking</title>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <style>
        /* General Styles */
        body {
            font-family: 'Roboto', sans-serif;
            background-color: #f5f5f5;
            margin: 0;
            padding: 0;
            overflow-x: hidden;
        }
        .container {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 100%;
            padding: 20px;
            box-sizing: border-box;
        }
        .app-header {
            width: auto;
            background-color: #6200ea;
            padding: 15px 20px;
            box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
            color: white;
            font-size: 24px;
            font-weight: 500;
            text-align: center;
        }
        .log-container {
            margin-top: 20px;
            width: 100%;
            max-width: 600px;
            background-color: #ffffff;
            border-radius: 8px;
            box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
            padding: 15px;
            overflow-y: auto;
            max-height: 200px;
        }
        .log {
            font-size: 14px;
            color: #333;
            line-height: 1.5;
        }
    </style>

    <style>
/* General Styles */
body {
    font-family: 'Roboto', sans-serif;
    background-color: #f5f5f5;
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Prevent horizontal scrolling */
}

.container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
}



.date-changer {
    margin-bottom: 20px;
    font-size: 16px;
}

.topic-filter, #layout-select {
    width: 100%;
    font-size: 16px;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid #ddd;
    background-color: #ffffff;
    color: #333;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
    margin-bottom: 10px;
    appearance: none;
    cursor: pointer;
    text-align: left;
}

.filter-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 15px;
    margin-bottom: 20px;
    width: 100%;
    max-width: 300px;
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
}

.filter-btn, .show-all-btn, .apply-btn {
    background-color: #6200ea;
    color: #fff;
    padding: 12px 15px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.3s, box-shadow 0.3s;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
}

.filter-btn:hover, .apply-btn:hover {
    background-color: #3700b3;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

/* Show All Button Distinct Style */
.show-all-btn {
    background-color: #03dac6;
    color: #fff;
}

.show-all-btn:hover {
    background-color: #018786;
}

.badge {
    background-color: #fff;
    color: #6200ea;
    padding: 4px 10px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}

.modern-card {
    position: relative;
    background-color: white;
    border-radius: 15px;
    width: 100%; /* Use full width */
    max-width: 800px; /* Full width to avoid scrolling in vertical layout */
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15);
    transition: box-shadow 0.3s;
    border: 2px solid #ddd;
    box-sizing: border-box; /* Ensure padding is contained within the card */
}

.question {
    font-size: 20px;
    font-weight: 500;
    color: #333;
    margin-bottom: 10px;
    padding-right: 30px; /* Space for the bookmark */
}

.answer {
    font-size: 18px;
    color: #333;
    margin-top: 10px;
    padding: 10px;
    border-radius: 8px;
    background-color: #f9f9f9;
    display: none;
}

.buttons {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

.dont-know-btn, .know-btn {
    padding: 10px 20px;
    width: auto;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    color: #fff;
}

.dont-know-btn {
    background-color: #e53935;
}

.know-btn {
    background-color: #388e3c;
}

/* Hover effect for dont-know-btn */
.dont-know-btn:hover {
    background-color: #d32f2f; /* Darker shade of red */
}

/* Hover effect for know-btn */
.know-btn:hover {
    background-color: #2e7d32; /* Darker shade of green */
}


.bookmark {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 18px;
    color: #ddd;
    cursor: default;
    transition: color 0.3s;
}

.review-metric {
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    color: #555;
    margin-top: 15px;
}

.filter-info {
    background-color: #e3f2fd;
    color: #1e88e5;
    padding: 10px 15px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 16px;
    margin-bottom: 20px;
    text-align: center;
    width: 95%;
    max-width: 600px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

.topic-header {
    font-size: 24px;
    font-weight: 700;
    color: #6200ea;
    margin: 20px 0 10px;
    text-align: center;
    width: 100%;
}






/* Hide extra elements in horizontal layout */
.horizontal-layout .modern-card {
    display: none; /* Only the current flashcard will be displayed in the horizontal layout */
}

.horizontal-layout .navigation-buttons {
    display: flex; /* Show navigation buttons in horizontal layout */
}

.horizontal-layout .flashcard-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 110%; /* Use full width */
    max-width: none; /* Adjust max-width if needed for screen fit */
    padding: 0 20px;
    box-sizing: border-box;
}

.horizontal-layout .modern-card {
    width: 110%; /* Stretch to fill container */
    max-width: 800px; /* Optional: adjust for full screen width */
}

/* Horizontal layout info box styling */
#horizontal-info {
    display: none; /* Only visible in horizontal layout */
    text-align: center;
    margin: 15px 0;
    padding: 10px;
    background-color: #f0f0f0;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    font-family: 'Roboto', sans-serif;
}

#horizontal-topic {
    font-size: 20px;
    font-weight: 700;
    color: #6200ea;
    margin-bottom: 5px;
}

#horizontal-position {
    font-size: 16px;
    font-weight: 500;
    color: #333;
}


 .navigation-buttons {
    display: flex;
    justify-content: center; /* Center buttons on smaller screens */
        gap: 30px;
    width: 100%;
    max-width: 800px; /* Adjust as needed */
    margin: 20px auto;
    padding: 10px 20px;
    box-sizing: border-box;
    margin-bottom: 40px;
}

.navigation-buttons button {
    background-color: #6200ea; /* Primary color */
    color: #ffffff;
    padding: 10px 20px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.3s, box-shadow 0.3s;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
}

.navigation-buttons button:disabled {
    background-color: #9e9e9e; /* Gray color when disabled */
    cursor: not-allowed;
    box-shadow: none;
}

.navigation-buttons button:hover:not(:disabled) {
    background-color: #3700b3; /* Darker color on hover */
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}


/* Dropdown container styling */
.dropdown {
    display: none; /* Hidden by default */
    position: absolute;
    background-color: #ffffff;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
    width: 600px;
    z-index: 1000;
}

.dropdown-content {
    color: #333;
    font-size: 16px;
}

.close {
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 20px;
    cursor: pointer;
}



  /* Ensure flashcards-container stretches fully in vertical layout */
.vertical-layout .flashcard-container {
    width: 100%; /* Use full width in vertical layout */
    max-width: none; /* Remove max-width constraint */
    padding: 0; /* Optional: remove padding if added */
    box-sizing: border-box;
    margin: 0 auto; /* Center align in the container */
}

/* Ensure container and flashcards align correctly in all layouts */
.flashcard-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* Add this class to body or main container when in vertical layout mode */
.vertical-layout .container {
    width: 100%; /* Ensure container width is full */
}



    #toggleButton {
        background-color: #4CAF50; /* Green background */
        border: none;
        color: white; /* White text color */
        padding: 12px 24px; /* Padding for better spacing */
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px; /* Font size */
        cursor: pointer; /* Pointer cursor on hover */
        border-radius: 8px; /* Rounded corners */
        transition: background-color 0.3s ease; /* Smooth transition on hover */
    }

    #toggleButton:hover {
        background-color: #45a049; /* Darker green on hover */
    }

    #toggleButton:focus {
        outline: none; /* Remove outline on focus */
    }

    #toggleButton:active {
        background-color: #388e3c; /* Even darker green when button is clicked */
    }


    .star-btn {
    color: lightgray;
    font-size: 20px;
    margin: 0 10px;
    cursor: pointer;
    transition: color 0.3s ease;
}

.star-btn.active {
    color: gold;
}

.bookmark {
    cursor: pointer;
    margin-left: auto;
}

/* Emoji styling */
        .emoji {
            font-size: 24px;  /* Larger font size */
            vertical-align: middle;
            display: inline-block;
            animation: slow-bounce 2s infinite;  /* Animation applied */
        }

        /* Slow bounce animation */
        @keyframes slow-bounce {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(-5px); /* Small bounce */
            }
        }




    </style>

    <style>
      .header-image, .hr-image {
            width: 50px;
            height: 50px;
            cursor: pointer;
            vertical-align: middle;
            margin-right: 10px;
        }

         /* Modal Styles */
        .modal97 {
            display: none;
            position: fixed;
            z-index: 10;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            overflow: auto;
            background-color: rgba(0,0,0,0.9);
        }

        .modal-top-bar97 {
            width: 80%;
            max-width: 700px;
            margin: auto;
            padding: 10px;
            display: flex;
            justify-content: flex-end;
            border-bottom: 5px solid #007bff;
            background-color: rgba(255, 255, 255, 0.8);
            z-index: 20;
            position: relative;
        }

        .modal-controls97 {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
        }

        .close97 {
            color: #333;
            font-size: 16px;
            font-weight: bold;
            cursor: pointer;
            margin-bottom: 5px;
        }

        .zoom-buttons97 {
            display: flex;
            gap: 5px;
        }

        .zoom-button97 {
            background-color: #007bff;
            color: white;
            border: none;
            padding: 5px 10px;
            border-radius: 5px;
            font-size: 16px;
            cursor: pointer;
        }

        .zoom-button97:hover {
            background-color: #0056b3;
        }

        .modal-content-wrapper97 {
            position: relative;
            width: 80%;
            max-width: 700px;
            margin: auto;
        }

        .modal-content97 {
            display: block;
            width: 100%;
            height: auto;
            margin: auto;
        }

         .header-image, .hr-image {
            width: 50px;
            height: 50px;
            cursor: pointer;
            vertical-align: middle;
            margin-right: 10px;
        }

        .popup {
            display: none;
            position: fixed;
            z-index: 999;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.8);
        }

        .popup-content {
            position: relative;
            margin: 10% auto;
            width: 80%;
            max-width: 600px;
            background-color: #fff;
            padding: 20px;
            border-radius: 10px;
            text-align: center;
        }

        .popup-image {
            width: 100%;
            height: auto;
        }

        .close {
            position: absolute;
            top: 1px;
            right: 8px;
            color: #333;
            font-size: 24px;
            font-weight: bold;
            cursor: pointer;
        }

</style>
</head>
<body>

<!-- App Header -->
<div class="app-header">
    <img src="https://firebasestorage.googleapis.com/v0/b/akrass-plus.appspot.com/o/ContentImage%2Fimage_search_1735012996661.jpg?alt=media&token=3ef27804-d6e3-4e1d-beef-62934f342808" alt="Header Image" class="header-image" onclick="openModal('header-popup-97')" />
    MBBS Flashcards Study
</div>

<hr>
<p style="margin-left: 20px;"><b>Chapter</b>: 2. Immunology</p>
<p style="margin-left: 20px;"><b>BOOK Reference</b>: FIRST AID for the USMLE STEP 1 - 2024 , <img src="https://firebasestorage.googleapis.com/v0/b/akrass-plus.appspot.com/o/ContentImage%2FIMG_20241224_093648.jpg?alt=media&token=e867e2f3-7487-4ab8-803e-943b16cba5e4" alt="HR Image" class="hr-image" onclick="openModal('hr-popup-97')" />👈                                                                                                              </p>
<p style="margin-left: 20px;"><b>Total Flashcards</b>: 341</p>
<hr>


    <!-- Modal Pop-Up for Header Image -->
    <div id="header-popup-97" class="modal97">
        <div class="modal-top-bar97">
            <div class="modal-controls97">
                <span class="close97" onclick="closeModal('header-popup-97')">Close</span>
                 <div class="zoom-buttons97">
                    <button class="zoom-button97" onclick="zoomImage('header-popup-97', 0.9)">zoom -</button>
                    <button class="zoom-button97" onclick="zoomImage('header-popup-97', 1.1)">+</button>
                </div>
             </div>
        </div>
      <div class="modal-content-wrapper97">
             <img class="modal-content97" src="https://firebasestorage.googleapis.com/v0/b/akrass-plus.appspot.com/o/ContentImage%2Fimage_search_1735012996661.jpg?alt=media&token=3ef27804-d6e3-4e1d-beef-62934f342808" alt="Header Image Full View" class="popup-image" />
         </div>
    </div>

    <!-- Modal Pop-Up for HR Image -->
    <div id="hr-popup-97" class="modal97">
         <div class="modal-top-bar97">
             <div class="modal-controls97">
               <span class="close97" onclick="closeModal('hr-popup-97')">Close</span>
                <div class="zoom-buttons97">
                 <button class="zoom-button97" onclick="zoomImage('hr-popup-97', 0.9)">zoom -</button>
                    <button class="zoom-button97" onclick="zoomImage('hr-popup-97', 1.1)">+</button>
                 </div>
            </div>
         </div>
      <div class="modal-content-wrapper97">
            <img class="modal-content97" src="https://firebasestorage.googleapis.com/v0/b/akrass-plus.appspot.com/o/ContentImage%2FIMG_20241224_093648.jpg?alt=media&token=e867e2f3-7487-4ab8-803e-943b16cba5e4" alt="HR Image Full View" class="popup-image" />
       </div>
   </div>


<!-- Main Container -->
<div class="container">

<button id="toggleButton" onclick="toggleDropdownContent(event)">How to Use the Flashcard System (Step-by-Step - Click Here👈)</button>

<div id="dropdownContent" class="dropdown" style="display: none;">
    <div class="dropdown-content">
        <button class="close" onclick="closeDropdown('dropdownContent')">Close</button>
        <br><h2>How to Use the Flashcard System</h2>

        <ol>
            <li><strong>Select Layout:</strong>
                <ul>
                    <li>Choose how you want to view flashcards:</li>
                    <li><strong>Horizontal Layout:</strong> One flashcard displayed at a time.</li>
                    <li><strong>Vertical Layout (Default):</strong> Flashcards shown one below another.</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #007BFF;">

            <li><strong>Select Topics:</strong>
                <ul>
                    <li>Pick multiple topics you want to study.</li>
                    <li>At the end of each topic, you’ll see:
                        <ul>
                            <li>Total flashcards in that topic.</li>
                            <li>Flashcards you’ve reviewed at least once (e.g., <strong>(2/6)</strong> means 2 out of 6 reviewed).</li>
                        </ul>
                    </li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #28A745;">

            <li><strong>Apply Filter:</strong>
                <ul>
                    <li>Click <strong>Apply Filter</strong> to display selected topics.</li>
                    <li>All Flashcards of selected topics will appear in your chosen layout (horizontal or vertical).</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #DC3545;">

            <li><strong>Review Flashcards:</strong>
                <ul>
                    <li>View the flashcard to read the question and try to recall the answer.</li>
        <li>After attempting to recall, use the buttons:</li>
                    <li>Use the buttons:
                        <ul>
                            <li><strong>Know:</strong> If you know the answer.</li>
                            <li><strong>Don’t Know:</strong> If unsure or don’t know the answer.</li>
                            <li>If you initially clicked "Know" but later feel unsure, click "Don’t Know" to adjust your response.</li>
                        </ul>
                    </li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #FFC107;">

            <li><strong>Review Stages:</strong>
                <ul>
                    <li>Each reviewed flashcard shows the next review date.</li>
                    <li>Review stages based on time intervals:
                        <ul>
                            <li><strong>First Review:</strong> 3 days after the first read.</li>
                            <li><strong>Second Review:</strong> 7 days after the first review.</li>
                            <li><strong>Third Review:</strong> 14 days after the second review.</li>
                            <li><strong>Final Review:</strong> 28 days after the third review.</li>
                            <li><strong>Completed:</strong> No further reviews needed.</li>
                        </ul>
                    </li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #17A2B8;">

            <li><strong>Pending Review Flashcards:</strong>
                <ul>
                    <li>Flashcards ready for review are shown in the <strong>Pending Review</strong> section.</li>
                    <li>Pending cards only show from selected topics.</li>
                    <li>To view all pending flashcards from all topics, select and apply <strong>"All Topics"</strong> in the topic section (by default, "All Topics" is applied).</li>
                    <li>When you are inside the Pending Flashcards Review section, to exit this section, click the <strong>"Show All Flashcards"</strong> button. It displays all flashcards (including pending flashcards) from the selected topics.</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #6C757D;">

            <li><strong>Bookmark Colors:</strong>
                <ul>
                    <li>Flashcard review stages are visually represented:</li>
                    <li><strong>Red:</strong> First Review.</li>
                    <li><strong>Pink:</strong> Second Review.</li>
                    <li><strong>Blue:</strong> Third Review.</li>
                    <li><strong>Green:</strong> Final Review.</li>
                    <li><strong>Gold:</strong> Completed.</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #343A40;">

             <li><strong>Star Mark Flashcards:</strong>
                <ul>
                    <li>Mark very important or difficult flashcards using the <strong>Star Mark</strong> button.</li>
                    <li>These star-marked flashcards are ideal for focused review before exams.</li>
                    <li>Click the <strong>Starred Flashcards</strong> button to filter and view only the star-marked flashcards from the selected topics.</li>
                    <li>When you click <strong>Starred Ready for Review</strong>, it displays all star-marked flashcards that are ready for review, including those in any review stage (First, Second, Third, or Final).</li>
                    <li>This feature ensures you spend your time efficiently by focusing on critical flashcards when time is limited.</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #007BFF;">

            <li><strong>Efficient Learning:</strong>
                <ul>
                    <li>The system ensures:</li>
                    <li><strong>Easy Points Flashcards:</strong> Reviewed in fewer rounds.</li>
                    <li><strong>Moderate/Difficult Points:</strong> Reviewed more frequently in more number of rounds.</li>
                    <li>Saves your time by allocating appropriate focus on difficult flashcards.</li>
                    <li>You can utilize your time efficiently and complete your syllabus within your time schedule.</li>
                </ul>
            </li>


        </ol>
    </div>
</div>

 <br>




     <!-- Dropdown for Layout Selection -->
    <div class="custom-select-container">
        <label for="layout-select"><b>Select Layout:</b></label>
        <select id="layout-select" class="custom-select" onchange="selectLayout(this.value)">
            <option value="vertical">Vertical Layout</option>
            <option value="horizontal">Horizontal Layout</option>
        </select>
    </div>

    <!-- Topic Selection Multi-select -->
    <div class="custom-select-container">
        <label for="topic-filter"><b>Select Multiple Topics & Apply Filter:</b></label>
        <select id="topic-filter" class="topic-filter" multiple>
            <!-- Options will be dynamically populated -->
        </select>
    </div>

    <!-- Apply Filter and Show All Buttons -->
    <button class="apply-btn" onclick="applySelectedTopics()">Apply Selected Topics</button><br>
    <button class="show-all-btn" onclick="showAllFlashcards()">Show All Flashcards</button>

     <div class="filter-container">
        <button class="filter-btn" onclick="filterFlashcards(0)">First Review<br> (Red) <span id="count-stage-0" class="badge">0</span></button>
        <button class="filter-btn" onclick="filterFlashcards(1)">Second Review<br> (Pink) <span id="count-stage-1" class="badge">0</span></button>
        <button class="filter-btn" onclick="filterFlashcards(2)">Third Review<br> (Blue) <span id="count-stage-2" class="badge">0</span></button>
        <button class="filter-btn" onclick="filterFlashcards(3)">Final Review<br> (Green) <span id="count-stage-3" class="badge">0</span></button>
        <button class="filter-btn" id="completed-flashcards-btn" onclick="filterFlashcards(4)">Completed Flashcards<br> 🏆 <span id="count-completed" class="badge">0 completed</span></button>
     </div>
 <div class="filter-container">
    <button class="filter-btn" onclick="showStarredFlashcards()">⭐ Starred Flashcards: <span id="count-starred" class="badge">0 Marked</span>, <span id="count-pending" class="badge">0 Pending</span></button>
    <button class="filter-btn" onclick="showStarredReadyFlashcards()">🌟 Starred Ready Review: <span id="count-starred-ready" class="badge">0 Marked</span>, <span id="count-ready-pending" class="badge">0 Pending</span></button>
</div>


    <div id="filter-info-container"></div> <!-- Filter info container for separate line display -->

<div id="horizontal-info" style="display: none;">
    <div id="horizontal-topic"></div>
    <div id="horizontal-position"></div>
</div>



    <!-- Flashcard Display Area -->
    <div id="flashcards-container" class="flashcard-container">
        <!-- Flashcards will be rendered here dynamically -->
    </div>

    <!-- Navigation for Horizontal Layout -->
    <div class="navigation-buttons" style="display: none;">
        <button id="prev-btn" onclick="navigateFlashcards('prev')" disabled>Previous</button>
        <button id="next-btn" onclick="navigateFlashcards('next')">Next</button>
    </div>
</div>




<!-- Dropdown content that replaces the modal -->
<div id="bookmarkDropdown1" class="dropdown">
    <div class="dropdown-content">
        <!-- Close button -->
        <span class="close" onclick="closeDropdown('bookmarkDropdown1')">×</span>
        <h2>Review Stage Colors</h2>
        <ul>
            <li><span style="color: red;"><i class="fas fa-bookmark"></i></span> First Review</li>
            <li><span style="color: pink;"><i class="fas fa-bookmark"></i></span> Second Review</li>
            <li><span style="color: blue;"><i class="fas fa-bookmark"></i></span> Third Review</li>
            <li><span style="color: green;"><i class="fas fa-bookmark"></i></span> Final Review</li>
            <li><span style="color: gold;"><i class="fas fa-bookmark"></i></span> Completed</li>
        </ul>
    </div>
</div>



<!-- Dropdown for Inactive Know Button Click -->
<div id="inactiveKnowDropdown" class="dropdown">
    <div class="dropdown-content">
        <span class="close" onclick="closeDropdown('inactiveKnowDropdown')">&times;</span>
        <h2>Button Inactive</h2>
        <p>The "Know" button is inactive until the review is ready. Please wait until the next review date.</p>
    </div>
</div>


<script>

 document.addEventListener('DOMContentLoaded', () => {
    openDatabase();
    const layoutSelect = document.getElementById('layout-select');
    const initialLayout = layoutSelect.value || 'vertical';
    selectLayout(initialLayout);
});

const dbName = "FlashcardDBFA2";
const storeName = "flashcardProgress";

const flashcards = [
    {
        "id": 1,
        "topic": "topic1",
        "question": "What are the primary organs of the immune system?",
        "answer": "<li>The primary organs of the immune system are the bone marrow and thymus.</li>",
        "memoryTip": "Think of the bone marrow as the \"factory\" where immune cells are made, and the thymus as the \"school\" where T cells graduate!",
        "emoji": "🏭"
    },
    {
        "id": 2,
        "topic": "topic1",
        "question": "What is the function of the bone marrow in the immune system?",
        "answer": "<li>The bone marrow is responsible for immune cell production and B cell maturation.</li>",
        "memoryTip": "Bone marrow is like a bakery, churning out fresh immune cells daily!",
        "emoji": "🍞"
    },
    {
        "id": 3,
        "topic": "topic1",
        "question": "What is the function of the thymus in the immune system?",
        "answer": "<li>The thymus is responsible for T cell maturation.</li>",
        "memoryTip": "The thymus is like a boot camp for T cells, toughening them up for battle!",
        "emoji": "🏋️"
    },
    {
        "id": 4,
        "topic": "topic1",
        "question": "What are the secondary organs of the immune system?",
        "answer": "<li>The secondary organs include the spleen, lymph nodes, tonsils, adenoids, appendix, and Peyer patches.</li>",
        "memoryTip": "Think of secondary organs as the \"meeting spots\" where immune cells gather to strategize!",
        "emoji": "🗣️"
    },
    {
        "id": 5,
        "topic": "topic2",
        "question": "What is a lymph node?",
        "answer": "<li>A lymph node is a secondary lymphoid organ that has many afferents and one or more efferents, is encapsulated, and has trabeculae.</li>",
        "memoryTip": "Lymph nodes are like traffic hubs for immune cells, directing them where to go!",
        "emoji": "🚦"
    },
    {
        "id": 6,
        "topic": "topic2",
        "question": "What are the main functions of lymph nodes?",
        "answer": "<li>The main functions of lymph nodes are nonspecific filtration by macrophages, circulation of B and T cells, and activation of the immune response.</li>",
        "memoryTip": "Lymph nodes filter out the bad guys like a bouncer at a club, letting in only the right immune cells!",
        "emoji": "🚷"
    },
    {
        "id": 7,
        "topic": "topic3",
        "question": "Where are B cells localized and proliferated in a lymph node?",
        "answer": "<li>B cells are localized and proliferated in the follicles located in the outer cortex of the lymph node.</li>",
        "memoryTip": "Follicles are like B cell party zones, where they gather and multiply!",
        "emoji": "🎉"
    },
    {
        "id": 8,
        "topic": "topic3",
        "question": "What distinguishes primary follicles from secondary follicles in lymph nodes?",
        "answer": "<li>Primary follicles are dense and quiescent, while secondary follicles have pale central germinal centers and are active.</li>",
        "memoryTip": "Primary follicles are like sleepy bears, while secondary follicles are the party animals of the lymph node!",
        "emoji": "🐻"
    },
    {
        "id": 9,
        "topic": "topic3",
        "question": "What does the medulla of a lymph node consist of?",
        "answer": "<li>The medulla consists of medullary cords (closely packed lymphocytes and plasma cells) and medullary sinuses (containing reticular cells and macrophages).</li>",
        "memoryTip": "The medulla is like a busy marketplace, filled with immune cells trading information!",
        "emoji": "🏪"
    },
    {
        "id": 10,
        "topic": "topic3",
        "question": "What is the role of medullary sinuses in lymph nodes?",
        "answer": "<li>Medullary sinuses communicate with efferent lymphatics.</li>",
        "memoryTip": "Medullary sinuses are like the exit doors of a concert, letting immune cells leave after the show!",
        "emoji": "🚪"
    },
    {
        "id": 11,
        "topic": "topic4",
        "question": "What is found in the paracortex of a lymph node?",
        "answer": "<li>The paracortex contains T cells and is the region of cortex between follicles and medulla.</li>",
        "memoryTip": "The paracortex is like the VIP section of a club, where T cells hang out!",
        "emoji": "🎟️"
    },
    {
        "id": 12,
        "topic": "topic4",
        "question": "What are high endothelial venules, and what is their function?",
        "answer": "<li>High endothelial venules are structures in the paracortex through which T and B cells enter from the blood.</li>",
        "memoryTip": "High endothelial venules are like the bouncers at the club, checking IDs of T and B cells before letting them in!",
        "emoji": "🕵️"
    },
    {
        "id": 13,
        "topic": "topic4",
        "question": "How is the paracortex affected in patients with DiGeorge syndrome?",
        "answer": "<li>The paracortex is underdeveloped in patients with DiGeorge syndrome.</li>",
        "memoryTip": "DiGeorge syndrome is like a club with a very small VIP section—too few T cells allowed in!",
        "emoji": "🚫"
    },
    {
        "id": 14,
        "topic": "topic4",
        "question": "What happens to the paracortex during an extreme cellular immune response?",
        "answer": "<li>The paracortex enlarges during an extreme cellular immune response, such as in EBV and other viral infections, leading to paracortical hyperplasia and lymphadenopathy.</li>",
        "memoryTip": "When there's a viral party, the paracortex gets crowded, just like a club on a Saturday night!",
        "emoji": "🎊"
    },
    {
        "id": 15,
        "topic": "topic5",
        "question": "What areas are drained by the deep cervical lymph nodes?",
        "answer": "<li>The deep cervical lymph nodes drain the head, neck, and oropharynx.</li>",
        "memoryTip": "Deep cervical nodes are like the neck's security team, keeping the head and throat safe!",
        "emoji": "🛡️"
    },
    {
        "id": 16,
        "topic": "topic5",
        "question": "What conditions are associated with the deep cervical lymph nodes?",
        "answer": "<li>Conditions include upper respiratory tract infections, infectious mononucleosis, Kawasaki disease, and malignancies of the head, neck, oropharynx.</li>",
        "memoryTip": "If the deep cervical nodes are swollen, it’s like they’re throwing a party for all the infections!",
        "emoji": "🎈"
    },
    {
        "id": 17,
        "topic": "topic5",
        "question": "What do the mediastinal lymph nodes drain?",
        "answer": "<li>The mediastinal lymph nodes drain the trachea and esophagus.</li>",
        "memoryTip": "Mediastinal nodes are like the traffic cops for the trachea and esophagus, directing the flow!",
        "emoji": "🚓"
    },
    {
        "id": 18,
        "topic": "topic5",
        "question": "What conditions are associated with the mediastinal lymph nodes?",
        "answer": "<li>Conditions include pulmonary TB (unilateral hilar), sarcoidosis (bilateral hilar), lung cancer, and granulomatous disease.</li>",
        "memoryTip": "If the mediastinal nodes are busy, it’s like a traffic jam of diseases!",
        "emoji": "🚦"
    },
    {
        "id": 19,
        "topic": "topic5",
        "question": "What areas are drained by the axillary lymph nodes?",
        "answer": "<li>The axillary lymph nodes drain the upper limb, breast, and skin above the umbilicus.</li>",
        "memoryTip": "Axillary nodes are like the underarm deodorant for the upper body, keeping it fresh!",
        "emoji": "🧴"
    },
    {
        "id": 20,
        "topic": "topic5",
        "question": "What conditions are associated with the axillary lymph nodes?",
        "answer": "<li>Conditions include mastitis and metastasis, especially from breast cancer.</li>",
        "memoryTip": "If the axillary nodes are swollen, it’s like they’re raising a flag for breast health!",
        "emoji": "🚩"
    },
    {
        "id": 21,
        "topic": "topic6",
        "question": "What does the right lymphatic duct drain?",
        "answer": "<li>The right lymphatic duct drains the right side of the body above the diaphragm into the junction of the right subclavian and internal jugular vein.</li>",
        "memoryTip": "The right lymphatic duct is like a VIP lane for the right side of the body!",
        "emoji": "🎟️"
    },
    {
        "id": 22,
        "topic": "topic6",
        "question": "What does the thoracic duct drain?",
        "answer": "<li>The thoracic duct drains below the diaphragm and the left thorax and upper limb into the junction of the left subclavian and internal jugular veins.</li>",
        "memoryTip": "The thoracic duct is like the main highway for lymph from the lower body!",
        "emoji": "🛣️"
    },
    {
        "id": 23,
        "topic": "topic6",
        "question": "What can happen if the thoracic duct ruptures?",
        "answer": "<li>Rupture of the thoracic duct can cause chylothorax.</li>",
        "memoryTip": "A ruptured thoracic duct is like a burst water balloon, spilling lymph everywhere!",
        "emoji": "🎈"
    },
    {
        "id": 24,
        "topic": "topic7",
        "question": "What area does the hilar lymph nodes drain?",
        "answer": "<li>The hilar lymph nodes drain the lungs.</li>",
        "memoryTip": "Hilar nodes are like the lungs' personal trainers, keeping them in shape!",
        "emoji": "🏋️‍♂️"
    },
    {
        "id": 25,
        "topic": "topic7",
        "question": "What conditions are associated with hilar lymph nodes?",
        "answer": "<li>Conditions include pulmonary TB, lung cancer, and granulomatous disease.</li>",
        "memoryTip": "If the hilar nodes are busy, it’s like they’re hosting a lung health seminar!",
        "emoji": "🎤"
    },
    {
        "id": 26,
        "topic": "topic7",
        "question": "What area does the celiac lymph nodes drain?",
        "answer": "<li>The celiac lymph nodes drain the liver, stomach, spleen, pancreas, and upper duodenum.</li>",
        "memoryTip": "Celiac nodes are like the digestive system's traffic controllers!",
        "emoji": "🚦"
    },
    {
        "id": 27,
        "topic": "topic7",
        "question": "What area does the superior mesenteric lymph nodes drain?",
        "answer": "<li>The superior mesenteric lymph nodes drain the lower duodenum, jejunum, ileum, and colon to the splenic flexure.</li>",
        "memoryTip": "Superior mesenteric nodes are like the GPS for the intestines, guiding the way!",
        "emoji": "🗺️"
    },
    {
        "id": 28,
        "topic": "topic7",
        "question": "What area does the inferior mesenteric lymph nodes drain?",
        "answer": "<li>The inferior mesenteric lymph nodes drain the colon from the splenic flexure to the upper rectum.</li>",
        "memoryTip": "Inferior mesenteric nodes are like the final stop on the colon's journey!",
        "emoji": "🛑"
    },
    {
        "id": 29,
        "topic": "topic7",
        "question": "What area does the para-aortic lymph nodes drain?",
        "answer": "<li>The para-aortic lymph nodes drain the pair of testes, ovaries, kidneys, fallopian tubes, and fundus of the uterus.</li>",
        "memoryTip": "Para-aortic nodes are like the body’s fertility advisors, keeping track of reproductive health!",
        "emoji": "👶"
    },
    {
        "id": 30,
        "topic": "topic7",
        "question": "What area does the internal iliac lymph nodes drain?",
        "answer": "<li>The internal iliac lymph nodes drain the body of the uterus, cervix, and superior bladder.</li>",
        "memoryTip": "Internal iliac nodes are like the caretakers of the pelvic region!",
        "emoji": "🏰"
    },
    {
        "id": 31,
        "topic": "topic7",
        "question": "What area does the external iliac lymph nodes drain?",
        "answer": "<li>The external iliac lymph nodes drain the cervix, proximal vagina, corpus cavernosum, prostate, inferior bladder, and lower rectum to anal canal (above the pectinate line).</li>",
        "memoryTip": "External iliac nodes are like the bouncers for the lower pelvic party!",
        "emoji": "🎉"
    },
    {
        "id": 32,
        "topic": "topic7",
        "question": "What area does the superficial inguinal lymph nodes drain?",
        "answer": "<li>The superficial inguinal lymph nodes drain the medial foot/leg and the popliteal area.</li>",
        "memoryTip": "Superficial inguinal nodes are like the foot soldiers of the lymphatic system!",
        "emoji": "🥾"
    },
    {
        "id": 33,
        "topic": "topic7",
        "question": "What area does the epitrochlear lymph nodes drain?",
        "answer": "<li>The epitrochlear lymph nodes drain the hand and forearm.</li>",
        "memoryTip": "Epitrochlear nodes are like the handshakes of the lymphatic system, connecting the upper limbs!",
        "emoji": "🤝"
    },
    {
        "id": 34,
        "topic": "topic7",
        "question": "What condition is associated with the epitrochlear lymph nodes?",
        "answer": "<li>Secondary syphilis is associated with the epitrochlear lymph nodes.</li>",
        "memoryTip": "Epitrochlear nodes are like the gossipers of the lymphatic system, spreading news of syphilis!",
        "emoji": "🗣️"
    },
    {
        "id": 35,
        "topic": "topic8",
        "question": "Where is the spleen located in the body?",
        "answer": "<li>The spleen is located in the left upper quadrant (LUQ) of the abdomen, anterolateral to the left kidney, and is protected by the 9th to 11th ribs.</li>",
        "memoryTip": "Think of the spleen as the \"rib-protected superhero\" of the abdomen, always ready to fight off infections!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 36,
        "topic": "topic8",
        "question": "What are the two types of circulation in the spleen?",
        "answer": "<li>The spleen has open circulation and closed circulation.</li>",
        "memoryTip": "Imagine the spleen as a busy city with open roads and closed highways, managing traffic like a pro!",
        "emoji": "🚦"
    },
    {
        "id": 37,
        "topic": "topic8",
        "question": "What is the primary function of red pulp in the spleen?",
        "answer": "<li>The red pulp primarily contains red blood cells (RBCs).</li>",
        "memoryTip": "Red pulp is like a bustling blood factory, churning out RBCs to keep the body energized!",
        "emoji": "🏭"
    },
    {
        "id": 38,
        "topic": "topic8",
        "question": "What is found in the white pulp of the spleen?",
        "answer": "<li>The white pulp contains white blood cells (WBCs), including B cells and T cells.</li>",
        "memoryTip": "White pulp is the \"white blood cell club,\" where the immune system's elite gather to strategize!",
        "emoji": "🏰"
    },
    {
        "id": 39,
        "topic": "topic8",
        "question": "What are Howell-Jolly bodies?",
        "answer": "<li>Howell-Jolly bodies are nuclear remnants found in the blood after splenic dysfunction.</li>",
        "memoryTip": "Howell-Jolly bodies are like little \"ghosts\" of old cells that the spleen forgot to clean up!",
        "emoji": "👻"
    },
    {
        "id": 40,
        "topic": "topic8",
        "question": "What is the significance of vaccinating patients undergoing splenectomy?",
        "answer": "<li>Patients undergoing splenectomy or with splenic dysfunction should be vaccinated against encapsulated organisms to prevent infections.</li>",
        "memoryTip": "Think of vaccines as \"body armor\" for splenectomy patients, protecting them from sneaky germs!",
        "emoji": "🛡️"
    },
    {
        "id": 41,
        "topic": "topic8",
        "question": "What is the periarteriolar lymphoid sheath?",
        "answer": "<li>The periarteriolar lymphoid sheath contains T cells and is located within the white pulp of the spleen.</li>",
        "memoryTip": "Picture the periarteriolar lymphoid sheath as a \"T cell fortress\" guarding the arteries!",
        "emoji": "🏰"
    },
    {
        "id": 42,
        "topic": "topic8",
        "question": "What is the role of the marginal zone in the spleen?",
        "answer": "<li>The marginal zone contains macrophages and specialized B cells, serving as a site for antigen-presenting cells (APCs) to capture blood-borne antigens.</li>",
        "memoryTip": "The marginal zone is like a \"checkpoint\" where immune cells catch and recognize intruders!",
        "emoji": "🚧"
    },
    {
        "id": 43,
        "topic": "topic9",
        "question": "Where is the thymus located?",
        "answer": "<li>The thymus is located in the anterosuperior mediastinum.</li>",
        "memoryTip": "The thymus is like the \"T cell training camp\" in the chest, preparing immune soldiers for battle!",
        "emoji": "🏕️"
    },
    {
        "id": 44,
        "topic": "topic9",
        "question": "What is the primary function of the thymus?",
        "answer": "<li>The thymus is the site of T-cell differentiation and maturation.</li>",
        "memoryTip": "Think of the thymus as the \"T cell academy,\" where future immune warriors are trained!",
        "emoji": "🎓"
    },
    {
        "id": 45,
        "topic": "topic9",
        "question": "What is the origin of thymic epithelium?",
        "answer": "<li>Thymic epithelium is derived from the third pharyngeal pouch (endoderm).</li>",
        "memoryTip": "The thymus has a \"pharyngeal pedigree,\" coming from the third pouch like a royal lineage!",
        "emoji": "👑"
    },
    {
        "id": 46,
        "topic": "topic9",
        "question": "What is the appearance of a normal neonatal thymus on a chest X-ray?",
        "answer": "<li>A normal neonatal thymus appears \"sail-shaped\" on a chest X-ray.</li>",
        "memoryTip": "The thymus is like a little sailboat on an X-ray sea, ready to navigate the immune waters!",
        "emoji": "⛵"
    },
    {
        "id": 47,
        "topic": "topic9",
        "question": "What conditions can lead to an absent thymic shadow?",
        "answer": "<li>An absent thymic shadow or hypoplastic thymus can be seen in immunodeficiencies such as SCID and DiGeorge syndrome.</li>",
        "memoryTip": "An absent thymic shadow is like a \"missing T cell ship\" in the immune fleet, signaling trouble ahead!",
        "emoji": "🚢"
    },
    {
        "id": 48,
        "topic": "topic9",
        "question": "What is a thymoma?",
        "answer": "<li>A thymoma is a neoplasm of the thymus associated with conditions like myasthenia gravis and superior vena cava syndrome.</li>",
        "memoryTip": "A thymoma is like an unwanted \"guest\" at the T cell party, causing all sorts of disruptions!",
        "emoji": "🎉"
    },
    {
        "id": 49,
        "topic": "topic10",
        "question": "What are the components of innate immunity?",
        "answer": "<li>Components of innate immunity include neutrophils, macrophages, monocytes, dendritic cells, natural killer (NK) cells, complement, physical epithelial barriers, and secreted enzymes.</li>",
        "memoryTip": "Innate immunity is like the \"first responders\" of the immune system, always ready to jump into action!",
        "emoji": "🚓"
    },
    {
        "id": 50,
        "topic": "topic10",
        "question": "What are the components of adaptive immunity?",
        "answer": "<li>Components of adaptive immunity include T cells, B cells, and circulating antibodies.</li>",
        "memoryTip": "Adaptive immunity is like the \"special forces\" of the immune system, trained for specific missions!",
        "emoji": "🎖️"
    },
    {
        "id": 51,
        "topic": "topic10",
        "question": "How is the mechanism of innate immunity characterized?",
        "answer": "<li>The mechanism of innate immunity is germline encoded.</li>",
        "memoryTip": "Innate immunity is like a \"pre-programmed robot,\" ready to fight without needing training!",
        "emoji": "🤖"
    },
    {
        "id": 52,
        "topic": "topic10",
        "question": "How does adaptive immunity generate variation?",
        "answer": "<li>Adaptive immunity generates variation through V(D)J recombination during lymphocyte development.</li>",
        "memoryTip": "Adaptive immunity is like a \"customizable video game,\" where each immune cell can level up and change!",
        "emoji": "🎮"
    },
    {
        "id": 53,
        "topic": "topic10",
        "question": "What is the response time of innate immunity to pathogens?",
        "answer": "<li>The response to pathogens in innate immunity occurs rapidly, within minutes to hours.</li>",
        "memoryTip": "Innate immunity is like a \"fast food restaurant,\" serving up quick responses to hungry pathogens!",
        "emoji": "🍔"
    },
    {
        "id": 54,
        "topic": "topic10",
        "question": "What is a key feature in pathogen recognition for innate immunity?",
        "answer": "<li>A key feature in pathogen recognition for innate immunity is Toll-like receptors (TLRs) that recognize pathogen-associated molecular patterns (PAMPs).</li>",
        "memoryTip": "TLRs are like \"security cameras\" for the immune system, spotting trouble before it gets in!",
        "emoji": "📹"
    },
    {
        "id": 55,
        "topic": "topic10",
        "question": "What is the role of memory cells in adaptive immunity?",
        "answer": "<li>Memory cells are activated B and T cells that provide a stronger, quicker immune response upon subsequent exposure to a previously encountered antigen.</li>",
        "memoryTip": "Memory cells are like \"old friends\" who remember your favorite pizza topping and order it right away!",
        "emoji": "🍕"
    },
    {
        "id": 56,
        "topic": "topic10",
        "question": "What is immune privilege?",
        "answer": "<li>Immune privilege refers to organs and tissues where mechanisms limit immune responses to avoid damage from inflammation, making allograft rejection less likely.</li>",
        "memoryTip": "Immune privilege is like a \"VIP lounge\" for organs, where they can relax without immune bouncers!",
        "emoji": "🎟️"
    },
    {
        "id": 57,
        "topic": "topic11",
        "question": "What are the two classes of Major Histocompatibility Complex (MHC)?",
        "answer": "<li>MHC I and MHC II.</li>",
        "memoryTip": "MHC I is like a single letter, while MHC II is a double trouble with two letters!",
        "emoji": "🅰️"
    },
    {
        "id": 58,
        "topic": "topic11",
        "question": "What genes encode the Major Histocompatibility Complex (MHC)?",
        "answer": "<li>MHC is encoded by HLA genes.</li>",
        "memoryTip": "HLA genes are like the VIP pass for T cells to the antigen party!",
        "emoji": "🎟️"
    },
    {
        "id": 59,
        "topic": "topic11",
        "question": "What is the primary function of MHC molecules?",
        "answer": "<li>Present antigen fragments to T cells and bind T-cell receptors (TCRs).</li>",
        "memoryTip": "MHC is the matchmaker for T cells and antigens—swiping right on immune responses!",
        "emoji": "💘"
    },
    {
        "id": 60,
        "topic": "topic12",
        "question": "What are the loci for MHC I?",
        "answer": "<li>HLA-A, HLA-B, HLA-C.</li>",
        "memoryTip": "MHC I loci are like the A-B-C of immune recognition!",
        "emoji": "🔤"
    },
    {
        "id": 61,
        "topic": "topic12",
        "question": "What type of cells express MHC I?",
        "answer": "<li>All nucleated cells, antigen-presenting cells (APCs), and platelets (except RBCs).</li>",
        "memoryTip": "MHC I is like a VIP badge for all nucleated cells—sorry, RBCs, no entry!",
        "emoji": "🚫"
    },
    {
        "id": 62,
        "topic": "topic12",
        "question": "What type of antigens do MHC I present?",
        "answer": "<li>Endogenous antigens (e.g., viral or cytosolic proteins) to CD8+ cytotoxic T cells.</li>",
        "memoryTip": "MHC I is the \"inside job\" for presenting viral villains to the T cell heroes!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 63,
        "topic": "topic12",
        "question": "How are antigen peptides loaded onto MHC I?",
        "answer": "<li>Antigen peptides are loaded onto MHC I in the RER after delivery via TAP (transporter associated with antigen processing).</li>",
        "memoryTip": "Think of TAP as the delivery service for antigen packages to MHC I!",
        "emoji": "📦"
    },
    {
        "id": 64,
        "topic": "topic13",
        "question": "What are the loci for MHC II?",
        "answer": "<li>HLA-DP, HLA-DQ, HLA-DR.</li>",
        "memoryTip": "MHC II loci are like a double scoop of ice cream—two letters for double the fun!",
        "emoji": "🍦"
    },
    {
        "id": 65,
        "topic": "topic13",
        "question": "What type of cells express MHC II?",
        "answer": "<li>Antigen-presenting cells (APCs).</li>",
        "memoryTip": "MHC II is the exclusive club for APCs—no entry for the rest!",
        "emoji": "🚪"
    },
    {
        "id": 66,
        "topic": "topic13",
        "question": "What type of antigens do MHC II present?",
        "answer": "<li>Exogenous antigens (e.g., bacterial proteins) to CD4+ helper T cells.</li>",
        "memoryTip": "MHC II is the \"outside in\" approach, serving up bacterial snacks to helper T cells!",
        "emoji": "🍽️"
    },
    {
        "id": 67,
        "topic": "topic13",
        "question": "How are antigens loaded onto MHC II?",
        "answer": "<li>Antigens are loaded following the release of the invariant chain in an acidified endosome.</li>",
        "memoryTip": "Think of the invariant chain as the bouncer at the endosome club, letting antigens in!",
        "emoji": "🕴️"
    },
    {
        "id": 68,
        "topic": "topic14",
        "question": "What associated protein is found with MHC I?",
        "answer": "<li>β2-microglobulin.</li>",
        "memoryTip": "β2-microglobulin is like the sidekick to MHC I, always there for support!",
        "emoji": "🦸‍♀️"
    },
    {
        "id": 69,
        "topic": "topic14",
        "question": "What associated protein is found with MHC II?",
        "answer": "<li>Invariant chain.</li>",
        "memoryTip": "The invariant chain is like a secret agent, keeping MHC II safe until it's time to present!",
        "emoji": "🕵️"
    },
    {
        "id": 70,
        "topic": "topic15",
        "question": "What diseases are associated with HLA subtype B27?",
        "answer": "<li>Psoriatic arthritis, ankylosing spondylitis, IBD-associated arthritis, reactive arthritis.</li>",
        "memoryTip": "Remember B27 with \"PAIR\"—Psoriatic, Ankylosing, IBD, Reactive!",
        "emoji": "👯"
    },
    {
        "id": 71,
        "topic": "topic15",
        "question": "What disease is associated with HLA subtype B57?",
        "answer": "<li>Abacavir hypersensitivity.</li>",
        "memoryTip": "B57 is like a warning sign for Abacavir—don't go there if you're sensitive!",
        "emoji": "⚠️"
    },
    {
        "id": 72,
        "topic": "topic15",
        "question": "What diseases are associated with HLA subtypes DQ2/DQ8?",
        "answer": "<li>Celiac disease.</li>",
        "memoryTip": "\"I ate (8) too (2) much gluten at Dairy Queen\" helps remember DQ2/DQ8!",
        "emoji": "🍞"
    },
    {
        "id": 73,
        "topic": "topic15",
        "question": "What diseases are associated with HLA subtype DR3?",
        "answer": "<li>DM type 1, SLE, Graves disease, Hashimoto thyroiditis, Addison disease.</li>",
        "memoryTip": "DM type 1: HLA-3 and -4 (1 + 3 = 4) is a math trick to remember DR3!",
        "emoji": "➕"
    },
    {
        "id": 74,
        "topic": "topic15",
        "question": "What diseases are associated with HLA subtype DR4?",
        "answer": "<li>Rheumatoid arthritis, DM type 1, Addison disease.</li>",
        "memoryTip": "\"There are 4 walls in 1 'rheum' (room)\" helps recall DR4!",
        "emoji": "🏠"
    },
    {
        "id": 75,
        "topic": "topic16",
        "question": "What type of immune system do natural killer (NK) cells belong to?",
        "answer": "<li>Innate immune system.</li>",
        "memoryTip": "NK cells are the \"natural\" born killers of the immune system—no training required!",
        "emoji": "🥷"
    },
    {
        "id": 76,
        "topic": "topic16",
        "question": "What mechanisms do NK cells use to induce apoptosis?",
        "answer": "<li>Use perforin and granzymes.</li>",
        "memoryTip": "NK cells are like ninjas, using perforin shurikens and granzyme smoke bombs to take out targets!",
        "emoji": "🥷"
    },
    {
        "id": 77,
        "topic": "topic16",
        "question": "What enhances the activity of NK cells?",
        "answer": "<li>IL-2, IL-12, IFN-α, and IFN-β.</li>",
        "memoryTip": "Think of these interleukins and interferons as energy drinks for NK cells—boosting their killer instincts!",
        "emoji": "🥤"
    },
    {
        "id": 78,
        "topic": "topic16",
        "question": "How are NK cells induced to kill?",
        "answer": "<li>When exposed to a nonspecific activation signal on the target cell and/or in the absence of an inhibitory signal such as MHC I.</li>",
        "memoryTip": "NK cells are like bouncers—they'll kick you out if you don't have the right signals!",
        "emoji": "🚷"
    },
    {
        "id": 79,
        "topic": "topic16",
        "question": "What is antibody-dependent cell-mediated cytotoxicity (ADCC)?",
        "answer": "<li>A mechanism where CD16 on NK cells binds the Fc region of bound IgG, activating the NK cell.</li>",
        "memoryTip": "ADCC is like a buddy system—NK cells need IgG friends to get the job done!",
        "emoji": "🤝"
    },
    {
        "id": 80,
        "topic": "topic17",
        "question": "What is the primary function of B cells?",
        "answer": "<li>Humoral immunity.</li>",
        "memoryTip": "B cells are the \"B\" in \"B-attle\" against infections, producing antibodies!",
        "emoji": "🛡️"
    },
    {
        "id": 81,
        "topic": "topic17",
        "question": "How do B cells optimize antigen specificity?",
        "answer": "<li>They undergo somatic hypermutation.</li>",
        "memoryTip": "B cells are like artists, constantly refining their masterpieces to hit the target!",
        "emoji": "🎨"
    },
    {
        "id": 82,
        "topic": "topic17",
        "question": "What do B cells differentiate into to secrete specific immunoglobulins?",
        "answer": "<li>Plasma cells.</li>",
        "memoryTip": "Plasma cells are like the factories of the immune system, churning out antibodies!",
        "emoji": "🏭"
    },
    {
        "id": 83,
        "topic": "topic17",
        "question": "What is the role of memory B cells?",
        "answer": "<li>They maintain immunologic memory and accelerate future responses to antigens.</li>",
        "memoryTip": "Memory B cells are like your brain's \"save\" button for immune responses!",
        "emoji": "💾"
    },
    {
        "id": 84,
        "topic": "topic17",
        "question": "What is the primary function of CD4+ T cells?",
        "answer": "<li>Help B cells make antibodies and produce cytokines to recruit phagocytes and activate other leukocytes.</li>",
        "memoryTip": "CD4+ T cells are the cheerleaders of the immune system, rallying the troops!",
        "emoji": "📣"
    },
    {
        "id": 85,
        "topic": "topic17",
        "question": "What is the primary function of CD8+ T cells?",
        "answer": "<li>Directly kill virus-infected and tumor cells via perforin and granzymes.</li>",
        "memoryTip": "CD8+ T cells are the assassins of the immune system, taking out infected cells with precision!",
        "emoji": "🎯"
    },
    {
        "id": 86,
        "topic": "topic17",
        "question": "What type of hypersensitivity reaction is associated with T cells?",
        "answer": "<li>Type IV hypersensitivity reaction.</li>",
        "memoryTip": "Type IV hypersensitivity is like a delayed reaction—T cells take their time to respond!",
        "emoji": "⏳"
    },
    {
        "id": 87,
        "topic": "topic17",
        "question": "What are the implications of T cells in organ rejection?",
        "answer": "<li>They are involved in acute and chronic cellular organ rejection.</li>",
        "memoryTip": "T cells are like picky roommates—they'll reject anything that doesn't fit their criteria!",
        "emoji": "🚪"
    },
    {
        "id": 88,
        "topic": "topic18",
        "question": "What are the two main types of T cells differentiated from T-cell precursors?",
        "answer": "<li>CD4+ (Helper T cells) and CD8+ (Cytotoxic T cells).</li>",
        "memoryTip": "Think of CD4+ as the \"helpers\" who bring snacks to the party, while CD8+ are the \"bouncers\" kicking out the unwanted guests!",
        "emoji": "🎉"
    },
    {
        "id": 89,
        "topic": "topic18",
        "question": "What are the functions of CD4+ T cells?",
        "answer": "<li>CD4+ T cells secrete cytokines such as IFN-γ, IL-2, IL-4, IL-5, IL-6, IL-10, IL-13, IL-17, IL-21, and IL-22.</li>",
        "memoryTip": "CD4+ T cells are like a Swiss Army knife, equipped with all the tools (cytokines) to help out in various situations!",
        "emoji": "🛠️"
    },
    {
        "id": 90,
        "topic": "topic18",
        "question": "What is the role of Th1 cells?",
        "answer": "<li>Th1 cells activate macrophages and cytotoxic T cells by secreting IFN-γ and IL-2.</li>",
        "memoryTip": "Th1 cells are like the cheerleaders of the immune system, rallying the troops to fight off invaders!",
        "emoji": "📣"
    },
    {
        "id": 91,
        "topic": "topic18",
        "question": "What cytokines do Th2 cells secrete, and what is their function?",
        "answer": "<li>Th2 cells secrete IL-4, IL-5, IL-6, IL-10, and IL-13, which help in activating eosinophils and promoting IgE production.</li>",
        "memoryTip": "Th2 cells are like the party planners, making sure everyone (eosinophils) has a good time with the right snacks (IgE)!",
        "emoji": "🎈"
    },
    {
        "id": 92,
        "topic": "topic18",
        "question": "What is the function of Treg cells?",
        "answer": "<li>Treg cells help maintain immune tolerance by suppressing the functions of CD4+ and CD8+ T cells.</li>",
        "memoryTip": "Treg cells are like the peacekeepers at a family reunion, making sure everyone gets along and no fights break out!",
        "emoji": "☮️"
    },
    {
        "id": 93,
        "topic": "topic18",
        "question": "What is the significance of the AIRE protein in T cell selection?",
        "answer": "<li>AIRE drives negative selection in the thymic medulla, removing T cells that bind too strongly to self-peptides.</li>",
        "memoryTip": "AIRE is like the bouncer at the club, making sure only the right T cells get in and the troublemakers are shown the door!",
        "emoji": "🚪"
    },
    {
        "id": 94,
        "topic": "topic18",
        "question": "What happens if there is a deficiency of the AIRE protein?",
        "answer": "<li>A deficiency leads to autoimmune polyendocrine syndrome, characterized by conditions like chronic mucocutaneous candidiasis and adrenal insufficiency.</li>",
        "memoryTip": "Without AIRE, it’s like having a party without a guest list—everyone gets in, including the troublemakers!",
        "emoji": "🎟️"
    },
    {
        "id": 95,
        "topic": "topic19",
        "question": "How do Th1 cells enhance macrophage function?",
        "answer": "<li>Th1 cells secrete IFN-γ, which enhances the ability of monocytes and macrophages to kill ingested microbes.</li>",
        "memoryTip": "Th1 cells are like the motivational speakers for macrophages, boosting their confidence to tackle the bad guys!",
        "emoji": "🎤"
    },
    {
        "id": 96,
        "topic": "topic19",
        "question": "What is the role of CD40L in macrophage activation?",
        "answer": "<li>CD40L on T cells interacts with CD40 on macrophages to enhance their activation.</li>",
        "memoryTip": "CD40L is like the high-five that gets macrophages pumped up to fight off infections!",
        "emoji": "✋"
    },
    {
        "id": 97,
        "topic": "topic20",
        "question": "What is the primary function of cytotoxic T cells?",
        "answer": "<li>Cytotoxic T cells kill virus-infected, neoplastic, and donor graft cells by inducing apoptosis.</li>",
        "memoryTip": "Cytotoxic T cells are like the ninjas of the immune system, stealthily taking out the bad guys without a sound!",
        "emoji": "🥷"
    },
    {
        "id": 98,
        "topic": "topic20",
        "question": "What proteins do cytotoxic T cells release to induce apoptosis?",
        "answer": "<li>Cytotoxic T cells release perforin and granzyme B.</li>",
        "memoryTip": "Perforin and granzyme B are like the secret weapons in a ninja's arsenal, ensuring the target is taken down efficiently!",
        "emoji": "⚔️"
    },
    {
        "id": 99,
        "topic": "topic21",
        "question": "What are the antigen-presenting cells (APCs) involved in T- and B-cell activation?",
        "answer": "<li>APCs include B cells, dendritic cells, Langerhans cells, and macrophages.</li>",
        "memoryTip": "APCs are like the tour guides of the immune system, showing T and B cells around and introducing them to the antigens!",
        "emoji": "🗺️"
    },
    {
        "id": 100,
        "topic": "topic21",
        "question": "What are the two signals required for T-cell activation?",
        "answer": "<li>The first signal is the presentation of antigen on MHC II to CD4+ T cells or MHC I to CD8+ T cells. The second signal is the costimulatory signal via B7 (CD80/86) on dendritic cells and CD28 on naïve T cells.</li>",
        "memoryTip": "T-cell activation needs a double handshake—first the antigen, then the high-five!",
        "emoji": "🤝"
    },
    {
        "id": 101,
        "topic": "topic21",
        "question": "How do Th cells influence B-cell activation and class switching?",
        "answer": "<li>Th cells secrete cytokines that determine the Ig class switching of B cells after binding CD40L to CD40 on B cells.</li>",
        "memoryTip": "Th cells are like the fashion consultants for B cells, helping them choose the right outfit (Ig class) for the occasion!",
        "emoji": "👗"
    },
    {
        "id": 102,
        "topic": "topic21",
        "question": "What is the initial antibody produced by activated B cells?",
        "answer": "<li>Activated B cells initially produce IgM.</li>",
        "memoryTip": "IgM is like the first draft of a paper—it's a start, but there's always room for improvement with class switching!",
        "emoji": "📝"
    },
    {
        "id": 103,
        "topic": "topic22",
        "question": "What are the components of the Fab fragment of an antibody?",
        "answer": "<li>The Fab fragment consists of light (L) and heavy (H) chains that recognize antigens.</li>",
        "memoryTip": "Think of Fab as \"Fabulous\" because it recognizes the fabulous antigens!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 104,
        "topic": "topic22",
        "question": "What is the function of the Fc region in antibodies like IgM and IgG?",
        "answer": "<li>The Fc region fixes complement.</li>",
        "memoryTip": "Fc is like a \"Fix-it\" guy for complement!",
        "emoji": "🔧"
    },
    {
        "id": 105,
        "topic": "topic22",
        "question": "What does the heavy chain contribute to in an antibody?",
        "answer": "<li>The heavy chain contributes to both the Fc and Fab regions.</li>",
        "memoryTip": "Heavy chains are like the \"heavy lifters\" in the antibody world!",
        "emoji": "🏋️"
    },
    {
        "id": 106,
        "topic": "topic22",
        "question": "What does the light chain contribute to in an antibody?",
        "answer": "<li>The light chain contributes only to the Fab region.</li>",
        "memoryTip": "Light chains are the \"lightweights\" focusing on the Fab!",
        "emoji": "🏃‍♂️"
    },
    {
        "id": 107,
        "topic": "topic22",
        "question": "What are hypervariable regions in antibodies?",
        "answer": "<li>Hypervariable regions are parts of the Fab region that determine the unique antigen-binding specificity.</li>",
        "memoryTip": "Hypervariable sounds like \"hyperactive\" kids, always changing and adapting!",
        "emoji": "🤸‍♀️"
    },
    {
        "id": 108,
        "topic": "topic23",
        "question": "What is the first step in the generation of antibody diversity?",
        "answer": "<li>Random recombination of VJ (light-chain) or V(D)J (heavy-chain) genes by RAG1 and RAG2.</li>",
        "memoryTip": "Think of RAG1 and RAG2 as the \"Raggedy Ann and Andy\" of antibody diversity, mixing things up!",
        "emoji": "🎭"
    },
    {
        "id": 109,
        "topic": "topic23",
        "question": "What role does terminal deoxynucleotidyl transferase (TdT) play in antibody diversity?",
        "answer": "<li>TdT randomly adds nucleotides to DNA during recombination.</li>",
        "memoryTip": "TdT is like a \"Tasty Dessert Topping\" that adds extra flavor to the DNA!",
        "emoji": "🍰"
    },
    {
        "id": 110,
        "topic": "topic23",
        "question": "How is antibody specificity generated in an antigen-dependent manner?",
        "answer": "<li>Through somatic hypermutation and affinity maturation in the variable region, and isotype switching in the constant region.</li>",
        "memoryTip": "Think of it as antibodies going through a \"specificity boot camp\" to get stronger!",
        "emoji": "🏋️‍♀️"
    },
    {
        "id": 111,
        "topic": "topic24",
        "question": "What immunoglobulin isotypes do mature, naïve B cells express before activation?",
        "answer": "<li>Mature, naïve B cells express IgM and IgD on their surfaces.</li>",
        "memoryTip": "IgM and IgD are like the \"Mature Duo\" waiting to party!",
        "emoji": "🎉"
    },
    {
        "id": 112,
        "topic": "topic24",
        "question": "What happens to B cells in germinal centers of lymph nodes?",
        "answer": "<li>They undergo isotype switching to become plasma cells that secrete IgA, IgG, or IgE.</li>",
        "memoryTip": "B cells are like teenagers switching styles as they grow up!",
        "emoji": "👗"
    },
    {
        "id": 113,
        "topic": "topic24",
        "question": "What is the main antibody in the secondary response to an antigen?",
        "answer": "<li>IgG is the main antibody in the secondary response.</li>",
        "memoryTip": "IgG is like the \"Grown-up\" that knows how to handle the situation!",
        "emoji": "👨‍⚕️"
    },
    {
        "id": 114,
        "topic": "topic24",
        "question": "What unique ability does IgG have regarding infants?",
        "answer": "<li>IgG is the only isotype that crosses the placenta, providing passive immunity to infants.</li>",
        "memoryTip": "IgG is like a \"Guardian\" that protects the baby before they can fight off germs!",
        "emoji": "🛡️"
    },
    {
        "id": 115,
        "topic": "topic24",
        "question": "What is the primary function of IgA?",
        "answer": "<li>IgA prevents the attachment of bacteria and viruses to mucous membranes.</li>",
        "memoryTip": "IgA is like a \"Bouncer\" at the mucous membrane club, keeping unwanted guests out!",
        "emoji": "🚷"
    },
    {
        "id": 116,
        "topic": "topic24",
        "question": "What is the first antibody produced during an immune response?",
        "answer": "<li>IgM is the first antibody produced during an immune response.</li>",
        "memoryTip": "IgM is like the \"First Responder\" at the scene of an infection!",
        "emoji": "🚓"
    },
    {
        "id": 117,
        "topic": "topic24",
        "question": "What is the role of IgE in the immune system?",
        "answer": "<li>IgE binds to mast cells and basophils, mediating immediate hypersensitivity and contributing to immunity against parasites.</li>",
        "memoryTip": "IgE is like the \"Emergency Alert\" system for allergies and parasites!",
        "emoji": "🚨"
    },
    {
        "id": 118,
        "topic": "topic25",
        "question": "What are thymus-independent antigens?",
        "answer": "<li>Thymus-independent antigens are those lacking a peptide component and cannot be presented by MHC to T cells.</li>",
        "memoryTip": "Think of thymus-independent antigens as \"Independent Kids\" who don't need T cell supervision!",
        "emoji": "🧒"
    },
    {
        "id": 119,
        "topic": "topic25",
        "question": "Why are thymus-independent antigens considered weakly immunogenic?",
        "answer": "<li>They often require boosters and adjuvants for effective vaccination.</li>",
        "memoryTip": "Weakly immunogenic antigens are like \"Lazy Students\" who need extra help to pass!",
        "emoji": "💤"
    },
    {
        "id": 120,
        "topic": "topic25",
        "question": "What are thymus-dependent antigens?",
        "answer": "<li>Thymus-dependent antigens contain a protein component and allow for class switching and immunologic memory through B cell and T cell interaction.</li>",
        "memoryTip": "Thymus-dependent antigens are like \"Team Players\" that work well with T cells!",
        "emoji": "🤝"
    },
    {
        "id": 121,
        "topic": "topic26",
        "question": "What is the complement system?",
        "answer": "<li>The complement system consists of hepatically synthesized plasma proteins that play a role in innate immunity and inflammation.</li>",
        "memoryTip": "Think of the complement system as the \"team of proteins\" that always shows up to the immune party!",
        "emoji": "🥳"
    },
    {
        "id": 122,
        "topic": "topic26",
        "question": "What does the membrane attack complex (MAC) defend against?",
        "answer": "<li>The MAC defends against gram-negative bacteria.</li>",
        "memoryTip": "The MAC is like a bouncer at the club, only letting in the right bacteria!",
        "emoji": "🚪"
    },
    {
        "id": 123,
        "topic": "topic26",
        "question": "What is the CH50 test used for?",
        "answer": "<li>The CH50 test is used to screen for activation of the classical complement pathway.</li>",
        "memoryTip": "CH50 sounds like \"see how 50\" proteins are doing in the classical pathway!",
        "emoji": "🔍"
    },
    {
        "id": 124,
        "topic": "topic27",
        "question": "What are the three activation pathways of the complement system?",
        "answer": "<li>The three activation pathways are classic, alternative, and lectin pathways.</li>",
        "memoryTip": "Think of them as the three amigos of immune activation: Classic, Alternative, and Lectin!",
        "emoji": "🤠"
    },
    {
        "id": 125,
        "topic": "topic27",
        "question": "What triggers the classic pathway of complement activation?",
        "answer": "<li>The classic pathway is mediated by IgG or IgM antibodies.</li>",
        "memoryTip": "Classic cars need classic fuel—IgG or IgM!",
        "emoji": "🚗"
    },
    {
        "id": 126,
        "topic": "topic27",
        "question": "What triggers the alternative pathway of complement activation?",
        "answer": "<li>The alternative pathway is triggered by microbe surface molecules.</li>",
        "memoryTip": "Alternative pathways are like alternative rock—different but still effective!",
        "emoji": "🎸"
    },
    {
        "id": 127,
        "topic": "topic27",
        "question": "What triggers the lectin pathway of complement activation?",
        "answer": "<li>The lectin pathway is triggered by mannose or other sugars on the microbe surface.</li>",
        "memoryTip": "Mannose is like the sweet candy that attracts the immune system!",
        "emoji": "🍬"
    },
    {
        "id": 128,
        "topic": "topic28",
        "question": "What is the function of C3b in the complement system?",
        "answer": "<li>C3b is involved in opsonization, enhancing phagocytosis.</li>",
        "memoryTip": "C3b is like a \"helping hand\" for phagocytes, making it easier to eat up bacteria!",
        "emoji": "🤲"
    },
    {
        "id": 129,
        "topic": "topic28",
        "question": "What roles do C3a, C4a, and C5a play in the immune response?",
        "answer": "<li>C3a, C4a, and C5a are involved in anaphylaxis.</li>",
        "memoryTip": "Think of C3a, C4a, and C5a as the \"party crashers\" of the immune system, causing a ruckus!",
        "emoji": "🎉"
    },
    {
        "id": 130,
        "topic": "topic28",
        "question": "What is the role of C5a in the immune response?",
        "answer": "<li>C5a mediates neutrophil chemotaxis.</li>",
        "memoryTip": "C5a is like a GPS for neutrophils, guiding them to the site of infection!",
        "emoji": "🧭"
    },
    {
        "id": 131,
        "topic": "topic28",
        "question": "What does the MAC (C5b-9) do?",
        "answer": "<li>The MAC is responsible for cytolysis, leading to cell lysis.</li>",
        "memoryTip": "The MAC is like a wrecking ball for bacteria—smashing them to bits!",
        "emoji": "💥"
    },
    {
        "id": 132,
        "topic": "topic29",
        "question": "What are the primary opsonins in bacterial defense?",
        "answer": "<li>The primary opsonins are C3b and IgG.</li>",
        "memoryTip": "C3b and IgG are the \"dynamic duo\" of opsonization, always ready to enhance phagocytosis!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 133,
        "topic": "topic29",
        "question": "What is the function of decay-accelerating factor (DAF)?",
        "answer": "<li>DAF helps prevent complement activation on self-cells, such as RBCs.</li>",
        "memoryTip": "DAF is like a traffic cop, directing complement proteins away from self-cells!",
        "emoji": "🚦"
    },
    {
        "id": 134,
        "topic": "topic30",
        "question": "How does C3a contribute to inflammation?",
        "answer": "<li>C3a stimulates mast-cell degranulation.</li>",
        "memoryTip": "C3a is like a firecracker, igniting the inflammation party!",
        "emoji": "🎆"
    },
    {
        "id": 135,
        "topic": "topic30",
        "question": "What effect does histamine have during inflammation?",
        "answer": "<li>Histamine increases endothelial permeability.</li>",
        "memoryTip": "Histamine is like a \"door opener,\" letting immune cells rush to the scene!",
        "emoji": "🚪"
    },
    {
        "id": 136,
        "topic": "topic30",
        "question": "What role does C5a play in neutrophil activity?",
        "answer": "<li>C5a mediates neutrophil chemotaxis, guiding them to the site of infection.</li>",
        "memoryTip": "C5a is the \"neutrophil taxi service,\" ensuring they arrive on time!",
        "emoji": "🚖"
    },
    {
        "id": 137,
        "topic": "topic31",
        "question": "What are the risks associated with early complement deficiencies (C1–C4)?",
        "answer": "<li>Early complement deficiencies increase the risk of severe, recurrent pyogenic sinus and respiratory tract infections and are associated with a higher risk of systemic lupus erythematosus (SLE).</li>",
        "memoryTip": "Early deficiencies are like a bad start to a race—you're likely to trip over SLEarly!",
        "emoji": "🏃‍♂️"
    },
    {
        "id": 138,
        "topic": "topic31",
        "question": "What are the consequences of terminal complement deficiencies (C5–C9)?",
        "answer": "<li>Terminal complement deficiencies lead to susceptibility to recurrent Neisseria bacteremia.</li>",
        "memoryTip": "Terminal deficiencies are like a \"no entry\" sign for Neisseria—too bad they don’t see it!",
        "emoji": "🚫"
    },
    {
        "id": 139,
        "topic": "topic31",
        "question": "What condition is caused by C1 esterase inhibitor deficiency?",
        "answer": "<li>C1 esterase inhibitor deficiency causes hereditary angioedema due to unregulated activation of kallikrein, leading to increased bradykinin.</li>",
        "memoryTip": "C1 esterase is like a \"brake\" for swelling—without it, things get out of hand!",
        "emoji": "🚨"
    },
    {
        "id": 140,
        "topic": "topic31",
        "question": "What is paroxysmal nocturnal hemoglobinuria (PNH)?",
        "answer": "<li>PNH is caused by a defect in the PIGA gene, preventing the formation of GPI anchors for complement inhibitors, leading to complement-mediated intravascular hemolysis.</li>",
        "memoryTip": "PNH is like a \"party crasher\" for red blood cells, causing them to burst in the night!",
        "emoji": "🌙"
    },
    {
        "id": 141,
        "topic": "topic31",
        "question": "What are the symptoms of PNH?",
        "answer": "<li>Symptoms of PNH include hemolysis, decreased haptoglobin, and dark urine.</li>",
        "memoryTip": "PNH makes your urine darker than a midnight snack—watch out for that color change!",
        "emoji": "🌌"
    },
    {
        "id": 142,
        "topic": "topic31",
        "question": "What complications can arise from PNH?",
        "answer": "<li>PNH can cause atypical venous thrombosis, such as Budd-Chiari syndrome, and thrombosis in the portal vein, cerebral, or dermal areas.</li>",
        "memoryTip": "PNH is like a \"thrombus factory,\" producing clots in all the wrong places!",
        "emoji": "🏭"
    },
    {
        "id": 143,
        "topic": "topic32",
        "question": "What are the important acute cytokines mentioned in the text?",
        "answer": "<li>IL-1, IL-6, and TNF-α are important acute cytokines.</li>",
        "memoryTip": "Think of them as the \"A-Team\" of inflammation, always ready to respond!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 144,
        "topic": "topic32",
        "question": "What cytokines are involved in recruiting other immune cells?",
        "answer": "<li>IL-8 and IL-12 are involved in recruiting other immune cells.</li>",
        "memoryTip": "IL-8 is like the \"clean-up crew\" calling in reinforcements!",
        "emoji": "🚨"
    },
    {
        "id": 145,
        "topic": "topic32",
        "question": "What is the function of Interleukin-1 (IL-1)?",
        "answer": "<li>IL-1 causes fever, acute inflammation, activates endothelium to express adhesion molecules, and induces chemokine secretion to recruit WBCs.</li>",
        "memoryTip": "IL-1 is like a hot sauce that makes everything spicy—fever and inflammation!",
        "emoji": "🌶️"
    },
    {
        "id": 146,
        "topic": "topic32",
        "question": "What is another name for Interleukin-1?",
        "answer": "<li>Interleukin-1 is also called osteoclast-activating factor.</li>",
        "memoryTip": "IL-1 is like a bone's personal trainer, activating those osteoclasts!",
        "emoji": "🏋️‍♂️"
    },
    {
        "id": 147,
        "topic": "topic32",
        "question": "What does Interleukin-6 (IL-6) do?",
        "answer": "<li>IL-6 causes fever and stimulates the production of acute-phase proteins.</li>",
        "memoryTip": "IL-6 is like a fire alarm—alerting the body to ramp up defenses!",
        "emoji": "🚒"
    },
    {
        "id": 148,
        "topic": "topic32",
        "question": "What is the role of Tumor Necrosis Factor-alpha (TNF-α)?",
        "answer": "<li>TNF-α activates endothelium, causes WBC recruitment, vascular leak, and cachexia in malignancy.</li>",
        "memoryTip": "TNF-α is like a bouncer at a club, letting in the right cells and causing a scene!",
        "emoji": "🚷"
    },
    {
        "id": 149,
        "topic": "topic32",
        "question": "What is the major chemotactic factor for neutrophils?",
        "answer": "<li>Interleukin-8 (IL-8) is the major chemotactic factor for neutrophils.</li>",
        "memoryTip": "IL-8 is like a neon sign saying \"Neutrophils this way!\"",
        "emoji": "💡"
    },
    {
        "id": 150,
        "topic": "topic32",
        "question": "What does Interleukin-12 do?",
        "answer": "<li>IL-12 induces differentiation of T cells into Th1 cells and activates NK cells.</li>",
        "memoryTip": "IL-12 is like a coach training T cells to be the best defenders!",
        "emoji": "🏆"
    },
    {
        "id": 151,
        "topic": "topic32",
        "question": "What is the function of Interleukin-2 (IL-2)?",
        "answer": "<li>IL-2 stimulates the growth of helper, cytotoxic, and regulatory T cells, and NK cells.</li>",
        "memoryTip": "IL-2 is like a growth hormone for T cells—making them bigger and stronger!",
        "emoji": "💪"
    },
    {
        "id": 152,
        "topic": "topic32",
        "question": "What does Interleukin-3 (IL-3) support?",
        "answer": "<li>IL-3 supports the growth and differentiation of bone marrow stem cells and stimulates proliferation of eosinophils, basophils, neutrophils, and monocytes.</li>",
        "memoryTip": "IL-3 is like a gardener, helping all the blood cells grow!",
        "emoji": "🌱"
    },
    {
        "id": 153,
        "topic": "topic32",
        "question": "What is the role of Interferon-γ?",
        "answer": "<li>Interferon-γ stimulates macrophages to kill phagocytosed pathogens, inhibits differentiation of Th2 cells, induces IgG isotype switching in B cells, and increases MHC expression.</li>",
        "memoryTip": "Interferon-γ is like a superhero for macrophages, giving them the power to fight!",
        "emoji": "🦸‍♀️"
    },
    {
        "id": 154,
        "topic": "topic32",
        "question": "What does Interleukin-4 (IL-4) promote?",
        "answer": "<li>IL-4 promotes the differentiation of T cells into Th2 cells and enhances class switching to IgE and IgG.</li>",
        "memoryTip": "IL-4 is like a party planner for T cells, making sure they know how to switch it up!",
        "emoji": "🎉"
    },
    {
        "id": 155,
        "topic": "topic32",
        "question": "What is the function of Interleukin-5 (IL-5)?",
        "answer": "<li>IL-5 promotes growth and differentiation of B cells and enhances class switching to IgA.</li>",
        "memoryTip": "IL-5 is like a cheerleader for B cells, boosting their confidence to switch!",
        "emoji": "📣"
    },
    {
        "id": 156,
        "topic": "topic32",
        "question": "What does Interleukin-10 do?",
        "answer": "<li>IL-10 attenuates the inflammatory response and decreases expression of MHC class II and Th1 cytokines.</li>",
        "memoryTip": "IL-10 is like a chill pill for the immune system, calming things down!",
        "emoji": "😌"
    },
    {
        "id": 157,
        "topic": "topic32",
        "question": "What is the role of Interleukin-13?",
        "answer": "<li>IL-13 promotes IgE production by B cells and induces alternative macrophage activation.</li>",
        "memoryTip": "IL-13 is like a magician, making IgE appear out of thin air!",
        "emoji": "🎩"
    },
    {
        "id": 158,
        "topic": "topic33",
        "question": "What is the respiratory burst also known as?",
        "answer": "<li>The respiratory burst is also called the oxidative burst.</li>",
        "memoryTip": "Think of it as the \"breath of fresh air\" for immune cells to fight off invaders!",
        "emoji": "🌬️"
    },
    {
        "id": 159,
        "topic": "topic33",
        "question": "What is the role of the phagocyte NADPH oxidase complex?",
        "answer": "<li>The phagocyte NADPH oxidase complex activates to utilize O2 as a substrate, playing a key role in the rapid release of reactive oxygen species (ROS).</li>",
        "memoryTip": "NADPH oxidase is like a power plant, generating energy (ROS) for the immune response!",
        "emoji": "⚡"
    },
    {
        "id": 160,
        "topic": "topic33",
        "question": "What happens in patients with NADPH oxidase deficiency?",
        "answer": "<li>Patients with NADPH oxidase deficiency have chronic granulomatous disease.</li>",
        "memoryTip": "Without NADPH oxidase, it's like having a fire department without water—no way to fight infections!",
        "emoji": "🚒"
    },
    {
        "id": 161,
        "topic": "topic33",
        "question": "What type of bacteria are patients with chronic granulomatous disease at increased risk for?",
        "answer": "<li>Patients are at increased risk for infections by catalase-positive species, such as S. aureus and Aspergillus.</li>",
        "memoryTip": "Catalase-positive bacteria are like sneaky ninjas, neutralizing H2O2 and evading the immune response!",
        "emoji": "🥷"
    },
    {
        "id": 162,
        "topic": "topic34",
        "question": "What are the types of interferons mentioned?",
        "answer": "<li>IFN-α, IFN-β, and IFN-γ are the types of interferons mentioned.</li>",
        "memoryTip": "Think of interferons as the \"triple threat\" of viral defense!",
        "emoji": "🎤"
    },
    {
        "id": 163,
        "topic": "topic34",
        "question": "What is the mechanism of action of interferons?",
        "answer": "<li>Interferons interfere with both RNA and DNA viruses, priming local cells for viral defense by downregulating protein synthesis and upregulating MHC expression.</li>",
        "memoryTip": "Interferons are like the immune system's alarm system, alerting cells to prepare for an invasion!",
        "emoji": "🚨"
    },
    {
        "id": 164,
        "topic": "topic34",
        "question": "What are some clinical uses of interferons?",
        "answer": "<li>Interferons are used in chronic HBV, Kaposi sarcoma, hairy cell leukemia, condyloma acuminatum, renal cell carcinoma, malignant melanoma, multiple sclerosis, and chronic granulomatous disease.</li>",
        "memoryTip": "Interferons are like the Swiss Army knife of treatments—useful for many conditions!",
        "emoji": "🛠️"
    },
    {
        "id": 165,
        "topic": "topic34",
        "question": "What are some adverse effects of interferons?",
        "answer": "<li>Adverse effects include flu-like symptoms, depression, neutropenia, myopathy, and interferon-induced autoimmunity.</li>",
        "memoryTip": "Interferons can be a bit moody—like a friend who gets sick every time you hang out!",
        "emoji": "🤒"
    },
    {
        "id": 166,
        "topic": "topic35",
        "question": "What is the function of TCR in T cells?",
        "answer": "<li>TCR (T cell receptor) binds to the antigen-MHC complex.</li>",
        "memoryTip": "TCR is like a key that unlocks the door to the immune party!",
        "emoji": "🔑"
    },
    {
        "id": 167,
        "topic": "topic35",
        "question": "What is the role of CD3 in T cells?",
        "answer": "<li>CD3 is associated with TCR for signal transduction.</li>",
        "memoryTip": "CD3 is the messenger that tells TCR when to party!",
        "emoji": "📡"
    },
    {
        "id": 168,
        "topic": "topic35",
        "question": "What does CD28 bind to in T cells?",
        "answer": "<li>CD28 binds to B7 on antigen-presenting cells (APC).</li>",
        "memoryTip": "CD28 is like a VIP pass that lets T cells into the immune club!",
        "emoji": "🎟️"
    },
    {
        "id": 169,
        "topic": "topic35",
        "question": "What are the key markers for Helper T cells?",
        "answer": "<li>Helper T cells have CD4, CD40L, and coreceptors CXCR4/CCR5.</li>",
        "memoryTip": "Helper T cells are like the social butterflies of the immune system, always networking!",
        "emoji": "🦋"
    },
    {
        "id": 170,
        "topic": "topic35",
        "question": "What is the primary marker for Cytotoxic T cells?",
        "answer": "<li>Cytotoxic T cells are marked by CD8.</li>",
        "memoryTip": "CD8 is like the bouncer at the immune club, ready to kick out the bad guys!",
        "emoji": "🚷"
    },
    {
        "id": 171,
        "topic": "topic35",
        "question": "What markers are found on Regulatory T cells?",
        "answer": "<li>Regulatory T cells have CD4 and CD25.</li>",
        "memoryTip": "Regulatory T cells are the peacekeepers, making sure the immune system doesn’t go wild!",
        "emoji": "☮️"
    },
    {
        "id": 172,
        "topic": "topic35",
        "question": "What are the key surface proteins on B cells?",
        "answer": "<li>B cells have Ig (immunoglobulin), CD19, CD20, CD21, CD40, MHC II, and B7.</li>",
        "memoryTip": "B cells are like the artists of the immune system, painting antibodies to fight infections!",
        "emoji": "🎨"
    },
    {
        "id": 173,
        "topic": "topic35",
        "question": "What does CD21 on B cells specifically bind to?",
        "answer": "<li>CD21 is the receptor for Epstein-Barr virus.</li>",
        "memoryTip": "CD21 is like a VIP lounge for the Epstein-Barr virus, but we don’t want it there!",
        "emoji": "🚫"
    },
    {
        "id": 174,
        "topic": "topic35",
        "question": "What are the markers for NK cells?",
        "answer": "<li>NK cells are identified by CD16 and CD56.</li>",
        "memoryTip": "NK cells are the ninjas of the immune system, stealthily taking out threats!",
        "emoji": "🥷"
    },
    {
        "id": 175,
        "topic": "topic35",
        "question": "What are the key markers on Macrophages?",
        "answer": "<li>Macrophages have CD14, CD40, CCR5, MHC II, B7, and Fc and C3b receptors.</li>",
        "memoryTip": "Macrophages are like the cleanup crew, ready to gobble up debris and bad guys!",
        "emoji": "🧹"
    },
    {
        "id": 176,
        "topic": "topic35",
        "question": "What is the marker for Hematopoietic stem cells?",
        "answer": "<li>Hematopoietic stem cells are marked by CD34.</li>",
        "memoryTip": "CD34 is like the birth certificate for stem cells, proving they’re the originals!",
        "emoji": "🍼"
    },
    {
        "id": 177,
        "topic": "topic36",
        "question": "What is anergy in the context of T and B cells?",
        "answer": "<li>Anergy is a state during which a cell cannot become activated by exposure to its antigen.</li>",
        "memoryTip": "Anergy is like a snooze button for immune cells; they just can’t wake up!",
        "emoji": "⏰"
    },
    {
        "id": 178,
        "topic": "topic36",
        "question": "When do T and B cells become anergic?",
        "answer": "<li>T and B cells become anergic when exposed to their antigen without a costimulatory signal (signal 2).</li>",
        "memoryTip": "Without a party invite (costimulatory signal), T and B cells just take a nap!",
        "emoji": "😴"
    },
    {
        "id": 179,
        "topic": "topic37",
        "question": "What is passive immunity?",
        "answer": "<li>Passive immunity is acquired by receiving preformed antibodies.</li>",
        "memoryTip": "Passive immunity is like borrowing a friend’s umbrella; you stay dry without getting wet!",
        "emoji": "☂️"
    },
    {
        "id": 180,
        "topic": "topic37",
        "question": "What is active immunity?",
        "answer": "<li>Active immunity is acquired through exposure to exogenous antigens.</li>",
        "memoryTip": "Active immunity is like building your own umbrella; it takes time but lasts longer!",
        "emoji": "🏗️"
    },
    {
        "id": 181,
        "topic": "topic37",
        "question": "How quickly does passive immunity onset?",
        "answer": "<li>Passive immunity has a rapid onset.</li>",
        "memoryTip": "Passive immunity is like a fast food meal; quick and easy!",
        "emoji": "🍔"
    },
    {
        "id": 182,
        "topic": "topic37",
        "question": "How quickly does active immunity onset?",
        "answer": "<li>Active immunity has a slow onset.</li>",
        "memoryTip": "Active immunity is like a slow-cooked meal; it takes time but is worth the wait!",
        "emoji": "🍲"
    },
    {
        "id": 183,
        "topic": "topic37",
        "question": "What is the duration of passive immunity?",
        "answer": "<li>Passive immunity lasts for a short span, with a half-life of about 3 weeks.</li>",
        "memoryTip": "Passive immunity is like a short vacation; it’s fun but doesn’t last long!",
        "emoji": "🏖️"
    },
    {
        "id": 184,
        "topic": "topic37",
        "question": "What is the duration of active immunity?",
        "answer": "<li>Active immunity provides long-lasting protection due to memory.</li>",
        "memoryTip": "Active immunity is like a lifelong membership; you’re covered for the long haul!",
        "emoji": "🏅"
    },
    {
        "id": 185,
        "topic": "topic37",
        "question": "Give examples of passive immunity.",
        "answer": "<li>Examples include IgA in breast milk, maternal IgG crossing the placenta, antitoxin, and humanized monoclonal antibodies.</li>",
        "memoryTip": "Passive immunity is like getting a free ride from mom; she’s got your back!",
        "emoji": "👩‍👧"
    },
    {
        "id": 186,
        "topic": "topic37",
        "question": "Give examples of active immunity.",
        "answer": "<li>Examples include natural infection, vaccines, and toxoids.</li>",
        "memoryTip": "Active immunity is like earning your stripes; you’ve worked hard for that protection!",
        "emoji": "🎖️"
    },
    {
        "id": 187,
        "topic": "topic37",
        "question": "What is a note regarding IVIG and other immune globulin preparations?",
        "answer": "<li>IVIG and other immune globulin preparations can provide temporary but specific passive immunity to a target pathogen.</li>",
        "memoryTip": "IVIG is like a quick fix; it’s not permanent but helps in a pinch!",
        "emoji": "🛠️"
    },
    {
        "id": 188,
        "topic": "topic37",
        "question": "What is a combined passive and active immunization example?",
        "answer": "<li>Combined passive and active immunizations can be given for hepatitis B or rabies exposure.</li>",
        "memoryTip": "It’s like having a double scoop of ice cream; you get the best of both worlds!",
        "emoji": "🍦"
    },
    {
        "id": 189,
        "topic": "topic38",
        "question": "What does vaccination induce?",
        "answer": "<li>Vaccination induces an active immune response (humoral and/or cellular) to specific pathogens.</li>",
        "memoryTip": "Vaccination is like sending an RSVP to the immune system party; it gets everyone ready to dance!",
        "emoji": "🎉"
    },
    {
        "id": 190,
        "topic": "topic38",
        "question": "What is a live attenuated vaccine?",
        "answer": "<li>A live attenuated vaccine is a microorganism rendered nonpathogenic but retains the capacity for transient growth within the inoculated host.</li>",
        "memoryTip": "Live attenuated vaccines are like a friendly ghost; they’re harmless but still show up!",
        "emoji": "👻"
    },
    {
        "id": 191,
        "topic": "topic38",
        "question": "What are the pros of live attenuated vaccines?",
        "answer": "<li>Pros include inducing strong, often lifelong immunity and both cellular and humoral responses.</li>",
        "memoryTip": "Live vaccines are like a great concert; they leave you buzzing for a long time!",
        "emoji": "🎶"
    },
    {
        "id": 192,
        "topic": "topic38",
        "question": "What are the cons of live attenuated vaccines?",
        "answer": "<li>Cons include the risk of reverting to a virulent form and being contraindicated in pregnancy and patients with immunodeficiency.</li>",
        "memoryTip": "Live vaccines can be a bit wild; sometimes they need to be tamed!",
        "emoji": "🦁"
    },
    {
        "id": 193,
        "topic": "topic38",
        "question": "Give examples of live attenuated vaccines.",
        "answer": "<li>Examples include MMR, varicella, adenovirus, typhoid (Ty21a), polio (Sabin), BCG, yellow fever, and rotavirus.</li>",
        "memoryTip": "Live vaccines are like a party lineup; they bring the fun!",
        "emoji": "🎊"
    },
    {
        "id": 194,
        "topic": "topic38",
        "question": "What is a killed or inactivated vaccine?",
        "answer": "<li>A killed or inactivated vaccine is a pathogen that is inactivated by heat or chemicals, maintaining epitope structure for immune response.</li>",
        "memoryTip": "Killed vaccines are like a movie that’s been edited for safety; still entertaining but no real danger!",
        "emoji": "🎬"
    },
    {
        "id": 195,
        "topic": "topic38",
        "question": "What are the pros of killed or inactivated vaccines?",
        "answer": "<li>Pros include being safer than live vaccines.</li>",
        "memoryTip": "Killed vaccines are like a safety net; they keep you secure!",
        "emoji": "🛡️"
    },
    {
        "id": 196,
        "topic": "topic38",
        "question": "What are the cons of killed or inactivated vaccines?",
        "answer": "<li>Cons include a weaker cell-mediated immune response and the need for booster shots.</li>",
        "memoryTip": "Killed vaccines might need a little extra love to keep the immune party going!",
        "emoji": "💔"
    },
    {
        "id": 197,
        "topic": "topic38",
        "question": "Give examples of killed or inactivated vaccines.",
        "answer": "<li>Examples include Hepatitis A, Typhoid (Vi polysaccharide), Rabies, and Influenza (intramuscular).</li>",
        "memoryTip": "Killed vaccines are like classic reruns; they’re safe and familiar!",
        "emoji": "📺"
    },
    {
        "id": 198,
        "topic": "topic38",
        "question": "What are subunit, recombinant, polysaccharide, and conjugate vaccines?",
        "answer": "<li>These vaccines use specific antigens that best stimulate the immune system.</li>",
        "memoryTip": "These vaccines are like a tailored suit; they fit just right for the immune system!",
        "emoji": "👔"
    },
    {
        "id": 199,
        "topic": "topic38",
        "question": "What are the pros of subunit, recombinant, polysaccharide, and conjugate vaccines?",
        "answer": "<li>Pros include targeting specific epitopes of antigens and a lower chance of adverse reactions.</li>",
        "memoryTip": "These vaccines are like a precision tool; they get the job done without the mess!",
        "emoji": "🔧"
    },
    {
        "id": 200,
        "topic": "topic38",
        "question": "What are the cons of subunit, recombinant, polysaccharide, and conjugate vaccines?",
        "answer": "<li>Cons include being expensive and having a weaker immune response.</li>",
        "memoryTip": "These vaccines can be a bit pricey; they’re the luxury items of the immune world!",
        "emoji": "💸"
    },
    {
        "id": 201,
        "topic": "topic38",
        "question": "Give examples of subunit, recombinant, polysaccharide, and conjugate vaccines.",
        "answer": "<li>Examples include HBV (antigen = HBsAg), HPV, acellular pertussis, Neisseria meningitidis, and Streptococcus pneumoniae.</li>",
        "memoryTip": "These vaccines are like a buffet; they offer a little bit of everything!",
        "emoji": "🍽️"
    },
    {
        "id": 202,
        "topic": "topic38",
        "question": "What is a toxoid vaccine?",
        "answer": "<li>A toxoid vaccine is a denatured bacterial toxin that stimulates the immune system to make antibodies without causing disease.</li>",
        "memoryTip": "Toxoid vaccines are like a harmless prank; they get a reaction without any real harm!",
        "emoji": "🎭"
    },
    {
        "id": 203,
        "topic": "topic38",
        "question": "What are the pros of toxoid vaccines?",
        "answer": "<li>Pros include protecting against bacterial toxins.</li>",
        "memoryTip": "Toxoid vaccines are like a shield against nasty surprises!",
        "emoji": "🛡️"
    },
    {
        "id": 204,
        "topic": "topic38",
        "question": "What are the cons of toxoid vaccines?",
        "answer": "<li>Cons include decreasing antitoxin levels over time, necessitating booster shots.</li>",
        "memoryTip": "Toxoid vaccines need a little maintenance; they’re like a car that needs regular check-ups!",
        "emoji": "🚗"
    },
    {
        "id": 205,
        "topic": "topic38",
        "question": "Give examples of toxoid vaccines.",
        "answer": "<li>Examples include Clostridium tetani and Corynebacterium diphtheriae.</li>",
        "memoryTip": "Toxoid vaccines are like the classic hits of the immune system; they never go out of style!",
        "emoji": "🎤"
    },
    {
        "id": 206,
        "topic": "topic38",
        "question": "What is an mRNA vaccine?",
        "answer": "<li>An mRNA vaccine uses a lipid nanoparticle to deliver mRNA, causing cells to synthesize a foreign protein (e.g., spike protein of SARS-CoV-2).</li>",
        "memoryTip": "mRNA vaccines are like a recipe card; they tell your cells exactly what to cook up!",
        "emoji": "📜"
    },
    {
        "id": 207,
        "topic": "topic38",
        "question": "What are the pros of mRNA vaccines?",
        "answer": "<li>Pros include high efficacy and the induction of both cellular and humoral immunity, and they are safe in pregnancy.</li>",
        "memoryTip": "mRNA vaccines are like a high-tech gadget; they work smart and efficiently!",
        "emoji": "🤖"
    },
    {
        "id": 208,
        "topic": "topic38",
        "question": "What are the cons of mRNA vaccines?",
        "answer": "<li>Cons include local and transient systemic reactions (fatigue, headache, myalgia) and rare myocarditis or pericarditis, particularly in young males.</li>",
        "memoryTip": "mRNA vaccines can cause a little fuss; they’re like a toddler throwing a tantrum!",
        "emoji": "👶"
    },
    {
        "id": 209,
        "topic": "topic39",
        "question": "What are the four types of hypersensitivity?",
        "answer": "<li>The four types of hypersensitivity are: Type I (anaphylactic and atopic), Type II (antibody-mediated), Type III (immune complex), and Type IV (cell-mediated).</li>",
        "memoryTip": "Remember the four types like a party: Type I is the wild party (anaphylaxis), Type II is the drama (antibody-mediated), Type III is the messy aftermath (immune complex), and Type IV is the slow burn (cell-mediated).",
        "emoji": "🎉"
    },
    {
        "id": 210,
        "topic": "topic40",
        "question": "What are the two phases of Type I hypersensitivity?",
        "answer": "<li>The two phases of Type I hypersensitivity are the immediate phase and the late phase.</li>",
        "memoryTip": "Think of it as a two-part movie: the immediate phase is the action-packed opening, and the late phase is the dramatic aftermath!",
        "emoji": "🎬"
    },
    {
        "id": 211,
        "topic": "topic40",
        "question": "What occurs during the immediate phase of Type I hypersensitivity?",
        "answer": "<li>During the immediate phase, antigen crosslinks preformed IgE on presensitized mast cells, leading to immediate degranulation and release of histamine, tryptase, and leukotrienes.</li>",
        "memoryTip": "It's like a surprise party where the balloons (IgE) pop and confetti (histamine) flies everywhere!",
        "emoji": "🎈"
    },
    {
        "id": 212,
        "topic": "topic40",
        "question": "What mediators are released during the immediate phase of Type I hypersensitivity?",
        "answer": "<li>The mediators released include histamine, tryptase, and leukotrienes.</li>",
        "memoryTip": "Histamine is like the party crasher that causes all the chaos!",
        "emoji": "🎉"
    },
    {
        "id": 213,
        "topic": "topic40",
        "question": "What happens during the late phase of Type I hypersensitivity?",
        "answer": "<li>In the late phase, chemokines attract inflammatory cells, such as eosinophils, leading to inflammation and tissue damage.</li>",
        "memoryTip": "The late phase is like the cleanup crew coming in after the party, dealing with the mess!",
        "emoji": "🧹"
    },
    {
        "id": 214,
        "topic": "topic40",
        "question": "What tests are used to diagnose Type I hypersensitivity?",
        "answer": "<li>Skin tests or blood tests (ELISA) for allergen-specific IgE are used to diagnose Type I hypersensitivity.</li>",
        "memoryTip": "Think of it as a detective looking for the culprit IgE in the crime scene!",
        "emoji": "🕵️‍♂️"
    },
    {
        "id": 215,
        "topic": "topic40",
        "question": "What are some examples of Type I hypersensitivity?",
        "answer": "<li>Examples include anaphylaxis (food, drug, or bee sting allergies) and allergic asthma.</li>",
        "memoryTip": "Type I is like a surprise allergy party where food, drugs, and bees are the uninvited guests!",
        "emoji": "🍯"
    },
    {
        "id": 216,
        "topic": "topic41",
        "question": "What characterizes Type II hypersensitivity?",
        "answer": "<li>Type II hypersensitivity is characterized by antibodies binding to cell-surface antigens or extracellular matrix, leading to cellular destruction, inflammation, and cellular dysfunction.</li>",
        "memoryTip": "It's like a bad breakup where antibodies are throwing shade at the cell!",
        "emoji": "💔"
    },
    {
        "id": 217,
        "topic": "topic41",
        "question": "What are the mechanisms of cellular destruction in Type II hypersensitivity?",
        "answer": "<li>Cellular destruction occurs through opsonization leading to phagocytosis or activation of the complement system, and NK cell killing (antibody-dependent cellular cytotoxicity).</li>",
        "memoryTip": "Think of it as antibodies putting a \"kick me\" sign on the cell, inviting all the bullies (immune cells) to come and attack!",
        "emoji": "🥊"
    },
    {
        "id": 218,
        "topic": "topic41",
        "question": "How does inflammation occur in Type II hypersensitivity?",
        "answer": "<li>Inflammation occurs when antibodies bind to cell surfaces, activating the complement system and Fc receptor-mediated inflammation.</li>",
        "memoryTip": "It's like antibodies throwing a wild party on the cell surface, causing a ruckus!",
        "emoji": "🎊"
    },
    {
        "id": 219,
        "topic": "topic41",
        "question": "What is the Direct Coombs test used for?",
        "answer": "<li>The Direct Coombs test detects antibodies attached directly to the RBC surface.</li>",
        "memoryTip": "Think of it as a \"who's on my team\" check for red blood cells!",
        "emoji": "🩸"
    },
    {
        "id": 220,
        "topic": "topic41",
        "question": "What is the Indirect Coombs test used for?",
        "answer": "<li>The Indirect Coombs test detects the presence of unbound antibodies in the serum.</li>",
        "memoryTip": "It's like checking the guest list to see who might crash the party!",
        "emoji": "📋"
    },
    {
        "id": 221,
        "topic": "topic41",
        "question": "What are some examples of Type II hypersensitivity?",
        "answer": "<li>Examples include autoimmune hemolytic anemia, immune thrombocytopenia, transfusion reactions, and hemolytic disease of the newborn.</li>",
        "memoryTip": "Type II is like a drama club where everyone is fighting over the spotlight!",
        "emoji": "🎭"
    },
    {
        "id": 222,
        "topic": "topic42",
        "question": "What characterizes Type III hypersensitivity?",
        "answer": "<li>Type III hypersensitivity is characterized by immune complex formation (antigen-antibody complexes) that activate complement and attract neutrophils, leading to tissue damage.</li>",
        "memoryTip": "Imagine a three-way tug-of-war between antigens, antibodies, and complement, with neutrophils as the referees causing chaos!",
        "emoji": "🤼"
    },
    {
        "id": 223,
        "topic": "topic42",
        "question": "What are some examples of diseases associated with Type III hypersensitivity?",
        "answer": "<li>Examples include systemic lupus erythematosus (SLE), rheumatoid arthritis, reactive arthritis, polyarteritis nodosa, poststreptococcal glomerulonephritis, and IgA vasculitis.</li>",
        "memoryTip": "Type III is like a messy family reunion where everyone brings their baggage (immune complexes) and fights!",
        "emoji": "👪"
    },
    {
        "id": 224,
        "topic": "topic42",
        "question": "What is serum sickness?",
        "answer": "<li>Serum sickness is a prototypic immune complex disease where antibodies to foreign proteins are produced, leading to immune complex formation and tissue damage 1-2 weeks after exposure.</li>",
        "memoryTip": "It's like a delayed reaction to a bad gift that keeps on giving!",
        "emoji": "🎁"
    },
    {
        "id": 225,
        "topic": "topic42",
        "question": "What are the symptoms of serum sickness?",
        "answer": "<li>Symptoms include fever, urticaria, arthralgia, proteinuria, and lymphadenopathy occurring 1-2 weeks after antigen exposure.</li>",
        "memoryTip": "Think of it as a surprise party hangover that shows up late!",
        "emoji": "🍹"
    },
    {
        "id": 226,
        "topic": "topic42",
        "question": "What is the Arthus reaction?",
        "answer": "<li>The Arthus reaction is a local subacute immune complex-mediated hypersensitivity reaction that occurs after intradermal injection of antigen into a presensitized individual.</li>",
        "memoryTip": "It's like a surprise party favor that causes a local ruckus instead of joy!",
        "emoji": "🎁"
    },
    {
        "id": 227,
        "topic": "topic43",
        "question": "What are the two mechanisms involved in Type IV hypersensitivity?",
        "answer": "<li>The two mechanisms are direct cell cytotoxicity by CD8+ cytotoxic T cells and an inflammatory reaction by effector CD4+ T cells releasing cytokines.</li>",
        "memoryTip": "Think of it as a two-part heist: one team takes out the target, while the other causes a distraction!",
        "emoji": "🎭"
    },
    {
        "id": 228,
        "topic": "topic43",
        "question": "How does Type IV hypersensitivity differ from Types I, II, and III?",
        "answer": "<li>Type IV hypersensitivity does not involve antibodies, unlike Types I, II, and III.</li>",
        "memoryTip": "It's the rebel of hypersensitivities, going against the crowd without any antibodies!",
        "emoji": "🤘"
    },
    {
        "id": 229,
        "topic": "topic43",
        "question": "What are some examples of Type IV hypersensitivity?",
        "answer": "<li>Examples include contact dermatitis (e.g., poison ivy, nickel allergy), drug reaction with eosinophilia and systemic symptoms (DRESS), and graft-versus-host disease.</li>",
        "memoryTip": "Type IV is like a slow-burning fuse that eventually explodes, often from things you touch!",
        "emoji": "🔥"
    },
    {
        "id": 230,
        "topic": "topic43",
        "question": "What tests are used to diagnose Type IV hypersensitivity?",
        "answer": "<li>Tests include PPD for TB infection, patch test for contact dermatitis, and Candida skin test for T cell immune function.</li>",
        "memoryTip": "It's like a series of tests to see who can handle the heat of the immune response!",
        "emoji": "🔍"
    },
    {
        "id": 231,
        "topic": "topic43",
        "question": "What does the acronym \"4T's\" stand for in Type IV hypersensitivity?",
        "answer": "<li>The \"4T's\" stand for T cells, Transplant rejections, TB skin tests, and Touching (contact dermatitis).</li>",
        "memoryTip": "Remember the 4T's like a T-shirt that fits all the Type IV hypersensitivity styles!",
        "emoji": "👕"
    },
    {
        "id": 232,
        "topic": "topic44",
        "question": "What type of hypersensitivity reaction is an allergic/anaphylactic reaction in blood transfusions?",
        "answer": "<li>Type I hypersensitivity.</li>",
        "memoryTip": "Think of it as a \"Type I\" party where only the allergic guests show up!",
        "emoji": "🎉"
    },
    {
        "id": 233,
        "topic": "topic44",
        "question": "What is the pathogenesis of an allergic/anaphylactic reaction during blood transfusion?",
        "answer": "<li>It is a reaction against plasma proteins in transfused blood.</li>",
        "memoryTip": "Plasma proteins are like party crashers that some people just can't handle!",
        "emoji": "🚫"
    },
    {
        "id": 234,
        "topic": "topic44",
        "question": "Who should receive blood products without IgA to prevent allergic reactions?",
        "answer": "<li>IgA-deficient individuals.</li>",
        "memoryTip": "IgA-deficient folks are like people allergic to gluten at a bread festival!",
        "emoji": "🍞"
    },
    {
        "id": 235,
        "topic": "topic44",
        "question": "What is the timing for an allergic/anaphylactic reaction after a blood transfusion?",
        "answer": "<li>Within minutes to 2–3 hours.</li>",
        "memoryTip": "It’s like waiting for a pizza delivery that arrives way too fast!",
        "emoji": "🍕"
    },
    {
        "id": 236,
        "topic": "topic44",
        "question": "What are the clinical presentations of an allergic/anaphylactic reaction?",
        "answer": "<li>Allergies: urticaria, pruritus; Anaphylaxis: wheezing, hypotension, respiratory arrest, shock.</li>",
        "memoryTip": "Anaphylaxis is like a surprise party that goes horribly wrong!",
        "emoji": "🎈"
    },
    {
        "id": 237,
        "topic": "topic44",
        "question": "What type of hypersensitivity reaction is an acute hemolytic transfusion reaction?",
        "answer": "<li>Type II hypersensitivity.</li>",
        "memoryTip": "Type II is like a two-faced friend who causes trouble at parties!",
        "emoji": "😈"
    },
    {
        "id": 238,
        "topic": "topic44",
        "question": "What is the pathogenesis of an acute hemolytic transfusion reaction?",
        "answer": "<li>It typically causes intravascular hemolysis due to ABO blood group incompatibility.</li>",
        "memoryTip": "ABO incompatibility is like mixing oil and water at a cooking class!",
        "emoji": "🍳"
    },
    {
        "id": 239,
        "topic": "topic44",
        "question": "When does an acute hemolytic transfusion reaction typically occur?",
        "answer": "<li>During transfusion or within 24 hours.</li>",
        "memoryTip": "It’s like a bad date that goes south in less than a day!",
        "emoji": "💔"
    },
    {
        "id": 240,
        "topic": "topic44",
        "question": "What are the clinical presentations of an acute hemolytic transfusion reaction?",
        "answer": "<li>Fever, hypotension, tachypnea, tachycardia, flank pain, hemoglobinuria, jaundice.</li>",
        "memoryTip": "It’s like a rollercoaster of symptoms that no one wants to ride!",
        "emoji": "🎢"
    },
    {
        "id": 241,
        "topic": "topic44",
        "question": "What causes a febrile nonhemolytic transfusion reaction?",
        "answer": "<li>Cytokines created by donor WBCs accumulate during storage of blood products.</li>",
        "memoryTip": "Donor WBCs are like overzealous party planners who just can’t stop decorating!",
        "emoji": "🎊"
    },
    {
        "id": 242,
        "topic": "topic44",
        "question": "What is the timing for a febrile nonhemolytic transfusion reaction?",
        "answer": "<li>Within 1–6 hours.</li>",
        "memoryTip": "It’s like waiting for a surprise that takes just a little too long to arrive!",
        "emoji": "⏳"
    },
    {
        "id": 243,
        "topic": "topic44",
        "question": "What are the clinical presentations of a febrile nonhemolytic transfusion reaction?",
        "answer": "<li>Fever, headaches, chills, flushing.</li>",
        "memoryTip": "It’s like catching a cold at a summer picnic!",
        "emoji": "🌞"
    },
    {
        "id": 244,
        "topic": "topic44",
        "question": "What is the mechanism behind transfusion-related acute lung injury?",
        "answer": "<li>A two-hit mechanism involving sequestered neutrophils and activation by transfused blood products.</li>",
        "memoryTip": "It’s like a double whammy of bad luck at a game of chance!",
        "emoji": "🎲"
    },
    {
        "id": 245,
        "topic": "topic44",
        "question": "What is the timing for transfusion-related acute lung injury?",
        "answer": "<li>Within minutes to 6 hours.</li>",
        "memoryTip": "It’s like a surprise fire drill that happens way too soon!",
        "emoji": "🚨"
    },
    {
        "id": 246,
        "topic": "topic44",
        "question": "What are the clinical presentations of transfusion-related acute lung injury?",
        "answer": "<li>Respiratory distress, noncardiogenic pulmonary edema.</li>",
        "memoryTip": "It’s like trying to breathe underwater at a pool party!",
        "emoji": "🌊"
    },
    {
        "id": 247,
        "topic": "topic44",
        "question": "What is the pathogenesis of a delayed hemolytic transfusion reaction?",
        "answer": "<li>It is an anamnestic response to a foreign antigen on donor RBCs previously encountered by the recipient.</li>",
        "memoryTip": "It’s like a long-lost friend showing up at a reunion and causing drama!",
        "emoji": "👥"
    },
    {
        "id": 248,
        "topic": "topic44",
        "question": "When does a delayed hemolytic transfusion reaction typically present?",
        "answer": "<li>Usually presents within 1–2 weeks.</li>",
        "memoryTip": "It’s like waiting for a delayed flight that finally arrives!",
        "emoji": "✈️"
    },
    {
        "id": 249,
        "topic": "topic44",
        "question": "What are the clinical presentations of a delayed hemolytic transfusion reaction?",
        "answer": "<li>Mild fever, hyperbilirubinemia.</li>",
        "memoryTip": "It’s like a mild headache after a long day at work!",
        "emoji": "😌"
    },
    {
        "id": 250,
        "topic": "topic45",
        "question": "What autoantibody is associated with Myasthenia gravis?",
        "answer": "<li>Anti-postsynaptic ACh receptor.</li>",
        "memoryTip": "Myasthenia gravis is like a game of telephone gone wrong with ACh!",
        "emoji": "📞"
    },
    {
        "id": 251,
        "topic": "topic45",
        "question": "What autoantibody is associated with Lambert-Eaton myasthenic syndrome?",
        "answer": "<li>Anti-presynaptic voltage-gated Ca2+ channel.</li>",
        "memoryTip": "Lambert-Eaton is like a calcium channel that forgot how to party!",
        "emoji": "🔋"
    },
    {
        "id": 252,
        "topic": "topic45",
        "question": "What autoantibody is associated with Antiphospholipid syndrome?",
        "answer": "<li>Anti-β2 glycoprotein I.</li>",
        "memoryTip": "Antiphospholipid syndrome is like a slippery slope on a ski trip!",
        "emoji": "⛷️"
    },
    {
        "id": 253,
        "topic": "topic45",
        "question": "What is a nonspecific screening antibody often associated with SLE?",
        "answer": "<li>Antinuclear (ANA).</li>",
        "memoryTip": "ANA is like a detective looking for clues in a mystery novel!",
        "emoji": "🕵️‍♂️"
    },
    {
        "id": 254,
        "topic": "topic45",
        "question": "Which autoantibodies are associated with SLE?",
        "answer": "<li>Anticardiolipin, lupus anticoagulant, anti-dsDNA, anti-Smith.</li>",
        "memoryTip": "SLE is like a complicated love story with many twists and turns!",
        "emoji": "💔"
    },
    {
        "id": 255,
        "topic": "topic45",
        "question": "What autoantibody is associated with drug-induced lupus?",
        "answer": "<li>Antihistone.</li>",
        "memoryTip": "Drug-induced lupus is like a bad reaction to a new medication!",
        "emoji": "💊"
    },
    {
        "id": 256,
        "topic": "topic45",
        "question": "What autoantibody is associated with Mixed connective tissue disease?",
        "answer": "<li>Anti-U1 RNP (ribonucleoprotein).</li>",
        "memoryTip": "Mixed connective tissue disease is like a potluck where everyone brings something different!",
        "emoji": "🍲"
    },
    {
        "id": 257,
        "topic": "topic45",
        "question": "What autoantibody is associated with Rheumatoid arthritis?",
        "answer": "<li>Rheumatoid factor (IgM antibody against IgG Fc region), anti-cyclic citrullinated peptide (anti-CCP).</li>",
        "memoryTip": "Rheumatoid arthritis is like a brawl between antibodies at a family reunion!",
        "emoji": "👨‍👩‍👧‍👦"
    },
    {
        "id": 258,
        "topic": "topic45",
        "question": "What autoantibodies are associated with Sjögren syndrome?",
        "answer": "<li>Anti-Ro/SSA, anti-La/SSB.</li>",
        "memoryTip": "Sjögren syndrome is like a dry desert where no one can find water!",
        "emoji": "🏜️"
    },
    {
        "id": 259,
        "topic": "topic45",
        "question": "What autoantibody is associated with diffuse scleroderma?",
        "answer": "<li>Anti-Scl-70 (anti-DNA topoisomerase I).</li>",
        "memoryTip": "Diffuse scleroderma is like a tight hug that just won’t let go!",
        "emoji": "🤗"
    },
    {
        "id": 260,
        "topic": "topic45",
        "question": "What autoantibody is associated with limited scleroderma (CREST syndrome)?",
        "answer": "<li>Anticentromere.</li>",
        "memoryTip": "CREST syndrome is like a party with a strict guest list!",
        "emoji": "🎟️"
    },
    {
        "id": 261,
        "topic": "topic45",
        "question": "What autoantibodies are associated with Polymyositis and dermatomyositis?",
        "answer": "<li>Antisynthetase (e.g., anti-Jo-1), anti-SRP, anti-helicase (anti-Mi-2).</li>",
        "memoryTip": "Polymyositis is like a workout gone wrong with too many muscle strains!",
        "emoji": "💪"
    },
    {
        "id": 262,
        "topic": "topic45",
        "question": "What autoantibody is associated with primary biliary cholangitis?",
        "answer": "<li>Antimitochondrial.</li>",
        "memoryTip": "Primary biliary cholangitis is like a mitochondria party that gets shut down!",
        "emoji": "🔒"
    },
    {
        "id": 263,
        "topic": "topic45",
        "question": "What autoantibodies are associated with autoimmune hepatitis?",
        "answer": "<li>Anti-smooth muscle, anti-liver/kidney microsomal-1.</li>",
        "memoryTip": "Autoimmune hepatitis is like a liver that’s had too much to drink at a party!",
        "emoji": "🍻"
    },
    {
        "id": 264,
        "topic": "topic45",
        "question": "What autoantibody is associated with microscopic polyangiitis?",
        "answer": "<li>Myeloperoxidase-antineutrophil cytoplasmic antibody (MPO-ANCA)/perinuclear ANCA (p-ANCA).</li>",
        "memoryTip": "Microscopic polyangiitis is like a tiny storm that causes big problems!",
        "emoji": "🌩️"
    },
    {
        "id": 265,
        "topic": "topic45",
        "question": "What autoantibody is associated with granulomatosis with polyangiitis?",
        "answer": "<li>PR3-ANCA/cytoplasmic ANCA (c-ANCA).</li>",
        "memoryTip": "Granulomatosis is like a messy art project that gets out of hand!",
        "emoji": "🎨"
    },
    {
        "id": 266,
        "topic": "topic45",
        "question": "What autoantibody is associated with primary membranous nephropathy?",
        "answer": "<li>Anti-phospholipase A2 receptor.</li>",
        "memoryTip": "Primary membranous nephropathy is like a slippery slope on a water slide!",
        "emoji": "💦"
    },
    {
        "id": 267,
        "topic": "topic45",
        "question": "What autoantibody is associated with bullous pemphigoid?",
        "answer": "<li>Anti-hemidesmosome.</li>",
        "memoryTip": "Bullous pemphigoid is like a bubble that pops unexpectedly!",
        "emoji": "🧼"
    },
    {
        "id": 268,
        "topic": "topic45",
        "question": "What autoantibody is associated with pemphigus vulgaris?",
        "answer": "<li>Anti-desmoglein (anti-desmosome).</li>",
        "memoryTip": "Pemphigus vulgaris is like a game of tug-of-war with skin!",
        "emoji": "🪢"
    },
    {
        "id": 269,
        "topic": "topic45",
        "question": "What autoantibodies are associated with Hashimoto thyroiditis?",
        "answer": "<li>Antithyroglobulin, antithyroid peroxidase (antimicrosomal).</li>",
        "memoryTip": "Hashimoto thyroiditis is like a thyroid that’s gone on strike!",
        "emoji": "✊"
    },
    {
        "id": 270,
        "topic": "topic45",
        "question": "What autoantibody is associated with Graves disease?",
        "answer": "<li>Anti-TSH receptor.</li>",
        "memoryTip": "Graves disease is like a TSH receptor that just can’t say no!",
        "emoji": "🚫"
    },
    {
        "id": 271,
        "topic": "topic45",
        "question": "What autoantibodies are associated with celiac disease?",
        "answer": "<li>IgA anti-endomysial, IgA anti-tissue transglutaminase, IgA and IgG deamidated gliadin peptide.</li>",
        "memoryTip": "Celiac disease is like a gluten party that everyone is trying to avoid!",
        "emoji": "🍞"
    },
    {
        "id": 272,
        "topic": "topic45",
        "question": "What autoantibodies are associated with type 1 diabetes mellitus?",
        "answer": "<li>Anti-glutamic acid decarboxylase, islet cell cytoplasmic antibodies.</li>",
        "memoryTip": "Type 1 diabetes is like a sugar rush that crashes hard!",
        "emoji": "🍬"
    },
    {
        "id": 273,
        "topic": "topic45",
        "question": "What autoantibodies are associated with pernicious anemia?",
        "answer": "<li>Antiparietal cell, anti-intrinsic factor.</li>",
        "memoryTip": "Pernicious anemia is like a vitamin B12 party that no one can get into!",
        "emoji": "🚪"
    },
    {
        "id": 274,
        "topic": "topic45",
        "question": "What autoantibody is associated with Goodpasture syndrome?",
        "answer": "<li>Anti-glomerular basement membrane.</li>",
        "memoryTip": "Goodpasture syndrome is like a basement that’s flooded with antibodies!",
        "emoji": "🏠"
    },
    {
        "id": 275,
        "topic": "topic46",
        "question": "What are immunodeficiencies?",
        "answer": "<li>Immunodeficiencies are disorders that result in a weakened immune response, making individuals more susceptible to infections.</li>",
        "memoryTip": "Think of immunodeficiencies as a \"no entry\" sign for the immune system, keeping it from fighting off invaders!",
        "emoji": "🚫"
    },
    {
        "id": 276,
        "topic": "topic47",
        "question": "What is X-linked (Bruton) agammaglobulinemia?",
        "answer": "<li>It is a B-cell disorder caused by a defect in the BTK gene, leading to no B-cell maturation and is X-linked recessive.</li>",
        "memoryTip": "Bruton’s agammaglobulinemia is like a party without any guests—no B-cells means no antibodies!",
        "emoji": "🎉"
    },
    {
        "id": 277,
        "topic": "topic47",
        "question": "What are the clinical presentations of X-linked agammaglobulinemia?",
        "answer": "<li>Patients experience recurrent bacterial and enteroviral infections after 6 months due to the absence of maternal IgG.</li>",
        "memoryTip": "If you’re missing your mom’s hugs (IgG), you might catch a cold—literally!",
        "emoji": "🤒"
    },
    {
        "id": 278,
        "topic": "topic47",
        "question": "What laboratory findings are associated with X-linked agammaglobulinemia?",
        "answer": "<li>There are absent B cells in peripheral blood, absent immunoglobulins of all classes, and absent or scanty lymph nodes and tonsils.</li>",
        "memoryTip": "No B cells, no immunoglobulins—it's like a library with no books!",
        "emoji": "📚"
    },
    {
        "id": 279,
        "topic": "topic47",
        "question": "What is the significance of live vaccines in patients with X-linked agammaglobulinemia?",
        "answer": "<li>Live vaccines are contraindicated due to the lack of an adequate immune response.</li>",
        "memoryTip": "Live vaccines are like a surprise party for someone who can’t attend—no fun for them!",
        "emoji": "🎈"
    },
    {
        "id": 280,
        "topic": "topic47",
        "question": "What is selective IgA deficiency?",
        "answer": "<li>It is the most common primary immunodeficiency, often asymptomatic, with unknown causes.</li>",
        "memoryTip": "Selective IgA deficiency is like being picky at a buffet—only some things get through!",
        "emoji": "🍽️"
    },
    {
        "id": 281,
        "topic": "topic47",
        "question": "What are the potential complications of selective IgA deficiency?",
        "answer": "<li>Patients may experience airway and GI infections, autoimmune diseases, atopy, and anaphylaxis to IgA in blood products.</li>",
        "memoryTip": "IgA deficiency can lead to a buffet of problems—just not the tasty kind!",
        "emoji": "🍔"
    },
    {
        "id": 282,
        "topic": "topic47",
        "question": "What laboratory findings are associated with selective IgA deficiency?",
        "answer": "<li>There is low IgA with normal levels of IgG and IgM.</li>",
        "memoryTip": "It’s like having a sandwich with no bread—just not complete!",
        "emoji": "🥪"
    },
    {
        "id": 283,
        "topic": "topic47",
        "question": "How can selective IgA deficiency affect diagnostic tests?",
        "answer": "<li>It can cause false-negative celiac disease tests and false-positive serum pregnancy tests.</li>",
        "memoryTip": "Selective IgA deficiency is like a magician—making test results disappear!",
        "emoji": "🎩"
    },
    {
        "id": 284,
        "topic": "topic47",
        "question": "What is common variable immunodeficiency (CVID)?",
        "answer": "<li>It is characterized by a defect in B-cell differentiation, often diagnosed after puberty.</li>",
        "memoryTip": "CVID is like a late bloomer—takes time to show its true colors!",
        "emoji": "🌸"
    },
    {
        "id": 285,
        "topic": "topic47",
        "question": "What are the risks associated with common variable immunodeficiency?",
        "answer": "<li>Patients have an increased risk of autoimmune diseases, bronchiectasis, lymphoma, and sinopulmonary infections.</li>",
        "memoryTip": "CVID is like a game of Jenga—one wrong move and everything can come tumbling down!",
        "emoji": "🎲"
    },
    {
        "id": 286,
        "topic": "topic48",
        "question": "What is thymic aplasia?",
        "answer": "<li>It is caused by a 22q11 microdeletion, leading to absent thymus and parathyroids, associated with DiGeorge syndrome.</li>",
        "memoryTip": "Thymic aplasia is like a house with no roof—no protection from the elements!",
        "emoji": "🏠"
    },
    {
        "id": 287,
        "topic": "topic48",
        "question": "What are the clinical features of DiGeorge syndrome?",
        "answer": "<li>It includes thymic, parathyroid, and cardiac defects, along with recurrent infections.</li>",
        "memoryTip": "DiGeorge syndrome is like a three-legged stool—remove one leg, and it can’t stand!",
        "emoji": "🪑"
    },
    {
        "id": 288,
        "topic": "topic48",
        "question": "What does CATCH-22 stand for in DiGeorge syndrome?",
        "answer": "<li>CATCH-22 stands for Cardiac defects, Abnormal facies, Thymic hypoplasia, Cleft palate, and Hypocalcemia.</li>",
        "memoryTip": "CATCH-22 is like a game of tag—if you miss one, you can’t play!",
        "emoji": "🏷️"
    },
    {
        "id": 289,
        "topic": "topic48",
        "question": "What is the consequence of IL-12 receptor deficiency?",
        "answer": "<li>It leads to impaired Th1 response and increased susceptibility to mycobacterial and fungal infections.</li>",
        "memoryTip": "IL-12 deficiency is like a team without a captain—no one knows where to go!",
        "emoji": "🧭"
    },
    {
        "id": 290,
        "topic": "topic48",
        "question": "What is hyper-IgE syndrome (Job syndrome)?",
        "answer": "<li>It is characterized by a deficiency of Th17 cells due to a STAT3 mutation, leading to impaired neutrophil recruitment.</li>",
        "memoryTip": "Hyper-IgE syndrome is like a party where no one shows up to help clean up the mess!",
        "emoji": "🧹"
    },
    {
        "id": 291,
        "topic": "topic48",
        "question": "What are the classic symptoms of hyper-IgE syndrome?",
        "answer": "<li>Symptoms include cold staphylococcal abscesses, retained baby teeth, coarse facies, eczema, and bone fractures from minor trauma.</li>",
        "memoryTip": "Hyper-IgE syndrome is like a toddler’s tantrum—lots of fuss and not much help!",
        "emoji": "👶"
    },
    {
        "id": 292,
        "topic": "topic48",
        "question": "What is chronic mucocutaneous candidiasis?",
        "answer": "<li>It is a T-cell dysfunction leading to impaired immunity against Candida species, often caused by defects in AIRE.</li>",
        "memoryTip": "Chronic candidiasis is like a stubborn guest who just won’t leave the party!",
        "emoji": "🚪"
    },
    {
        "id": 293,
        "topic": "topic49",
        "question": "What is severe combined immunodeficiency (SCID)?",
        "answer": "<li>SCID is characterized by several types, including defective IL-2R gamma chain and adenosine deaminase deficiency, leading to a severely weakened immune system.</li>",
        "memoryTip": "SCID is like a superhero without powers—totally defenseless!",
        "emoji": "🦸"
    },
    {
        "id": 294,
        "topic": "topic49",
        "question": "What are the clinical presentations of SCID?",
        "answer": "<li>Patients may present with failure to thrive, chronic diarrhea, thrush, and recurrent infections.</li>",
        "memoryTip": "SCID is like a plant without water—struggling to survive!",
        "emoji": "🌱"
    },
    {
        "id": 295,
        "topic": "topic49",
        "question": "What laboratory findings are indicative of SCID?",
        "answer": "<li>Findings include absence of thymic shadow on CXR, germinal centers on lymph node biopsy, and T cells on flow cytometry.</li>",
        "memoryTip": "SCID is like a treasure hunt with no treasure—nothing to find!",
        "emoji": "🗺️"
    },
    {
        "id": 296,
        "topic": "topic49",
        "question": "What is ataxia-telangiectasia?",
        "answer": "<li>It is caused by defects in the ATM gene, leading to cerebellar defects, spider angiomas, and IgA deficiency.</li>",
        "memoryTip": "Ataxia-telangiectasia is like a rollercoaster ride—lots of ups and downs!",
        "emoji": "🎢"
    },
    {
        "id": 297,
        "topic": "topic49",
        "question": "What are the risks associated with ataxia-telangiectasia?",
        "answer": "<li>Patients have increased sensitivity to radiation and a higher risk of lymphoma and leukemia.</li>",
        "memoryTip": "Ataxia-telangiectasia is like playing with fire—better be careful!",
        "emoji": "🔥"
    },
    {
        "id": 298,
        "topic": "topic49",
        "question": "What is hyper-IgM syndrome?",
        "answer": "<li>It is most commonly due to defective CD40L on Th cells, leading to a class switching defect and increased susceptibility to infections.</li>",
        "memoryTip": "Hyper-IgM syndrome is like a party where everyone brings the same dish—no variety!",
        "emoji": "🍲"
    },
    {
        "id": 299,
        "topic": "topic49",
        "question": "What are the clinical features of Wiskott-Aldrich syndrome?",
        "answer": "<li>It includes thrombocytopenia, eczema, and recurrent pyogenic infections.</li>",
        "memoryTip": "Wiskott-Aldrich syndrome is like a three-part harmony—if one part is off, the whole song is a mess!",
        "emoji": "🎶"
    },
    {
        "id": 300,
        "topic": "topic49",
        "question": "What is leukocyte adhesion deficiency (type 1)?",
        "answer": "<li>It is an autosomal recessive defect in LFA-1 integrin, leading to impaired migration and chemotaxis of phagocytes.</li>",
        "memoryTip": "Leukocyte adhesion deficiency is like a traffic jam for white blood cells—no one can get through!",
        "emoji": "🚦"
    },
    {
        "id": 301,
        "topic": "topic49",
        "question": "What are the clinical features of Chédiak-Higashi syndrome?",
        "answer": "<li>It includes progressive neurodegeneration, lymphohistiocytosis, partial albinism, recurrent infections, and peripheral neuropathy.</li>",
        "memoryTip": "Chédiak-Higashi syndrome is like a mixed bag of candy—some sweet, some sour, and a little nutty!",
        "emoji": "🍬"
    },
    {
        "id": 302,
        "topic": "topic49",
        "question": "What is chronic granulomatous disease?",
        "answer": "<li>It is caused by a defect in NADPH oxidase, leading to decreased reactive oxygen species and increased susceptibility to catalase-positive organisms.</li>",
        "memoryTip": "Chronic granulomatous disease is like a superhero with a broken shield—vulnerable to attacks!",
        "emoji": "🛡️"
    },
    {
        "id": 303,
        "topic": "topic49",
        "question": "What are the laboratory findings in chronic granulomatous disease?",
        "answer": "<li>The abnormal dihydrorhodamine test shows decreased green fluorescence, indicating impaired oxidative burst.</li>",
        "memoryTip": "Chronic granulomatous disease is like a light bulb that just won’t turn on—no brightness!",
        "emoji": "💡"
    },
    {
        "id": 304,
        "topic": "topic50",
        "question": "What types of immune cells are involved in the immune response?",
        "answer": "<li>T cells, B cells, granulocytes, and complement.</li>",
        "memoryTip": "Think of immune cells as the \"T-B-G-C\" team, ready to tackle infections like a superhero squad!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 305,
        "topic": "topic50",
        "question": "What is the mnemonic to remember encapsulated bacteria?",
        "answer": "<li>SHINE my SKiS.</li>",
        "memoryTip": "Imagine shining your skin to remember the encapsulated bacteria—it's like a glow-up for your immune system!",
        "emoji": "✨"
    },
    {
        "id": 306,
        "topic": "topic50",
        "question": "Which bacteria are included in the SHINE my SKiS mnemonic?",
        "answer": "<li>Pseudomonas aeruginosa, Streptococcus pneumoniae, Haemophilus influenzae type b, Neisseria meningitidis, Escherichia coli, Salmonella, Klebsiella pneumoniae, and group B Streptococcus.</li>",
        "memoryTip": "If these bacteria were at a party, they'd be the ones shining the brightest—just like your skin after a good moisturizer!",
        "emoji": "🎉"
    },
    {
        "id": 307,
        "topic": "topic50",
        "question": "What type of infections do B-cell deficiencies typically produce?",
        "answer": "<li>Recurrent bacterial infections.</li>",
        "memoryTip": "B-cells are like the \"B\" in \"Bacteria,\" always on the lookout for trouble!",
        "emoji": "🦠"
    },
    {
        "id": 308,
        "topic": "topic50",
        "question": "What type of infections do T-cell deficiencies typically produce?",
        "answer": "<li>More fungal and viral infections.</li>",
        "memoryTip": "T-cells tackle \"Tough\" infections like fungi and viruses—think of them as the tough guys of the immune system!",
        "emoji": "💪"
    },
    {
        "id": 309,
        "topic": "topic51",
        "question": "What is the onset time for hyperacute transplant rejection?",
        "answer": "<li>Within minutes.</li>",
        "memoryTip": "Hyperacute rejection is like a bad date that ends before dessert—too quick to enjoy!",
        "emoji": "⏱️"
    },
    {
        "id": 310,
        "topic": "topic51",
        "question": "What causes hyperacute transplant rejection?",
        "answer": "<li>Pre-existing recipient antibodies react to donor antigen, activating complement.</li>",
        "memoryTip": "Think of it as a surprise party gone wrong—everyone shows up uninvited and chaos ensues!",
        "emoji": "🎈"
    },
    {
        "id": 311,
        "topic": "topic51",
        "question": "What are the features of hyperacute transplant rejection?",
        "answer": "<li>Widespread thrombosis of graft vessels, ischemia, and fibrinoid necrosis.</li>",
        "memoryTip": "Hyperacute rejection is like a traffic jam in your blood vessels—nobody's getting anywhere fast!",
        "emoji": "🚦"
    },
    {
        "id": 312,
        "topic": "topic51",
        "question": "What is the onset time for acute transplant rejection?",
        "answer": "<li>Weeks to months.</li>",
        "memoryTip": "Acute rejection is like a slow burn—takes time to heat up but can get intense!",
        "emoji": "🔥"
    },
    {
        "id": 313,
        "topic": "topic51",
        "question": "What immune cells are involved in acute transplant rejection?",
        "answer": "<li>CD8+ T cells and/or CD4+ T cells activated against donor MHCs.</li>",
        "memoryTip": "Think of CD8+ and CD4+ T cells as the \"CD\" in \"Cool Defenders\" against unwanted guests!",
        "emoji": "🎶"
    },
    {
        "id": 314,
        "topic": "topic51",
        "question": "What is the pathogenesis of acute transplant rejection?",
        "answer": "<li>It involves both cellular and humoral responses, with antibodies developing after transplant.</li>",
        "memoryTip": "Acute rejection is like a delayed reaction—first, you invite them, then you realize they’re not so great!",
        "emoji": "⏳"
    },
    {
        "id": 315,
        "topic": "topic51",
        "question": "What are the features of chronic transplant rejection?",
        "answer": "<li>Dominated by arteriosclerosis, with both cellular and humoral components.</li>",
        "memoryTip": "Chronic rejection is like a long-term relationship that slowly turns sour—starts off great, but then... not so much!",
        "emoji": "💔"
    },
    {
        "id": 316,
        "topic": "topic51",
        "question": "What is graft-versus-host disease (GVHD)?",
        "answer": "<li>Grafted immunocompetent T cells proliferate in the immunocompromised host and reject host cells with “foreign” proteins.</li>",
        "memoryTip": "GVHD is like a roommate who doesn’t get along with your friends—awkward and uncomfortable!",
        "emoji": "🏠"
    },
    {
        "id": 317,
        "topic": "topic51",
        "question": "What are the symptoms of graft-versus-host disease?",
        "answer": "<li>Maculopapular rash, jaundice, diarrhea, and hepatosplenomegaly.</li>",
        "memoryTip": "GVHD symptoms are like a bad case of the \"rashes\"—nobody wants to deal with that!",
        "emoji": "🤒"
    },
    {
        "id": 318,
        "topic": "topic51",
        "question": "How can you prevent graft-versus-host disease in immunocompromised patients?",
        "answer": "<li>Irradiate blood products prior to transfusion.</li>",
        "memoryTip": "Think of irradiating blood products as giving them a \"spa day\" to make them less likely to cause trouble!",
        "emoji": "🧖‍♀️"
    },
    {
        "id": 319,
        "topic": "topic52",
        "question": "What are immunosuppressants?",
        "answer": "<li>Agents that block lymphocyte activation and proliferation.</li>",
        "memoryTip": "Think of immunosuppressants as the \"bouncers\" at the lymphocyte club, keeping unwanted guests from getting in!",
        "emoji": "🚷"
    },
    {
        "id": 320,
        "topic": "topic52",
        "question": "How do immunosuppressants reduce acute transplant rejection?",
        "answer": "<li>By suppressing cellular immunity, they are used as prophylaxis.</li>",
        "memoryTip": "Immunosuppressants are like a security system for your new organ, keeping the immune system from throwing a party!",
        "emoji": "🎉"
    },
    {
        "id": 321,
        "topic": "topic52",
        "question": "What is a common strategy to enhance the efficacy of immunosuppressants?",
        "answer": "<li>They are frequently combined to achieve greater efficacy with reduced toxicity.</li>",
        "memoryTip": "Combining immunosuppressants is like making a smoothie; the more fruits (drugs) you add, the better the flavor (effect)!",
        "emoji": "🍹"
    },
    {
        "id": 322,
        "topic": "topic52",
        "question": "What are the risks associated with chronic immunosuppression?",
        "answer": "<li>It increases the risk of infection and malignancy.</li>",
        "memoryTip": "Chronic immunosuppression is like leaving your door unlocked; it invites unwanted guests (infections and cancers)!",
        "emoji": "🚪"
    },
    {
        "id": 323,
        "topic": "topic53",
        "question": "What is the role of calcineurin in immunosuppressants?",
        "answer": "<li>Calcineurin inhibitors block T-cell activation by preventing IL-2 transcription.</li>",
        "memoryTip": "Calcineurin is like a traffic light for T-cells; it turns red to stop them from activating!",
        "emoji": "🚦"
    },
    {
        "id": 324,
        "topic": "topic53",
        "question": "What is the mechanism of action of Cyclosporine?",
        "answer": "<li>It is a calcineurin inhibitor that binds cyclophilin and blocks T-cell activation.</li>",
        "memoryTip": "Cyclosporine is like a superhero that binds to the villain (cyclophilin) to stop T-cells from causing chaos!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 325,
        "topic": "topic53",
        "question": "What are the indications for Tacrolimus?",
        "answer": "<li>It is used for immunosuppression after solid organ transplant.</li>",
        "memoryTip": "Tacrolimus is like a VIP pass for your new organ, ensuring it gets the best protection!",
        "emoji": "🎟️"
    },
    {
        "id": 326,
        "topic": "topic53",
        "question": "What are the side effects of Tacrolimus?",
        "answer": "<li>It has a risk of diabetes and neurotoxicity but does not cause gingival hyperplasia or hirsutism.</li>",
        "memoryTip": "Tacrolimus is like a double-edged sword; it protects your organ but can also cause some unwanted side effects!",
        "emoji": "⚔️"
    },
    {
        "id": 327,
        "topic": "topic53",
        "question": "What is Sirolimus's mechanism of action?",
        "answer": "<li>It is an mTOR inhibitor that blocks T-cell activation and B-cell differentiation by preventing response to IL-2.</li>",
        "memoryTip": "Sirolimus is like a bouncer at a club, preventing T-cells from responding to the party invitation (IL-2)!",
        "emoji": "🚫"
    },
    {
        "id": 328,
        "topic": "topic53",
        "question": "What are the indications for Sirolimus?",
        "answer": "<li>It is used for kidney transplant rejection prophylaxis.</li>",
        "memoryTip": "Sirolimus is like a life jacket for your kidney, keeping it afloat during the transplant process!",
        "emoji": "🛟"
    },
    {
        "id": 329,
        "topic": "topic53",
        "question": "What is the mechanism of action of Azathioprine?",
        "answer": "<li>It is an antimetabolite that inhibits lymphocyte proliferation by blocking nucleotide synthesis.</li>",
        "memoryTip": "Azathioprine is like a gardener, pulling out weeds (lymphocytes) to help your garden (body) thrive!",
        "emoji": "🌱"
    },
    {
        "id": 330,
        "topic": "topic53",
        "question": "What are the side effects of Azathioprine?",
        "answer": "<li>It can cause pancytopenia.</li>",
        "memoryTip": "Azathioprine can make your blood count feel like a party with too few guests (pancytopenia)!",
        "emoji": "🎈"
    },
    {
        "id": 331,
        "topic": "topic53",
        "question": "What is the mechanism of action of Mycophenolate mofetil?",
        "answer": "<li>It reversibly inhibits IMP dehydrogenase, preventing purine synthesis of B and T cells.</li>",
        "memoryTip": "Mycophenolate is like a traffic cop, directing traffic away from purine synthesis to keep the peace!",
        "emoji": "🚔"
    },
    {
        "id": 332,
        "topic": "topic53",
        "question": "What are the side effects of Mycophenolate mofetil?",
        "answer": "<li>It can cause GI upset, pancytopenia, and hypertension.</li>",
        "memoryTip": "Mycophenolate can upset your stomach like a rollercoaster ride, but it keeps your immune system in check!",
        "emoji": "🎢"
    },
    {
        "id": 333,
        "topic": "topic54",
        "question": "What is the mechanism of action of glucocorticoids?",
        "answer": "<li>They inhibit NF-κB and suppress both B- and T-cell function by decreasing transcription of many cytokines.</li>",
        "memoryTip": "Glucocorticoids are like a librarian, keeping the immune system's noisy kids (B and T cells) quiet!",
        "emoji": "📚"
    },
    {
        "id": 334,
        "topic": "topic54",
        "question": "What are the indications for glucocorticoids?",
        "answer": "<li>They are used in many autoimmune and inflammatory disorders, adrenal insufficiency, asthma, CLL, and non-Hodgkin lymphoma.</li>",
        "memoryTip": "Glucocorticoids are like a Swiss Army knife, handy for many different medical situations!",
        "emoji": "🛠️"
    },
    {
        "id": 335,
        "topic": "topic54",
        "question": "What are the side effects of glucocorticoids?",
        "answer": "<li>They can cause Cushing syndrome, osteoporosis, hyperglycemia, diabetes, amenorrhea, adrenocortical atrophy, peptic ulcers, psychosis, cataracts, and avascular necrosis.</li>",
        "memoryTip": "Glucocorticoids can bring a whole bag of tricks, but some tricks can be scary (side effects)!",
        "emoji": "🎭"
    },
    {
        "id": 336,
        "topic": "topic55",
        "question": "What is the clinical use of Erythropoietin (EPO)?",
        "answer": "<li>It is used for anemias, especially in renal failure.</li>",
        "memoryTip": "EPO is like a cheerleader for your red blood cells, boosting their production when they need it most!",
        "emoji": "📣"
    },
    {
        "id": 337,
        "topic": "topic55",
        "question": "What are the side effects associated with Erythropoietin?",
        "answer": "<li>It is associated with an increased risk of hypertension and thromboembolic events.</li>",
        "memoryTip": "EPO can pump you up, but too much excitement can lead to high blood pressure!",
        "emoji": "💥"
    },
    {
        "id": 338,
        "topic": "topic55",
        "question": "What are the clinical uses of Filgrastim and Sargramostim?",
        "answer": "<li>They are used for leukopenia and recovery of granulocyte and monocyte counts.</li>",
        "memoryTip": "Filgrastim and Sargramostim are like personal trainers for your white blood cells, helping them get back in shape!",
        "emoji": "🏋️‍♂️"
    },
    {
        "id": 339,
        "topic": "topic55",
        "question": "What is the clinical use of Romiplostim and Eltrombopag?",
        "answer": "<li>They are used for autoimmune thrombocytopenia as platelet stimulators.</li>",
        "memoryTip": "Romiplostim and Eltrombopag are like pep talks for your platelets, getting them motivated to show up!",
        "emoji": "🗣️"
    },
    {
        "id": 340,
        "topic": "topic55",
        "question": "What are the clinical uses of Interleukin-2 (Aldesleukin)?",
        "answer": "<li>It is used for renal cell carcinoma and metastatic melanoma.</li>",
        "memoryTip": "Interleukin-2 is like a superhero calling in reinforcements to fight cancer!",
        "emoji": "🦸‍♀️"
    },
    {
        "id": 341,
        "topic": "topic55",
        "question": "What are the clinical uses of Interferons?",
        "answer": "<li>IFN-α is used for chronic hepatitis C and B, renal cell carcinoma; IFN-β is used for multiple sclerosis; IFN-γ is used for chronic granulomatous disease.</li>",
        "memoryTip": "Interferons are like the immune system's secret agents, tackling various diseases undercover!",
        "emoji": "🕵️‍♂️"
    }
];

const topics = {
    "topic1": "1. Immune System Organs",
    "topic2": "2. Lymph Node Structure and Function",
    "topic3": "3. Lymph Node Anatomy",
    "topic4": "4. Paracortex",
    "topic5": "5. Lymphatic Drainage Associations",
    "topic6": "6. Lymphatic Ducts",
    "topic7": "7. Lymphatic Drainage and Associated Pathologies",
    "topic8": "8. Immunology - Lymphoid Structures",
    "topic9": "9. Immunology - Thymus",
    "topic10": "10. Immunology - Cellular Components",
    "topic11": "11. Major Histocompatibility Complex (MHC)",
    "topic12": "12. MHC I Details",
    "topic13": "13. MHC II Details",
    "topic14": "14. Associated Proteins",
    "topic15": "15. HLA Subtypes and Associated Diseases",
    "topic16": "16. Functions of Natural Killer Cells",
    "topic17": "17. Major Functions of B and T Cells",
    "topic18": "18. Differentiation of T Cells",
    "topic19": "19. Macrophage-Lymphocyte Interaction",
    "topic20": "20. Cytotoxic T Cells",
    "topic21": "21. T- and B-Cell Activation",
    "topic22": "22. Immunology - Immune Responses: Antibody Structure and Function",
    "topic23": "23. Immunology - Immune Responses: Generation of Antibody Diversity",
    "topic24": "24. Immunology - Immune Responses: Immunoglobulin Isotypes",
    "topic25": "25. Immunology - Immune Responses: Antigen Types and Memory",
    "topic26": "26. Complement System",
    "topic27": "27. Activation Pathways",
    "topic28": "28. Functions of Complement Components",
    "topic29": "29. Opsonins and Inhibitors",
    "topic30": "30. Inflammation",
    "topic31": "31. Complement Disorders",
    "topic32": "32. Important Cytokines",
    "topic33": "33. Respiratory Burst",
    "topic34": "34. Interferons",
    "topic35": "35. Cell Surface Proteins",
    "topic36": "36. Anergy",
    "topic37": "37. Passive vs Active Immunity",
    "topic38": "38. Vaccination",
    "topic39": "39. Hypersensitivity Types",
    "topic40": "40. Type I Hypersensitivity",
    "topic41": "41. Type II Hypersensitivity",
    "topic42": "42. Type III Hypersensitivity",
    "topic43": "43. Type IV Hypersensitivity",
    "topic44": "44. Immunologic Blood Transfusion Reactions",
    "topic45": "45. Autoantibodies and Associated Disorders",
    "topic46": "46. Immunodeficiencies Overview",
    "topic47": "47. B-cell Disorders",
    "topic48": "48. T-cell Disorders",
    "topic49": "49. B- and T-cell Disorders",
    "topic50": "50. Immunodeficiency and Infections",
    "topic51": "51. Transplant Rejection",
    "topic52": "52. Immunosuppressants Overview",
    "topic53": "53. Mechanisms and Types of Immunosuppressants",
    "topic54": "54. Glucocorticoids",
    "topic55": "55. Recombinant Cytokines and Clinical Uses"
};












let filteredTopics = [];
let filterStage = null;
let reviewStages = {};
let completedFlashcards = [];
let currentDate = new Date();
const reviewStageColors = { 0: 'red', 1: 'pink', 2: 'blue', 3: 'green' };
let db;
let isStarFilterActive = false;
let isStarReadyFilterActive = false;
let currentFlashcardIndex = 0;
let isHorizontal = false;
let starMarked = {};

function toggleStar(starElement, flashcardId) {
        const isStarred = !starMarked[flashcardId]; // Toggle starred status
      starMarked[flashcardId] = isStarred; // Update local state


      // Update UI Immediately
        starElement.classList.toggle('fas', isStarred);
        starElement.classList.toggle('far', !isStarred);
       starElement.style.color = isStarred ? 'gold' : 'lightgray';
       updateStarredCount(); // Recalculate and update counts
    const transaction = db.transaction([storeName], 'readwrite');
    const store = transaction.objectStore(storeName);
    const request = store.get(flashcardId);

    request.onsuccess = (event) => {
        let data = event.target.result;

        if (data) {
            // Only update the starred field, keep review metrics unchanged
            data.starred = isStarred;
            store.put(data); // Save the updated data with starred status
        } else {
            // Add a new entry with only the starred field (no review metrics)
            store.put({
                id: flashcardId,
                starred: isStarred // Only starred field
            });
        }
    };

    request.onerror = (event) => {
        console.error('Error updating star status:', event.target.errorCode);
    };
}



function openDatabase() {
    const request = indexedDB.open(dbName, 1); // Ensure the version is correct

    request.onupgradeneeded = (event) => {
        db = event.target.result;
        if (!db.objectStoreNames.contains(storeName)) {
            const store = db.createObjectStore(storeName, { keyPath: 'id' });
            store.createIndex('reviewStage', 'reviewStage', { unique: false });
            store.createIndex('dueDate', 'dueDate', { unique: false });
            store.createIndex('starred', 'starred', { unique: false }); // Ensure 'starred' is defined
        }
    };

    request.onsuccess = (event) => {
        db = event.target.result;
        loadProgress(() => {
            updateTopicProgress();
            updateStarredCount();
            renderFlashcards();
        });
    };

    request.onerror = (event) => {
        console.error('Database error:', event.target.errorCode);
    };
}


function saveProgress(id, reviewStage = 0, dueDate = null, revealedTimestamp = null, starred = false) {
    const transaction = db.transaction([storeName], 'readwrite');
    const store = transaction.objectStore(storeName);

    const data = {
        id,
        reviewStage,
        dueDate,
        revealedTimestamp,
        starred // Include starred in the saved data
    };

    store.put(data); // Save both review metrics and starred status together
}



function loadProgress(callback) {
    const transaction = db.transaction([storeName], 'readonly');
    const store = transaction.objectStore(storeName);
    const request = store.getAll();

    request.onsuccess = (event) => {
        const progressData = event.target.result;

        progressData.forEach(progress => {
            if (progress.reviewStage !== undefined && progress.dueDate !== undefined) {
                // Only initialize reviewStages for flashcards with valid review metrics
                reviewStages[progress.id] = {
                    reviewStage: progress.reviewStage,
                    dueDate: progress.dueDate,
                    revealedTimestamp: progress.revealedTimestamp || null
                };
            }
            starMarked[progress.id] = progress.starred ?? false; // Initialize starred state
        });

        console.log('Progress loaded:', progressData);
        if (callback) callback();
    };

    request.onerror = (event) => {
        console.error('Load error:', event.target.errorCode);
    };
}




// Flashcard functions
function selectLayout(value) {
    if (value === 'horizontal') {
        switchToHorizontalLayout();
    } else {
        switchToVerticalLayout();
    }
    applyCurrentFilters();
}

function switchToHorizontalLayout() {
    isHorizontal = true;
    document.body.classList.add('horizontal-layout');
    document.body.classList.remove('vertical-layout');
    currentFlashcardIndex = 0;
    document.getElementById('horizontal-info').style.display = 'block';
    document.querySelector('.navigation-buttons').style.display = 'flex';
    applyCurrentFilters();
}

function switchToVerticalLayout() {
    isHorizontal = false;
    document.body.classList.add('vertical-layout');
    document.body.classList.remove('horizontal-layout');
    document.getElementById('horizontal-info').style.display = 'none';
    document.querySelector('.navigation-buttons').style.display = 'none';
    applyCurrentFilters();
}

function showFlashcard(index) {
    const flashcards = document.querySelectorAll('.modern-card');
    if (index < 0 || index >= flashcards.length) return;

    flashcards.forEach(flashcard => flashcard.style.display = 'none');

    const currentFlashcard = flashcards[index];
    const topic = currentFlashcard.dataset.topic;
    const topicFlashcards = Array.from(flashcards).filter(f => f.dataset.topic === topic);
    const currentPosition = topicFlashcards.indexOf(currentFlashcard) + 1;
    const totalInTopic = topicFlashcards.length;

    document.getElementById('horizontal-topic').textContent = topics[topic];
    document.getElementById('horizontal-position').textContent = `Flashcard ${currentPosition} of ${totalInTopic}`;

    currentFlashcard.style.display = 'block';

    document.getElementById('prev-btn').disabled = index === 0;
    document.getElementById('next-btn').disabled = index === flashcards.length - 1;
}

function navigateFlashcards(direction) {
    const flashcards = document.querySelectorAll('.modern-card');
    if (direction === 'next' && currentFlashcardIndex < flashcards.length - 1) {
        currentFlashcardIndex++;
    } else if (direction === 'prev' && currentFlashcardIndex > 0) {
        currentFlashcardIndex--;
    }
    showFlashcard(currentFlashcardIndex);
}

function updateTopicProgress() {
    const topicSelect = document.getElementById('topic-filter');
    topicSelect.innerHTML = '';

    const allOption = document.createElement('option');
    allOption.value = 'all';
    allOption.textContent = 'All Topics';
    topicSelect.appendChild(allOption);

    Object.keys(topics).forEach(topicKey => {
        const topicName = topics[topicKey];
        const totalFlashcards = flashcards.filter(card => card.topic === topicKey).length;
        const reviewedFlashcards = flashcards.filter(card => card.topic === topicKey && reviewStages[card.id]).length;

        const option = document.createElement('option');
        option.value = topicKey;

        if (reviewedFlashcards === totalFlashcards && totalFlashcards > 0) {
            option.textContent = `${topicName} 🔹(${reviewedFlashcards}/${totalFlashcards}) ✔️`;
        } else {
            option.textContent = `${topicName} 🔹(${reviewedFlashcards}/${totalFlashcards})`;
        }

        topicSelect.appendChild(option);
    });
}

function applySelectedTopics() {
    const topicSelect = document.getElementById('topic-filter');
    const selectedOptions = Array.from(topicSelect.selectedOptions);
    const selectedTopicValues = selectedOptions.map(option => option.value);

    if (selectedTopicValues.includes('all')) {
        filteredTopics = [];
    } else {
        filteredTopics = selectedTopicValues.filter(value => value !== 'all');
    }

    currentFlashcardIndex = 0;
    renderFlashcards();
}

function renderInitialFlashcards() {
    renderFlashcards(true); // Render only the first 50 cards initially
}


function loadRestOfFlashcardsInBackground() {
  // Use a timeout to defer the loading, ensuring the UI thread doesn't get blocked
  setTimeout(() => {
        renderFlashcards(false, true); // Load the rest of the flashcards in the background
  }, 0);
}



    function renderFlashcards(initialLoad = false, appendOnly = false) {
        const flashcardsContainer = document.getElementById('flashcards-container');
        const filterInfoContainer = document.getElementById('filter-info-container');

        if (appendOnly === false) {
            flashcardsContainer.innerHTML = '';
        }
        if (appendOnly === false) {
            filterInfoContainer.innerHTML = '';
        }
        const allTopicsSelected = filteredTopics.length === 0 || filteredTopics.length === Object.keys(topics).length;

        // Update topics and review stage info dynamically
        const selectedTopicsText = allTopicsSelected
            ? 'All Topics'
            : filteredTopics.slice(0, 2).map(topic => topics[topic] || 'All Topics').join(', ') +
            (filteredTopics.length > 2 ? ', <button id="showMoreBtn" onclick="showAllTopics()">More</button>' : '');

        let selectedFilterText = ''; // Dynamic filter text based on active filters

        if (isStarFilterActive) {
            selectedFilterText = `⭐ Showing: Star-marked flashcards of selected topics <br>
                <span style="font-size: 0.9em; color: gray;">(To Exit the Review stage, Click "Show All Flashcards" Button)</span>`;
        } else if (isStarReadyFilterActive) {
            selectedFilterText = `🌟 Showing: Star-marked Ready-for-review flashcards of selected topics <br>
                <span style="font-size: 0.9em; color: gray;">(To Exit the Review stage, Click "Show All Flashcards" Button)</span>`;
        } else if (filterStage !== null) {
            selectedFilterText = `
                Review Stage: ${getReviewStageLabel(filterStage)} <br>
                <span style="font-size: 0.9em; color: gray;">(To Exit the Review stage, Click "Show All Flashcards" Button)</span>`;
        } else {
            selectedFilterText = `Showing all flashcards of selected topics`;
        }

        // Create and display filter info only once for initial load or for all load
        if (appendOnly === false) {
            const filterInfo = document.createElement('div');
            filterInfo.className = 'filter-info';

            // Topics selected line
            const topicsLine = document.createElement('div');
            topicsLine.innerHTML = `<strong style="color: black;">Topics selected:</strong>  ${selectedTopicsText}`;
            filterInfo.appendChild(topicsLine);

            // Add an <hr> for separation
            const separator = document.createElement('hr');
            separator.style.border = '1px solid #ccc';
            separator.style.margin = '10px 0';
            filterInfo.appendChild(separator);

            // Review stage or filter line
            const filterLine = document.createElement('div');
            filterLine.innerHTML = selectedFilterText; // Use innerHTML to support HTML rendering
            filterInfo.appendChild(filterLine);

            filterInfoContainer.appendChild(filterInfo);
        }

        let currentTopic = null;
        let cardsLoaded = 0;
    const limit = initialLoad ? 50 : flashcards.length; // set a limit if its a initial load
        for (let i = 0; i < flashcards.length; i++) {
            if (cardsLoaded >= limit) break; // break out of the loop if the limit is reached

            const flashcard = flashcards[i];
             const reviewStageData = reviewStages[flashcard.id];
              const isStarred = starMarked[flashcard.id];
            const isDue = reviewStageData && new Date(reviewStageData.dueDate) <= currentDate;
            const isTopicMatch = filteredTopics.length === 0 || filteredTopics.includes(flashcard.topic);

            // Match against the "Starred" filter
            let isStarredMatch = isStarFilterActive ? isStarred : true;
           // Match against the "Starred Ready Review" filter
            let isReadyMatch = isStarReadyFilterActive ? (isStarred && isDue) : true;

            // Match against the stage filter
            let isStageMatch = filterStage === null || (reviewStageData?.reviewStage === filterStage && isDue);
             if (filterStage === 4) {
               isStageMatch = reviewStageData?.reviewStage === 4;
            }

            if (isTopicMatch && isStarredMatch && isStageMatch && isReadyMatch) {
                if (!isHorizontal && currentTopic !== flashcard.topic) {
                    currentTopic = flashcard.topic;
                    const topicHeader = document.createElement('div');
                    topicHeader.className = 'topic-header';
                    topicHeader.textContent = topics[flashcard.topic];
                   flashcardsContainer.appendChild(topicHeader);
                }
                 const isAnswerVisible = reviewStageData?.revealedTimestamp &&
                (new Date() - new Date(reviewStageData.revealedTimestamp)) < 24 * 60 * 60 * 1000;

                const memoryTip = flashcard.memoryTip || '';
                const emojiSymbol = flashcard.emoji || '✨';
                const emojiExplanation = flashcard.emojiExplanation || '';

                const card = document.createElement('div');
                card.className = 'modern-card';
                card.dataset.flashcardId = flashcard.id;
                card.dataset.topic = flashcard.topic;
                card.innerHTML = `
                    <div class="question">${flashcard.question}</div>
                    <div class="answer" style="display: ${isAnswerVisible ? 'block' : 'none'}">
                        ${flashcard.answer}
                        <br>
                        <hr style="border: 1px solid black; margin: 10px 0;">
                        <em><strong>Memory Tip:</strong> ${memoryTip}</em>
                         <br><br>
                        <span class="emoji">${emojiSymbol}</span>
                    </div>
                    <div class="review-metric"></div>
                    <div class="buttons">
                       <button class="dont-know-btn" onclick="handleReviewClick(${flashcard.id}, false)">Don't Know</button>
                     <i class="${isStarred ? 'fas' : 'far'} fa-star star-btn"
                            style="color: ${isStarred ? 'gold' : 'lightgray'};"
                             onclick="toggleStar(this, ${flashcard.id})"></i>
                       <button class="know-btn" onclick="handleReviewClick(${flashcard.id}, true)" ondblclick="handleInactiveKnowClick(event)">Know</button>
                     </div>
                    <i class="fas fa-bookmark bookmark" onclick="toggleDropdown(event, 'bookmarkDropdown')"></i>
                    `;
                flashcardsContainer.appendChild(card);
                cardsLoaded++;
           }
       }
        applyReviewMetrics();
        updatePendingCounts();

        if (isHorizontal) {
             showFlashcard(currentFlashcardIndex);
         }
        attachBookmarkListeners();
     }


function showAllTopics() {
    const showMoreBtn = document.getElementById('showMoreBtn');
    const topicsLine = showMoreBtn.parentElement;
    const allTopicsText = filteredTopics.map(topic => topics[topic] || 'All Topics').join(', ');
    topicsLine.innerHTML = `<strong style="color: black;">Topics selected:</strong>  ${allTopicsText} <button id="hideMoreBtn" onclick="hideAllTopics()">Hide</button>`;
}

function hideAllTopics() {
    const hideMoreBtn = document.getElementById('hideMoreBtn');
    const topicsLine = hideMoreBtn.parentElement;
    const selectedTopicsText = filteredTopics.slice(0, 2).map(topic => topics[topic] || 'All Topics').join(', ') +
          (filteredTopics.length > 2 ? ', <button id="showMoreBtn" onclick="showAllTopics()">More</button>' : '');
    topicsLine.innerHTML = `<strong style="color: black;">Topics selected:</strong>  ${selectedTopicsText}`;
}



function showStarredFlashcards() {
    // Set the filter for starred flashcards to active and reset others
    isStarFilterActive = true;
    isStarReadyFilterActive = false; // Disable "Ready for Review" filter
    filterStage = null; // Reset the review stage filter

    renderFlashcards(); // Re-render flashcards based on updated filters
    updateStarredCount(); // Update the count of starred flashcards
}



function showStarredReadyFlashcards() {
    // Set the filter for starred and ready-to-review flashcards to active and reset others
    isStarReadyFilterActive = true;
    isStarFilterActive = false; // Disable the "Starred" filter
    filterStage = null; // Reset the review stage filter

    renderFlashcards(); // Re-render flashcards based on updated filters
    updateStarredCount(); // Update the count of starred ready-to-review flashcards
}



function attachBookmarkListeners() {
    const bookmarks = document.querySelectorAll('.bookmark');
    bookmarks.forEach(bookmark => {
        bookmark.addEventListener('click', (event) => {
            toggleDropdown(event, 'bookmarkDropdown');
        });
    });
}

function filterFlashcards(stage) {
    filterStage = stage;
    isStarFilterActive = false;
    isStarReadyFilterActive = false;
    currentFlashcardIndex = 0;
    renderFlashcards();
}

function showAllFlashcards() {
    if (filteredTopics.length === 0) {
        const topicSelect = document.getElementById('topic-filter');
        const selectedOptions = Array.from(topicSelect.selectedOptions);
        filteredTopics = selectedOptions.map(option => option.value).filter(value => value !== 'all');
    }
    filterStage = null;
    isStarFilterActive = false;
    isStarReadyFilterActive = false;
    currentFlashcardIndex = 0;
    renderFlashcards();
}

function applyReviewMetrics() {
    document.querySelectorAll('.modern-card').forEach(card => {
        const flashcardId = parseInt(card.dataset.flashcardId);
        const reviewMetric = card.querySelector('.review-metric');
        const bookmark = card.querySelector('.bookmark');
        const knowButton = card.querySelector('.know-btn');

        if (reviewStages[flashcardId]) {
            const { reviewStage, dueDate } = reviewStages[flashcardId];
            reviewMetric.dataset.reviewStage = reviewStage;
            reviewMetric.dataset.dueDate = dueDate;

            const timeRemaining = (new Date(dueDate).getTime() - currentDate.getTime()) / (1000 * 60 * 60 * 24);

            if (reviewStage === 4) {
                reviewMetric.textContent = '🏆 Final Review: Completed';
                reviewMetric.style.color = 'gold';
                bookmark.style.color = 'gold';
                card.style.borderColor = 'gold';
                knowButton.disabled = true;
                knowButton.style.backgroundColor = 'gray';
            } else if (timeRemaining <= 0) {
                reviewMetric.textContent = '🔔 Ready for Review';
                reviewMetric.style.color = '#388e3c';
                knowButton.disabled = false;
                knowButton.style.backgroundColor = '#388e3c';
                bookmark.style.color = reviewStageColors[reviewStage];
                card.style.borderColor = reviewStageColors[reviewStage];
            } else {
                const stageColor = reviewStageColors[reviewStage];
                reviewMetric.textContent = `${getReviewText(reviewStage, dueDate)}`;
                reviewMetric.style.color = stageColor;
                bookmark.style.color = stageColor;
                card.style.borderColor = stageColor;
                knowButton.disabled = true;
                knowButton.style.backgroundColor = 'gray';
            }
        } else {
            bookmark.style.color = '';
            card.style.borderColor = '';
            reviewMetric.textContent = '';
        }
    });
}


  function handleReviewClick(flashcardId, isKnow) {
    const flashcard = document.querySelector(`[data-flashcard-id="${flashcardId}"]`);
    const answer = flashcard.querySelector('.answer');
        answer.style.display = 'block';


    let reviewStage = reviewStages[flashcardId]?.reviewStage || 0;
    const dueDate = new Date(currentDate);
          const revealedTimestamp = new Date().toISOString();
        const isStarred = starMarked[flashcardId] || false;

         if (isKnow) {
        reviewStage = getNextStage(reviewStage, dueDate); // Move to next stage
    } else {
        reviewStage = 0;
            dueDate.setDate(dueDate.getDate() + 3); // Set the review in 3 days
        }
        reviewStages[flashcardId] = { reviewStage, dueDate: dueDate.toISOString(), revealedTimestamp };
         saveProgress(flashcardId, reviewStage, dueDate.toISOString(), revealedTimestamp, isStarred); // Save starred state with review metrics

          applyReviewMetrics();
        updatePendingCounts();
        updateTopicProgress();
       }


function getNextStage(reviewStage, dueDate) {
    if (reviewStage === 0) {
        dueDate.setDate(dueDate.getDate() + 7);
        return 1;
    } else if (reviewStage === 1) {
        dueDate.setDate(dueDate.getDate() + 14);
        return 2;
    } else if (reviewStage === 2) {
        dueDate.setDate(dueDate.getDate() + 28);
        return 3;
    }
    return 4;
}

function getReviewText(reviewStage, dueDate) {
    const timeRemaining = (new Date(dueDate) - currentDate) / (1000 * 60 * 60 * 24);
    return `${["First Review", "Second Review", "Third Review", "Final Review"][reviewStage]} in ${Math.ceil(timeRemaining)} days`;
}

function getReviewStageLabel(stage) {
    const labels = ["First Review", "Second Review", "Third Review", "Final Review"];
    return labels[stage] || " 🏆 Completed Flashcards List";
}

function updatePendingCounts() {
    const counts = [0, 0, 0, 0, 0];
    flashcards.forEach(flashcard => {
        const flashcardData = reviewStages[flashcard.id];
        if (flashcardData) {
            if (flashcardData.reviewStage < 4 && new Date(flashcardData.dueDate) <= currentDate) {
                counts[flashcardData.reviewStage]++;
            } else if (flashcardData.reviewStage === 4) {
                counts[4]++;
            }
        }
    });
    counts.forEach((count, index) => {
        if (index < 4) {
            document.getElementById(`count-stage-${index}`).textContent = `${count} pending`;
        } else {
            document.getElementById('count-completed').textContent = `${count} completed`;
        }
    });
}

function simulateDateTimeChange() {
    const dateInput = document.getElementById('current-date').value;
    const timeInput = document.getElementById('current-time').value;

    if (dateInput && timeInput) {
        currentDate = new Date(`${dateInput}T${timeInput}:00`);
    } else {
        currentDate = new Date();
    }
    refreshFlashcards();
}

function refreshFlashcards() {
    applyReviewMetrics();
    updatePendingCounts();
}

function applyCurrentFilters() {
    if (filterStage !== null) {
        filterFlashcards(filterStage);
    } else {
        renderFlashcards();
    }

    if (isHorizontal) {
        currentFlashcardIndex = 0;
        showFlashcard(currentFlashcardIndex);
    }
}


// Handle inactive "Know" button click to show dropdown
function handleInactiveKnowClick(event) {
    if (event.target.disabled) {
        toggleDropdownBelowButton(event, 'inactiveKnowDropdown');
    }
}

// Function to toggle dropdown visibility below the button
function toggleDropdownBelowButton(event, dropdownId) {
    event.stopPropagation();

    const dropdown = document.getElementById(dropdownId);
    const isVisible = dropdown.style.display === "block";

    if (isVisible) {
        dropdown.style.display = "none";
        return;
    }

    const dropdowns = document.querySelectorAll('.dropdown');
    dropdowns.forEach(d => {
        d.style.display = 'none';
    });

    dropdown.style.display = "block";
    dropdown.style.position = "absolute";

    const rect = event.target.getBoundingClientRect();
    dropdown.style.top = `${rect.bottom + window.scrollY}px`;
    dropdown.style.left = "50%";
    dropdown.style.transform = "translateX(-50%)";
    dropdown.style.maxWidth = "90vw";
}

// Close dropdown when clicking outside of it
window.addEventListener('click', function (event) {
    const dropdown = document.getElementById('inactiveKnowDropdown');
    if (dropdown && dropdown.style.display === "block" && !dropdown.contains(event.target)) {
        dropdown.style.display = "none";
    }
});

// Optional: Close dropdown function for specific dropdowns
function closeDropdown(dropdownId) {
    const dropdown = document.getElementById(dropdownId);
    if (dropdown) {
        dropdown.style.display = "none";
    }
}


function updateStarredCount() {

    const totalStarredCount = flashcards.filter(flashcard => starMarked[flashcard.id]).length;
    const totalStarredReadyCount = flashcards.filter(flashcard => {
          const reviewStageData = reviewStages[flashcard.id];
          const isDue = reviewStageData && new Date(reviewStageData.dueDate) <= currentDate;
        return starMarked[flashcard.id] && isDue;
        }).length;
        const count = flashcards.filter(flashcard => {
             const isTopicMatch = filteredTopics.length === 0 || filteredTopics.includes(flashcard.topic);
             return isTopicMatch && starMarked[flashcard.id]
         }).length;

        const countReady = flashcards.filter(flashcard => {
             const isTopicMatch = filteredTopics.length === 0 || filteredTopics.includes(flashcard.topic);
                const reviewStageData = reviewStages[flashcard.id];
                const isDue = reviewStageData && new Date(reviewStageData.dueDate) <= currentDate;
                return isTopicMatch &&  starMarked[flashcard.id] && isDue;
           }).length;
    const starFilterBtn = document.querySelector('.filter-btn[onclick="showStarredFlashcards()"]');
    if (starFilterBtn) {
        starFilterBtn.innerHTML = `Starred Flashcards <br> ⭐  <span id="count-starred" class="badge">${totalStarredCount} marked</span>`;
    }
    const starReadyFilterBtn = document.querySelector('.filter-btn[onclick="showStarredReadyFlashcards()"]');
    if (starReadyFilterBtn) {
        starReadyFilterBtn.innerHTML = ` Starred Ready for Review <br> 🌟 <span id="count-starred-ready" class="badge">${totalStarredReadyCount} pending</span>`
      }
}


function attachBookmarkListeners() {
    const cards = document.querySelectorAll('.modern-card');
       cards.forEach(card =>{
         card.addEventListener('click', function(event){
            const bookmark = event.target.closest('.bookmark');
             if(bookmark){
                toggleDropdown1(event, 'bookmarkDropdown1')
              }

        });
    });

}


// Toggle dropdown near the clicked bookmark icon, centered horizontally in the viewport
function toggleDropdown1(event, dropdownId) {
    event.stopPropagation();

    const dropdown = document.getElementById(dropdownId);
  const computedStyle = window.getComputedStyle(dropdown);
    const isVisible = computedStyle.display === "block";


    if (isVisible) {
        dropdown.style.display = "none";
        return;
    }

    dropdown.style.display = "block";
    dropdown.style.position = "absolute";

    const rect = event.target.getBoundingClientRect();

    dropdown.style.top = `${rect.bottom + window.scrollY}px`;
    dropdown.style.left = "50%";
    dropdown.style.transform = "translateX(-50%)";
    dropdown.style.maxWidth = "90vw";
}


// Close dropdown when clicking outside of it
window.addEventListener('click', function (event) {
    const dropdown = document.getElementById('bookmarkDropdown1');
   const bookmark = event.target.closest('.bookmark');
   if (dropdown && dropdown.style.display === "block" && !bookmark && !dropdown.contains(event.target)) {
        dropdown.style.display = "none";
    }
});

// Close dropdown manually
function closeDropdown(dropdownId) {
    const dropdown = document.getElementById(dropdownId);
    if (dropdown) {
        dropdown.style.display = "none";
    }
}


</script>



<script>
// Function to Toggle the Dropdown Below the Button
function toggleDropdownContent(event) {
    event.stopPropagation();  // Prevent immediate closing due to outside click listener

    const dropdown = document.getElementById('dropdownContent');
    const isVisible = dropdown.style.display === "block";

    // Hide dropdown if already visible
    if (isVisible) {
        dropdown.style.display = "none";
        return;
    }

    // Hide any other open dropdowns
    const dropdowns = document.querySelectorAll('.dropdown');
    dropdowns.forEach(d => {
        d.style.display = 'none';
    });

       // Show and position dropdown
    dropdown.style.display = "block";
    dropdown.style.position = "absolute";

    const rect = event.target.getBoundingClientRect();

    // Set top position just below the clicked bookmark icon
    dropdown.style.top = `${rect.bottom + window.scrollY}px`;

    // Center horizontally in the viewport, using transform for responsive centering
    dropdown.style.left = "50%";
    dropdown.style.transform = "translateX(-50%)";  // Center align horizontally

    // Optional: Set max width for small screens
    dropdown.style.maxWidth = "90vw";  // Allow dropdown to adjust within viewport
}

// Close dropdown when clicking outside of it
window.addEventListener('click', function(event) {
    const dropdown = document.getElementById('dropdownContent');
    const toggleButton = document.getElementById('toggleButton'); // Assuming the button to open dropdown has ID "toggleButton"

    // Close dropdown if clicked outside of it and not on the toggle button
    if (dropdown && dropdown.style.display === "block" &&
        !dropdown.contains(event.target) &&
        event.target !== toggleButton) {
        dropdown.style.display = "none";
    }
});

// Function to Close Dropdown Explicitly
function closeDropdown(dropdownId) {
    const dropdown = document.getElementById(dropdownId);
    if (dropdown) {
        dropdown.style.display = "none";
    }
}


</script>

 <script>
         function openModal(modalId) {
            document.getElementById(modalId).style.display = "block";
        }

        function closeModal(modalId) {
            document.getElementById(modalId).style.display = "none";
        }

         function zoomImage(modalId, zoomFactor) {
             var image = document.getElementById(modalId).querySelector('.modal-content97');
            if (image) {
                var currentWidth = image.clientWidth;
                image.style.width = (currentWidth * zoomFactor) + 'px';
            } else {
                console.error('Zoom image not found for modal:', modalId);
             }
         }


        function openPopup(popupId) {
             document.getElementById(popupId).style.display = "block";
         }

         function closePopup(popupId) {
            document.getElementById(popupId).style.display = "none";
         }

    </script>



<!-- Include the rest of your JavaScript here -->

</body>
</html>