/* wangEditor 集成样式 - 解决CSS冲突 */

/* 1. 确保wangEditor容器不受全局样式重置影响 */
.w-e-text-container,
.w-e-toolbar,
.w-e-modal,
.w-e-drop-panel,
.w-e-select-list {
    /* 重置字体以匹配项目字体 */
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
}

/* 2. 确保wangEditor内部元素的样式优先级 */
.w-e-text-container * {
    /* 确保wangEditor内部样式不被全局样式覆盖 */
    box-sizing: border-box !important;
}

/* 3. 修复可能的字体大小问题 */
.w-e-text-container [data-slate-editor] {
    font-size: 14px;
    line-height: 1.6;
}

/* 4. 确保wangEditor的CSS变量有默认值（防止变量未定义） */
:root {
    /* 文本区域相关变量 */
    --w-e-textarea-bg-color: #fff;
    --w-e-textarea-color: #333;
    --w-e-textarea-border-color: #ccc;
    --w-e-textarea-slight-bg-color: #f5f5f5;
    --w-e-textarea-slight-color: #999;
    --w-e-textarea-slight-border-color: #e8e8e8;
    --w-e-textarea-selected-border-color: #007bff;
    --w-e-textarea-handler-bg-color: #007bff;
    
    /* 工具栏相关变量 */
    --w-e-toolbar-bg-color: #fff;
    --w-e-toolbar-color: #333;
    --w-e-toolbar-border-color: #e8e8e8;
    --w-e-toolbar-active-bg-color: #f1f1f1;
    --w-e-toolbar-active-color: #333;
    --w-e-toolbar-disabled-color: #999;
    
    /* 模态框相关变量 */
    --w-e-modal-button-bg-color: #fff;
    --w-e-modal-button-border-color: #ccc;
}

/* 5. 确保wangEditor在项目中的响应式表现 */
.w-e-text-container {
    max-width: 100%;
    overflow-x: auto;
}

/* 6. 修复可能的z-index冲突 */
.w-e-modal,
.w-e-drop-panel,
.w-e-select-list,
.w-e-hover-bar {
    z-index: 9999 !important;
}

/* 7. 确保wangEditor的表格在移动端正常显示 */
.w-e-text-container [data-slate-editor] .table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* 8. 修复可能的按钮样式冲突 */
.w-e-bar-item button,
.w-e-modal button {
    /* 确保按钮样式不被项目的全局按钮样式覆盖 */
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
}

/* 9. 确保wangEditor的图片在项目中正常显示 */
.w-e-text-container [data-slate-editor] img {
    max-width: 100% !important;
    height: auto !important;
}

/* 10. 修复可能的链接样式冲突 */
.w-e-text-container [data-slate-editor] a {
    color: #007bff;
    text-decoration: underline;
}

.w-e-text-container [data-slate-editor] a:hover {
    color: #0056b3;
    text-decoration: underline;
}