/* Origin by https://github.com/jiang068/epubjs */
body {
margin: 0; 
/* 不强制指定字体，让EPUB内容使用自己的字体设置 */
font-family: inherit;
background: #fff; color: #000;
display: flex; height: 100vh; overflow: hidden;
}
body.night {
background: #121212; color: #e0e0e0;
}
#toc {
width: 220px;
border-right: 1px solid #ccc;
overflow-y: auto;
padding: 0.5em;
background: #f9f9f9;
/* 为界面元素指定合适的字体 */
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "微软雅黑", sans-serif;
}
body.night #toc {
background: #1f1f1f;
border-color: #444;
color: #e0e0e0;
}
/* 确保夜间模式下目录内容颜色正确 */
body.night #toc h2,
body.night #toc li {
color: #e0e0e0 !important;
}
body.night #toc li:hover, 
body.night #toc li.active {
background: #0078d7;
color: white !important;
}
#toc h2 {
font-size: 1.2em;
margin-top: 0;
}
#toc ul {
list-style: none;
padding-left: 0;
}
#toc li {
cursor: pointer;
padding: 4px 6px;
border-radius: 3px;
}
#toc li:hover, #toc li.active {
background: #0078d7;
color: white;
}
#main {
flex: 1;
display: flex;
flex-direction: column;
height: 100vh;
}
#toolbar {
background: #eee;
padding: 0.1em 0.5em; /* 减少上下内边距 */
display: flex;
align-items: center;
gap: 6px; /* 减少按钮间距 */
user-select: none;
/* 为工具栏指定合适的字体 */
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "微软雅黑", sans-serif;
flex-wrap: nowrap; /* 不换行，保持水平排列 */
min-height: 28px; /* 减少最小高度 */
justify-content: space-between; /* 标题在左，按钮组在右 */
}
body.night #toolbar {
background: #222;
color: #e0e0e0;
}
#title {
font-weight: bold;
font-size: 1.1em;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
min-width: 0; /* 允许flex收缩 */
flex: 1; /* 占用剩余空间 */
margin-right: 10px; /* 与按钮组的间距 */
}

/* 按钮组容器 */
.toolbar-buttons {
display: flex;
align-items: center;
gap: 4px; /* 按钮间的小间距 */
flex-shrink: 0; /* 按钮组不被压缩 */
}

button {
padding: 0.1em 0.4em; /* 减少按钮内边距 */
cursor: pointer;
background: #0078d7;
border: none;
color: white;
border-radius: 3px;
font-size: 0.9em; /* 稍微减小字体 */
/* 为按钮指定合适的字体 */
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "微软雅黑", sans-serif;
flex-shrink: 0; /* 防止按钮被压缩 */
white-space: nowrap; /* 防止按钮文字换行 */
}
button:disabled {
background: #aaa;
cursor: default;
}
#viewer {
flex: 1;
overflow: hidden;
}
#viewport {
width: 100%; height: 100%;
margin: 0 auto !important;
}

/* 图片自适应样式 - 温和设置，不破坏原始格式 */
#viewport iframe {
width: 100%;
height: 100%;
/* 确保iframe内的内容可以使用自己的字体 */
font-family: inherit !important;
}

/* 确保EPUB内容区域不被外层样式干扰 */
#viewport * {
font-family: inherit !important;
}
/* 双页模式时，viewport宽度减半并居中 */
body.double-page #viewport {
width: 50%;
margin: 0 auto;
}
/* 手机端强制单页铺满 */
@media(max-width:768px) {
#toc { display: none; }
body.double-page #viewport {
    width: 100%;
}

/* 手机端工具栏优化 */
#toolbar {
    padding: 0.2em 0.3em;
    gap: 5px;
    flex-wrap: nowrap; /* 手机端不换行，强制水平排列 */
    justify-content: space-between; /* 保持标题左对齐，按钮右对齐 */
}

#title {
    font-size: 0.9em; /* 减小字体 */
    max-width: calc(100vw - 320px); /* 为按钮预留更多空间 */
    min-width: 80px; /* 最小宽度确保可读性 */
    flex: 1; /* 占用剩余空间 */
    margin-right: 10px; /* 与按钮组的间距 */
}

button {
    padding: 0.15em 0.4em; /* 减少按钮内边距 */
    font-size: 0.85em; /* 减小字体 */
    min-width: 30px; /* 确保按钮最小可点击区域 */
}

/* 优化重要按钮显示 */
#prevBtn, #nextBtn, #modeToggleBtn, #tocToggleBtn {
    flex-shrink: 0; /* 这些按钮永远不被压缩 */
}

/* 在极小屏幕上进一步优化 */
@media(max-width:480px) {
    #title {
        max-width: calc(100vw - 250px);
        font-size: 0.8em;
    }
    
    button {
        padding: 0.1em 0.3em;
        font-size: 0.8em;
        min-width: 28px;
    }
    
    /* 在极小屏幕上隐藏不太重要的按钮文字，只保留符号 */
    #fontIncreaseBtn::after { content: ""; }
    #fontDecreaseBtn::after { content: ""; }
    #pageToggleBtn { 
        width: 35px;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
}
/* 所有按钮在所有设备上都显示 */
#pageToggleBtn, #tocToggleBtn {
display: inline-block;
}

/* 目录切换按钮样式 */
#tocToggleBtn {
background: #28a745;
}

/* 页面模式按钮样式 */
#pageToggleBtn {
background: #6f42c1;
}

/* 文字颜色按钮样式 */
#textColorBtn {
background: #fd7e14;
}