/* ================================================
   GLOBAL IMAGE STYLES FOR EXAM MODULES
   ================================================
   Standardized image sizing for:
   - Optional question images (thumbnails)
   - Quill editor inserted images (inline)
   ================================================ */

/* === OPTIONAL QUESTION IMAGES (Thumbnail) === */
.question-img-thumbnail {
    width: 250px;
    height: 250px;
    object-fit: cover;
    border-radius: 0.75rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    cursor: zoom-in;
    transition: transform 0.2s, box-shadow 0.3s;
    display: block;
}

.question-img-thumbnail:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.15);
}

/* Mobile - full width dengan max height */
@media (max-width: 640px) {
    .question-img-thumbnail {
        width: 100%;
        height: auto;
        max-height: 200px;
        object-fit: contain;
    }
}

/* === QUILL EDITOR IMAGES (Inline in content) === */
.question-content img,
.option-text img,
.prose img,
.q-content img,
.rich-text img {
    max-width: 400px !important;
    height: auto !important;
    border-radius: 0.5rem;
    margin: 0.5rem 0;
    display: inline-block;
    vertical-align: middle;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Mobile - full width for Quill images */
@media (max-width: 640px) {
    .question-content img,
    .option-text img,
    .prose img,
    .q-content img,
    .rich-text img {
        max-width: 100% !important;
    }
}

/* Prevent images from being too small */
.question-content img,
.option-text img,
.prose img,
.q-content img,
.rich-text img {
    min-width: 100px;
}

/* Special handling for images in table cells (True/False questions) */
.tf-table img {
    max-width: 300px !important;
    height: auto !important;
}

@media (max-width: 640px) {
    .tf-table img {
        max-width: 150px !important;
    }
}