/* CKEditor 5 inside Filament - Dark mode fixes */
.dark .ck.ck-editor__main>.ck-editor__editable {
    background: rgb(17 24 39);
    /* mirip gray-900 */
    color: rgb(243 244 246);
    /* mirip gray-100 */
    border-color: rgb(55 65 81);
    /* gray-700 */
}

.dark .ck.ck-editor__main>.ck-editor__editable.ck-focused {
    border-color: rgb(59 130 246);
    /* blue-500 */
    box-shadow: 0 0 0 1px rgb(59 130 246);
}

/* placeholder */
.dark .ck .ck-placeholder::before,
.dark .ck .ck-placeholder::after {
    color: rgb(156 163 175);
    /* gray-400 */
}

/* toolbar background & buttons */
.dark .ck.ck-toolbar {
    background: rgb(31 41 55);
    /* gray-800 */
    border-color: rgb(55 65 81);
    /* gray-700 */
}

.dark .ck.ck-toolbar .ck-button,
.dark .ck.ck-toolbar .ck-button .ck-button__label {
    color: rgb(243 244 246);
}

.dark .ck.ck-toolbar .ck-button:not(.ck-disabled):hover,
.dark .ck.ck-toolbar .ck-button.ck-on {
    background: rgb(55 65 81);
    /* gray-700 */
}

/* dropdown panel */
.dark .ck .ck-dropdown__panel {
    background: rgb(31 41 55);
    border-color: rgb(55 65 81);
}

.dark .ck .ck-list__item .ck-button {
    color: rgb(243 244 246);
}

.dark .ck .ck-list__item .ck-button:hover {
    background: rgb(55 65 81);
}

/* CKEditor min height */
.ck-editor__editable {
    min-height: 250px;
    /* ganti sesuai kebutuhan */
}

/* Dark mode friendly */
.dark .ck-editor__editable {
    min-height: 250px;
}