/*
 * CKEditor 5 產生之內容在前台的版面樣式（摘自 ckeditor5-content.css 的結構部分）。
 * 官方樣式都限定在 .ck-content 容器下，且 .table/.image 會與 Bootstrap 衝突，
 * 這裡只針對 CKEditor 5 輸出的 figure / img 結構，不影響既有的 table.table。
 */

/* 圖片 */
figure.image {
    display: table;
    clear: both;
    text-align: center;
    margin: .9em auto;
    min-width: 50px;
}
figure.image img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    min-width: 100%;
    height: auto;
}
figure.image > figcaption {
    display: table-caption;
    caption-side: bottom;
    padding: .6em;
    font-size: .75em;
    color: #333;
    background-color: #f7f7f7;
}
figure.image.image_resized {
    display: block;
    box-sizing: border-box;
    max-width: 100%;
}
figure.image.image_resized img {
    width: 100%;
}
figure.image.image_resized > figcaption {
    display: block;
}
img.image_resized {
    height: auto;
}
.image-inline {
    display: inline-flex;
    align-items: flex-start;
    max-width: 100%;
}
.image-inline img {
    flex-grow: 1;
    flex-shrink: 1;
    max-width: 100%;
}
.image-style-align-left {
    float: left;
    margin-right: 1.5em;
}
.image-style-align-right {
    float: right;
    margin-left: 1.5em;
}
.image-style-align-center {
    margin-left: auto;
    margin-right: auto;
}
.image-style-side {
    float: right;
    margin-left: 1.5em;
    max-width: 50%;
}
figure.image.image-style-block-align-left {
    margin-left: 0;
    margin-right: auto;
}
figure.image.image-style-block-align-right {
    margin-left: auto;
    margin-right: 0;
}

/* 表格（CKEditor 5 以 <figure class="table"> 包住 <table>） */
figure.table {
    display: table;
    margin: .9em auto;
}
figure.table > table {
    width: 100%;
    height: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}
/* 舊內容的表格是 Bootstrap 的 <table class="table">；CKEditor 5 會把 class 移到外層
   <figure class="table">，Bootstrap 的 .table>tbody>tr>td 對不到，這裡補上同樣的儲存格樣式 */
figure.table > table > thead > tr > th,
figure.table > table > thead > tr > td,
figure.table > table > tbody > tr > th,
figure.table > table > tbody > tr > td,
figure.table > table > tfoot > tr > th,
figure.table > table > tfoot > tr > td {
    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
    text-align: left;
    border-top: 1px solid #ddd;
}
figure.table > table > thead > tr > th {
    vertical-align: bottom;
    border-bottom: 2px solid #ddd;
}
figure.table > figcaption {
    display: table-caption;
    caption-side: top;
    text-align: center;
    padding: .6em;
}

/* 媒體嵌入 */
figure.media {
    clear: both;
    display: block;
    min-width: 15em;
    margin: .9em auto;
}

/* 分頁線（列印時換頁，畫面上不顯示） */
.page-break {
    page-break-after: always;
    height: 0;
}