.ck-editor,
.document-editor,
.ck-editor__editable {
    box-shadow: 0 1px 2px #0000000d
}

.document-editor {
    display: flex;
    max-height: 700px;
    flex-flow: column nowrap;
    border-radius: var(--ck-border-radius);
    border: 1px solid #e2e8f0
}

.document-editor .document-editor__toolbar {
    z-index: 1;
    border-bottom: 1px solid #e2e8f0
}

.document-editor .document-editor__toolbar .ck-toolbar {
    border: 0;
    border-radius: 0;
    background-color: #f1f5f9
}

.document-editor .document-editor__toolbar .ck-toolbar .ck-icon {
    width: 16px
}

.document-editor .document-editor__editable-container {
    overflow-y: scroll;
    padding: calc(2 * var(--ck-spacing-large));
    background-color: #f1f5f9
}

.document-editor .document-editor__editable-container .ck-editor__editable {
    width: 15.8cm;
    margin: 0 auto;
    min-height: 21cm;
    background: #fff;
    padding: 1cm 2cm 2cm;
    border-radius: var(--ck-border-radius);
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 2px #0000000d
}

.document-editor .ck-heading-dropdown .ck-list .ck-button__label {
    line-height: calc(1.7 * var(--ck-line-height-base) * var(--ck-font-size-base));
    min-width: 6em
}

.document-editor .ck-heading-dropdown .ck-list .ck-button:not(.ck-heading_paragraph) .ck-button__label {
    transform: scale(.8);
    transform-origin: left
}

.document-editor .ck-content h2,
.document-editor .ck-heading-dropdown .ck-heading_heading1 .ck-button__label {
    font-size: 2.18em;
    font-weight: 400
}

.document-editor .ck-content h2 {
    line-height: 1.37em;
    padding-top: .342em;
    margin-bottom: .142em
}

.document-editor .ck-content h3,
.document-editor .ck-heading-dropdown .ck-heading_heading2 .ck-button__label {
    font-size: 1.75em;
    font-weight: 400;
    color: #009dff
}

.document-editor .ck-heading-dropdown .ck-heading_heading2.ck-on .ck-button__label {
    color: var(--ck-color-list-button-on-text)
}

.document-editor .ck-content h3 {
    line-height: 1.86em;
    padding-top: .171em;
    margin-bottom: .357em
}

.document-editor .ck-content h4,
.document-editor .ck-heading-dropdown .ck-heading_heading3 .ck-button__label {
    font-size: 1.31em;
    font-weight: 700
}

.document-editor .ck-content h4 {
    line-height: 1.24em;
    padding-top: .286em;
    margin-bottom: .952em
}

.document-editor .ck-content p {
    font-size: 1em;
    line-height: 1.63em;
    padding-top: .5em;
    margin-bottom: 1.13em
}

.document-editor .ck-content blockquote {
    font-family: Georgia, serif;
    margin-left: calc(2 * var(--ck-spacing-large));
    margin-right: calc(2 * var(--ck-spacing-large))
}

.ck.ck-content {
    min-height: 250px
}

.ck.ck-content.ck-editor__editable_inline {
    border: 1px solid #e2e8f0
}

.ck .ck .ck-content {
    min-height: 250px
}

.ck .ck .ck-content.ck-editor__editable_inline {
    border: 1px solid #e2e8f0
}

.ck .ck .ck-content blockquote,
.ck .ck .ck-content dl,
.ck .ck .ck-content dd,
.ck .ck .ck-content h1,
.ck .ck .ck-content h2,
.ck .ck .ck-content h3,
.ck .ck .ck-content h4,
.ck .ck .ck-content h5,
.ck .ck .ck-content h6,
.ck .ck .ck-content hr,
.ck .ck .ck-content figure,
.ck .ck .ck-content p,
.ck .ck .ck-content pre {
    margin: revert
}

.ck .ck .ck-content ol,
.ck .ck .ck-content ul {
    list-style: revert;
    margin: revert;
    padding: revert
}

.ck .ck .ck-content h1,
.ck .ck .ck-content h2,
.ck .ck .ck-content h3,
.ck .ck .ck-content h4,
.ck .ck .ck-content h5,
.ck .ck .ck-content h6 {
    font-size: revert;
    font-weight: revert
}

.ck .ck .ck-content img,
.ck .ck .ck-content svg,
.ck .ck .ck-content video,
.ck .ck .ck-content canvas,
.ck .ck .ck-content audio,
.ck .ck .ck-content iframe,
.ck .ck .ck-content embed,
.ck .ck .ck-content object {
    display: revert;
    vertical-align: revert
}

.ck .ck.ck-reset_all,
.ck .ck.ck-reset_all * {
    color: #1e293b
}

.ck .ck.ck-toolbar,
.ck .ck.ck-balloon-panel {
    background-color: #f1f5f9;
    border-color: #e2e8f0
}

.ck .ck.ck-toolbar .ck-icon,
.ck .ck.ck-balloon-panel .ck-icon {
    width: 16px
}

.ck .ck.ck-editor__main>.ck-editor__editable:not(.ck-focused) {
    border-color: #e2e8f0
}

