/* Summary：文章顯示格式與重排規則，僅作用於正文及公告附件圖片。 */
/* 還原站台 reset 清除的粗體、斜體及清單格式。 */
.sys-message-content strong,
.sys-message-content b {
    font-weight: bolder;
    font-style: inherit;
}

.sys-message-content em,
.sys-message-content i {
    font-style: italic;
    font-weight: inherit;
}

.sys-message-content ul {
    list-style-type: disc;
}

.sys-message-content ol {
    list-style-type: decimal;
}

.sys-message-content ul,
.sys-message-content ol {
    list-style-position: outside;
    margin-block: 1em;
    padding-inline-start: 2em;
}

/* 將既有文章的布局與繪製限制在正文容器，提供儲存格行寬的查詢基準。 */
.sys-message-content {
    display: flow-root;
    contain: layout paint;
    isolation: isolate;
    container-type: inline-size;
    overflow-wrap: anywhere;
    min-width: 0;
}

/* 限制非表格內容與祖先的寬度，表格本身保留二維布局與水平捲動。 */
.sys-message-content :where(:not(table, thead, tbody, tfoot, tr, th, td, col, colgroup)) {
    box-sizing: border-box;
    max-width: 100% !important;
    min-width: 0 !important;
}

/* 只啟用自動折行，保留 pre-line／pre-wrap 的分行與對齊空白。 */
.sys-message-content,
.sys-message-content * {
    text-wrap: wrap !important;
    overflow-wrap: anywhere;
}

.sys-message-content .sys-message-cell-content {
    display: block;
    width: 100%;
    /* 即使表格欄位固定寬度，文字行寬仍以正文寬度扣除預留空間為上限。 */
    max-width: min(100%, max(0px, calc(100cqi - 2rem))) !important;
    min-width: 0 !important;
}

/* 每個表格獨立捲動，不讓整個正文或頁面產生水平捲動。 */
.sys-message-content .sys-message-table-scroll {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    margin-block: 1em;
}

/* 方向鍵捲動前，讓使用者能辨識目前聚焦的表格容器。 */
.sys-message-content .sys-message-table-scroll:focus-visible {
    outline: 2px solid #005fcc;
    outline-offset: -2px;
}

/* 媒體及附件圖片不超出正文寬度，覆寫既有固定最小寬度。 */
.sys-message-content img,
.sys-message-content video,
.sys-message-content iframe,
.sys-message-image {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
}

/* 圖片與 HTML5 影片維持比例，iframe 沿用既有高度。 */
.sys-message-content img,
.sys-message-content video,
.sys-message-image {
    height: auto !important;
}