/* Summernote自定义样式 */

/* 编辑器基本样式 */
.note-editor {
    border: 1px solid #ddd;
    border-radius: 4px;
}

.note-editing-area {
    min-height: 300px;
}

.note-editable {
    min-height: 250px;
    font-size: 14px;
    line-height: 1.6;
}

/* 修复自定义下拉菜单样式，不影响Summernote内置功能 */
.note-dropdown-menu.custom-dropdown {
    position: absolute;
    z-index: 1050;
    background: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    display: none;
}

.note-dropdown-menu.custom-dropdown.show {
    display: block;
}

.note-dropdown-menu.custom-dropdown .dropdown-item {
    padding: 8px 12px;
    cursor: pointer;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
    color: #333;
}

.note-dropdown-menu.custom-dropdown .dropdown-item:hover {
    background-color: #f8f9fa;
}

.note-btn-group.custom-group.open .note-dropdown-menu.custom-dropdown {
    display: block;
}

/* 上传进度样式 */
.summernote-upload-progress {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #666;
}

.summernote-upload-progress i {
    color: #007bff;
}

/* 工具栏样式优化 - 支持自动换行 */
.note-toolbar {
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    padding: 8px;
    /* 允许工具栏自动换行 */
    display: flex;
    flex-wrap: wrap;
    gap: 2px;  /* 减小间距使更紧凑 */
    row-gap: 2px;  /* 行间距更小 */
    align-items: flex-start;
}

/* 工具栏按钮组也支持换行 */
.note-toolbar .note-btn-group {
    flex-shrink: 0;
    margin: 1px;  /* 减小外边距 */
}

.note-btn {
    border: none;
    background: none;
    padding: 6px 8px;
    margin: 1px;
    border-radius: 3px;
    cursor: pointer;
    transition: background-color 0.2s;
}
.note-btn.btn{    line-height: 18px;}
.note-btn:hover {
    background-color: #e9ecef;
}

.note-btn.active {
    background-color: #007bff;
    color: white;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .note-toolbar {
        padding: 6px;
        gap: 1px;
        row-gap: 1px;
    }

    .note-btn-group {
        margin: 0.5px;
    }

    .note-btn {
        padding: 4px 6px;
        font-size: 13px;
    }

    .note-editing-area {
        min-height: 200px;
    }

    .note-editable {
        min-height: 180px;
        font-size: 16px; /* 移动端增大字体 */
    }
}

/* 超大屏幕优化 - 保持紧凑布局 */
@media (min-width: 1400px) {
    .note-toolbar {
        gap: 3px;
        row-gap: 3px;
    }

    .note-toolbar .note-btn-group {
        margin: 2px;
    }
}

/* 暗色主题支持 */
@media (prefers-color-scheme: dark) {
    .note-editor {
        border-color: #555;
        background-color: #2d3748;
    }
    
    .note-toolbar {
        background-color: #4a5568;
        border-color: #555;
    }
    
    .note-editable {
        background-color: #2d3748;
        color: #e2e8f0;
    }
    
    .note-dropdown-menu.custom-dropdown {
        background-color: #4a5568;
        border-color: #555;
    }
    
    .note-dropdown-menu.custom-dropdown .dropdown-item {
        color: #e2e8f0;
    }
    
    .note-dropdown-menu.custom-dropdown .dropdown-item:hover {
        background-color: #2d3748;
    }
}

/* 文件链接样式 */
.file-link {
    display: inline-block;
    padding: 8px 12px;
    margin: 4px;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    text-decoration: none;
    color: #495057;
    font-size: 14px;
    transition: all 0.2s ease;
}

.file-link:hover {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #212529;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.file-link i {
    margin-right: 6px;
}

/* 模态框居中和层级修复 */
.note-modal .modal-dialog {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 60px);
    margin: 30px auto;
}

.note-modal {
    z-index: 1060 !important;
}

.note-modal .modal-backdrop {
    z-index: 1055 !important;
}

/* 确保图片插入模态框居中 */
.note-image-dialog .modal-dialog,
.note-link-dialog .modal-dialog,
.note-video-dialog .modal-dialog {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 60px);
    margin: 30px auto;
}

/* 文件上传模态框样式 */
#summernote-file-upload-modal .modal-dialog {
    max-width: 500px;
}

#summernote-file-upload-modal .file-preview {
    background-color: #f8f9fa;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    transition: all 0.3s ease;
}

#summernote-file-upload-modal .file-preview.dragover {
    border-color: #007bff;
    background-color: #e3f2fd;
}

/* 响应式文件链接 */
@media (max-width: 768px) {
    .file-link {
        display: block;
        margin: 4px 0;
        text-align: center;
    }
}

/* 隐藏编辑器底部状态栏和调整大小栏 */
.note-statusbar,
.note-status-output,
.note-resizebar {
    display: none !important;
}

/* 编辑器底部边框圆角修正 */
.note-editor {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.note-editing-area {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

/* 防止编辑器初始化前显示原始内容 */
#contentEditor:not(.note-editor):not(.summernote) {
    display: none !important;
}

/* 确保编辑器初始化后正常显示 */
.note-editor,
.summernote {
    display: block !important;
}

/* 隐藏可能在编辑器外显示的原始内容 */
.note-editor + div:not([class]):not([id]) {
    display: none !important;
}

/* 防止任何编辑器相关的原始文本内容显示在页面上 */
[id$="Editor"]:not(.note-editor):not(.summernote):empty::before {
    content: '';
    display: none;
}

/* 确保编辑器容器在初始化前不显示任何内容 */
[id$="Editor"]:not(.note-editor):not(.summernote) {
    opacity: 0;
    height: 0;
    overflow: hidden;
    transition: opacity 0.3s ease;
}

/* 编辑器初始化后显示 */
[id$="Editor"].note-editor,
[id$="Editor"].summernote {
    opacity: 1;
    height: auto;
    overflow: visible;
}