/* =======================================================================
   RESEP ANTI-BOCOR UNTUK KONTEN CKEDITOR 5 DI LAYAR HP (MOBILE)
   ======================================================================= */

/* 1. Gambar Otomatis Menyusut (Tidak Melebihi Frame) */
.ck-content img {
    max-width: 100% !important;
    height: auto !important;
    display: block;
    object-fit: contain;
    border-radius: 0.5rem; /* Opsional: memberikan sudut melengkung */
    margin-left: auto;
    margin-right: auto;
}

/* Membatasi elemen media bawaan CKEditor agar tidak melebar */
.ck-content figure.image,
.ck-content figure.media {
    max-width: 100%;
    margin: 1.25rem auto;
}

/* 2. Tabel Bisa Di-Swipe ke Samping (Horizontal Scroll) */
.ck-content figure.table {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch; /* Memuluskan scroll di iPhone/iPad */
    display: block;
    margin: 1.5rem 0;
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
}

/* Memastikan teks di dalam tabel tidak terlalu tergencet */
.ck-content figure.table table {
    width: 100%;
    min-width: max-content; 
    border-collapse: collapse;
}

/* Memperbaiki tampilan video YouTube (iframe) agar responsif 16:9 */
.ck-content .media iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
}