@charset "utf-8";

body.huux-tinymce-dark,
.mce-content-body.huux-tinymce-dark {
    background-color: #2b2c40 !important;
    color: #cfcfe4;
}

body.huux-tinymce-light,
.mce-content-body.huux-tinymce-light {
    background-color: #ffffff !important;
    color: #000000;
}

body.huux-tinymce-dark p,
body.huux-tinymce-dark li,
body.huux-tinymce-dark div,
body.huux-tinymce-dark span,
body.huux-tinymce-dark h1,
body.huux-tinymce-dark h2,
body.huux-tinymce-dark h3,
body.huux-tinymce-dark h4,
body.huux-tinymce-dark h5,
body.huux-tinymce-dark h6 {
    color: inherit;
}

/* Soft：编辑器内「默认黑」内联色 → 深色可读字色（绿/红等自定义色不动） */
body.huux-tinymce-dark [style*="color: #000000"],
body.huux-tinymce-dark [style*="color:#000000"],
body.huux-tinymce-dark [style*="color: #000;"],
body.huux-tinymce-dark [style*="color:#000;"],
body.huux-tinymce-dark [style*="color: rgb(0, 0, 0)"],
body.huux-tinymce-dark [style*="color:rgb(0, 0, 0)"],
body.huux-tinymce-dark [style*="color: black"],
body.huux-tinymce-dark [style*="color:black"],
.mce-content-body.huux-tinymce-dark [style*="color: #000000"],
.mce-content-body.huux-tinymce-dark [style*="color:#000000"],
.mce-content-body.huux-tinymce-dark [style*="color: #000;"],
.mce-content-body.huux-tinymce-dark [style*="color:#000;"],
.mce-content-body.huux-tinymce-dark [style*="color: rgb(0, 0, 0)"],
.mce-content-body.huux-tinymce-dark [style*="color:rgb(0, 0, 0)"],
.mce-content-body.huux-tinymce-dark [style*="color: black"],
.mce-content-body.huux-tinymce-dark [style*="color:black"] {
    color: #cfcfe4 !important;
}

body.huux-tinymce-dark a {
    color: #8b8dff;
}

body.huux-tinymce-dark blockquote:not(.blockquote) {
    border-left-color: rgba(207, 207, 228, 0.35);
    color: #b8b8cf;
}

body.huux-tinymce-dark blockquote.blockquote {
    background-color: rgba(255, 255, 255, 0.06);
    color: #cfcfe4;
}

.dark-style .tox .tox-edit-area__iframe,
[data-bs-theme=dark] .tox .tox-edit-area__iframe {
    background-color: #2b2c40 !important;
}

.light-style .tox .tox-edit-area__iframe,
[data-bs-theme=light] .tox .tox-edit-area__iframe {
    background-color: #ffffff !important;
}

.dark-style .tox-tinymce,
[data-bs-theme=dark] .tox-tinymce {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

.dark-style .form-control,
.dark-style .form-select,
[data-bs-theme=dark] .form-control,
[data-bs-theme=dark] .form-select {
    background-color: rgba(var(--card-background-rgb), var(--card-background-opacity, 1)) !important;
    color: var(--bs-body-color) !important;
    border-color: rgba(var(--bs-body-color-rgb), 0.18) !important;
}

.dark-style .form-select,
[data-bs-theme=dark] .form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23cfcfe4' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
}

.dark-style .form-control::placeholder,
[data-bs-theme=dark] .form-control::placeholder {
    color: rgba(var(--bs-body-color-rgb), 0.45) !important;
}

/* 浅色：仅用户帖子正文默认纯黑（排除自定义字段「游戏名/AppID」等）
 * 说明：正文常为 TinyMCE 的 h1/h2…，主题 --bs-heading-color(#566a7f) 会盖掉继承色 */
