﻿
.richtexteditor {
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    box-sizing: border-box !important;
    border: 1px solid #ddd;
    background-color: #fff;
    user-select: none;
    min-height: 200px;
    min-width: 200px;
    font-family: -apple-system, Helvetica, Arial, sans-serif;
}

.richtexteditor, .rte-absolute, .rte-fixed, rte-dropdown-panel {
    font-family: -apple-system, Helvetica, Arial, sans-serif;
    font-size: 14px;
}

    .richtexteditor *, .rte-absolute *, .rte-fixed * {
        box-sizing: border-box !important;
    }

    .richtexteditor.rte-fullpage {
        position: fixed !important;
        border: none !important;
        left: -2px !important;
        top: -2px !important;
        right: -2px !important;
        bottom: -2px !important;
        width: auto !important;
        height: auto !important;
        max-width: none !important;
        max-height: none !important;
        border-radius: 0px !important;
    }

        .richtexteditor.rte-fullpage rte-toolbar {
            border-radius: 0px !important;
        }

.rte-absolute {
    box-sizing: border-box !important;
    position: absolute !important;
}

.rte-fixed {
    box-sizing: border-box !important;
    position: fixed !important;
}

rte-precontent {
    z-index: 1;
}

rte-content {
    border-bottom: solid 1px #ebedf2;
    padding: 8px;
    user-select: none;
    background-color: #fff;
}

.rte-editable {
    background-color: #fff;
}

rte-toolbar {
    border-bottom: solid 1px #ebedf2;
}

.rte-office rte-toolbar {
    padding: 2px 2px 3px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAACCCAYAAABGtuhTAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAACB0RVh0U29mdHdhcmUATWFjcm9tZWRpYSBGaXJld29ya3MgTVi7kSokAAAAFnRFWHRDcmVhdGlvbiBUaW1lADA1LzA3LzEyJiegEwAAAOZJREFUeJztmcENxDAIBHFE/23eM79T7hE7RdxYGkRcwGiBBSx7fM5rBXjyulFe5DEnC5yswMhFAydMzMUDUV4kzCsRMp/DfiHjVUZxEfn93SjwQGk9gTlgoD9kPocBJ7FhUfCQcwwWWSCHeh/iCgsUpWMv0z7U2yYDlrij9eTz0N8pFXxoV/gC/z8bLksw0J/DFygENry0+4ENdwp+nfOvgApFaedDP9DvQ38vN+wUv212FEXuQ1yh//3Q78Mc9vHlr7J/wPLvh/yDpL4oBRTSQHxiFzC2XmGBnWL/oNnQKfo1qlf4ABqzK10RRBaNAAAAAElFTkSuQmCC');
}



rte-codebox {
    flex: 99999;
    text-align: left;
    font-size: 15px;
    line-height: 1.5;
    border: none;
    font-family: "Consolas", "Courier New", Courier, monospace, serif;
}

    rte-codebox textarea {
        -moz-resize: none;
        -webkit-resize: none;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border: none;
        padding: 10px;
        margin: 0;
        font-family: "Courier New", Courier, monospace, serif;
        font-size: 14px;
        background: #FFF;
        color: #000;
        outline: none;
    }

.richtexteditor.rte-modern rte-toolbar {
    padding: 0px 2px;
    font-size: 14px;
    color: #333;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.05);
    border-bottom: 1px solid #eeeeee;
}

/* 2026-05-11 Sticky toolbar on scroll: keep the editor toolbar visible at the
   top of the viewport when the user scrolls past the editor's top. Activates
   only on editors with class `rte-toolbar-sticky` (set via JS based on
   config.stickyToolbar). Z-index keeps it above body content + below modals. */
.richtexteditor.rte-toolbar-sticky rte-toolbar.rte-toolbar-desktop,
.richtexteditor.rte-toolbar-sticky rte-toolbar.rte-toolbar-mobile {
    position: sticky;
    top: 0;
    z-index: 5;
    background-color: #fff;
}

/* 2026-05-11 Auto-grow: the editor expands to fit content instead of showing
   an inner scrollbar. Set `config.autoGrow = true` to enable. */
.richtexteditor.rte-autogrow rte-content {
    overflow-y: visible !important;
}
.richtexteditor.rte-autogrow,
.richtexteditor.rte-autogrow iframe.rte-editable {
    height: auto !important;
    max-height: none !important;
}

/* 2026-05-11 Print stylesheet: only the editor's content prints; toolbars,
   chrome, status bar, drag handles, selection rectangles are hidden so the
   printed page matches the saved document, not the editing UI. */
