:root {
    --editor-bg-color: #383a47;
    --editor-body-bg-color: #161922;
    --editor-border-color: #58596a;
    --editor-hover-color: #58596a;
}

.editor.ant > .tox {
    .tox-editor-header {
        min-height: 48px;
    }

    &.tox-tinymce--disabled {
        position: relative;

        &::after {
            content: "";
            position: absolute;
            height: 100%;
            width: 100%;
            pointer-events: none;
            cursor: not-allowed;
            background-color: rgba(255, 255, 255, 0.08);
        }
    }

    &.tox-tinymce:not(.tox-tinymce--disabled) {
        transition: all 200ms linear;

        &:hover,
        &.tox-edit-focus {
            border-color: #48a5df;
        }

        &.tox-edit-focus {
            box-shadow: 0 0 0 2px rgba(37, 149, 231, 0.2);
        }
    }

    &.tox-tinymce {
        border-radius: 4px;
    }
}

.editor > .tox,
.tox {
    .tox-editor-header,
    .tox-dialog-wrap__backdrop--opaque,
    .tox-dialog,
    .tox-dialog__header,
    .tox-dialog__footer,
    .tox-textfield[disabled],
    .tox-textarea[disabled],
    .tox-menubar,
    .tox-promotion,
    .tox-notification--warn,
    .tox-notification--warning,
    .tox-pop__dialog,
    .tox-sidebar,
    .tox-statusbar,
    .tox-toolbar-overlord,
    .tox-toolbar,
    .tox-toolbar__primary,
    .tox-toolbar__overflow,
    &.tox-tinymce-aux .tox-toolbar__overflow,
    .tox-view-wrap,
    .tox-view-wrap__slot-container,
    .tox-tbtn,
    .tox-tbtn--bespoke,
    .tox-tbtn--bespoke:disabled,
    .tox-menu,
    .tox-tbtn--disabled,
    &.tox-tinymce-inline .tox-editor-header,
    &:not(.tox-tinymce-inline) .tox-editor-header,
    &:not(.tox-tinymce-inline).tox-tinymce--toolbar-sticky-on .tox-editor-header {
        background-color: var(--editor-bg-color);
    }

    .tox-collection__item {
        border: 2px solid transparent;
    }

    .tox-edit-area::before {
        display: none;
    }

    &.tox-tinymce {
        border: 1px solid var(--editor-border-color);
        border-radius: 6px;
    }

    .tox-tbtn:hover,
    .tox-tbtn.tox-tbtn--select,
    .tox-tbtn.tox-tbtn--enabled {
        &,
        &:focus {
            background: var(--editor-hover-color);
        }
    }

    .tox-button:not(.tox-button--icon):not(.tox-button--naked) {
        background: #2282c7;
        border-color: #2282c7;
        &.tox-button--secondary {
            background: #292b35;
            border-color: #58596a;
        }
    }

    .tox-form {
        .tox-textfield,
        .tox-toolbar-textfield,
        .tox-listboxfield .tox-listbox--select,
        .tox-textarea,
        .tox-textarea-wrap .tox-textarea:focus,
        .tox-textarea-wrap,
        .tox-textarea-wrap .tox-textarea,
        .tox-textarea-wrap .tox-textarea:focus {
            box-shadow: none;
            border-color: transparent;
            background-color: var(--editor-body-bg-color);
        }
    }

    .tox-collection__item {
        &,
        &.tox-collection__item--active {
            &:not(.tox-collection__item--state-disabled),
            &:not(.tox-collection__item--state-disabled) .tox-collection__item-label > * {
                background-color: var(--editor-bg-color) !important;
            }
        }

        &:hover,
        &.tox-collection__item--enabled {
            &:not(.tox-collection__item--state-disabled),
            &:not(.tox-collection__item--state-disabled) .tox-collection__item-label > * {
                background-color: var(--editor-hover-color) !important;
            }
        }
    }
}