/**=====================
      Ck Editor CSS Start
==========================**/
.tox {
    &.tox-tinymce {
        background-color: rgba($input-bg, 0.4);
        border: 1px solid $input-bg !important;
        border-radius: 10px !important;
        padding: 0;
        min-height: 350px;

        .tox-toolbar-overlord {
            background-color: unset !important;

            .tox-toolbar {
                background: unset !important;
                border-bottom: 1px solid rgba($dark-color, 0.2);
                cursor: pointer;
            }
        }

        .tox-edit-area__iframe {
            background-color: unset !important;

            p {
                text-align: right;
            }
        }

        .tox-statusbar__path {
            font-size: 14px;
        }

        .tox-statusbar {
            height: 30px !important;
            padding: 16px 12px !important;
            background-color: unset !important;
        }

        .tox-tbtn {
            svg {
                color: rgba(34, 47, 62, 0.80);
            }
        }
    }

    .tox-split-button {
        &:hover {
            box-shadow: none !important;
        }
    }
}

.mce-content-body {
    font-size: 14px !important;
    height: calc(100% - 20px);
}

.mce-content-body[data-mce-placeholder]:not(.mce-visualblocks)::before {
    color: rgba($dark-color, 0.5);
    content: attr(data-mce-placeholder);
    position: absolute;
    font-weight: 400;
    font-size: 14px;
}

/**=====================
      Ck Editor CSS End
==========================**/