/*=============================================
=                   TinyMCE 5 Style                   =
=============================================*/

.tox .tox-toolbar-overlord,
.tox .tox-toolbar,
.tox .tox-toolbar__overflow,
.tox .tox-toolbar__primary {
    background-image: none !important;
    background-color: var(--bs-card-bg, var(--bs-body-bg)) !important;
}

.tox .tox-tbtn svg {
    fill: var(--bs-body-color) !important;
}

.tox .tox-tbtn {
    color: var(--bs-body-color) !important;
}

.tox-toolbar__group {
    border-color: rgba(var(--bs-body-color-rgb), 0.5) !important;
}

.tox-tinymce {
    border-color: transparent !important;
}

.tox .tox-statusbar {
    border-color: rgba(var(--bs-body-color-rgb), 0.5) !important;
    background-color: var(--bs-card-bg, var(--bs-body-bg)) !important;
    color: var(--bs-body-color) !important;
}

.tox .tox-statusbar a,
.tox .tox-statusbar__path-item,
.tox .tox-statusbar__wordcount {
    color: rgba(var(--bs-body-color-rgb), 0.5) !important;
}

.tox .tox-tbtn:hover {
    background: rgba(var(--bs-body-color-rgb), 0.1) !important;
    color: var(--bs-primary) !important;
}

.tox .tox-tbtn:focus {
    background: rgba(var(--bs-body-color-rgb), 0.2) !important;
}

.tox .tox-tbtn:focus:not(.tox-tbtn--disabled) {
    color: var(--bs-primary) !important;
}

.tox .tox-tbtn:active {
    background: rgba(var(--bs-body-color-rgb), 0.3) !important;
    color: var(--bs-primary) !important;
}

.tox .tox-tbtn:hover svg,
.tox .tox-tbtn:focus:not(.tox-tbtn--disabled) svg,
.tox .tox-tbtn:active svg {
    fill: var(--bs-primary) !important;
}

.tox .tox-menu {
    border-color: rgba(var(--bs-body-color-rgb), 0.5) !important;
    background-color: var(--bs-card-bg, var(--bs-body-bg)) !important;
    color: var(--bs-body-color) !important;
}

.tox .tox-collection__item {
    color: var(--bs-body-color) !important;
}

.tox .tox-collection--list .tox-collection__item--active {
    background-color: var(--bs-theme-200, var(--bs-gray-100)) !important;
}

.tox .tox-collection--list .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
    color: var(--bs-body-color-bright) !important;
}

.tox .tox-collection--list .tox-collection__item--enabled {
    background-color: var(--bs-theme-200, var(--bs-gray-200)) !important;
    color: var(--bs-primary) !important;
}

.tox.tox-tinymce-aux .tox-toolbar__overflow {
    border-color: rgba(var(--bs-body-color-rgb), 0.5) !important;
    background-color: var(--bs-card-bg, var(--bs-body-bg)) !important;
    color: var(--bs-body-color) !important;
}

.tox .tox-tbtn--enabled,
.tox .tox-tbtn--enabled:hover {
    background-color: var(--bs-theme-200, var(--bs-gray-200)) !important;
    color: var(--bs-primary) !important;
}

.tox .tox-tbtn--enabled svg {
    fill: var(--bs-primary) !important;
}

.tox .tox-insert-table-picker .tox-insert-table-picker__selected {
    background-color: rgba(var(--bs-primary-rgb), 0.5) !important;
    border-color: rgba(var(--bs-primary-rgb), 0.5) !important;
}

.tox .tox-insert-table-picker>div {
    border-color: rgba(var(--bs-body-color-rgb), .5) !important;
}

.tox .tox-edit-area__iframe {
    /* background-color:rgb(var(--bs-card-bg-rgb))!important ; */
}

.tox .tox-dialog,
.tox .tox-dialog__body {
    background-color: var(--bs-card-bg, var(--bs-body-bg)) !important;
    color: var(--bs-body-color) !important;
}

.tox .tox-dialog__title {
    color: var(--bs-body-color) !important;
}

