/* =========================================================
   EduPro v28 - Final material viewer fixes
   Loaded after all theme/final CSS so viewer rules are stable.
========================================================= */
.edupro-material-viewer-overlay,
.edupro-material-viewer-overlay *,
.edupro-material-viewer-overlay *::before,
.edupro-material-viewer-overlay *::after {
    box-sizing: border-box;
}

/* Header nền tối: toàn bộ chữ/icon zoom và nút đóng luôn màu trắng. */
.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-actions,
.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-zoom-controls button,
.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-zoom-controls button *,
.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-close,
.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-close * {
    color: #fff !important;
}

.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-zoom-controls {
    border-color: rgba(255, 255, 255, .20) !important;
    background: rgba(255, 255, 255, .07) !important;
    box-shadow: none !important;
}

.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-zoom-controls button {
    background: rgba(255, 255, 255, .08) !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-zoom-controls [data-material-zoom-reset] {
    background: rgba(255, 255, 255, .14) !important;
}

.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-zoom-controls button:hover:not(:disabled),
.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-close:hover {
    background: rgba(255, 255, 255, .18) !important;
    color: #fff !important;
}

.edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-zoom-controls button:disabled {
    color: rgba(255, 255, 255, .48) !important;
    opacity: 1 !important;
}

/* Khung gốc luôn lấy đúng content width, không cộng dồn padding/width cũ. */
.edupro-material-viewer-overlay .edupro-material-viewer-body,
.edupro-material-viewer-overlay .edupro-material-viewer-body > .edupro-material-viewer-zoomable,
.edupro-material-viewer-overlay .edupro-material-viewer-scale-inner {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.edupro-material-viewer-overlay .edupro-material-viewer-body {
    max-width: 100% !important;
    min-height: 0 !important;
}

/* Khi về 100% phải xóa hoàn toàn kích thước/transform còn sót từ lần zoom trước. */
.edupro-material-viewer-overlay:not(.is-material-zoomed) .edupro-material-viewer-zoomable,
.edupro-material-viewer-overlay:not(.is-material-zoomed) .edupro-material-viewer-scale-inner {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
    transform-origin: 0 0 !important;
    zoom: 1 !important;
}

/* Desktop: modal dùng grid sẵn có, phần tài liệu chỉ chiếm đúng hàng content. */
@media (min-width: 769px) {
    .edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-body,
    .edupro-material-viewer-overlay.is-student-full-window:not(.is-material-zoomed) .edupro-material-viewer-zoomable,
    .edupro-material-viewer-overlay.is-student-full-window:not(.is-material-zoomed) .edupro-material-viewer-scale-inner {
        height: 100% !important;
        min-height: 0 !important;
    }

    .edupro-material-viewer-overlay.is-student-full-window .edupro-material-viewer-body {
        overflow: auto !important;
    }

    .edupro-material-viewer-overlay.is-student-full-window:not(.is-material-zoomed) .edupro-material-link-iframe,
    .edupro-material-viewer-overlay.is-student-full-window:not(.is-material-zoomed) .edupro-material-office-iframe,
    .edupro-material-viewer-overlay.is-student-full-window:not(.is-material-zoomed) .edupro-material-office-online-iframe,
    .edupro-material-viewer-overlay.is-student-full-window:not(.is-material-zoomed) .edupro-material-ppt-iframe,
    .edupro-material-viewer-overlay.is-student-full-window:not(.is-material-zoomed) .edupro-material-ispring-iframe {
        display: block !important;
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        transform: none !important;
    }

    .edupro-material-viewer-overlay.is-student-full-window:not(.is-material-zoomed) .edupro-material-office-body,
    .edupro-material-viewer-overlay.is-student-full-window:not(.is-material-zoomed) .edupro-material-office-online-shell {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
    }
}

/* DOCX native: giữ nguyên form Word, JS sẽ scale nguyên trang nếu trang rộng hơn viewport. */
.edupro-material-viewer-overlay.has-native-docx .edupro-material-office-body,
.edupro-material-viewer-overlay.has-native-docx .edupro-material-docx-page.is-native-docx,
.edupro-material-viewer-overlay.has-native-docx .edupro-docx-shadow-host {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.edupro-material-viewer-overlay.has-native-docx .edupro-material-office-body {
    height: auto !important;
    min-height: 100% !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    background: #e5e7eb !important;
}

.edupro-material-viewer-overlay.has-native-docx .edupro-material-docx-page.is-native-docx,
.edupro-material-viewer-overlay.has-native-docx .edupro-docx-shadow-host {
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
}

/* PDF: canvas tính theo content-box thật và luôn nằm giữa khung ở mức 100%. */
.edupro-material-viewer-overlay .edupro-material-pdf-viewer,
.edupro-material-viewer-overlay .edupro-material-pdf-canvas-wrap {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.edupro-material-viewer-overlay .edupro-material-pdf-canvas-wrap {
    overflow: auto !important;
    justify-content: center !important;
    align-items: flex-start !important;
}

.edupro-material-viewer-overlay:not(.is-material-zoomed) .edupro-material-pdf-canvas-wrap canvas {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Fallback Word/Excel/ảnh/video/PPT không làm nở modal ở mức 100%. */
.edupro-material-viewer-overlay:not(.is-material-zoomed) :is(
    .edupro-material-docx-page:not(.is-native-docx),
    .edupro-material-excel-content,
    .edupro-material-excel-table,
    .edupro-material-media-shell,
    .edupro-material-image-shell,
    .edupro-material-audio-shell,
    .edupro-material-ispring-shell,
    .edupro-material-ppt-shell
) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.edupro-material-viewer-overlay:not(.is-material-zoomed) :is(
    .edupro-material-image-shell img,
    .edupro-material-media-shell video,
    .edupro-material-docx-page:not(.is-native-docx) img,
    .edupro-material-excel-content img
) {
    max-width: 100% !important;
    height: auto !important;
}

/* Mobile: không cho header/content phá ngang khung khi đang ở 100%.
   Giữ nguyên cơ chế Office-mobile-fit hiện hữu; chỉ mở scroll ngang khi người dùng chủ động zoom. */
@media (max-width: 768px) {
    .edupro-material-viewer-overlay.is-mobile-material-viewer .edupro-material-viewer-head,
    .edupro-material-viewer-overlay.is-mobile-material-viewer .edupro-material-viewer-title-wrap,
    .edupro-material-viewer-overlay.is-mobile-material-viewer .edupro-material-viewer-actions {
        min-width: 0 !important;
    }

    .edupro-material-viewer-overlay.is-mobile-material-viewer .edupro-material-viewer-head {
        width: 100% !important;
        max-width: 100vw !important;
    }

    .edupro-material-viewer-overlay.is-mobile-material-viewer:not(.is-material-zoomed) .edupro-material-viewer-body,
    .edupro-material-viewer-overlay.is-mobile-material-viewer:not(.is-material-zoomed) .edupro-material-viewer-zoomable,
    .edupro-material-viewer-overlay.is-mobile-material-viewer:not(.is-material-zoomed) .edupro-material-viewer-scale-inner {
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }

    .edupro-material-viewer-overlay.is-mobile-material-viewer.has-native-docx .edupro-material-viewer-body {
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
}