.ck .ck.ck-button:not(.ck-disabled):hover,
.ck .cka.ck-button:not(.ck-disabled):hover {
    background-color: #e2e8f0
}

.dark .document-editor {
    border-color: rgb(var(--color-darkmode-900) / 30%)
}

.dark .document-editor .document-editor__toolbar {
    border-color: rgb(var(--color-darkmode-900) / 20%)
}

.dark .document-editor .document-editor__toolbar .ck-toolbar {
    background-color: rgb(var(--color-darkmode-900) / 20%)
}

.dark .document-editor .document-editor__toolbar .ck-toolbar .ck-toolbar__separator {
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .document-editor .document-editor__toolbar .ck-toolbar .ck-tooltip .ck-tooltip__text {
    color: #e2e8f0;
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .document-editor .document-editor__toolbar .ck-toolbar .ck-tooltip .ck-tooltip__text:after {
    border-bottom: rgb(var(--color-darkmode-800) / 1)
}

.dark .document-editor .document-editor__toolbar .ck-toolbar .ck.ck-icon :not([fill]) {
    fill: #cbd5e1
}

.dark .document-editor .document-editor__toolbar .ck-toolbar .ck.ck-dropdown__panel {
    border-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .document-editor .document-editor__toolbar .ck-toolbar .ck.ck-button.ck-on,
.dark .document-editor .document-editor__toolbar .ck-toolbar a.ck.ck-button.ck-on {
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .document-editor .document-editor__editable-container {
    background-color: rgb(var(--color-darkmode-600) / 1)
}

.dark .document-editor .document-editor__editable-container .ck-editor__editable,
.dark .ck.ck-content.ck-editor__editable_inline {
    border-color: rgb(var(--color-darkmode-900) / 20%);
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .ck.ck-list {
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .ck.ck-dropdown__panel {
    background-color: rgb(var(--color-darkmode-800) / 1);
    border-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .ck.ck.ck-input-text {
    background-color: rgb(var(--color-darkmode-400) / 1);
    border-color: rgb(var(--color-darkmode-400) / 1)
}

.dark .ck.ck.ck-input-text:focus {
    box-shadow: none
}

.dark .ck .ck-insert-table-dropdown-grid-box {
    border-color: rgb(var(--color-darkmode-400) / 1)
}

.dark .ck.ck-reset_all,
.dark .ck.ck-reset_all * {
    color: #cbd5e1 !important
}

.dark .ck .ck .ck-content.ck-editor__editable_inline {
    border-color: rgb(var(--color-darkmode-900) / 20%);
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .ck .ck.ck-toolbar,
.dark .ck .ck.ck-balloon-panel {
    background-color: rgb(var(--color-darkmode-700) / 1);
    border-color: rgb(var(--color-darkmode-900) / 20%)
}

.dark .ck .ck.ck-toolbar:before,
.dark .ck .ck.ck-balloon-panel:before {
    border-bottom-color: rgb(var(--color-darkmode-900) / 20%) !important
}

.dark .ck .ck.ck-toolbar:after,
.dark .ck .ck.ck-balloon-panel:after {
    border-bottom-color: rgb(var(--color-darkmode-900) / 20%) !important
}

.dark .ck .ck.ck-toolbar .ck-toolbar__separator,
.dark .ck .ck.ck-balloon-panel .ck-toolbar__separator {
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .ck .ck.ck-toolbar .ck-tooltip .ck-tooltip__text,
.dark .ck .ck.ck-balloon-panel .ck-tooltip .ck-tooltip__text {
    color: #e2e8f0;
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .ck .ck.ck-toolbar .ck-tooltip .ck-tooltip__text:after,
.dark .ck .ck.ck-balloon-panel .ck-tooltip .ck-tooltip__text:after {
    border-bottom-color: rgb(var(--color-darkmode-900) / 20%)
}

.dark .ck .ck.ck-toolbar .ck.ck-icon :not([fill]),
.dark .ck .ck.ck-balloon-panel .ck.ck-icon :not([fill]) {
    fill: #cbd5e1
}

.dark .ck .ck.ck-toolbar .ck.ck-dropdown__panel,
.dark .ck .ck.ck-balloon-panel .ck.ck-dropdown__panel {
    border-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .ck .ck.ck-toolbar .ck.ck-button.ck-on,
.dark .ck .ck.ck-toolbar a.ck.ck-button.ck-on,
.dark .ck .ck.ck-balloon-panel .ck.ck-button.ck-on,
.dark .ck .ck.ck-balloon-panel a.ck.ck-button.ck-on {
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .ck .ck.ck-editor__main>.ck-editor__editable {
    background-color: rgb(var(--color-darkmode-800) / 1)
}

.dark .ck .ck.ck-editor__main>.ck-editor__editable:not(.ck-focused) {
    border-color: rgb(var(--color-darkmode-900) / 20%)
}

.dark .ck .ck.ck-button:not(.ck-disabled):hover,
.dark .ck .cka.ck-button:not(.ck-disabled):hover {
    background-color: rgb(var(--color-darkmode-900) / 20%)
}