/* ========== CKEditor Wrapper ========== */ .ckeditor-wrapper { border-radius: 6px; overflow: hidden; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); } /* ========== Main Editor Container ========== */ .ckeditor-wrapper .ck.ck-editor__main { min-height: var(--editor-min-height, 400px); max-height: var(--editor-max-height, 600px); } /* ========== Editable Content Area (ClassicEditor) ========== */ .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline { min-height: calc(var(--editor-min-height, 400px) - 50px); max-height: calc(var(--editor-max-height, 600px) - 50px); overflow-y: auto !important; scrollbar-width: thin; scrollbar-color: #cbd5e1 #f1f5f9; background: #fff !important; color: #111 !important; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 14px; line-height: 1.6; padding: 1rem; border: none !important; } /* ========== Headings and Text Formatting ========== */ .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h1, .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h2, .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h3, .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h4, .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h5, .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h6 { margin: 1em 0 0.5em 0; color: inherit !important; } .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline p { margin: 0.5em 0 !important; } .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline ul, .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline ol { margin: 0.5em 0; padding-left: 2em; } .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline blockquote { margin: 1em 0; padding: 0.5em 1em; border-left: 4px solid #d1d5db; background-color: #f9fafb; color: inherit !important; } /* ========== Dark Mode Support ========== */ .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline { background: #111 !important; color: #f9fafb !important; } .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h1, .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h2, .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h3, .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h4, .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h5, .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline h6 { color: #f9fafb !important; } .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline blockquote { background-color: #1f2937 !important; border-left-color: #374151 !important; color: #f3f4f6 !important; } /* ========== Custom Scrollbars (Light & Dark) ========== */ .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar { width: 8px; } .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-track { background: #f1f5f9; border-radius: 4px; } .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; } .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-thumb:hover { background: #94a3b8; } .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-track { background: #1f2937; } .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-thumb { background: #4b5563; } .dark .ckeditor-wrapper .ck.ck-content.ck-editor__editable_inline::-webkit-scrollbar-thumb:hover { background: #6b7280; }