/**
 * Linux4AI Course Theme
 * Based on Reveal.js White Theme
 * Optimized for Technical Content and Code Blocks
 */

/* 1. 全局排版优化 */
.reveal {
    background-color: #fff;
    color: #222;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* 强制所有内容左对齐 (用户需求 1) */
.reveal .slides section,
.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6,
.reveal p, .reveal li, .reveal ul, .reveal ol,
.reveal pre, .reveal code,
.reveal table, .reveal blockquote {
    text-align: left;
}

/* 标题紧凑化 & 字号减小 (用户需求 2) */
.reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 {
    color: #000;
    margin: 0 0 0.5em 0;
    font-weight: 600;
    text-transform: none; /* 取消默认的全大写风格 */
    line-height: 1.2;
}

.reveal h1 { font-size: 1.6em; border-bottom: 2px solid #eee; padding-bottom: 0.2em; } /* 原 2.0em */
.reveal h2 { font-size: 1.3em; } /* 原 1.5em */
.reveal h3 { font-size: 1.1em; color: #444; } /* 原 1.2em */
.reveal h4 { font-size: 0.9em; color: #666; } /* 原 1.0em */
.reveal h5 { font-size: 0.8em; color: #666; }
.reveal h6 { font-size: 0.7em; color: #666; }

/* 正文调整 - 紧凑模式 */
.reveal p {
    font-size: 0.8em;
    line-height: 1.5;
    margin-bottom: 0.8em;
}

.reveal li {
    font-size: 0.8em;
    line-height: 1.4;
    margin-bottom: 0.4em;
}

.reveal ul, .reveal ol {
    margin-left: 1.5em;
    display: block;
}

/* 2. 代码块深度优化 */
.reveal pre {
    width: 100%;
    margin: 10px 0;
    box-shadow: none;
    font-size: 0.6em;
    font-family: 'Fira Code', 'Consolas', 'Monaco', 'Andale Mono', 'Ubuntu Mono', monospace;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background-color: #f8f9fa; /* 极浅灰背景 */
    text-align: left; /* 确保代码左对齐 */
}

/* 针对 reveal.js 的代码块结构 */
.reveal pre code {
    display: block;
    padding: 12px;
    max-height: 550px; /* 限制高度，防止溢出 */
    overflow: auto;    /* 允许滚动 */
    line-height: 1.3;
    background-color: transparent;
    color: #24292e;    /* Github 风格深灰字 */
    white-space: pre;
    text-align: left;
}

/* 限制 slide 内图片高度，防止大图溢出画布（与代码块同理；为标题/说明预留空间） */
.reveal section img {
    max-height: 560px;
}

/* 滚动条样式 */
.reveal pre code::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.reveal pre code::-webkit-scrollbar-track {
    background: #f1f1f1;
}
.reveal pre code::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 4px;
}
.reveal pre code::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* 3. 表格优化 */
.reveal table {
    margin: 1em 0;
    border-collapse: collapse;
    font-size: 0.7em;
    width: 100%;
    border: 1px solid #ddd;
    text-align: left; /* 表格内容左对齐 */
}

.reveal table th {
    background-color: #f5f5f5;
    font-weight: 600;
    border: 1px solid #ddd;
    padding: 8px 12px;
    text-align: left;
}

.reveal table td {
    border: 1px solid #ddd;
    padding: 8px 12px;
    text-align: left;
}

/* 抵消 pandoc ≥3 的管道表 <col style="width:…">（按源码分隔行长度估算的列宽，几乎从不符合内容实际）。
   全部 slides 的表格都是按「内容自适应」auto 布局编写的；col 宽度一旦介入（fixed 布局下它甚至优先于 th），
   短内容列被拉宽、长内容列被压窄 → 大面积换行 → 表格整体抬高、页尾内容被画布裁掉。
   必须 !important 才能赢过 col 上的内联 style。docs 页面（非 .reveal）保留 pandoc 列宽——纵向滚动无裁切风险。 */
.reveal table col {
    width: auto !important;
}

/* 固定列宽表格（工具类）：窄首列 + 定宽末列，中间列占余量。
   用于「级 | 长描述 | 勾选」类三列表——末列短标签（如「☐ U0 已点亮」）列宽不足会换行，
   把每一行都撑成两行高，表格整体抬高 ~70px 导致页尾内容被画布裁掉。
   用法：markdown 中用围栏 div 包裹表格（::: {.tbl-colfix} … :::）。 */
.tbl-colfix table {
    table-layout: fixed;
}
.tbl-colfix table th:first-child {
    width: 8%;
}
.tbl-colfix table th:last-child {
    width: 26%;
}

/* 4. 引用块优化 */
.reveal blockquote {
    width: 95%;
    margin: 10px auto;
    padding: 10px 20px;
    font-size: 0.8em;
    border-left: 4px solid #ccc;
    background: #fafafa;
    box-shadow: none;
    font-style: normal;
    text-align: left;
}

/* 
 * 5. Lab & Syllabus Styles (GitHub-like)
 * Applied to content wrapped in .markdown-body
 */

/* Hide duplicate title block generated by Pandoc */
#title-block-header {
    display: none;
}

.markdown-body {
    box-sizing: border-box;
    min-width: 200px;
    max-width: 980px;
    margin: 0 auto;
    padding: 45px;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
    font-size: 16px;
    line-height: 1.5;
    word-wrap: break-word;
    color: #24292e;
    background-color: #fff;
}

.markdown-body h1, .markdown-body h2, .markdown-body h3, 
.markdown-body h4, .markdown-body h5, .markdown-body h6 {
    margin-top: 24px;
    margin-bottom: 16px;
    font-weight: 600;
    line-height: 1.25;
}

.markdown-body h1 {
    font-size: 2em;
    padding-bottom: 0.3em;
    border-bottom: 1px solid #eaecef;
}

.markdown-body h2 {
    font-size: 1.5em;
    padding-bottom: 0.3em;
    border-bottom: 1px solid #eaecef;
}

.markdown-body h3 { font-size: 1.25em; }
.markdown-body h4 { font-size: 1em; }
.markdown-body h5 { font-size: 0.875em; }
.markdown-body h6 { font-size: 0.85em; color: #6a737d; }

.markdown-body p {
    margin-top: 0;
    margin-bottom: 16px;
}

.markdown-body blockquote {
    padding: 0 1em;
    color: #6a737d;
    border-left: 0.25em solid #dfe2e5;
    margin: 0 0 16px 0;
}

.markdown-body ul, .markdown-body ol {
    padding-left: 2em;
    margin-top: 0;
    margin-bottom: 16px;
}

.markdown-body li {
    word-wrap: break-all;
}

.markdown-body table {
    display: table;
    width: 100%;
    border-collapse: collapse;
    margin-top: 0;
    margin-bottom: 16px;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
}

.markdown-body table th {
    padding: 8px 12px;
    border: none;
    border-bottom: 1px solid #000;
    font-weight: bold;
    background-color: #f0f0f0;
    text-align: left;
}

.markdown-body table td {
    padding: 8px 12px;
    border: none;
    text-align: left;
}

.markdown-body table tr {
    background-color: #fff;
    border: none;
}

.markdown-body table tr:nth-child(even) {
    background-color: #f8f9fa;
}

.markdown-body code {
    padding: 0.2em 0.4em;
    margin: 0;
    font-size: 85%;
    background-color: rgba(27,31,35,0.05);
    border-radius: 3px;
    font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;
}

.markdown-body pre {
    padding: 16px;
    overflow: auto;
    font-size: 85%;
    line-height: 1.45;
    background-color: #f6f8fa;
    border-radius: 3px;
    margin-top: 0;
    margin-bottom: 16px;
}

.markdown-body pre code {
    padding: 0;
    margin: 0;
    font-size: 100%;
    word-break: normal;
    white-space: pre;
    background: transparent;
    border: 0;
    overflow: visible;
}

.markdown-body a {
    color: #0366d6;
    text-decoration: none;
}

.markdown-body a:hover {
    text-decoration: underline;
}

/* doc 页面顶部「← 返回首页」导航（build_slides.sh render_doc 经 --include-before-body 注入）*/
.markdown-body .doc-home {
    margin: 0 0 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eaecef;
    font-size: 90%;
}
.markdown-body .doc-home a {
    color: #0366d6;
    text-decoration: none;
}
.markdown-body .doc-home a:hover {
    text-decoration: underline;
}

.markdown-body img {
    max-width: 100%;
    box-sizing: content-box;
    background-color: #fff;
}

/* TOC Navigation Styles */
#TOC {
    position: fixed;
    right: 20px;
    top: 20px;
    width: 250px;
    max-height: 90vh;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #e1e4e8;
    border-radius: 6px;
    padding: 10px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    z-index: 1000;
    font-size: 14px;
    transition: all 0.3s ease;
}

#TOC.collapsed {
    width: 60px;
    height: 40px;
    overflow: hidden;
    padding: 5px;
}

#TOC.collapsed > ul {
    display: none;
}

#toc-toggle {
    display: block;
    width: 100%;
    background: #f6f8fa;
    border: 1px solid #d1d5da;
    border-radius: 3px;
    padding: 5px;
    cursor: pointer;
    font-weight: bold;
    color: #24292e;
    margin-bottom: 10px;
    text-align: center;
}

#TOC.collapsed #toc-toggle {
    margin-bottom: 0;
    border: none;
    background: transparent;
    padding: 0;
    height: 100%;
}

#TOC ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

#TOC ul ul {
    padding-left: 15px;
}

#TOC a {
    display: block;
    padding: 4px 0;
    color: #0366d6;
    text-decoration: none;
    word-wrap: break-word;
}

#TOC a:hover {
    text-decoration: underline;
}

@media (max-width: 1100px) {
    #TOC {
        background: rgba(255,255,255,0.95);
    }
}