@media print {
    .richtexteditor rte-toolbar,
    .richtexteditor rte-subtoolbar,
    .richtexteditor rte-bottom,
    .richtexteditor rte-precontent,
    .richtexteditor rte-control-toolbar,
    .richtexteditor rte-control-selected,
    .richtexteditor rte-plusbtn,
    .rte-block-drag-handle,
    .rte-block-drop-indicator,
    .rte-toolbar-sticky rte-toolbar { display: none !important; }
    .richtexteditor {
        border: 0 !important;
        box-shadow: none !important;
        background: #fff !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
    .richtexteditor iframe.rte-editable {
        height: auto !important;
        border: 0 !important;
        page-break-inside: auto;
    }
    .richtexteditor rte-content {
        overflow: visible !important;
    }
}

/* 2026-05-19 Reading mode — hides toolbars + status, leaves only the editing
   surface for distraction-free writing. Toggle via editor.toggleReadingMode(). */
.richtexteditor.rte-reading-mode rte-toolbar,
.richtexteditor.rte-reading-mode rte-subtoolbar,
.richtexteditor.rte-reading-mode rte-bottom,
.richtexteditor.rte-reading-mode rte-plusbtn {
    display: none !important;
}
.richtexteditor.rte-reading-mode {
    border: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
}

/* 2026-05-11 Block drag handles (Notion-style ⋮⋮ on left edge of blocks).
   Activated via config.blockDragHandles = true. */
.rte-block-drag-handle {
    position: absolute;
    width: 18px;
    height: 22px;
    cursor: grab;
    color: #94a3b8;
    user-select: none;
    z-index: 4;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    line-height: 1;
    opacity: 0;
    transition: opacity 120ms, background-color 120ms;
    background: transparent;
}
.rte-block-drag-handle.rte-block-drag-handle-visible {
    opacity: 1;
}
.rte-block-drag-handle:hover {
    background: #eef2f7;
    color: #475569;
}
.rte-block-drag-handle:active {
    cursor: grabbing;
}
.rte-block-drop-indicator {
    position: absolute;
    height: 2px;
    background: #2563eb;
    z-index: 4;
    pointer-events: none;
    border-radius: 2px;
}


.richtexteditor.rte-office {
    padding: 0px;
    margin: 2px;
    border-style: solid;
    border-width: 1px;
    border-color: #bdd4f0;
    border-top-color: #c5d2df;
    border-left-color: #b7c8d7;
    border-right-color: #b8c9d7;
    border-bottom-color: #9ebfdb;
    border-radius: 0px;
}

.richtexteditor.rte-modern {
    border: 1px solid #d5d5d5;
    border-radius: 8px;
    -moz-border-radius: 8px;
}

.rte-modern.rte-desktop.rte-toolbar-default {
    min-width: 820px;
}

.rte-modern.rte-desktop.rte-toolbar-full {
    min-width: 820px;
}



rte-bottom {
    padding: 3px 8px;
    user-select: none;
    min-height: 35px;
    background-color: #fff;
}

.rte-modern rte-plusbtn rte-toolbar-button {
    width: 24px;
    height: 24px;
    margin: 1px;
}

rte-taglist {
}

rte-tagitem {
    display: inline-flex;
    align-items: center;
    margin: 2px;
    padding: 1px 6px;
    border: 1px solid #e2e8f0;
    border-radius: 3px;
    background: #f8fafc;
    color: #475569;
    cursor: pointer;
    font-size: 11px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    line-height: 16px;
    user-select: none;
    transition: background .1s, border-color .1s, color .1s;
}

rte-tagitem:hover {
    background: #e2e8f0;
    border-color: #cbd5e1;
    color: #1e293b;
}

rte-tagitem.rte-ui-active {
    background: #e0f2fe;
    border-color: #93c5fd;
    color: #0369a1;
    font-weight: 500;
}

rte-textcounter {
    padding: 5px 8px 3px;
    color: #6e6e6e; /* WCAG 1.4.3: 5.2:1 on white (was #999999 = 2.85:1, AA fail) */
    font-size:13px;
    font-family: sans-serif;
    text-transform: lowercase;
}
rte-powerby {
    padding: 5px 8px 3px;
    font-family: sans-serif;
}


rte-resizecorner {
    margin: 3px 0;
    padding: 3px 0;
    min-width: 16px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjM1QzFBMTY5MzA1MTFFQUJGNDI5NDU5N0M4QkUxNDkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjM1QzFBMTc5MzA1MTFFQUJGNDI5NDU5N0M4QkUxNDkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpGMzVDMUExNDkzMDUxMUVBQkY0Mjk0NTk3QzhCRTE0OSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpGMzVDMUExNTkzMDUxMUVBQkY0Mjk0NTk3QzhCRTE0OSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pn+/bqEAAAA8SURBVHjaYvz//z8DKYCJGEXp6elwUxmpakNGRsZ/2tgAMxGdptwGdDfDaJg4+TbgcjPMZMptIAUABBgAPN8zHGdT1H8AAAAASUVORK5CYII=);
    background-repeat: no-repeat;
    background-position: center center;
    cursor: nw-resize;
}

.rte-fullpage rte-resizecorner {
    display: none;
}


.rte-office rte-ribbon-column {
    margin: 2px;
    border-style: solid;
    border-width: 1px;
    border-color: #bdd4f0;
    border-top-color: #c5d2df;
    border-left-color: #b7c8d7;
    border-right-color: #b8c9d7;
    border-bottom-color: #9ebfdb;
    border-radius: 3px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAABiCAYAAAB+koVqAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAACB0RVh0U29mdHdhcmUATWFjcm9tZWRpYSBGaXJld29ya3MgTVi7kSokAAAAFnRFWHRDcmVhdGlvbiBUaW1lADA1LzA2LzEynpvHdgAAAeNJREFUeJzt3bFtw0AUBcFP4/qv1InhRA4kOaAauE0IAjMVMFs8no46vn8e7wGATWtm5vfxvPo5ALiZNTPzfBkhAOxZMzPvt4AAsOcTkKsfA4C7OQNy9VMAcDteYQGQeIUFQCIgACSfMxAFAWCPBQJAIiAAJH6FBUCyZmZeVz8FALezZmYefz6mCMAeN9EBSL6ufgAA7klAAEgEBIBkzcwcVz8FALdjgQCQCAgAiYAAkKyZcQgCwDaH6AAkXmEBkAgIAIlXWAAkZ0AOCQFgj1dYACQCAkDiHggAiUN0ABILBIDEGQgAiYAAkDgDASCxQABIBASAREAASAQEgMQhOgCJi4QAJF5hAZBYIAAkFggAiYAAkAgIAImAAJCch+hO0QHYZIEAkAgIAIlPmQCQWCAAJJ+b6DYIAHssEAASAQEgERAAEgEBIBEQABL3QABILBAAEgEBIPGXtgAkFggAiQUCQGKBAJAICACJgACQCAgAiZvoACQWCACJBQJAYoEAkAgIAImAAJAICACJgACQCAgAiYAAkAgIAMl5kfBwlRCAPRYIAImAAJAICACJgACQrJnxOV4AtlkgACTnAjFBANhkgQCQCAgAib+0BSCxQABIBASAxD0QABILBIBEQABIBASA5B+/giW9vHXuqwAAAABJRU5ErkJggg==');
    background-repeat: repeat-x;
}


rte-control-toolbar {
    border-radius: 6px;
    background: rgba(255,255,255,.98);
    padding: 2px 3px;
    border: 1px solid #d1d5db;
    box-shadow: 0 4px 20px rgba(0,0,0,.15);
    backdrop-filter: blur(10px);
    opacity: 0.98;
}

    rte-control-toolbar:hover {
        opacity: 1;
    }

.rte-modern rte-control-toolbar rte-toolbar-button, .rte-modern rte-control-toolbar rte-toolbar-splitbutton, .rte-modern rte-control-toolbar rte-toolbar-dropdown {
    margin: 0;
    border-radius: 4px;
    width: 30px;
    height: 28px;
    padding: 0;
}

.rte-modern rte-control-toolbar rte-toolbar-button svg,
.rte-modern rte-control-toolbar rte-toolbar-splitbutton svg,
.rte-modern rte-control-toolbar rte-toolbar-dropdown svg,
.rte-modern rte-control-toolbar rte-toolbar-arrowbutton svg {
    width: 18px;
    height: 18px;
}

.rte-modern rte-control-toolbar rte-toolbar-arrowbutton {
    margin: 0;
    border-radius: 4px;
    height: 28px;
    width: 40px;
    padding-right: 12px;
    background-position: 26px 9px;
    background-size: 12px 12px;
}

.rte-modern rte-control-toolbar rte-line-break {
    margin: 0 3px;
}

rte-ribbon-group-left {
    margin-bottom: 4px;
}

rte-ribbon-group-right {
    margin-left: 5px;
}

rte-ribbon-main {
    padding: 5px 5px 1px;
}

rte-ribbon-text {
    padding-top: 2px;
    color: #3e6ac1;
    background-color: #c1d9f1;
    font-family: arial !important;
    font-size: 11px !important;
    border-left: solid 1px #d2eaf2;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}


rte-ribbon-group-big {
    border: solid 1px #9cb9dc;
    margin-bottom: 4px;
}

.rte-office rte-ribbon-group-big rte-toolbar-button {
    width: 40px;
    height: 40px;
    cursor: pointer;
}

rte-ribbon-group-big > *:first-child {
    flex: 9999;
}

rte-ribbon-group-small {
    border: solid 1px #9cb9dc;
    border-radius: 3px;
    height: 22px;
}


rte-toolbar-group {
    display: inline-flex;
    flex-direction: row;
    padding: 2px;
}

.rte-toolbar-mobile rte-toolbar-group {
    padding: 1px;
}

.rte-office rte-toolbar-group {
    height: 22px;
    border: solid 1px #9cb9dc;
    border-radius: 3px;
    margin-right: 2px;
    margin-bottom: 4px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAUCAYAAACqJ5zlAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAACB0RVh0U29mdHdhcmUATWFjcm9tZWRpYSBGaXJld29ya3MgTVi7kSokAAAAFnRFWHRDcmVhdGlvbiBUaW1lADA1LzA3LzEyJiegEwAAAFZJREFUeJyFzikSgFAMA9B0weG4/7E4ASdgEEV8FktSQeWbpo2t2/7gM3mcFwjcnAFmDNY2YAqycdNTIKuKYYzBMEXIW//r4a2pRtxbRCBCIqE3ljkJXvG0DxgqeYzsAAAAAElFTkSuQmCC');
    background-repeat: repeat-x;
}

rte-dropdown-head {
    background-color: transparent;
    user-select: none;
}



rte-dropdown-panel {
    text-align: left;
    background-color: #fff;
    user-select: none;
    display: flex;
    flex-direction: column;
    min-height: 50px;
    border: 1px solid #e2e2e2;
    box-shadow: 0px 10px 40px 10px rgba(140, 152, 164, 0.175);
    border-radius: 0.3125rem;
    padding: 1rem 0;
}

/* Insert-video URL dialog: widen so long YouTube/Vimeo URLs aren't truncated. */
rte-dropdown-panel.rte-panel-insertvideo {
    min-width: 406px;
}
rte-dropdown-panel.rte-panel-insertvideo textarea {
    width: 100%;
    min-height: 60px;
}

    rte-dropdown-panel rte-toolbar-group {
        flex-direction: column;
    }

    rte-dropdown-panel rte-dropdown-menuitem {
        margin: 1px 0;
        padding: 1px 0;
        align-items: center;
        white-space: nowrap;
        outline: none;
    }

        rte-dropdown-panel rte-dropdown-menuitem rte-dropdown-menuitem-label {
            font-size: 13px;
            padding-right: 12px;
        }

        rte-dropdown-panel rte-dropdown-menuitem:hover {
            background-color: #f1f3f4;
        }

        rte-dropdown-panel rte-dropdown-menuitem:focus-visible {
            background-color: #eef4ff;
            box-shadow: inset 0 0 0 1px rgba(37,99,235,.28);
        }

    rte-dropdown-panel.rte-menu-hideicon rte-toolbar-button {
        display: none;
    }

    rte-dropdown-panel.rte-menu-hideicon rte-dropdown-menuitem {
        padding: 5px 13px;
    }

rte-subtoolbar {
    padding: 2px 7px;
    background-color: #fff;
    border-bottom: solid 1px #eee;
}

rte-toolbar-splitbutton {
    display: flex;
}

rte-toolbar-button {
    display: inline-flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    outline: none;
}

rte-toolbar-splitbutton {
    border: solid 1px transparent;
    padding: 1px;
    margin: 4px 3px;
    width: 42px;
    height: 28px;
    outline: none;
}

    rte-toolbar-splitbutton:hover {
        background-color: #f2f2f2;
        border: solid 1px #e2e2e2;
    }

        rte-toolbar-splitbutton:hover rte-toolbar-splitbutton-direct {
        }

        rte-toolbar-splitbutton:hover rte-toolbar-splitbutton-dropdown {
            border-left: solid 1px #e2e2e2;
        }


rte-dropdown-menuitem rte-toolbar-splitbutton {
    width: 28px;
}

rte-dropdown-menuitem rte-toolbar-splitbutton-direct {
}

rte-dropdown-menuitem rte-toolbar-splitbutton-dropdown {
    display: none;
}

.rte-modern rte-toolbar-splitbutton.rte-command-active {
    background-color: #e8f0fe;
    fill: #377dff;
    padding: 1px;
}

rte-toolbar-splitbutton-direct {
    display: inline-flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    width: 24px;
}

rte-toolbar-splitbutton-dropdown {
    border-left: solid 1px transparent;
    width: 14px;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMjAgNTEyIiBjbGFzcz0ic3ZnLWlubGluZS0tZmEgZmEtYW5nbGUtZG93biBmYS13LTEwIj48cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik0xNDMgMzUyLjNMNyAyMTYuM2MtOS40LTkuNC05LjQtMjQuNiAwLTMzLjlsMjIuNi0yMi42YzkuNC05LjQgMjQuNi05LjQgMzMuOSAwbDk2LjQgOTYuNCA5Ni40LTk2LjRjOS40LTkuNCAyNC42LTkuNCAzMy45IDBsMjIuNiAyMi42YzkuNCA5LjQgOS40IDI0LjYgMCAzMy45bC0xMzYgMTM2Yy05LjIgOS40LTI0LjQgOS40LTMzLjggMHoiIGNsYXNzPSIiPjwvcGF0aD48L3N2Zz4=');
    background-position: 1px center;
    background-repeat: no-repeat;
    background-size: 12px 12px;
}

rte-color-button-mask {
    position: absolute;
    width: 16px;
    height: 3px;
    left: 5px;
    top: 18px;
}


.rte-office rte-toolbar-button {
    width: 20px;
    height: 20px;
}


.rte-office rte-toolbar-group rte-toolbar-button {
    width: 22px;
    border-left: solid 1px #d8e6f7;
    border-right: solid 1px #abc1de;
}

    .rte-office rte-toolbar-group rte-toolbar-button:first-child {
        width: 21px;
        border-left-width: 0px;
        border-right: solid 1px #abc1de;
    }

    .rte-office rte-toolbar-group rte-toolbar-button:last-child {
        width: 21px;
        border-left: solid 1px #d8e6f7;
        border-right-width: 0px;
    }

.rte-office rte-toolbar-group rte-toolbar-dropdown:first-child {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.rte-office rte-toolbar-group rte-toolbar-dropdown:last-child {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    border-left: solid 1px #d8e6f7;
    border-right-width: 0px;
}


.rte-modern rte-toolbar-button {
    margin: 4px 3px;
    padding: 1px;
    border: solid 1px transparent;
    width: 28px;
    height: 28px;
    cursor: pointer;
}

    .rte-modern rte-toolbar-button.rte-command-active {
        background-color: #e8f0fe;
        fill: #377dff;
        padding: 1px;
    }

.rte-toolbar-mobile rte-toolbar-group rte-toolbar-button {
    margin: 3px 2px;
}

.rte-office rte-toolbar-arrowbutton {
    width: 32px;
    padding-right: 12px;
    height: 20px;
}

.rte-modern rte-toolbar-arrowbutton {
    margin: 4px 3px;
    border: solid 1px transparent;
    padding: 1px;
    padding-right: 11px;
    width: 38px;
    height: 28px;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMjAgNTEyIiBjbGFzcz0ic3ZnLWlubGluZS0tZmEgZmEtYW5nbGUtZG93biBmYS13LTEwIj48cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik0xNDMgMzUyLjNMNyAyMTYuM2MtOS40LTkuNC05LjQtMjQuNiAwLTMzLjlsMjIuNi0yMi42YzkuNC05LjQgMjQuNi05LjQgMzMuOSAwbDk2LjQgOTYuNCA5Ni40LTk2LjRjOS40LTkuNCAyNC42LTkuNCAzMy45IDBsMjIuNiAyMi42YzkuNCA5LjQgOS40IDI0LjYgMCAzMy45bC0xMzYgMTM2Yy05LjIgOS40LTI0LjQgOS40LTMzLjggMHoiIGNsYXNzPSIiPjwvcGF0aD48L3N2Zz4=');
    background-position: 23px 8px;
    background-repeat: no-repeat;
    background-size: 12px 12px;
    cursor: pointer;
}

    .rte-modern rte-toolbar-arrowbutton.rte-command-active {
        background-color: #eee;
        border-bottom-width: 0px;
        padding: 1px 11px 10px 1px;
        background-position: 22px center;
        height: 36px;
        margin-bottom: -4px;
        background-position: 23px 8px;
    }

.rte-modern rte-toolbar-button:hover {
    background-color: #f1f3f4;
}

.rte-modern rte-toolbar-arrowbutton:hover {
    background-color: #f1f3f4;
}

.rte-modern rte-toolbar-dropdown:hover {
    background-color: #fff;
}

.rte-modern rte-toolbar-button:focus-visible,
.rte-modern rte-toolbar-arrowbutton:focus-visible,
.rte-modern rte-toolbar-dropdown:focus-visible,
.rte-modern rte-toolbar-splitbutton:focus-visible,
rte-toolbar-splitbutton-direct:focus-visible,
rte-toolbar-splitbutton-dropdown:focus-visible,
rte-dropdown-panel rte-toolbar-button:focus-visible,
rte-toolbar-dropdown-item:focus-visible,
rte-dialog-button:focus-visible,
rte-dialog-header-close:focus-visible {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37,99,235,.18);
    background-color: #eef4ff;
}

rte-toolbar-splitbutton-direct:focus-visible,
rte-toolbar-splitbutton-dropdown:focus-visible {
    border-radius: 3px;
}

.rte-modern .rte_command_togglemore.rte-command-active {
    background-color: #f4f4f4;
    border: solid 1px #eee;
    border-bottom-width: 0px;
    padding: 1px 1px 1px 1px;
}

rte-dropdown-panel rte-toolbar-button {
    margin: 0px 3px;
    padding: 2px;
    width: 28px;
    height: 28px;
}

    rte-dropdown-panel rte-toolbar-button.rte-command-active {
        background-color: #eee;
        padding: 1px;
    }

.rte-command-disabled {
    opacity: 0.2;
}

rte-toolbar-dropdown {
    margin-left: 0px;
    margin-right: 0px;
}

rte-control-toolbar.rte-modern rte-toolbar-dropdown {
    border: solid 1px #e2e8f0;
    margin: 4px;
    border-radius: 10px;
    background: #fff;
}

.rte-modern rte-control-toolbar rte-toolbar-button:hover,
.rte-modern rte-control-toolbar rte-toolbar-splitbutton:hover,
.rte-modern rte-control-toolbar rte-toolbar-dropdown:hover,
.rte-modern rte-control-toolbar rte-toolbar-arrowbutton:hover {
    background: #f3f6fb;
    fill: #0f172a;
    color: #0f172a;
}

.rte-modern rte-control-toolbar rte-toolbar-button.rte-command-active,
.rte-modern rte-control-toolbar rte-toolbar-splitbutton.rte-command-active,
.rte-modern rte-control-toolbar rte-toolbar-dropdown.rte-command-active,
.rte-modern rte-control-toolbar rte-toolbar-arrowbutton.rte-command-active {
    background: #eef2f7;
    fill: #0f172a;
    color: #0f172a;
}

.rte-office rte-toolbar-dropdown {
    background-color: #fff;
}

rte-toolbar-dropdown-arrow, rte-input-arrow {
    background-image: url('data:image/png;base64,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');
}

rte-input-arrow {
    position: absolute;
    right: 7px;
    top: 9px;
    width: 18px;
    height: 16px;
    background-size: 18px 16px;
    background-repeat: no-repeat;
    opacity: 0.7;
}

    rte-input-arrow:hover {
        opacity: 1.0;
        cursor: pointer;
    }

.rte-modern rte-toolbar-dropdown-input {
    padding: 0 7px;
    display: flex;
    align-items: center;
    white-space: nowrap;
}

.rte-modern rte-toolbar-dropdown-arrow {
    background-position: left center;
    background-size: 70% 30%;
    background-repeat: no-repeat;
    width: 18px;
    cursor: pointer;
}


.rte-office rte-toolbar-dropdown-input {
    padding-left: 3px;
}

.rte-office rte-toolbar-dropdown-arrow {
    background-position: center center;
    background-size: 50% 40%;
    background-repeat: no-repeat;
    width: 16px;
}

rte-toolbar-dropdown-item {
    font-size: 15px;
    padding: 0.375rem 1.5rem;
    cursor: pointer;
    white-space: nowrap;
    outline: none;
}

    rte-toolbar-dropdown-item:hover {
        background-color: #f2f2f2;
    }

    rte-toolbar-dropdown-item:focus-visible {
        color: #0f172a;
    }


.rte-office rte-line-break {
    display: block;
    width: 88%;
    margin: 0px 6% 4px;
    height: 5px;
    border-bottom: solid 1px #ccc;
}

.rte-modern rte-line-break {
    display: block;
    width: calc( 100% + 8px );
    margin: 0px -4px 0px -4px;
    height: 1px;
    border-bottom: 0.0625rem solid #ebedf2;
}

rte-line-spliter {
    width: 1px;
    height: 17px;
    margin: 10px auto !important;
    background: #e9e9e9;
}

rte-control-selected {
    position: absolute;
}

rte-control-selected-line {
    position: absolute;
    background-color: #377dff;
    min-width: 1px;
    min-height: 1px;
}

    rte-control-selected-line.rte-line-l {
        transform: translateX(-1px);
    }

    rte-control-selected-line.rte-line-t {
        transform: translateY(-1px);
    }

rte-control-selected-corner {
    position: absolute;
    width: 9px;
    height: 9px;
    background-color: #377dff;
}

    rte-control-selected-corner.rte-corner-l {
        cursor: ew-resize;
        transform: translateX(2px);
    }

    rte-control-selected-corner.rte-corner-r {
        cursor: ew-resize;
        transform: translateX(-2px);
    }

    rte-control-selected-corner.rte-corner-t {
        transform: translateY(2px);
        cursor: ns-resize;
    }

    rte-control-selected-corner.rte-corner-b {
        transform: translateY(-2px);
        cursor: ns-resize;
    }

    rte-control-selected-corner.rte-corner-tl {
        transform: translate(2px,2px);
        cursor: nw-resize;
    }

    rte-control-selected-corner.rte-corner-tr {
        transform: translate(-2px,2px);
        cursor: ne-resize;
    }

    rte-control-selected-corner.rte-corner-bl {
        transform: translate(2px,-2px);
        cursor: sw-resize;
    }

    rte-control-selected-corner.rte-corner-br {
        transform: translate(-2px,-2px);
        cursor: se-resize;
    }


rte-dialog-float {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 2px 2px 8px #999;
    right: 12px;
    top: 12px;
}

rte-dialog-outer {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
}

rte-dialog-inner {
    background-color: #fff;
    border-radius: 7px;
    padding: 10px 15px 10px;
    min-width: 300px;
    min-height: 200px;
    user-select: none;
    display: flex;
    flex-direction: column;
    position: relative;
}

    rte-dialog-inner rte-dialog-header {
        margin: -10px -15px 15px;
    }

    rte-dialog-inner rte-dialog-footer,
    rte-dialog-inner rte-dialog-line-action {
        margin: 2px;
    }

rte-dialog-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-bottom: 0.0625rem solid #e7eaf3;
    border-top-left-radius: 0.4375rem;
    border-top-right-radius: 0.4375rem;
    font-size: 1rem;
    color: #1e2022;
    font-weight: 600;
}

rte-dialog-header-close {
    font-size: 16px;
    opacity: 0.5;
    color: #666;
    transition: color linear 0.3s,opacity linear 0.3s;
    cursor: pointer;
    display: inline-block;
    position: absolute;
    top: 15px;
    right: 12px;
    width: 24px;
    height: 24px;
    padding: 2px;
}

    rte-dialog-header-close[rte-tooltip] {
        position: absolute;
    }

    rte-dialog-header-close svg {
        width: 16px;
        height: 16px;
        margin: 0px;
        vertical-align: top;
    }

    rte-dialog-header-close:hover {
        opacity: 1;
    }

    rte-dialog-header-close:focus-visible {
        opacity: 1;
        border-radius: 999px;
    }

rte-dialog-header-text {
    display: flex;
    align-items: center;
}

rte-dialog-footer, rte-dialog-line-action {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: end;
    justify-content: flex-end;
    border-top: 0.0625rem solid #e7eaf3;
    border-bottom-right-radius: 0.4375rem;
    border-bottom-left-radius: 0.4375rem;
    padding: 1rem 1.5rem 0 1.5rem;
    font-size: 1em;
    font-weight: bold;
}

.rte-dialog-line-input, rte-dialog-line-target {
    position: relative;
    margin: 12px;
}

    .rte-dialog-line-input input[type=text] {
        width: 100%;
        min-height: 36px;
        margin: 0;
        padding: 8px 10px;
        color: #333333;
        background: #ffffff;
        border: 1px solid #cccccc;
        border-radius: 4px;
        box-sizing: border-box;
        font-size: 13px;
        line-height: 1.4;
    }

    .rte-dialog-line-input input:hover, .rte-dialog-line-input input:focus {
        color: #1e2022;
        outline: 0;
        border-color: #0f8b8d;
        box-shadow: 0 0 0 2px rgba(15, 139, 141, 0.12);
    }

.rte-html-div {
    min-height: 200px;
    color: rgb(95, 99, 104);
    border: 1px solid rgb(218, 220, 224);
    border-image: initial;
    border-radius: 4px;
    padding: 5px;
    margin: 10px 0;
}

    .rte-html-div:hover, .rte-html-div:focus {
        color: #1e2022;
        outline: 0;
        border: 2px solid #1a73e8;
    }


.rte-dialog-line-input textarea {
    width: 100%;
    min-height: 80px;
    margin: 0;
    padding: 8px 10px;
    color: #333333;
    background: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 13px;
    line-height: 1.5;
    resize: vertical;
}


    .rte-dialog-line-input textarea:hover, .rte-dialog-line-input textarea:focus {
        color: #1e2022;
        outline: 0;
        border-color: #0f8b8d;
        box-shadow: 0 0 0 2px rgba(15, 139, 141, 0.12);
    }


.rte-dialog-line-input rte-dialog-input-label {
    background-color: white;
    box-shadow: white 5px 0px 0px, white -5px 0px 0px;
    color: rgb(95, 99, 104);
    display: inline;
    left: 12px;
    margin-bottom: 0px;
    max-width: 300px;
    position: absolute;
    top: -8px;
    overflow-wrap: break-word;
    padding: 0px;
}

rte-dialog-line-target rte-dialog-input-label {
    min-height: 20px;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: 400;
    cursor: pointer;
    display: inline-block;
    max-width: 100%;
}

.rte_insertlink_link input[type=checkbox] {
    margin: 4px 0 0 -20px;
    position: absolute;
    cursor: pointer;
}

rte-dialog-line-action {
    justify-content: flex-end;
}

.rte-dialog-footer-center {
    justify-content: center;
}

rte-dialog-button {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    margin: 4px 3px;
    padding: 6px 18px;
    border: 1px solid #0f8b8d;
    border-radius: 4px;
    color: #fff;
    background: #0f8b8d;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    box-shadow: none;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    outline: none;
}

    rte-dialog-button:active {
        background: #0c6f70;
        border-color: #0c6f70;
    }

    rte-dialog-button:hover {
        background: #0c7b7d;
        border-color: #0c7b7d;
    }

    rte-dialog-button:focus-visible {
        box-shadow: 0 0 0 3px rgba(15,139,141,.22);
    }

    rte-dialog-button.rte-button-type-next {
        margin-left: 25px;
    }

    rte-dialog-button.rte-button-type-replace, rte-dialog-button.rte-button-type-replaceall {
    }

    .rte-button-type-cancel, rte-dialog-button.rte-button-type-replace, rte-dialog-button.rte-button-type-replaceall {
        background-color: #fff;
        color: #0f8b8d;
        border-color: #0f8b8d;
    }

        .rte-button-type-cancel:hover, rte-dialog-button.rte-button-type-replace:hover, rte-dialog-button.rte-button-type-replaceall:hover {
            color: #fff;
            background: #0c7b7d;
            border-color: #0c7b7d;
        }

.rte-button-type-commit {
}



@media (min-width: 900px) {
    .rte-dialog-pasteauto rte-dialog-inner, .rte-dialog-pasteword rte-dialog-inner {
        width: 600px;
        min-height: 350px;
    }
}


.rte-dialog-insertgallery rte-dialog-inner, .rte-dialog-inserttemplate rte-dialog-inner {
    width: 900px;
    height: 600px;
    max-width: 90%;
    max-height: 90%;
}

.rte-dialog-insertcode rte-dialog-inner {
    width: 520px;
    height: 400px;
    max-width: 90%;
    max-height: 90%;
}

.rte-panel-insertimage-dragdrop rte-dialog-inner, .rte-panel-insertdocument-dragdrop rte-dialog-inner {
    width: 480px;
    max-width: 95%;
}


.rte-panel-controlinsertlink input[type=text], .rte-panel-controleditlink input[type=text], .rte-panel-insertlink input[type=text] {
    width: 320px;
}

.rte-panel-insertimage input[type=text], .rte-panel-insertdocument input[type=text] {
    width: 320px;
}

@media (max-width: 399px) {
    .rte-panel-controlinsertlink input[type=text], .rte-panel-controleditlink input[type=text], .rte-panel-insertlink input[type=text] {
        width: 280px;
    }

    .rte-panel-insertimage input[type=text], .rte-panel-insertdocument input[type=text] {
        width: 280px;
    }
}


rte-dropdown-panel.rte-panel-insertimage rte-tabui-toolbar, rte-dropdown-panel.rte-panel-insertdocument rte-tabui-toolbar, rte-dropdown-panel.rte-panel-controlsize rte-tabui-toolbar, rte-dropdown-panel.rte-panel-insertlink rte-tabui-toolbar {
    display: none;
}

.rte-panel-general {
}

    .rte-panel-general rte-dialog-header {
        margin: -10px -15px 10px;
    }

rte-inserttable-panel {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.rte-panel-inserttable {
    padding: 15px;
    min-width: 160px;
}

.rte-panel-find .rte-dialog-line-input {
    margin: 3px 0;
}

rte-tabui {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

.rte-panel-insertimage rte-tabui {
}

rte-tabui-toolbar {
    display: inline-flex;
    border-bottom: solid 1px #dee2e6;
}

rte-tabui-panel {
    display: flex;
    flex-direction: column;
    position: relative;
    flex: 999;
    padding: 0.75rem 0.75rem;
}

rte-tabui-toolbar-button {
    cursor: pointer;
    color: #737373;
    margin-bottom: -0.125rem;
    border-bottom: solid 2px transparent;
    padding: 1rem;
    font-size: 16px;
    cursor: pointer;
    transition: color 0.18s ease, border-color 0.18s ease, background-color 0.18s ease;
    outline: none;
}

    rte-tabui-toolbar-button.rte-ui-active {
        border-bottom: 2px solid #4b5563;
        color: #374151;
    }

    rte-tabui-toolbar-button:hover {
        color: #1f2937;
        background: rgba(148, 163, 184, 0.08);
    }

    rte-tabui-toolbar-button:focus-visible {
        color: #1f2937;
        background: rgba(59, 130, 246, 0.08);
        border-bottom-color: #2563eb;
        box-shadow: inset 0 -1px 0 #2563eb;
    }

.rte-panel-forecolor, .rte-panel-backcolor {
    padding: 15px;
}

rte-dialog-line-auto, rte-dialog-line-more {
    display: flex;
    padding: 3px;
    cursor: pointer;
}

    rte-dialog-line-auto:hover, rte-dialog-line-more:hover {
        display: flex;
        padding: 2px;
        border: solid 1px #1a73e8;
        background-color: #ddeafb;
    }

rte-dialog-item-label {
    flex: 999;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 13px;
    padding-right: 6px;
}

rte-dialog-line-colors {
    display: block;
    padding: 1px;
}

rte-dialog-item-color {
    display: inline-block;
    border: solid 1px #666;
    width: 16px;
    height: 16px;
    margin: 2px;
    cursor: pointer;
}

rte-dialog-item-color:hover {
        border-color: #1a73e8;
    }

/* RichTextBox-style toolbar color popup */
rte-dropdown-panel.rte-panel-forecolor, rte-dropdown-panel.rte-panel-backcolor {
    border-radius: 8px !important;
    box-shadow: 0 8px 30px rgba(0,0,0,.12) !important;
    padding: 12px 14px !important;
    border: 1px solid #e2e8f0 !important;
}

rte-dropdown-panel.rte-panel-forecolor rte-dialog-item-color[rte-tooltip],
rte-dropdown-panel.rte-panel-backcolor rte-dialog-item-color[rte-tooltip] {
    width: 20px !important;
    height: 20px !important;
    border-radius: 3px !important;
    margin: 2px !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    transition: transform .1s, box-shadow .1s !important;
}

rte-dropdown-panel.rte-panel-forecolor rte-dialog-item-color[rte-tooltip]:hover,
rte-dropdown-panel.rte-panel-backcolor rte-dialog-item-color[rte-tooltip]:hover {
    transform: scale(1.25) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.18) !important;
    z-index: 1 !important;
    position: relative !important;
    border-color: rgba(0,0,0,.08) !important;
}

rte-dropdown-panel.rte-panel-forecolor rte-dialog-line-auto,
rte-dropdown-panel.rte-panel-backcolor rte-dialog-line-auto,
rte-dropdown-panel.rte-panel-forecolor rte-dialog-line-more,
rte-dropdown-panel.rte-panel-backcolor rte-dialog-line-more {
    padding: 5px 4px !important;
    margin-top: 4px !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

rte-dropdown-panel.rte-panel-forecolor rte-dialog-line-auto:hover,
rte-dropdown-panel.rte-panel-backcolor rte-dialog-line-auto:hover,
rte-dropdown-panel.rte-panel-forecolor rte-dialog-line-more:hover,
rte-dropdown-panel.rte-panel-backcolor rte-dialog-line-more:hover {
    background: #f1f5f9 !important;
    border: 0 !important;
}

rte-dropdown-panel.rte-panel-forecolor rte-dialog-line-auto rte-dialog-item-label,
rte-dropdown-panel.rte-panel-backcolor rte-dialog-line-auto rte-dialog-item-label,
rte-dropdown-panel.rte-panel-forecolor rte-dialog-line-more rte-dialog-item-label,
rte-dropdown-panel.rte-panel-backcolor rte-dialog-line-more rte-dialog-item-label {
    font-size: 13px !important;
    color: #334155 !important;
}

rte-dropdown-panel.rte-panel-forecolor rte-dialog-line-auto rte-dialog-item-color,
rte-dropdown-panel.rte-panel-backcolor rte-dialog-line-auto rte-dialog-item-color {
    width: 20px !important;
    height: 20px !important;
    border-radius: 3px !important;
    border: 1px solid #cbd5e1 !important;
}

rte-dropdown-panel.rte-panel-forecolor rte-dialog-line-more rte-dialog-item-color,
rte-dropdown-panel.rte-panel-backcolor rte-dialog-line-more rte-dialog-item-color {
    width: 20px !important;
    height: 20px !important;
    border-radius: 3px !important;
    border: 1px solid #cbd5e1 !important;
    background: linear-gradient(135deg, #ff0000 0%, #ff8800 17%, #ffff00 33%, #00ff00 50%, #00ffff 67%, #0000ff 83%, #ff00ff 100%) !important;
}

.rte-dialog-colorpicker {
    min-height: 350px;
}

.colorcell {
    width: 22px;
    height: 22px;
    padding: 1px;
    cursor: pointer;
    vertical-align: middle;
}

.colordiv, .customdiv,
.colordiv2, .customdiv2 {
    border: solid 1px rgba(148, 163, 184, 0.45);
    border-radius: 3px;
    width: 18px;
    height: 18px;
    font-size: 1px;
    transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.colorcell:hover .colordiv,
.colorcell:hover .customdiv,
.colorcell:hover .colordiv2,
.colorcell:hover .customdiv2 {
    transform: scale(1.25);
    border-color: #334155;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.18);
    z-index: 1;
    position: relative;
}

.rte-dialog-colorpicker table {
    border-collapse: separate;
    border-spacing: 2px;
    margin: 0 auto;
}

.rte-panel-insertchars rte-tabui-toolbar {
    padding-left: 1.5rem;
}

.rte-panel-insertchars rte-tabui-toolbar-button {
    padding: 0.5rem;
    font-size: 13px;
}

rte-insertchars-item {
    width: 24px;
    height: 24px;
    margin: 1px;
    vertical-align: middle;
    text-align: center;
    border: 1px dotted rgb(221, 221, 221);
    font-size: 16px;
    cursor: pointer;
}

    rte-insertchars-item:hover {
        background-color: #c3d9ff;
    }

rte-inserttable-table {
    display: flex;
    flex-direction: column;
    cursor: pointer;
}

rte-inserttable-row {
    display: flex;
    flex-direction: row;
}

rte-inserttable-cell {
    width: 16px;
    height: 16px;
    margin: 3px;
    border: solid 1px gray;
    border-color: #e9e9e9;
    background-color: #f8f8f8;
}

    rte-inserttable-cell.rte-ui-active {
        border-color: #c3d9ff;
        background-color: #ddeafb;
    }

.rte-dialog-preview rte-dialog-inner {
    min-width: 70%;
    min-height: 70%;
}

    .rte-dialog-preview rte-dialog-inner rte-tabui {
        flex: 99;
        position: relative;
    }

.rte-dialog-preview rte-tabui-panel {
    flex-direction: row;
    justify-content: center;
}

.rte-dialog-preview rte-preview-framecontainer {
    padding: 5px;
    margin: 5px;
    box-shadow: 0px 0px 6px #ccc;
}

.rte-preview-dialog-fullscreen {
    width: 98%;
    height: 98%;
    border-radius: 0px !important;
    display: flex;
    flex-direction: column;
}


.rte-flex-column-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.rte-flex-wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
}

.rte-panel-insertemoji {
    padding: 1rem 1.5rem;
}

    .rte-panel-insertemoji rte-tabui-toolbar-button {
        padding: 0.5rem 0;
    }

    .rte-panel-insertemoji rte-tabui-toolbar {
        border: none;
    }

#emojis_searchbar:before {
    content: "";
    position: absolute;
    right: 10px;
    top: 8px;
    bottom: 8px;
    width: 20px;
    height: 20px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' viewBox='0 0 25 25' fill-rule='evenodd'%3E%3Cpath d='M16.036 18.455l2.404-2.405 5.586 5.587-2.404 2.404zM8.5 2C12.1 2 15 4.9 15 8.5S12.1 15 8.5 15 2 12.1 2 8.5 4.9 2 8.5 2zm0-2C3.8 0 0 3.8 0 8.5S3.8 17 8.5 17 17 13.2 17 8.5 13.2 0 8.5 0zM15 16a1 1 0 1 1 2 0 1 1 0 1 1-2 0'%3E%3C/path%3E%3C/svg%3E") center / contain no-repeat;
}

#emoji-picker {
    font-size: 20px;
}

    #emoji-picker gspan {
        cursor: pointer;
    }

.rte-dialog-insertcode select {
    margin: 3px 12px;
    height: 22px;
    border: solid 1px #ccc;
}

.rte-dialog-insertcode textarea {
    color: rgb(95, 99, 104);
    border: 1px solid rgb(218, 220, 224);
    margin: 8px 3px;
    padding: 5px;
    resize: both;
    min-width: 200px;
    min-height: 200px;
}

    .rte-dialog-insertcode textarea:focus {
        color: #1e2022;
        outline: 0;
        border: 2px solid #1a73e8;
    }

rte-dropdown-panel rte-dialog-header {
    display: none;
}

.rte-panel-insertimage rte-dialog-header, .rte-panel-insertdocument rte-dialog-header {
    display: none;
}

[rte-tooltip] {
    position: relative;
}

    [rte-tooltip]:hover {
        z-index: 99999999;
    }

@keyframes rte-tooltip {
    0% {
        opacity: 0.0;
    }

    90% {
        opacity: 0.0;
    }

    100% {
        opacity: 1.0;
    }
}


[rte-tooltip]:hover:before, [rte-tooltip]:hover:after {
    animation: rte-tooltip linear 0.5s;
}

[rte-tooltip]:hover:after {
    content: attr(rte-tooltip);
    background: #000;
    padding: 5px;
    border-radius: 3px;
    display: inline-block;
    position: absolute;
    transform: translate(-50%,100%);
    margin: 0 auto;
    color: #FFF;
    min-width: 25px;
    bottom: -5px;
    left: 50%;
    text-align: center;
    font-size: 12px;
    white-space: pre;
}

[rte-tooltip]:hover:before {
    z-index: 1;
    bottom: -5px;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(0, 0, 0, 0);
    border-bottom-color: #000;
    border-width: 5px;
    margin-left: -5px;
}

.fileuploader-dragdrop {
    display: block;
    padding: 30px 0;
    margin: 30px 15px;
    background: #fff;
    border: 2px dotted #c2cdda;
    border-radius: 14px;
    text-align: center;
}

    .fileuploader-dragdrop:hover {
        background-color: #eee;
    }

    .fileuploader-dragdrop input[type="file"] {
        cursor: pointer;
    }

.rte-menu, rte-submenu {
    font-size: 13px;
}

.rte-menu {
    border: 1px solid transparent;
    box-shadow: rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
    rem-margin-top: 1.5rem;
    rem-margin-bottom: 3rem;
    min-width: 160px;
    padding: 10px 0;
}

rte-submenu {
    position: absolute;
    left: 100%;
    top: 0;
    padding: 10px 0;
    border-top: solid 1px transparent;
    border-left: solid 1px transparent;
    /* Match the dropdown panel popup styling. */
    background-color: #fff;
    user-select: none;
    display: flex;
    flex-direction: column;
    min-width: 160px;
    box-shadow: rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
}

rte-menuitemcontainer {
    position: relative;
}

rte-menuitem {
    display: flex;
    align-items: center;
    border: solid 1px transparent;
    margin: 2px 2px;
    outline: none;
}

    rte-menuitem:hover {
        background-color: #f1f3f4;
    }

    rte-menuitem:active {
        background-color: #f1f3f4;
    }

    rte-menuitem:focus-visible {
        background-color: #eef4ff;
        border-color: rgba(37,99,235,.28);
    }

rte-menuicon {
    width: 24px;
    height: 24px;
    margin: 1px;
    margin-left: 5px;
}

rte-menutext {
    margin-left: 3px;
    flex: 999;
}

rte-menuarrow {
    margin-right: 4px;
    font-family: sans-serif;
    font-size: 70%;
}

    rte-menuarrow:after {
        content: '\25BA';
    }

rte-menuspliter {
    display: block;
    border-top: 1px solid rgb(218, 220, 224);
    margin: 3px 0px 3px 28px;
}

.rte_command_paragraphs rte-toolbar-dropdown-item div {
    font-size: 15px;
    margin: 0px;
    padding: 0px;
}

.rte_command_paragraphs rte-toolbar-dropdown-item h1 {
    font-size: 32px;
    margin: 0px;
    padding: 0px;
}

.rte_command_paragraphs rte-toolbar-dropdown-item h2 {
    font-size: 27px;
    margin: 0px;
    padding: 0px;
}

.rte_command_paragraphs rte-toolbar-dropdown-item h3 {
    font-size: 24px;
    margin: 0px;
    padding: 0px;
}

.rte_command_paragraphs rte-toolbar-dropdown-item h4 {
    font-size: 21px;
    margin: 0px;
    padding: 0px;
}

.rte_command_paragraphs rte-toolbar-dropdown-item h5 {
    font-size: 18px;
    margin: 0px;
    padding: 0px;
}

.rte_command_paragraphs rte-toolbar-dropdown-item h6 {
    font-size: 15px;
    margin: 0px;
    padding: 0px;
}

rte-floatpanel {
    z-index: 101;
    background: rgba(255,255,255,.5) !important;
    border: solid 1px rgba(203,213,225,.55) !important;
    border-radius: 10px !important;
    width: 28px !important;
    height: auto;
    opacity: 0.35 !important;
    user-select: none;
    padding: 3px 2px !important;
    box-shadow: none !important;
    backdrop-filter: blur(6px);
    transition: opacity 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

    rte-floatpanel:hover,
    rte-floatpanel:focus-within,
    rte-floatpanel.is-active {
        opacity: 1 !important;
        background: rgba(255,255,255,.96) !important;
        border-color: #dbe4ee !important;
        box-shadow: 0 18px 44px rgba(15,23,42,.16), 0 3px 10px rgba(15,23,42,.08) !important;
    }

    rte-floatpanel rte-toolbar-button {
        width: 22px;
        height: 22px;
        margin: 1px 0;
        border-radius: 8px;
        filter: grayscale(1);
        opacity: 0.75;
        transition: filter 160ms ease, opacity 160ms ease, background-color 160ms ease;
    }

        rte-floatpanel:hover rte-toolbar-button,
        rte-floatpanel:focus-within rte-toolbar-button,
        rte-floatpanel.is-active rte-toolbar-button {
            filter: none;
            opacity: 1;
        }

        rte-floatpanel rte-toolbar-button:hover {
            background: #f3f6fb;
            fill: #0f172a;
            color: #0f172a;
        }


.rte-current-item {
    background-color: #eef2f7;
}

/* Optional development toggles for hiding editor chrome can live here. */


.rte-list-item {
    padding: 5px 5px 5px 12px;
    font-size: 14px;
}

    .rte-list-item:hover {
        background-color: #f2f2f2;
    }




rte-toast {
    position: fixed;
    z-index: 88888888;
    background-color: rgba(0,0,0,0.7);
    color: white;
    padding: 3px 6px;
    border-radius: 5px;
}

.rte-skin-blue {
    background-color: #ccdcee !important;
    border-color: #7e9db9 !important;
}

    .rte-skin-blue rte-content, .rte-skin-blue textarea {
        background-color: #fff;
    }

    .rte-skin-blue * {
    }

    .rte-skin-blue iframe {
    }

    .rte-skin-blue rte-toolbar {
        background-color: #ccdcee !important;
    }

    .rte-skin-blue rte-subtoolbar {
        background-color: #7e9db9 !important;
    }


    .rte-skin-blue rte-bottom {
        background-color: #ccdcee !important;
    }

    .rte-skin-blue rte-dialog-inner {
        background-color: #ccdcee !important;
    }

    .rte-skin-blue rte-dialog-header {
        background-color: #ccdcee !important;
        color: white !important;
    }

    .rte-skin-blue rte-dialog-line-action {
        color: white !important;
    }

.rte-skin-gray {
    background-color: #fafafa !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
}

    .rte-skin-gray rte-toolbar {
        background-color: #fafafa !important;
    }

    .rte-skin-gray rte-subtoolbar {
        background-color: #eeeeee !important;
    }

.rte-modern.rte-skin-gray .rte_command_togglemore.rte-command-active {
    background-color: #eeeeee !important;
}

.rte-skin-gray rte-bottom {
    background-color: #fafafa !important;
}

.rte-skin-gray rte-dialog-header {
    background-color: #fafafa !important;
}

.rte-skin-dark {
    background-color: #333 !important;
    border-color: #333 !important;
}

    .rte-skin-dark rte-content, .rte-skin-dark textarea {
        background-color: #333;
    }

    .rte-skin-dark * {
        color: #fff;
        fill: #fff;
    }

    .rte-skin-dark iframe {
        background-color: #fff;
    }

    .rte-skin-dark rte-toolbar {
        background-color: #333 !important;
    }

    .rte-skin-dark rte-subtoolbar {
        background-color: #666 !important;
    }

.rte-modern.rte-skin-dark .rte_command_togglemore.rte-command-active, .rte-modern.rte-skin-dark .rte-command-active {
    background-color: #666 !important;
}

.rte-skin-dark rte-bottom {
    background-color: #333 !important;
}

.rte-skin-dark rte-dialog-inner {
    background-color: #333 !important;
}

.rte-skin-dark rte-dialog-header {
    background-color: #333 !important;
    color: white !important;
}

.rte-skin-dark rte-dialog-line-action {
    background-color: #333 !important;
    color: white !important;
}

.rte-skin-rounded-corner.richtexteditor {
    border-radius: 7px;
}

.rte-skin-rounded-corner rte-toolbar {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

.rte-skin-rounded-corner rte-bottom {
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}

rte-content::-webkit-scrollbar {
    height: 5px;
    width: 5px;
    overflow: visible;
    background-color: transparent;
    box-shadow: none;
}

rte-content::-webkit-scrollbar-track {
    background: transparent;
}

rte-content::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: rgba(0,0,0,.1);
    background-clip: padding-box;
}

rte-content::-webkit-scrollbar-corner {
    background: transparent;
}

rte-content::-webkit-scrollbar-thumb:hover {
        background-color: rgba(0,0,0,.4);
        box-shadow: inset 1px 1px 1px rgba(0,0,0,.25)
    }

.rte-dialog-insertgallery rte-dialog-inner,
.rte-dialog-inserttemplate rte-dialog-inner {
    width: 1080px;
    max-width: 94vw;
    height: 78vh;
    max-height: 90vh;
    padding: 0;
    overflow: hidden;
    border-radius: 24px;
}

/* The default `rte-dialog-inner rte-dialog-header { margin: -10px -15px 15px; }`
   rule assumes the dialog has 10/15px padding to absorb it. The gallery /
   template dialogs override padding to 0, so the negative margin pulls the
   header outside the rounded clipping boundary and clips the first letter of
   the title. Reset the margin and add proper padding for these dialogs. */
.rte-dialog-insertgallery rte-dialog-inner rte-dialog-header,
.rte-dialog-inserttemplate rte-dialog-inner rte-dialog-header {
    margin: 0;
    padding: 18px 24px 14px;
}

.rte-dialog-browser,
.rte-gallery-browser {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: linear-gradient(180deg, #ffffff 0%, #f7f8fa 100%);
}

.rte-dialog-browser-header {
    padding: 18px 20px 0;
}

.rte-dialog-browser-kicker {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #0f8b8d;
}

.rte-dialog-browser-title {
    margin-top: 6px;
    font-size: 24px;
    font-weight: 700;
    color: #182235;
}

.rte-dialog-browser-copy {
    margin-top: 8px;
    line-height: 1.6;
    color: #475569;
}

.rte-dialog-browser-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
}

.rte-dialog-browser-search,
.rte-gallery-browser-search {
    min-height: 42px;
    border: 1px solid #cfd6e1;
    border-radius: 12px;
    padding: 0 14px;
    font-size: 14px;
    color: #111827;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%);
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

.rte-dialog-browser-search {
    flex: 1 1 auto;
    min-width: 0;
}

.rte-gallery-browser-search {
    width: 240px;
    max-width: 100%;
}

.rte-dialog-browser-search:focus,
.rte-gallery-browser-search:focus {
    outline: none;
    border-color: #6b7280;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(107, 114, 128, 0.12), inset 0 1px 2px rgba(15, 23, 42, 0.03);
}

.rte-dialog-browser-count {
    flex: none;
    border-radius: 999px;
    background: #f1f5f9;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 700;
    color: #334155;
}

.rte-dialog-browser-scrollpanel {
    flex: 1 1 auto;
    min-height: 0;
    padding: 0 20px 20px;
    overflow-y: auto;
}

.rte-dialog-browser-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 14px;
}

.rte-template-grid {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.rte-dialog-browser-card {
    width: 100%;
    border: 1px solid #d7dce4;
    border-radius: 20px;
    background: linear-gradient(180deg, #ffffff 0%, #f7f8fa 100%);
    padding: 0;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 12px 32px rgba(24, 34, 53, 0.08);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
    overflow: hidden;
}

.rte-dialog-browser-card:hover,
.rte-dialog-browser-card:focus,
.rte-dialog-browser-card.is-selected {
    outline: none;
    transform: translateY(-2px);
    border-color: #6b7280;
    box-shadow: 0 18px 38px rgba(24, 34, 53, 0.14);
}

.rte-template-card-preview {
    padding: 14px;
}

.rte-template-card-preview-body {
    position: relative;
    height: 190px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}

.rte-template-card-preview-canvas {
    color: #182235;
}

.rte-template-card-footer {
    border-top: 1px solid #e2e8f0;
    padding: 12px 14px 14px;
}

.rte-template-card-title {
    font-size: 15px;
    font-weight: 700;
    color: #182235;
}

.rte-template-card-meta {
    margin-top: 5px;
    font-size: 12px;
    color: #64748b;
    line-height: 1.5;
}

.rte-dialog-browser-empty,
.rte-gallery-browser-empty {
    border: 1px dashed #cbd5e1;
    border-radius: 20px;
    padding: 28px 22px;
    text-align: center;
    line-height: 1.7;
    color: #64748b;
    background: rgba(248, 250, 252, 0.9);
}

.rte-gallery-browser {
    display: flex;
    flex-direction: column;
}

.rte-gallery-browser-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-top: 1px solid #edf2f7;
    border-bottom: 1px solid #d7dde7;
    background: linear-gradient(180deg, #fbfcfe 0%, #edf1f7 100%);
    flex-wrap: wrap;
}

.rte-gallery-browser-button {
    border: 1px solid #c7d0db;
    border-radius: 10px;
    padding: 9px 14px;
    background: linear-gradient(180deg, #ffffff 0%, #eef2f7 100%);
    color: #243142;
    font-size: 13px;
    line-height: 1.2;
    cursor: pointer;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
    transition: border-color 0.16s ease, background-color 0.16s ease, transform 0.16s ease;
}

.rte-gallery-browser-button:hover {
    border-color: #8a94a4;
    background: linear-gradient(180deg, #ffffff 0%, #e9edf3 100%);
}

.rte-gallery-browser-button[disabled],
.rte-gallery-browser-button[aria-disabled="true"] {
    opacity: 0.55;
    cursor: not-allowed;
}

.rte-gallery-browser-button-primary {
    border-color: #374151;
    background: linear-gradient(180deg, #4b5563 0%, #374151 100%);
    color: #fff;
    font-weight: 600;
}

.rte-gallery-browser-button-primary:hover {
    border-color: #1f2937;
    background: linear-gradient(180deg, #435061 0%, #2f3947 100%);
}

.rte-gallery-browser-path,
.rte-gallery-browser-type {
    min-height: 38px;
    padding: 9px 12px;
    border: 1px solid #c6cfdd;
    border-radius: 8px;
    background-color: #fff;
    font-size: 13px;
    line-height: 18px;
}

.rte-gallery-browser-path {
    min-width: 64px;
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rte-gallery-browser-type {
    color: #475569;
}

.rte-gallery-browser-status {
    padding: 9px 16px;
    border-bottom: 1px solid #d7dde7;
    background-color: #f7f9fc;
    color: #415065;
    font-size: 13px;
}

.rte-gallery-browser-surface {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding: 18px 16px 20px;
}

.rte-gallery-browser-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 16px;
}

.rte-gallery-browser-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
    padding: 10px;
    border: 1px solid #d7dce4;
    border-radius: 12px;
    background: linear-gradient(180deg, #ffffff 0%, #f7f8fa 100%);
    text-align: left;
    cursor: pointer;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.rte-gallery-browser-card:hover,
.rte-gallery-browser-card.is-selected {
    border-color: #8a94a4;
    box-shadow: 0 10px 20px rgba(51, 65, 85, 0.08);
    transform: translateY(-1px);
    outline: none;
}

.rte-gallery-browser-card.is-selected {
    border-color: #4b5563;
    box-shadow: 0 0 0 3px rgba(75, 85, 99, 0.18);
}

.rte-gallery-browser-selection {
    height: 18px;
    color: #475569;
    font-size: 12px;
    line-height: 18px;
    font-weight: 600;
}

.rte-gallery-browser-thumbnail {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 112px;
    border: 1px solid #d6dde9;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f1f5fb 100%);
    overflow: hidden;
}

.rte-gallery-browser-thumbnail-image {
    max-width: 100%;
    max-height: 100%;
    display: block;
    object-fit: contain;
}

.rte-gallery-browser-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 600;
    color: #223046;
}

.rte-gallery-browser-meta {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #66768b;
    font-size: 12px;
}

.rte-gallery-browser-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 12px 16px;
    border-top: 1px solid #d7dde7;
    background: linear-gradient(180deg, #fbfcfe 0%, #edf1f7 100%);
}

.rte-gallery-browser-footer-text {
    margin-right: auto;
    color: #4f5f74;
    font-size: 13px;
}

rte-dropdown-panel.rte-panel-insertimage rte-dialog-inner,
rte-dropdown-panel.rte-panel-insertdocument rte-dialog-inner {
    width: 560px;
    max-width: 94vw;
    padding: 0 0 16px;
    overflow: hidden;
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f7f8fa 100%);
}

rte-dropdown-panel.rte-panel-insertimage rte-dialog-header,
rte-dropdown-panel.rte-panel-insertdocument rte-dialog-header {
    display: flex;
    align-items: center;
    padding: 18px 20px 12px;
    border-bottom: 1px solid #e2e8f0;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%);
}

rte-dropdown-panel.rte-panel-insertimage rte-dialog-header-text,
rte-dropdown-panel.rte-panel-insertdocument rte-dialog-header-text {
    font-size: 20px;
    font-weight: 700;
    color: #182235;
}

rte-dropdown-panel.rte-panel-insertimage .rte-dialog-line-input,
rte-dropdown-panel.rte-panel-insertdocument .rte-dialog-line-input {
    margin: 12px 16px 0;
}

rte-dropdown-panel.rte-panel-insertimage .rte-dialog-line-input input[type=text],
rte-dropdown-panel.rte-panel-insertdocument .rte-dialog-line-input input[type=text] {
    width: 100%;
    min-height: 36px;
    margin: 0;
    padding: 8px 10px;
    color: #333333;
    background: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 4px;
    box-shadow: none;
    font-size: 13px;
    line-height: 1.4;
}

rte-dropdown-panel.rte-panel-insertimage .rte-dialog-line-input input[type=text]:focus,
rte-dropdown-panel.rte-panel-insertdocument .rte-dialog-line-input input[type=text]:focus {
    outline: none;
    border-color: #0f8b8d;
    box-shadow: 0 0 0 2px rgba(15, 139, 141, 0.12);
}

.rte-insertimage-intro,
.rte-insertdocument-intro {
    margin: 12px 16px 0;
    font-size: 13px;
    line-height: 1.6;
    color: #475569;
}

.rte-insertimage-preview,
.rte-insertdocument-preview {
    margin: 12px 16px 0;
    border: 1px solid #d7dce4;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, #f7f8fa 100%);
    padding: 14px;
}

.rte-insertimage-preview-image {
    display: block;
    max-width: 100%;
    max-height: 220px;
    margin: 0 auto;
    object-fit: contain;
}

.rte-insertimage-preview.is-empty .rte-insertimage-preview-image {
    display: none;
}

.rte-insertimage-preview-caption {
    margin-top: 10px;
    text-align: center;
    font-size: 13px;
    line-height: 1.6;
    color: #475569;
}

.rte-insertimage-preview.is-error .rte-insertimage-preview-caption {
    color: #b91c1c;
}

.rte-insertdocument-preview {
    display: flex;
    align-items: center;
    gap: 14px;
}

.rte-insertdocument-preview-icon {
    width: 56px;
    height: 56px;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: linear-gradient(180deg, #eef2f7 0%, #dbe3ee 100%);
    border: 1px solid #c8d2df;
}

.rte-insertdocument-preview-ext {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: #374151;
}

.rte-insertdocument-preview-title {
    font-size: 15px;
    font-weight: 700;
    color: #182235;
    word-break: break-word;
}

.rte-insertdocument-preview-meta {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.6;
    color: #64748b;
    word-break: break-word;
}

.rte-insertdocument-preview.is-empty .rte-insertdocument-preview-title {
    color: #475569;
}

rte-dropdown-panel.rte-panel-insertimage .rte-dialog-line-action,
rte-dropdown-panel.rte-panel-insertdocument .rte-dialog-line-action {
    margin: 14px 16px 0;
    padding: 0;
}

rte-dropdown-panel.rte-panel-insertimage .rte-dialog-button,
rte-dropdown-panel.rte-panel-insertdocument .rte-dialog-button {
    min-height: 34px;
    padding: 6px 18px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    box-shadow: none;
}

rte-dropdown-panel.rte-panel-insertimage .rte-dialog-button:hover,
rte-dropdown-panel.rte-panel-insertdocument .rte-dialog-button:hover {
    background: #0c7b7d;
    border-color: #0c7b7d;
}

rte-dropdown-panel.rte-panel-insertimage .rte-dialog-button.rte-button-type-cancel,
rte-dropdown-panel.rte-panel-insertdocument .rte-dialog-button.rte-button-type-cancel {
    background: #ffffff;
    color: #0f8b8d;
    border-color: #0f8b8d;
}

rte-dropdown-panel.rte-panel-insertimage .rte-dialog-button.rte-button-type-cancel:hover,
rte-dropdown-panel.rte-panel-insertdocument .rte-dialog-button.rte-button-type-cancel:hover {
    background: #0c7b7d;
    color: #ffffff;
    border-color: #0c7b7d;
}

/* ===========================================================================
 * 2026-05-08 dialog polish layer — applies to every editor dialog (insert
 * video / link / image / code / table / find / template / gallery / etc.)
 *
 * Until this layer landed, every dialog inherited `min-width: 300px` from
 * the base `rte-dialog-inner` rule above. That worked for two-button
 * confirmations but felt cramped for URL fields, code editors, and any
 * dialog with a textarea — the input was about 270 px wide once you
 * subtracted the 12 px margin on each side.
 *
 * The rules below set sensible per-dialog defaults, modernise the input
 * chrome (subtle border, blue focus ring matching the AI Chat / AI Review
 * panels), and add comfortable header / footer padding. Mobile fallback at
 * the bottom keeps dialogs viewport-bound on small screens.
 * ======================================================================= */

/* Default: bump every dialog from a 300 px-wide pill to a sensible 440 px
   card with a generous max-width, viewport-bound. */
rte-dialog-outer rte-dialog-inner {
    min-width: 440px;
    max-width: min(720px, calc(100vw - 32px));
    padding: 16px 20px 16px;
    border-radius: 10px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(20, 36, 58, 0.04);
}

/* Header: more breathing room around the title / close button. */
rte-dialog-outer rte-dialog-inner rte-dialog-header {
    margin: -16px -20px 14px;
    padding: 14px 20px 12px;
    align-items: center;
    border-bottom: 1px solid #eef1f5;
}

rte-dialog-outer rte-dialog-header-text {
    font-size: 15px;
    font-weight: 700;
    color: #1b2a3d;
    letter-spacing: -0.005em;
}

/* Close button: softer, tighter hit area, hover background */
rte-dialog-outer rte-dialog-header-close {
    top: 11px;
    right: 12px;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    padding: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 120ms ease, opacity 120ms ease;
}

rte-dialog-outer rte-dialog-header-close:hover {
    background-color: #f1f5f9;
    opacity: 1;
}

/* Input rows: tighten margin so the dialog doesn't waste vertical space,
   and modernise the text/textarea chrome to match the AI Toolkit look. */
rte-dialog-outer .rte-dialog-line-input,
rte-dialog-outer rte-dialog-line-target {
    margin: 14px 0;
}

rte-dialog-outer .rte-dialog-line-input input[type=text],
rte-dialog-outer .rte-dialog-line-input textarea {
    border-radius: 8px;
    border-color: rgba(20, 36, 58, 0.16);
    font-size: 13px;
    padding: 10px 12px;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

rte-dialog-outer .rte-dialog-line-input input:hover,
rte-dialog-outer .rte-dialog-line-input input:focus,
rte-dialog-outer .rte-dialog-line-input textarea:hover,
rte-dialog-outer .rte-dialog-line-input textarea:focus {
    border-color: rgba(21, 89, 214, 0.45);
    box-shadow: 0 0 0 3px rgba(21, 89, 214, 0.16);
}

/* The label that floats above the input (Url / Width / etc.) — modern
   feel: smaller, less shouty colour. */
rte-dialog-outer .rte-dialog-line-input rte-dialog-input-label {
    font-size: 11px;
    color: #64748b;
    font-weight: 600;
    letter-spacing: 0.02em;
}

/* Action row: align primary button to the right with extra padding. */
rte-dialog-outer rte-dialog-line-action,
rte-dialog-outer rte-dialog-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 14px 0 4px !important;
    padding-top: 0;
    border-top: 0;
}

rte-dialog-outer rte-dialog-button {
    min-height: 34px;
    padding: 0 16px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

/* === Per-dialog width hints === */

/* Insert video: just a URL textarea — bigger so users can paste long
   YouTube / Vimeo links without horizontal scroll. */
rte-dialog-outer.rte-dialog-insertvideo rte-dialog-inner {
    min-width: 520px;
}

rte-dialog-outer .rte-dialog-line-url textarea {
    min-height: 64px;
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 12.5px;
    word-break: break-all;
}

/* Insert link / image-by-url: same family — bigger than the default, but
   not as wide as the code editor. */
rte-dialog-outer.rte-dialog-insertlink rte-dialog-inner,
rte-dialog-outer.rte-panel-insertimage-byurl rte-dialog-inner,
rte-dialog-outer.rte-panel-insertdocument-byurl rte-dialog-inner {
    min-width: 480px;
}

/* Insert code: monospace editor area needs real width to read code. */
rte-dialog-outer.rte-dialog-insertcode rte-dialog-inner {
    min-width: 640px;
    max-width: min(880px, calc(100vw - 32px));
}

/* Insert table / find / general — keep a consistent 460 px floor. */
rte-dialog-outer.rte-panel-find rte-dialog-inner,
rte-dialog-outer.rte-panel-general rte-dialog-inner {
    min-width: 460px;
}

/* Insert gallery / template / paste cleanup — comfortable wide layouts
   for picking from a grid. */
rte-dialog-outer.rte-dialog-insertgallery rte-dialog-inner,
rte-dialog-outer.rte-dialog-inserttemplate rte-dialog-inner,
rte-dialog-outer.rte-dialog-pasteauto rte-dialog-inner,
rte-dialog-outer.rte-dialog-pasteword rte-dialog-inner {
    min-width: 720px;
    max-width: min(960px, calc(100vw - 32px));
}

/* Image editor / HTML2PDF — full creative surface. */
rte-dialog-outer.rte-dialog-imageeditor rte-dialog-inner,
rte-dialog-outer.rte-dialog-html2pdf rte-dialog-inner {
    min-width: 760px;
    max-width: min(1080px, calc(100vw - 32px));
}

/* === Mobile fallback === */
@media (max-width: 640px) {
    rte-dialog-outer rte-dialog-inner,
    rte-dialog-outer.rte-dialog-insertvideo rte-dialog-inner,
    rte-dialog-outer.rte-dialog-insertlink rte-dialog-inner,
    rte-dialog-outer.rte-panel-insertimage-byurl rte-dialog-inner,
    rte-dialog-outer.rte-dialog-insertcode rte-dialog-inner,
    rte-dialog-outer.rte-panel-find rte-dialog-inner,
    rte-dialog-outer.rte-panel-general rte-dialog-inner,
    rte-dialog-outer.rte-dialog-insertgallery rte-dialog-inner,
    rte-dialog-outer.rte-dialog-inserttemplate rte-dialog-inner,
    rte-dialog-outer.rte-dialog-imageeditor rte-dialog-inner,
    rte-dialog-outer.rte-dialog-html2pdf rte-dialog-inner {
        min-width: 0;
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
        padding: 12px 14px;
    }
}

/* ===========================================================================
 * 2026-06-06 dialog system refresh
 *
 * Global pass for every dialog created through editor.createDialog. This sits
 * after the earlier dialog polish layer so it can normalize the shell without
 * changing individual dialog JavaScript.
 * ======================================================================= */

rte-dialog-outer {
    background:
        radial-gradient(circle at 50% 18%, rgba(96, 165, 250, 0.16), transparent 34%),
        rgba(15, 23, 42, 0.58);
    backdrop-filter: blur(4px);
}

rte-dialog-outer rte-dialog-inner {
    min-width: 460px;
    max-width: min(760px, calc(100vw - 32px));
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    box-shadow:
        0 26px 70px rgba(15, 23, 42, 0.26),
        0 0 0 1px rgba(255, 255, 255, 0.82) inset;
}

rte-dialog-outer rte-dialog-inner rte-dialog-header {
    min-height: 52px;
    margin: -16px -20px 18px;
    padding: 14px 52px 13px 20px;
    align-items: center;
    background:
        radial-gradient(circle at 20px 0, rgba(59, 130, 246, 0.16), transparent 42px),
        linear-gradient(180deg, #ffffff 0%, #f7faff 100%);
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

rte-dialog-outer rte-dialog-header-text {
    min-width: 0;
    color: #172033;
    font-size: 15px;
    font-weight: 750;
    letter-spacing: -0.01em;
}

rte-dialog-outer rte-dialog-header-close {
    top: 12px;
    right: 14px;
    width: 30px;
    height: 30px;
    padding: 7px;
    border-radius: 999px;
    color: #64748b;
    opacity: 0.78;
}

rte-dialog-outer rte-dialog-header-close:hover,
rte-dialog-outer rte-dialog-header-close:focus-visible {
    color: #0f172a;
    background: #eef4ff;
    opacity: 1;
}

rte-dialog-outer rte-dialog-header-close:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18);
}

rte-dialog-outer .rte-dialog-line-input,
rte-dialog-outer rte-dialog-line-target {
    margin: 16px 0;
}

rte-dialog-outer .rte-dialog-line-input input[type=text],
rte-dialog-outer .rte-dialog-line-input input[type=number],
rte-dialog-outer .rte-dialog-line-input input[type=url],
rte-dialog-outer .rte-dialog-line-input input[type=email],
rte-dialog-outer .rte-dialog-line-input textarea,
rte-dialog-outer .rte-dialog-line-input select {
    min-height: 38px;
    border-color: rgba(100, 116, 139, 0.24);
    border-radius: 11px;
    background: #ffffff;
    color: #172033;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

rte-dialog-outer rte-dialog-inner > div select,
rte-dialog-outer rte-dialog-inner > div textarea {
    min-height: 38px;
    border: 1px solid rgba(100, 116, 139, 0.24);
    border-radius: 11px;
    background: #ffffff;
    color: #172033;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

rte-dialog-outer rte-dialog-inner > div select {
    padding: 7px 34px 7px 11px;
}

rte-dialog-outer rte-dialog-inner > div textarea {
    padding: 11px 12px;
    line-height: 1.5;
}

rte-dialog-outer.rte-dialog-insertcode rte-dialog-inner > div select,
rte-dialog-outer.rte-dialog-insertcode rte-dialog-inner > div textarea {
    border-color: rgba(100, 116, 139, 0.24);
}

rte-dialog-outer.rte-dialog-insertcode rte-dialog-inner > div textarea {
    padding: 11px 12px;
}

rte-dialog-outer .rte-dialog-line-input input:hover,
rte-dialog-outer .rte-dialog-line-input input:focus,
rte-dialog-outer .rte-dialog-line-input textarea:hover,
rte-dialog-outer .rte-dialog-line-input textarea:focus,
rte-dialog-outer .rte-dialog-line-input select:hover,
rte-dialog-outer .rte-dialog-line-input select:focus,
rte-dialog-outer rte-dialog-inner > div select:hover,
rte-dialog-outer rte-dialog-inner > div select:focus,
rte-dialog-outer rte-dialog-inner > div textarea:hover,
rte-dialog-outer rte-dialog-inner > div textarea:focus {
    border-color: rgba(37, 99, 235, 0.48);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        0 0 0 3px rgba(37, 99, 235, 0.14);
}

rte-dialog-outer .rte-dialog-line-input rte-dialog-input-label {
    top: -9px;
    left: 14px;
    padding: 0 6px;
    border-radius: 999px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    box-shadow: none;
    color: #5b6b82;
    font-size: 11px;
    font-weight: 700;
}

rte-dialog-outer rte-dialog-line-action,
rte-dialog-outer rte-dialog-footer {
    gap: 10px;
    margin: 18px -20px -16px !important;
    padding: 14px 20px 16px;
    border-top: 1px solid rgba(148, 163, 184, 0.16);
    background: rgba(248, 251, 255, 0.78);
}

rte-dialog-outer rte-dialog-button {
    min-height: 36px;
    padding: 0 18px;
    border-radius: 999px;
    border-color: #1d4ed8;
    background: linear-gradient(180deg, #3b82f6 0%, #1d4ed8 100%);
    color: #ffffff;
    font-weight: 700;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.22);
}

rte-dialog-outer rte-dialog-button:hover {
    background: linear-gradient(180deg, #4f8ff7 0%, #2563eb 100%);
    border-color: #2563eb;
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.28);
}

rte-dialog-outer rte-dialog-button:active {
    background: #1d4ed8;
    border-color: #1d4ed8;
}

rte-dialog-outer .rte-button-type-cancel,
rte-dialog-outer rte-dialog-button.rte-button-type-replace,
rte-dialog-outer rte-dialog-button.rte-button-type-replaceall {
    color: #334155;
    background: #ffffff;
    border-color: rgba(100, 116, 139, 0.28);
    box-shadow: none;
}

rte-dialog-outer .rte-button-type-cancel:hover,
rte-dialog-outer rte-dialog-button.rte-button-type-replace:hover,
rte-dialog-outer rte-dialog-button.rte-button-type-replaceall:hover {
    color: #0f172a;
    background: #eef4ff;
    border-color: rgba(37, 99, 235, 0.32);
    box-shadow: none;
}

rte-dialog-outer rte-dialog-button:focus-visible {
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.22);
}

rte-dialog-outer .rte-dialog-tabcontainer {
    border-radius: 14px;
    overflow: hidden;
}

rte-dialog-outer .rte-dialog-browser,
rte-dialog-outer .rte-gallery-browser {
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(59, 130, 246, 0.1), transparent 34%),
        #ffffff;
}

rte-dialog-outer .rte-dialog-browser-card,
rte-dialog-outer .rte-gallery-browser-card {
    border-radius: 16px;
    border-color: rgba(100, 116, 139, 0.18);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

rte-dialog-outer .rte-dialog-browser-card:hover,
rte-dialog-outer .rte-dialog-browser-card:focus,
rte-dialog-outer .rte-dialog-browser-card.is-selected,
rte-dialog-outer .rte-gallery-browser-card:hover,
rte-dialog-outer .rte-gallery-browser-card.is-selected {
    border-color: rgba(37, 99, 235, 0.38);
    box-shadow: 0 14px 28px rgba(37, 99, 235, 0.14);
}

rte-dialog-outer.rte-dialog-preview rte-dialog-inner,
rte-dialog-outer.rte-dialog-shortcuts rte-dialog-inner,
rte-dialog-outer.rte-dialog-revisionhistory rte-dialog-inner {
    min-width: 720px;
    max-width: min(980px, calc(100vw - 32px));
}

rte-dialog-outer.rte-dialog-insertlink rte-dialog-inner,
rte-dialog-outer.rte-panel-controlinsertlink rte-dialog-inner,
rte-dialog-outer.rte-panel-controleditlink rte-dialog-inner,
rte-dialog-outer.rte-panel-insertimage-byurl rte-dialog-inner,
rte-dialog-outer.rte-panel-insertdocument-byurl rte-dialog-inner {
    min-width: 520px;
}

@media (max-width: 640px) {
    rte-dialog-outer {
        align-items: flex-start;
        padding: 12px;
        overflow: auto;
    }

    rte-dialog-outer rte-dialog-inner,
    rte-dialog-outer.rte-dialog-preview rte-dialog-inner,
    rte-dialog-outer.rte-dialog-shortcuts rte-dialog-inner,
    rte-dialog-outer.rte-dialog-revisionhistory rte-dialog-inner {
        min-width: 0;
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
        max-height: calc(100vh - 24px);
    }

    rte-dialog-outer rte-dialog-inner rte-dialog-header {
        margin-left: -14px;
        margin-right: -14px;
        padding-left: 14px;
    }

    rte-dialog-outer rte-dialog-line-action,
    rte-dialog-outer rte-dialog-footer {
        margin-left: -14px !important;
        margin-right: -14px !important;
        padding-left: 14px;
        padding-right: 14px;
    }
}

/* Dropdown command panels: link, image, table, color, special characters,
   and other toolbar panels should feel related to modal dialogs. */
rte-dropdown-panel {
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.2);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    box-shadow:
        0 18px 46px rgba(15, 23, 42, 0.18),
        0 0 0 1px rgba(255, 255, 255, 0.78) inset;
}

rte-dropdown-panel rte-dialog-header {
    margin: 0;
    padding: 12px 16px 11px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16);
    background:
        radial-gradient(circle at 18px 0, rgba(59, 130, 246, 0.12), transparent 40px),
        linear-gradient(180deg, #ffffff 0%, #f7faff 100%);
}

rte-dropdown-panel rte-dialog-header-text {
    color: #172033;
    font-size: 14px;
    font-weight: 750;
    letter-spacing: -0.005em;
}

rte-dropdown-panel .rte-dialog-line-input,
rte-dropdown-panel rte-dialog-line-target {
    margin: 14px 16px;
}

rte-dropdown-panel .rte-dialog-line-input input[type=text],
rte-dropdown-panel .rte-dialog-line-input input[type=number],
rte-dropdown-panel .rte-dialog-line-input input[type=url],
rte-dropdown-panel .rte-dialog-line-input textarea,
rte-dropdown-panel .rte-dialog-line-input select {
    min-height: 36px;
    padding: 9px 11px;
    border-color: rgba(100, 116, 139, 0.24);
    border-radius: 11px;
    background: #ffffff;
    color: #172033;
}

rte-dropdown-panel .rte-dialog-line-input input:hover,
rte-dropdown-panel .rte-dialog-line-input input:focus,
rte-dropdown-panel .rte-dialog-line-input textarea:hover,
rte-dropdown-panel .rte-dialog-line-input textarea:focus,
rte-dropdown-panel .rte-dialog-line-input select:hover,
rte-dropdown-panel .rte-dialog-line-input select:focus {
    border-color: rgba(37, 99, 235, 0.48);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

rte-dropdown-panel .rte-dialog-line-input rte-dialog-input-label {
    top: -9px;
    left: 14px;
    padding: 0 6px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: none;
    color: #5b6b82;
    font-size: 11px;
    font-weight: 700;
}

rte-dropdown-panel rte-dialog-line-action,
rte-dropdown-panel .rte-dialog-line-action,
rte-dropdown-panel rte-dialog-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 14px 0 0 !important;
    padding: 12px 16px 14px;
    border-top: 1px solid rgba(148, 163, 184, 0.16);
    background: rgba(248, 251, 255, 0.78);
}

rte-dropdown-panel rte-dialog-button,
rte-dropdown-panel .rte-dialog-button {
    min-height: 34px;
    padding: 0 16px;
    border-radius: 999px;
    border-color: #1d4ed8;
    background: linear-gradient(180deg, #3b82f6 0%, #1d4ed8 100%);
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 7px 16px rgba(37, 99, 235, 0.2);
}

rte-dropdown-panel rte-dialog-button:hover,
rte-dropdown-panel .rte-dialog-button:hover {
    background: linear-gradient(180deg, #4f8ff7 0%, #2563eb 100%);
    border-color: #2563eb;
}

rte-dropdown-panel .rte-button-type-cancel,
rte-dropdown-panel rte-dialog-button.rte-button-type-cancel {
    color: #334155;
    background: #ffffff;
    border-color: rgba(100, 116, 139, 0.28);
    box-shadow: none;
}

rte-dropdown-panel .rte-button-type-cancel:hover,
rte-dropdown-panel rte-dialog-button.rte-button-type-cancel:hover {
    color: #0f172a;
    background: #eef4ff;
    border-color: rgba(37, 99, 235, 0.32);
}

rte-dropdown-panel rte-dropdown-menuitem {
    margin: 2px 8px;
    padding: 6px 9px;
    border-radius: 10px;
}

rte-dropdown-panel rte-dropdown-menuitem:hover,
rte-dropdown-panel rte-dropdown-menuitem:focus-visible {
    background-color: #eef4ff;
}

rte-dropdown-panel.rte-panel-forecolor,
rte-dropdown-panel.rte-panel-backcolor {
    padding: 10px;
}

rte-dropdown-panel.rte-panel-forecolor rte-dialog-item-color[rte-tooltip],
rte-dropdown-panel.rte-panel-backcolor rte-dialog-item-color[rte-tooltip] {
    border-radius: 8px;
}