.light-style .message > :not(#custom_fields_wrapper),
[data-bs-theme="light"] .message > :not(#custom_fields_wrapper) {
    color: #000000;
}

.dark-style .message,
[data-bs-theme=dark] .message {
    color: var(--bs-body-color);
}

.dark-style .message [style*="color: #000000"],
.dark-style .message [style*="color:#000000"],
.dark-style .message [style*="color: #000;"],
.dark-style .message [style*="color:#000;"],
.dark-style .message [style*="color: rgb(0, 0, 0)"],
.dark-style .message [style*="color:rgb(0, 0, 0)"],
.dark-style .message [style*="color: black"],
.dark-style .message [style*="color:black"],
[data-bs-theme=dark] .message [style*="color: #000000"],
[data-bs-theme=dark] .message [style*="color:#000000"],
[data-bs-theme=dark] .message [style*="color: #000;"],
[data-bs-theme=dark] .message [style*="color:#000;"],
[data-bs-theme=dark] .message [style*="color: rgb(0, 0, 0)"],
[data-bs-theme=dark] .message [style*="color:rgb(0, 0, 0)"],
[data-bs-theme=dark] .message [style*="color: black"],
[data-bs-theme=dark] .message [style*="color:black"] {
    color: var(--bs-body-color) !important;
}

.dark-style .message p,
.dark-style .message li,
.dark-style .message span,
.dark-style .message div,
[data-bs-theme=dark] .message p,
[data-bs-theme=dark] .message li,
[data-bs-theme=dark] .message span,
[data-bs-theme=dark] .message div {
    color: inherit;
}

/* Soft：不再全局强制标题 700（会把已取消粗体的标题又撑粗，波及全站旧帖）。
 * 粗细以编辑器写入的内联字重 / <strong> 为准；normal 必须压过主题。 */
.light-style .message h1[style*="font-weight: normal"],
.light-style .message h2[style*="font-weight: normal"],
.light-style .message h3[style*="font-weight: normal"],
.light-style .message h4[style*="font-weight: normal"],
.light-style .message h5[style*="font-weight: normal"],
.light-style .message h6[style*="font-weight: normal"],
.light-style .message h1[style*="font-weight:normal"],
.light-style .message h2[style*="font-weight:normal"],
.light-style .message h3[style*="font-weight:normal"],
.light-style .message h4[style*="font-weight:normal"],
.light-style .message h5[style*="font-weight:normal"],
.light-style .message h6[style*="font-weight:normal"],
.dark-style .message h1[style*="font-weight: normal"],
.dark-style .message h2[style*="font-weight: normal"],
.dark-style .message h3[style*="font-weight: normal"],
.dark-style .message h4[style*="font-weight: normal"],
.dark-style .message h5[style*="font-weight: normal"],
.dark-style .message h6[style*="font-weight: normal"],
.dark-style .message h1[style*="font-weight:normal"],
.dark-style .message h2[style*="font-weight:normal"],
.dark-style .message h3[style*="font-weight:normal"],
.dark-style .message h4[style*="font-weight:normal"],
.dark-style .message h5[style*="font-weight:normal"],
.dark-style .message h6[style*="font-weight:normal"],
[data-bs-theme="light"] .message h1[style*="font-weight: normal"],
[data-bs-theme="light"] .message h2[style*="font-weight: normal"],
[data-bs-theme="light"] .message h3[style*="font-weight: normal"],
[data-bs-theme="light"] .message h4[style*="font-weight: normal"],
[data-bs-theme="light"] .message h5[style*="font-weight: normal"],
[data-bs-theme="light"] .message h6[style*="font-weight: normal"],
[data-bs-theme="light"] .message h1[style*="font-weight:normal"],
[data-bs-theme="light"] .message h2[style*="font-weight:normal"],
[data-bs-theme="light"] .message h3[style*="font-weight:normal"],
[data-bs-theme="light"] .message h4[style*="font-weight:normal"],
[data-bs-theme="light"] .message h5[style*="font-weight:normal"],
[data-bs-theme="light"] .message h6[style*="font-weight:normal"],
[data-bs-theme="dark"] .message h1[style*="font-weight: normal"],
[data-bs-theme="dark"] .message h2[style*="font-weight: normal"],
[data-bs-theme="dark"] .message h3[style*="font-weight: normal"],
[data-bs-theme="dark"] .message h4[style*="font-weight: normal"],
[data-bs-theme="dark"] .message h5[style*="font-weight: normal"],
[data-bs-theme="dark"] .message h6[style*="font-weight: normal"],
[data-bs-theme="dark"] .message h1[style*="font-weight:normal"],
[data-bs-theme="dark"] .message h2[style*="font-weight:normal"],
[data-bs-theme="dark"] .message h3[style*="font-weight:normal"],
[data-bs-theme="dark"] .message h4[style*="font-weight:normal"],
[data-bs-theme="dark"] .message h5[style*="font-weight:normal"],
[data-bs-theme="dark"] .message h6[style*="font-weight:normal"] {
    font-weight: normal !important;
}

.light-style .message h1[style*="font-weight: normal"] strong,
.light-style .message h1[style*="font-weight: normal"] b,
.light-style .message h2[style*="font-weight: normal"] strong,
.light-style .message h2[style*="font-weight: normal"] b,
.light-style .message h3[style*="font-weight: normal"] strong,
.light-style .message h3[style*="font-weight: normal"] b,
.light-style .message h4[style*="font-weight: normal"] strong,
.light-style .message h4[style*="font-weight: normal"] b,
.light-style .message h5[style*="font-weight: normal"] strong,
.light-style .message h5[style*="font-weight: normal"] b,
.light-style .message h6[style*="font-weight: normal"] strong,
.light-style .message h6[style*="font-weight: normal"] b,
.light-style .message h1[style*="font-weight:normal"] strong,
.light-style .message h1[style*="font-weight:normal"] b,
.light-style .message h2[style*="font-weight:normal"] strong,
.light-style .message h2[style*="font-weight:normal"] b,
.light-style .message h3[style*="font-weight:normal"] strong,
.light-style .message h3[style*="font-weight:normal"] b,
.light-style .message h4[style*="font-weight:normal"] strong,
.light-style .message h4[style*="font-weight:normal"] b,
.light-style .message h5[style*="font-weight:normal"] strong,
.light-style .message h5[style*="font-weight:normal"] b,
.light-style .message h6[style*="font-weight:normal"] strong,
.light-style .message h6[style*="font-weight:normal"] b,
.dark-style .message h1[style*="font-weight: normal"] strong,
.dark-style .message h1[style*="font-weight: normal"] b,
.dark-style .message h2[style*="font-weight: normal"] strong,
.dark-style .message h2[style*="font-weight: normal"] b,
.dark-style .message h3[style*="font-weight: normal"] strong,
.dark-style .message h3[style*="font-weight: normal"] b,
.dark-style .message h4[style*="font-weight: normal"] strong,
.dark-style .message h4[style*="font-weight: normal"] b,
.dark-style .message h5[style*="font-weight: normal"] strong,
.dark-style .message h5[style*="font-weight: normal"] b,
.dark-style .message h6[style*="font-weight: normal"] strong,
.dark-style .message h6[style*="font-weight: normal"] b,
.dark-style .message h1[style*="font-weight:normal"] strong,
.dark-style .message h1[style*="font-weight:normal"] b,
.dark-style .message h2[style*="font-weight:normal"] strong,
.dark-style .message h2[style*="font-weight:normal"] b,
.dark-style .message h3[style*="font-weight:normal"] strong,
.dark-style .message h3[style*="font-weight:normal"] b,
.dark-style .message h4[style*="font-weight:normal"] strong,
.dark-style .message h4[style*="font-weight:normal"] b,
.dark-style .message h5[style*="font-weight:normal"] strong,
.dark-style .message h5[style*="font-weight:normal"] b,
.dark-style .message h6[style*="font-weight:normal"] strong,
.dark-style .message h6[style*="font-weight:normal"] b,
[data-bs-theme="light"] .message h1[style*="font-weight: normal"] strong,
[data-bs-theme="light"] .message h1[style*="font-weight: normal"] b,
[data-bs-theme="light"] .message h2[style*="font-weight: normal"] strong,
[data-bs-theme="light"] .message h2[style*="font-weight: normal"] b,
[data-bs-theme="light"] .message h3[style*="font-weight: normal"] strong,
[data-bs-theme="light"] .message h3[style*="font-weight: normal"] b,
[data-bs-theme="light"] .message h4[style*="font-weight: normal"] strong,
[data-bs-theme="light"] .message h4[style*="font-weight: normal"] b,
[data-bs-theme="light"] .message h5[style*="font-weight: normal"] strong,
[data-bs-theme="light"] .message h5[style*="font-weight: normal"] b,
[data-bs-theme="light"] .message h6[style*="font-weight: normal"] strong,
[data-bs-theme="light"] .message h6[style*="font-weight: normal"] b,
[data-bs-theme="light"] .message h1[style*="font-weight:normal"] strong,
[data-bs-theme="light"] .message h1[style*="font-weight:normal"] b,
[data-bs-theme="light"] .message h2[style*="font-weight:normal"] strong,
[data-bs-theme="light"] .message h2[style*="font-weight:normal"] b,
[data-bs-theme="light"] .message h3[style*="font-weight:normal"] strong,
[data-bs-theme="light"] .message h3[style*="font-weight:normal"] b,
[data-bs-theme="light"] .message h4[style*="font-weight:normal"] strong,
[data-bs-theme="light"] .message h4[style*="font-weight:normal"] b,
[data-bs-theme="light"] .message h5[style*="font-weight:normal"] strong,
[data-bs-theme="light"] .message h5[style*="font-weight:normal"] b,
[data-bs-theme="light"] .message h6[style*="font-weight:normal"] strong,
[data-bs-theme="light"] .message h6[style*="font-weight:normal"] b,
[data-bs-theme="dark"] .message h1[style*="font-weight: normal"] strong,
[data-bs-theme="dark"] .message h1[style*="font-weight: normal"] b,
[data-bs-theme="dark"] .message h2[style*="font-weight: normal"] strong,
[data-bs-theme="dark"] .message h2[style*="font-weight: normal"] b,
[data-bs-theme="dark"] .message h3[style*="font-weight: normal"] strong,
[data-bs-theme="dark"] .message h3[style*="font-weight: normal"] b,
[data-bs-theme="dark"] .message h4[style*="font-weight: normal"] strong,
[data-bs-theme="dark"] .message h4[style*="font-weight: normal"] b,
[data-bs-theme="dark"] .message h5[style*="font-weight: normal"] strong,
[data-bs-theme="dark"] .message h5[style*="font-weight: normal"] b,
[data-bs-theme="dark"] .message h6[style*="font-weight: normal"] strong,
[data-bs-theme="dark"] .message h6[style*="font-weight: normal"] b,
[data-bs-theme="dark"] .message h1[style*="font-weight:normal"] strong,
[data-bs-theme="dark"] .message h1[style*="font-weight:normal"] b,
[data-bs-theme="dark"] .message h2[style*="font-weight:normal"] strong,
[data-bs-theme="dark"] .message h2[style*="font-weight:normal"] b,
[data-bs-theme="dark"] .message h3[style*="font-weight:normal"] strong,
[data-bs-theme="dark"] .message h3[style*="font-weight:normal"] b,
[data-bs-theme="dark"] .message h4[style*="font-weight:normal"] strong,
[data-bs-theme="dark"] .message h4[style*="font-weight:normal"] b,
[data-bs-theme="dark"] .message h5[style*="font-weight:normal"] strong,
[data-bs-theme="dark"] .message h5[style*="font-weight:normal"] b,
[data-bs-theme="dark"] .message h6[style*="font-weight:normal"] strong,
[data-bs-theme="dark"] .message h6[style*="font-weight:normal"] b {
    font-weight: normal !important;
}

/* TinyMCE 弹窗深色适配 */
.dark-style .tox .tox-dialog,
[data-bs-theme=dark] .tox .tox-dialog {
    background-color: #2b2c40 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.dark-style .tox .tox-dialog__header,
.dark-style .tox .tox-dialog__body,
.dark-style .tox .tox-dialog__footer,
[data-bs-theme=dark] .tox .tox-dialog__header,
[data-bs-theme=dark] .tox .tox-dialog__body,
[data-bs-theme=dark] .tox .tox-dialog__footer {
    background-color: #2b2c40 !important;
    color: #cfcfe4 !important;
}

.dark-style .tox .tox-textfield,
.dark-style .tox .tox-textarea,
[data-bs-theme=dark] .tox .tox-textfield,
[data-bs-theme=dark] .tox .tox-textarea {
    background-color: #232333 !important;
    color: #cfcfe4 !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

.dark-style .tox .tox-label,
[data-bs-theme=dark] .tox .tox-label {
    color: #cfcfe4 !important;
}

/* 颜色选择面板：标题 + 色号；宽高贴合内容，去掉底部/右侧假留白 */
.tox .tox-menu.huux-color-picker-menu,
.tox .tox-menu.tox-swatches-menu:has(.huux-color-picker-panel) {
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 !important;
    overflow: visible !important;
}

.tox .tox-swatches.huux-color-picker-panel,
.tox .huux-color-picker-panel {
    box-sizing: border-box !important;
    display: block !important;
    margin: 0 !important;
    padding: 8px !important;
    /* 5 × 30px 色格 + 左右 padding */
    width: 166px !important;
    min-width: 166px !important;
    max-width: 166px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    border-radius: 8px !important;
}

.tox .huux-color-picker-title {
    display: block !important;
    margin: 0 0 6px !important;
    padding: 0 1px !important;
    border: 0 !important;
    background: transparent !important;
    color: #111827 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    font-family: "Microsoft YaHei", "PingFang SC", sans-serif !important;
    line-height: 1.3 !important;
    white-space: normal !important;
}

.tox .huux-color-picker-hex-box {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 0 8px !important;
    padding: 6px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    background: #f8fafc !important;
    box-shadow: none !important;
}

.tox .huux-color-picker-hex-row {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.tox .huux-color-picker-preview {
    flex: 0 0 22px !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(15, 23, 42, 0.14) !important;
    border-radius: 4px !important;
    background-color: #000000 !important;
    background-image: none !important;
}

.tox .huux-color-picker-hash {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #6b7280 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.tox .huux-color-picker-hex {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 4px !important;
    border: 1px solid #d1d5db !important;
    border-radius: 4px !important;
    background: #ffffff !important;
    color: #111827 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    font-family: Consolas, "SF Mono", Monaco, monospace !important;
    line-height: 24px !important;
    outline: none !important;
    box-shadow: none !important;
}

.tox .huux-color-picker-hex:focus {
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.18) !important;
}

.tox .huux-color-picker-hex.is-invalid {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.16) !important;
}

.tox .huux-color-picker-apply {
    flex: 0 0 auto !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 6px !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: #4f46e5 !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    font-family: "Microsoft YaHei", "PingFang SC", sans-serif !important;
    line-height: 24px !important;
    cursor: pointer !important;
}

.tox .huux-color-picker-apply:hover {
    background: #4338ca !important;
    filter: none !important;
}

.tox .huux-color-picker-panel .tox-swatches__row {
    display: flex !important;
    width: 150px !important;
    max-width: 150px !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: flex-start !important;
}

.tox .huux-color-picker-panel .tox-swatches__row:empty {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
}

/* 最后一行：黑 / 清除 / 取色器，收拢空隙，别撑出大块空白 */
.tox .huux-color-picker-panel .tox-swatches__row:last-child {
    justify-content: space-between !important;
}

.tox .huux-color-picker-panel .tox-swatches__picker-btn {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 深色模式 */
.dark-style .tox .huux-color-picker-title,
[data-bs-theme="dark"] .tox .huux-color-picker-title {
    color: #f3f4f6 !important;
}

.dark-style .tox .huux-color-picker-hex-box,
[data-bs-theme="dark"] .tox .huux-color-picker-hex-box {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

.dark-style .tox .huux-color-picker-hash,
[data-bs-theme="dark"] .tox .huux-color-picker-hash {
    color: #a1a1b5 !important;
}

.dark-style .tox .huux-color-picker-hex,
[data-bs-theme="dark"] .tox .huux-color-picker-hex {
    background: #232333 !important;
    color: #f3f4f6 !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
}

.dark-style .tox .huux-color-picker-hex:focus,
[data-bs-theme="dark"] .tox .huux-color-picker-hex:focus {
    border-color: #8b8dff !important;
    box-shadow: 0 0 0 2px rgba(139, 141, 255, 0.22) !important;
}

.dark-style .tox .huux-color-picker-apply,
[data-bs-theme="dark"] .tox .huux-color-picker-apply {
    background: #6b6eff !important;
    color: #ffffff !important;
}

.dark-style .tox .huux-color-picker-apply:hover,
[data-bs-theme="dark"] .tox .huux-color-picker-apply:hover {
    background: #5a5df0 !important;
}

.dark-style .tox .huux-color-picker-preview,
[data-bs-theme="dark"] .tox .huux-color-picker-preview {
    border-color: rgba(255, 255, 255, 0.2) !important;
}
