/* CSDA 圖文雙欄：純內容排版，不使用 table；不影響既有表格、影片或單張圖片 */
.csda-media-text {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    gap: 30px;
    margin: 28px 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}
.csda-media-text > .csda-media-text__media,
.csda-media-text > .csda-media-text__content {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}
.csda-media-text--image-right > .csda-media-text__media { order: 2; }
.csda-media-text--image-right > .csda-media-text__content { order: 1; }
.csda-media-text .csda-media-text__media > img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    border-radius: 8px;
}
.csda-media-text .csda-media-text__media > figure.image,
.csda-media-text .csda-media-text__media > figure.csda-image-figure {
    display: table;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
}
.csda-media-text .csda-media-text__media > figure.image img,
.csda-media-text .csda-media-text__media > figure.csda-image-figure img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
}
.csda-media-text .csda-media-text__media > figure.image figcaption,
.csda-media-text .csda-media-text__media > figure.csda-image-figure figcaption {
    display: table-caption;
    caption-side: bottom;
    padding-top: 8px;
    color: #718096;
    font-size: 13px;
    line-height: 1.65;
    overflow-wrap: anywhere;
}
.csda-media-text .csda-media-text__content > p:first-child { margin-top: 0; }
@media (max-width: 700px) {
    .csda-media-text {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
        margin: 22px 0;
    }
    .csda-media-text > .csda-media-text__media,
    .csda-media-text > .csda-media-text__content { order: 0; }
}
/* 拖曳調整兩欄中的圖片比例（以容器 class 保存，不使用 inline grid CSS） */
.csda-media-text.csda-media-text--media-20{grid-template-columns:minmax(0,20fr) minmax(0,80fr);}
.csda-media-text.csda-media-text--media-20.csda-media-text--image-right{grid-template-columns:minmax(0,80fr) minmax(0,20fr);}
.csda-media-text.csda-media-text--media-25{grid-template-columns:minmax(0,25fr) minmax(0,75fr);}
.csda-media-text.csda-media-text--media-25.csda-media-text--image-right{grid-template-columns:minmax(0,75fr) minmax(0,25fr);}
.csda-media-text.csda-media-text--media-30{grid-template-columns:minmax(0,30fr) minmax(0,70fr);}
.csda-media-text.csda-media-text--media-30.csda-media-text--image-right{grid-template-columns:minmax(0,70fr) minmax(0,30fr);}
.csda-media-text.csda-media-text--media-35{grid-template-columns:minmax(0,35fr) minmax(0,65fr);}
.csda-media-text.csda-media-text--media-35.csda-media-text--image-right{grid-template-columns:minmax(0,65fr) minmax(0,35fr);}
.csda-media-text.csda-media-text--media-40{grid-template-columns:minmax(0,40fr) minmax(0,60fr);}
.csda-media-text.csda-media-text--media-40.csda-media-text--image-right{grid-template-columns:minmax(0,60fr) minmax(0,40fr);}
.csda-media-text.csda-media-text--media-45{grid-template-columns:minmax(0,45fr) minmax(0,55fr);}
.csda-media-text.csda-media-text--media-45.csda-media-text--image-right{grid-template-columns:minmax(0,55fr) minmax(0,45fr);}
.csda-media-text.csda-media-text--media-50{grid-template-columns:minmax(0,50fr) minmax(0,50fr);}
.csda-media-text.csda-media-text--media-50.csda-media-text--image-right{grid-template-columns:minmax(0,50fr) minmax(0,50fr);}
.csda-media-text.csda-media-text--media-55{grid-template-columns:minmax(0,55fr) minmax(0,45fr);}
.csda-media-text.csda-media-text--media-55.csda-media-text--image-right{grid-template-columns:minmax(0,45fr) minmax(0,55fr);}
.csda-media-text.csda-media-text--media-60{grid-template-columns:minmax(0,60fr) minmax(0,40fr);}
.csda-media-text.csda-media-text--media-60.csda-media-text--image-right{grid-template-columns:minmax(0,40fr) minmax(0,60fr);}
.csda-media-text.csda-media-text--media-65{grid-template-columns:minmax(0,65fr) minmax(0,35fr);}
.csda-media-text.csda-media-text--media-65.csda-media-text--image-right{grid-template-columns:minmax(0,35fr) minmax(0,65fr);}
.csda-media-text.csda-media-text--media-70{grid-template-columns:minmax(0,70fr) minmax(0,30fr);}
.csda-media-text.csda-media-text--media-70.csda-media-text--image-right{grid-template-columns:minmax(0,30fr) minmax(0,70fr);}
.csda-media-text.csda-media-text--media-75{grid-template-columns:minmax(0,75fr) minmax(0,25fr);}
.csda-media-text.csda-media-text--media-75.csda-media-text--image-right{grid-template-columns:minmax(0,25fr) minmax(0,75fr);}
.csda-media-text.csda-media-text--media-80{grid-template-columns:minmax(0,80fr) minmax(0,20fr);}
.csda-media-text.csda-media-text--media-80.csda-media-text--image-right{grid-template-columns:minmax(0,20fr) minmax(0,80fr);}

