/* ============================================================
   LiteEditor 编辑器样式 v9
   ============================================================ */
.lite-editor {
    overflow: visible;
    border-radius: 10px;
    background: #fff;
    display: flex;
    flex-direction: column;
    font-size: 14px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04);
    position: relative;
    isolation: isolate;
}
.lite-editor.le-fullscreen { position: fixed; inset: 0; z-index: 9999; border-radius: 0; box-shadow: none; }

/* ---------- 工具栏 ---------- */
.le-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    padding: 8px 12px;
    background: #f8fafc;
    border-bottom: 1px solid #e5e9f0;
    user-select: none;
    position: sticky;
    top: 0;
    z-index: 20;
    border-radius: 10px 10px 0 0;
    box-shadow: 0 1px 0 rgba(0, 0, 0, .02);
}
.lite-editor.le-fullscreen .le-toolbar { border-radius: 0; }

/* 彻底重置按钮样式，防止变成原生小方块 */
.lite-toolbar button,
.le-toolbar button {
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 6px !important;
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 6px !important;
    cursor: pointer !important;
    color: #475569 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    font-family: inherit !important;
    line-height: 1 !important;
    transition: all .15s !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}
.lite-toolbar button:hover,
.le-toolbar button:hover { 
    background: #e2e8f0 !important; 
    color: #0f172a !important; 
}
.lite-toolbar button:active,
.le-toolbar button:active { 
    background: #cbd5e1 !important; 
}
.lite-toolbar button.is-active,
.le-toolbar button.is-active { 
    background: #dbeafe !important; 
    color: #2563eb !important; 
    border-color: #bfdbfe !important;
}

.lite-toolbar button b, .lite-toolbar button i, .lite-toolbar button u, .lite-toolbar button s,
.le-toolbar button b, .le-toolbar button i, .le-toolbar button u, .le-toolbar button s { 
    font-size: 15px !important; 
    font-family: Georgia, serif !important; 
    font-weight: 900 !important;
}

/* 强制 SVG 尺寸和样式，防止尺寸坍塌 */
.lite-toolbar button svg,
.le-toolbar button svg { 
    width: 18px !important; 
    height: 18px !important; 
    display: block !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.le-tb-group { display: inline-flex; align-items: center; gap: 2px; }
.le-tb-sep { width: 1px; height: 16px; background: #cbd5e1; margin: 0 4px; display: inline-block; }
.le-toolbar .le-spacer { flex: 1; }

/* ---------- 下拉菜单 ---------- */
.le-dropdown { position: relative; display: inline-flex; }
.le-dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 6px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    padding: 10px;
    z-index: 100;
    min-width: 160px;
}
.le-dropdown-menu.show { display: block; }
.le-color-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 6px; }
.le-color-item {
    width: 20px; height: 20px; border-radius: 4px; cursor: pointer; border: 1px solid #cbd5e1;
}
.le-color-item:hover { transform: scale(1.15); box-shadow: 0 2px 5px rgba(0,0,0,0.2); }

/* ---------- 编辑区 ---------- */
.le-body { display: flex; min-height: 0; overflow: visible; }
.le-wysiwyg, .le-textarea, .le-preview {
    flex: 1; min-width: 0; padding: 24px 30px; outline: 0; font-size: 15px; line-height: 1.8;
}
.le-wysiwyg { background: #fff; color: #1e293b; min-height: 480px; overflow-y: visible; word-wrap: break-word; border-radius: 0 0 10px 10px; }
.le-wysiwyg:empty::before { content: attr(data-placeholder); color: #cbd5e1; pointer-events: none; white-space: pre-line; }

.le-textarea {
    border: 0; resize: vertical; font-family: ui-monospace, monospace; font-size: 14px;
}
.le-preview {
    background: #fbfcfe; border-left: 1px dashed #e5e9f0; line-height: 1.8; word-wrap: break-word;
}

.lite-editor .le-wysiwyg, .lite-editor .le-textarea, .lite-editor .le-preview { display: none; }
.le-mode-wysiwyg .le-wysiwyg { display: block; }
.le-mode-markdown .le-textarea, .le-mode-markdown .le-preview { display: block; }
.le-mode-markdown.le-preview-off .le-preview { display: none; }

/* ---------- 富文本排版 ---------- */
.le-wysiwyg h1, .le-preview h1 { font-size: 24px; padding-bottom: 8px; border-bottom: 1px solid #eef1f4; }
.le-wysiwyg h2, .le-preview h2 { font-size: 20px; padding-bottom: 6px; border-bottom: 1px solid #eef1f4; }
.le-wysiwyg h3, .le-preview h3 { font-size: 17px; }
.le-wysiwyg p, .le-preview p { margin: 11px 0; }
.le-wysiwyg a, .le-preview a { color: #2563eb; text-decoration: none; border-bottom: 1px solid rgba(37, 99, 235, .3); }
.le-wysiwyg img, .le-preview img { max-width: 100%; height: auto; border-radius: 6px; margin: 6px 0; }
.le-wysiwyg code, .le-preview code { background: #f1f5f9; padding: 2px 7px; border-radius: 4px; color: #db2777; font-size: 13px; }

.le-wysiwyg blockquote, .le-preview blockquote {
    border-left: 4px solid #cbd5e1; padding: 6px 16px; color: #64748b; margin: 14px 0; background: #f8fafc; border-radius: 0 6px 6px 0;
}
.le-wysiwyg ul, .le-wysiwyg ol, .le-preview ul, .le-preview ol { padding-left: 26px; margin: 11px 0; }
.le-wysiwyg li, .le-preview li { margin: 5px 0; }
.le-wysiwyg hr, .le-preview hr { border: 0; border-top: 1px solid #e5e9f0; margin: 22px 0; }
.le-wysiwyg table, .le-preview table { border-collapse: collapse; margin: 14px 0; width: 100%; font-size: 13.5px; }
.le-wysiwyg th, .le-wysiwyg td, .le-preview th, .le-preview td { border: 1px solid #e5e9f0; padding: 9px 14px; text-align: left; }
.le-wysiwyg th, .le-preview th { background: #f8fafc; font-weight: 600; }

/* ---------- 状态栏 ---------- */
.le-footer {
    padding: 9px 20px; background: #f8fafc; border-top: 1px solid #e5e9f0; font-size: 12.5px; color: #94a3b8;
    display: flex; justify-content: space-between; border-radius: 0 0 10px 10px;
}