/* 移动端适配 (max-width: 768px) */
@media (max-width: 768px) {
    /* 1. 修复导航栏位置和交互 */
    .book-summary {
        width: 260px !important;
        left: -260px !important; /* 初始隐藏在左侧 */
        transition: transform 0.3s ease;
        z-index: 10;
        background: #f5f5f5;
        box-shadow: 2px 0 5px rgba(0,0,0,0.1);
    }
    
    /* 导航栏展开状态 */
    .book.with-summary .book-summary {
        transform: translateX(260px);
    }

    /* 2. 内容区域适配 */
    .book .book-body {
        left: 0 !important;
        width: 100% !important;
        transition: transform 0.3s ease;
        transform: translateX(0);
    }
    
    /* 当导航展开时内容区域右移 */
    .book.with-summary .book-body {
        transform: translateX(260px);
    }

    /* 3. 修复并自定义菜单按钮 */
    .book-header .btn.btn-menu {
        display: block !important;
        position: fixed;
        left: 10px;
        top: 10px;
        z-index: 20;
        background: #fff;
        border: 1px solid #ddd;
        border-radius: 4px;
        padding: 5px 10px;
        color: #333;
    }

    /* 4. 确保头部区域可见 */
    .book-header {
        position: fixed;
        width: 100%;
        background: #fff;
        z-index: 5;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    }

    /* 5. 隐藏右侧目录 */
    .book-anchor {
        display: none !important;
    }

    /* 6. 调整页面内边距，留出头部空间 */
    .page-inner {
        padding: 60px 15px 15px !important;
        max-width: 100% !important;
    }

    /* 7. 添加遮罩层效果 */
    .book.with-summary .book-body:after {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0,0,0,0.5);
        z-index: 1;
    }

    /* 8. 代码和表格优化 */
    pre code {
        white-space: pre-wrap;
        word-wrap: break-word;
    }
    table {
        display: block;
        overflow-x: auto;
    }

    /* 9. 标题大小调整 */
    h1 { font-size: 1.8em; }
    h2 { font-size: 1.5em; }
    h3 { font-size: 1.3em; }
}