/* Added styles for responsive math equations */
.mjx-chtml {
    display: inline-block;
    line-height: 0;
    text-indent: 0;
    text-align: left;
    text-transform: none;
    font-style: normal;
    font-weight: normal;
    font-size: 100%;
    font-size-adjust: none;
    letter-spacing: normal;
    word-wrap: normal;
    word-spacing: normal;
    white-space: nowrap;
    float: none;
    direction: ltr;
    max-width: 100%;
    max-height: none;
    min-width: 0;
    min-height: 0;
    border: 0;
    margin: 0;
    padding: 1px 0;
    overflow-x: auto;
    overflow-y: hidden;
}

/* Make math equations scroll horizontally on small screens if needed */
.mjx-math {
    display: inline-block;
    overflow-x: auto;
    max-width: 100%;
}

/* Adjust font size for math on small screens */
@media (max-width: 480px) {
    .mjx-chtml {
        font-size: 90% !important;
    }
    
    /* Allow horizontal scrolling for complex equations */
    .question, .option, .explanation {
        overflow-x: auto;
    }
    
    /* Ensure proper line breaks for math content */
    .mjx-container {
        overflow-x: auto;
        overflow-y: hidden;
        max-width: 100%;
    }
}