/*
| Chuẩn bề ngang trang - toàn hệ thống.
|
| Vì sao có file này: nhiều màn đang bị co lại giữa khung và chừa hai bên trống
| rất lớn, do khối nội dung không được ép giãn (grid canh giữa) hoặc bị khoá
| max-width cứng trong từng view. File nạp SAU CÙNG, ép mọi khối nội dung cấp
| trang giãn hết bề ngang khung làm việc, để cả hệ thống dùng chung một chuẩn.
|
| Phạm vi: chỉ trong khung quản trị (.global-layout) và cổng Khoa Cơ bản
| (.be-portal-body). Các trang public/login giữ nguyên bố cục canh giữa.
| Không đụng tới modal, hộp thoại và khung in.
*/

.global-layout .app-content,
.global-layout .app-page-shell,
.be-portal-body .be-content {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    /* Khối nội dung là con của lưới/flex: bắt buộc giãn thay vì co theo nội dung. */
    justify-items: stretch !important;
    justify-content: stretch !important;
    align-items: start !important;
}

/* Con trực tiếp của vùng nội dung: container của từng trang. */
.global-layout .app-page-shell > *,
.global-layout .app-content > main > *,
.be-portal-body .be-content > * {
    justify-self: stretch !important;
    align-self: start !important;
    max-width: none !important;
}

/* Các lớp container thường dùng trong view nghiệp vụ. */
.global-layout :where(.container, .container-fluid, .container-lg, .page-container, .module-page, .sis-page, .sis-workspace-shell, .sis-data-workspace, .sis-list-workspace),
.be-portal-body :where(.container, .container-fluid, .container-lg, .page-container, .sis-page) {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Không áp cho hộp thoại, khung in và các khối cố ý giới hạn bề ngang. */
.global-layout :where(.modal, .modal-dialog, .modal-content, .offcanvas, .drawer) :where(.container, .container-fluid),
.global-layout :where(.erpui-print-sheet, .sis-report-preview__body, .report-preview__body, .preview-body) :where(.container, .container-fluid) {
    width: auto !important;
    max-width: initial !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

@media print {
    .global-layout .app-page-shell,
    .global-layout .app-content {
        justify-content: initial !important;
        justify-items: initial !important;
    }
}