/* Full-width Unfold form controls. */
body.change-form #content-main .form-row,
body.change-form #content-main .field-line,
body.change-form #content-main .field-line > .grow,
body.change-form #content-main .related-widget-wrapper,
body.change-form #content-main [class*="max-w-2xl"],
body.change-form #content-main .django-ckeditor-widget,
body.change-form #content-main .cke {
    box-sizing: border-box;
    max-width: none !important;
    width: 100% !important;
}

body.change-form #content-main .django-ckeditor-widget {
    display: block !important;
}

body.change-form #content-main input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
body.change-form #content-main textarea,
body.change-form #content-main select {
    box-sizing: border-box;
    max-width: none !important;
    width: 100% !important;
}

/* Blend CKEditor into the surrounding Unfold form in both themes. */
.django-ckeditor-widget .cke,
.django-ckeditor-widget .cke_inner,
.django-ckeditor-widget .cke_top,
.django-ckeditor-widget .cke_contents,
.django-ckeditor-widget .cke_bottom {
    background: transparent !important;
}

.django-ckeditor-widget .cke {
    border-color: var(--color-base-200) !important;
    border-radius: var(--border-radius, 6px) !important;
    box-shadow: none !important;
    overflow: hidden;
}

.django-ckeditor-widget .cke_top {
    border-color: var(--color-base-200) !important;
}

.django-ckeditor-widget .cke_bottom {
    display: none !important;
}

.dark .django-ckeditor-widget .cke,
.dark .django-ckeditor-widget .cke_top,
.dark .django-ckeditor-widget .cke_bottom {
    border-color: var(--color-base-700) !important;
}

.dark .django-ckeditor-widget .cke_button_icon {
    filter: invert(1) brightness(1.5);
}

.dark .django-ckeditor-widget .cke_button_label,
.dark .django-ckeditor-widget .cke_combo_text,
.dark .django-ckeditor-widget .cke_path_item,
.dark .django-ckeditor-widget .cke_resizer {
    color: var(--color-base-300) !important;
}

.dark .django-ckeditor-widget .cke_button:hover,
.dark .django-ckeditor-widget .cke_button:focus,
.dark .django-ckeditor-widget .cke_button_on,
.dark .django-ckeditor-widget .cke_combo_button:hover,
.dark .django-ckeditor-widget .cke_combo_button:focus {
    background: var(--color-base-800) !important;
}

.django-ckeditor-widget iframe {
    background: transparent !important;
    color-scheme: normal !important;
    width: 100% !important;
}