.tox .tox-dialog__header,
.tox .tox-dialog__footer {
    background-color: transparent !important;
}

.tox .tox-label,
.tox .tox-toolbar-label {
    color: var(--bs-body-color) !important;
    opacity: 0.8;
}

.tox .tox-button--naked {
    color: var(--bs-body-color) !important;
}

.tox .tox-listboxfield .tox-listbox--select,
.tox .tox-textarea,
.tox .tox-textfield,
.tox .tox-toolbar-textfield {
    /* 此处抄Bootstrap 的form-control样式 */
    background-color: var(--bs-card-bg, var(--bs-body-bg)) !important;
    color: var(--bs-body-color) !important;
    border-color: rgba(var(--bs-body-color-rgb), 0.5) !important;
}

.tox .tox-button {
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
}

.tox .tox-button--secondary {
    background-color: transparent !important;
    color: var(--bs-secondary) !important;
    border-color: rgba(var(--bs-secondary-rgb), 0.5) !important;
}

.tox .tox-button--naked {
    background-color: transparent !important;
    color: var(--bs-secondary) !important;
}

.tox .tox-button:hover,
.tox .tox-button:focus {
    filter: brightness(1.1);
}

.tox .tox-button:active {
    filter: brightness(0.9);
}

.tox .tox-dialog-wrap__backdrop {
    background-color: rgba(var(--bs-body-bg-rgb), 0.5) !important;
}

.tox .tox-dialog__body-content .tox-form__group h1,
.tox .tox-dialog__body-content .tox-form__group h2,
.tox .tox-dialog__body-content .tox-form__group h3,
.tox .tox-dialog__body-content .tox-form__group h4,
.tox .tox-dialog__body-content .tox-form__group h5,
.tox .tox-dialog__body-content .tox-form__group h6 {
    color: var(--bs-body-color) !important;
}

.tox .tox-dialog__body-nav-item {
    color: var(--bs-body-color) !important;
}

.tox .tox-dialog__body-nav-item--active {
    color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
}

.tox .tox-dialog__body-content a {
    color: var(--bs-primary) !important;
}

/* ============================================
   S3-Body 内用 CSS sticky 替代 TinyMCE 内置 JS 吸顶
   原因：TinyMCE 的吸顶逻辑基于 getBoundingClientRect() + window.scrollY，
   在 #S3-Body 独立滚动容器内坐标失真，导致吸顶后无法正确取消。
   改用 CSS position: sticky 可直接相对于 #S3-Body 滚动，行为可靠。
   ============================================ */

/* 1. 解除 .tox-tinymce 的 overflow:hidden（来自 skin.min.css），
      否则它会成为 sticky 的滚动容器，导致 .tox-editor-header
      只能相对 .tox-tinymce 吸顶而非 #S3-Body */
#S3-Body .tox-tinymce {
    overflow: visible !important;
}

/* 2. 工具栏吸顶：top 留出 S3-Header 的高度，z-index 低于 S3-Header(5) 避免遮挡 */
#S3-Body .tox-editor-header {
    top: 0;
    z-index: 4;
    background-color: var(--bs-card-bg, var(--bs-body-bg));
}
.tox-editor-container {
    position: relative;
    transition: padding-top 0.2s ease;
}
#S3-Wrapper.scrolled #S3-Body .tox-editor-header {
    position: fixed;
    top: var(--s3-header-height, calc(env(safe-area-inset-top, 0px) + 4.125rem));
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
}
/* #S3-Wrapper.scrolled #S3-Body .tox-editor-container {
    padding-top: var(--tinymce-header-height, 56px);
}
 */
/* 3. 吸顶时工具栏内部也需要不透明背景，否则会透出编辑区内容 */
#S3-Body .tox-editor-header .tox-toolbar-overlord,
#S3-Body .tox-editor-header .tox-toolbar,
#S3-Body .tox-editor-header .tox-toolbar__primary {
    background-color: var(--bs-card-bg, var(--bs-body-bg)) !important;
}

/*============  End of TinyMCE 5 Style  =============*/