/* editor.css - v6.1 Layout Fix */

:root {
    --primary-color: #1890ff;
    --success-color: #1a7f37;
    --danger-color: #d1242f;  
    --dark-color: #24292f;    
    --brown-color: #9a6700;   
    --bg-color: #f6f8fa;
    --border-color: #d0d7de;
}

* { box-sizing: border-box; }

body, html { 
    margin: 0; padding: 0; 
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; 
    background-color: var(--bg-color); 
    height: 100%; 
    /* 【关键修改】使用 Flex 布局，确保页脚可见 */
    display: flex;
    flex-direction: column;
    overflow: hidden; /* 禁止整页滚动，只允许编辑器内部滚动 */
}

/* --- Main Wrapper (Flex Item) --- */
.main-wrapper {
    /* 占据剩余所有空间 */
    flex: 1;
    width: 100%;
    max-width: 1600px;
    margin: 0 auto; /* 居中 */
    padding: 20px; /* 四周留白 */
    display: flex;
    flex-direction: column;
    gap: 15px;
    overflow: hidden; /* 防止溢出 */
}

/* --- Toolbar Header --- */
.editor-toolbar-header {
    background: #fff; 
    padding: 8px 20px; 
    border-radius: 6px; 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    border: 1px solid var(--border-color);
    flex-shrink: 0; 
}

.page-title { 
    font-size: 18px; font-weight: 600; color: #333; 
    display: flex; align-items: center; gap: 10px; 
}

/* Title Input */
.title-input {
    background: #f6f8fa; border: 1px solid var(--border-color); 
    padding: 6px 12px; border-radius: 6px; color: #57606a; 
    font-size: 14px; width: 400px; outline: none; 
    text-align: center;
}

/* Action Buttons */
.action-group { display: flex; gap: 8px; align-items: center; }

.btn { 
    border: none; padding: 6px 12px; border-radius: 6px; 
    color: #fff; font-size: 13px; font-weight: 600; 
    cursor: pointer; transition: 0.2s; 
    display: flex; align-items: center; gap: 6px;
    box-shadow: 0 1px 0 rgba(27,31,36,0.1);
}
.btn:hover { opacity: 0.9; }
.btn:active { transform: translateY(1px); }

.btn-setting { background: #f6f8fa; color: #24292f; border: 1px solid var(--border-color); }
.btn-save { background: var(--success-color); }
.btn-pdf { background: var(--danger-color); }
.btn-md { background: var(--dark-color); }
.btn-long { background: var(--brown-color); }

/* --- Editor Split Layout --- */
.editor-container {
    display: flex; gap: 15px; 
    flex: 1; /* 填满 main-wrapper 的剩余空间 */
    min-height: 0; /* 允许子元素滚动 */
}

.panel {
    flex: 1; background: #fff; 
    border-radius: 6px; 
    border: 1px solid var(--border-color);
    display: flex; flex-direction: column; 
    overflow: hidden;
}

.panel-header {
    padding: 8px 15px; border-bottom: 1px solid var(--border-color); 
    display: flex; justify-content: space-between; align-items: center; 
    background: #f6f8fa; font-size: 13px; color: #57606a; font-weight: 600;
}

.copy-btn { 
    border: 1px solid var(--border-color); background: #fff; 
    padding: 3px 8px; border-radius: 4px; cursor: pointer; 
    font-size: 12px; color: #57606a; transition: 0.2s;
}
.copy-btn:hover { border-color: var(--primary-color); color: var(--primary-color); }

.editor-area, .preview-area {
    flex: 1; padding: 20px; overflow-y: auto; 
    font-size: 16px; line-height: 1.6; 
    border: none; resize: none; outline: none;
}
#editor { font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace; color: #24292f; }

/* Markdown Preview Styling */
#preview h1, #preview h2 { border-bottom: 1px solid #eee; padding-bottom: .3em; }
#preview blockquote { border-left: 4px solid #dfe2e5; color: #6a737d; padding-left: 1em; }
#preview img { max-width: 100%; border-radius: 4px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
#preview pre { background: #f6f8fa; padding: 16px; border-radius: 6px; overflow: auto; }
#preview code { background: #afb8c133; padding: .2em .4em; border-radius: 6px; font-size: 85%; font-family: monospace; }

/* --- PDF Print Fix --- */
@media print {
    .global-top-nav, .global-footer, #global-settings-modal { display: none !important; }
    .editor-toolbar-header, .panel:first-child, .panel-header { display: none !important; }

    body, html, .main-wrapper, .editor-container {
        height: auto !important; margin: 0 !important; padding: 0 !important; 
        overflow: visible !important; background: #fff !important;
        display: block !important;
    }

    .panel:last-child {
        border: none !important; width: 100% !important; display: block !important;
    }
    
    .preview-area {
        padding: 0 !important; overflow: visible !important;
    }

    #preview { font-size: 12pt; line-height: 1.5; }
    a { text-decoration: none; color: #000; }
    @page { margin: 2cm; size: A4; }
}

/* Responsive */
@media (max-width: 768px) {
    .editor-container { flex-direction: column; height: auto; }
    .main-wrapper { height: auto; margin-bottom: 60px; }
    .panel { min-height: 50vh; }
    .action-group { display: none; }
}
/* editor.css 的最末尾添加 */

/* --- PDF Export Mode (关键修复) --- */
/* 当 JS 添加此当类时，强制解除页面的 Flex 锁定，允许 html2pdf 截取完整高度 */
body.export-mode {
    overflow: visible !important;
    height: auto !important;
    display: block !important;
    padding: 0 !important;
    background: white !important;
}

/* 导出时隐藏界面上不需要的元素 */
body.export-mode .main-wrapper, 
body.export-mode .global-top-nav, 
body.export-mode .global-footer,
body.export-mode .editor-toolbar-header,
body.export-mode #global-settings-modal {
    display: none !important;
}