/* 手機一律改成上下排列，忽略桌機圖文比例設定。 */
@media (max-width:700px) {
    .csda-media-text { grid-template-columns:minmax(0,1fr)!important; }
}

/* v3 - 圖文整組位置與寬度。使用簡短 class 以通過既有 HTML 白名單。 */
.csda-media-text.csda-mt-w60{width:60%;max-width:100%;}
.csda-media-text.csda-mt-w80{width:80%;max-width:100%;}
.csda-media-text.csda-mt-w100{width:100%;max-width:100%;}
.csda-media-text.csda-mt-l{margin-left:0;margin-right:auto;}
.csda-media-text.csda-mt-c{margin-left:auto;margin-right:auto;}
.csda-media-text.csda-mt-r{margin-left:auto;margin-right:0;}
@media (max-width:700px){
  .csda-media-text.csda-mt-w60,
  .csda-media-text.csda-mt-w80,
  .csda-media-text.csda-mt-w100{width:100%;max-width:100%;}
  .csda-media-text.csda-mt-l,
  .csda-media-text.csda-mt-c,
  .csda-media-text.csda-mt-r{margin-left:0;margin-right:0;}
}

/* v4: 編輯整個文字欄字級。整組寬度／對齊使用既有 v3 class。 */
.csda-media-text.csda-mt-f14 .csda-media-text__content{font-size:14px;}
.csda-media-text.csda-mt-f16 .csda-media-text__content{font-size:16px;}
.csda-media-text.csda-mt-f18 .csda-media-text__content{font-size:18px;}
.csda-media-text.csda-mt-f20 .csda-media-text__content{font-size:20px;}
.csda-media-text.csda-mt-f24 .csda-media-text__content{font-size:24px;}
.csda-media-text.csda-mt-f28 .csda-media-text__content{font-size:28px;}
.csda-media-text.csda-mt-f32 .csda-media-text__content{font-size:32px;}

/* v5：整組文字欄字級確實作用於已有的 p/span 等內容，包括內嵌過個別 font-size 的段落。 */
.csda-media-text.csda-mt-f14 .csda-media-text__content, .csda-media-text.csda-mt-f14 .csda-media-text__content *{font-size:14px!important;}
.csda-media-text.csda-mt-f16 .csda-media-text__content, .csda-media-text.csda-mt-f16 .csda-media-text__content *{font-size:16px!important;}
.csda-media-text.csda-mt-f18 .csda-media-text__content, .csda-media-text.csda-mt-f18 .csda-media-text__content *{font-size:18px!important;}
.csda-media-text.csda-mt-f20 .csda-media-text__content, .csda-media-text.csda-mt-f20 .csda-media-text__content *{font-size:20px!important;}
.csda-media-text.csda-mt-f24 .csda-media-text__content, .csda-media-text.csda-mt-f24 .csda-media-text__content *{font-size:24px!important;}
.csda-media-text.csda-mt-f28 .csda-media-text__content, .csda-media-text.csda-mt-f28 .csda-media-text__content *{font-size:28px!important;}
.csda-media-text.csda-mt-f32 .csda-media-text__content, .csda-media-text.csda-mt-f32 .csda-media-text__content *{font-size:32px!important;}

/* v6：支援圖文整組寬度 40%～100%，5% 一級；只保存類別，不保存拖曳把手。 */
.csda-media-text.csda-mt-w40{width:40%;max-width:100%;}
.csda-media-text.csda-mt-w45{width:45%;max-width:100%;}
.csda-media-text.csda-mt-w50{width:50%;max-width:100%;}
.csda-media-text.csda-mt-w55{width:55%;max-width:100%;}
.csda-media-text.csda-mt-w60{width:60%;max-width:100%;}
.csda-media-text.csda-mt-w65{width:65%;max-width:100%;}
.csda-media-text.csda-mt-w70{width:70%;max-width:100%;}
.csda-media-text.csda-mt-w75{width:75%;max-width:100%;}
.csda-media-text.csda-mt-w80{width:80%;max-width:100%;}
.csda-media-text.csda-mt-w85{width:85%;max-width:100%;}
.csda-media-text.csda-mt-w90{width:90%;max-width:100%;}
.csda-media-text.csda-mt-w95{width:95%;max-width:100%;}
.csda-media-text.csda-mt-w100{width:100%;max-width:100%;}
@media(max-width:700px){.csda-media-text[class*="csda-mt-w"]{width:100%!important;max-width:100%!important;}}