:root {
color-scheme: light;
--primary-background: #fff;
--secondary-background: ghostwhite;
--third-background: #e8e8e8;
--info-background: #50c050;
--warning-background: #c0a000;
--error-background: #e04040;
--border: #dde;
--text: #222;
--anchor: #07b;
--anchor-focus: #607c9f;
--input-focus: #1fa0eb;
--strong: #3c3c3c;
--hint: #9A9A9A;

--keyword: #5e8f60;
--identifier: #222;
--comment: #484a86;
--operator: #155da4;
--punctuation: black;
--other: black;
--escapeSequence: #c4891b;
--number: #252dbe;
--literal: #a4255b;
--program: #6060c0;
--option: #508000;
--raw-data: #a4255b;

--clipboard-image-normal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='color: black' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E %3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2' /%3E %3C/svg%3E");
--clipboard-image-selected: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='color: black' viewBox='0 0 20 20' fill='currentColor'%3E %3Cpath d='M8 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z' /%3E %3Cpath d='M6 3a2 2 0 00-2 2v11a2 2 0 002 2h8a2 2 0 002-2V5a2 2 0 00-2-2 3 3 0 01-3 3H9a3 3 0 01-3-3z' /%3E %3C/svg%3E");
--clipboard-image: var(--clipboard-image-normal)
}

[data-theme="dark"] {
color-scheme: dark;
--primary-background: #171921;
--secondary-background: #1e202a;
--third-background: #2b2e3b;
--info-background: #008000;
--warning-background: #807000;
--error-background: #c03000;
--border: #0e1014;
--text: #fff;
--anchor: #8be9fd;
--anchor-focus: #8be9fd;
--input-focus: #8be9fd;
--strong: #bd93f9;
--hint: #7A7C85;

--keyword: #f8f8f2;
--identifier: #f8f8f2;
--comment: #ff79c6;
--operator: #f8f8f2;
--punctuation: #f8f8f2;
--other: #f8f8f2;
--escapeSequence: #bd93f9;
--number: #f1fa8c;
--literal: #f1fa8c;
--program: #9090c0;
--option: #90b010;
--raw-data: #8be9fd;

--clipboard-image-normal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='color: lightgray' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E %3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2' /%3E %3C/svg%3E");
--clipboard-image-selected: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='color: lightgray' viewBox='0 0 20 20' fill='currentColor'%3E %3Cpath d='M8 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z' /%3E %3Cpath d='M6 3a2 2 0 00-2 2v11a2 2 0 002 2h8a2 2 0 002-2V5a2 2 0 00-2-2 3 3 0 01-3 3H9a3 3 0 01-3-3z' /%3E %3C/svg%3E");
--clipboard-image: var(--clipboard-image-normal);
}

@media (prefers-color-scheme: dark) {
[data-theme="auto"] {
    color-scheme: dark;
    --primary-background: #171921;
    --secondary-background: #1e202a;
    --third-background: #2b2e3b;
    --info-background: #008000;
    --warning-background: #807000;
    --error-background: #c03000;
    --border: #0e1014;
    --text: #fff;
    --anchor: #8be9fd;
    --anchor-focus: #8be9fd;
    --input-focus: #8be9fd;
    --strong: #bd93f9;
    --hint: #7A7C85;

    --keyword: #ff79c6;
    --identifier: #f8f8f2;
    --comment: #6272a4;
    --operator: #ff79c6;
    --punctuation: #f8f8f2;
    --other: #f8f8f2;
    --escapeSequence: #bd93f9;
    --number: #bd93f9;
    --literal: #f1fa8c;
    --program: #9090c0;
    --option: #90b010;
    --raw-data: #8be9fd;

    --clipboard-image-normal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='color: lightgray' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E %3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2' /%3E %3C/svg%3E");
    --clipboard-image-selected: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='color: lightgray' viewBox='0 0 20 20' fill='currentColor'%3E %3Cpath d='M8 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z' /%3E %3Cpath d='M6 3a2 2 0 00-2 2v11a2 2 0 002 2h8a2 2 0 002-2V5a2 2 0 00-2-2 3 3 0 01-3 3H9a3 3 0 01-3-3z' /%3E %3C/svg%3E");
    --clipboard-image: var(--clipboard-image-normal);
}
}


span.DecNumber {
color: var(--number); }

span.BinNumber {
color: var(--number); }

span.HexNumber {
color: var(--number); }

span.OctNumber {
color: var(--number); }

span.FloatNumber {
color: var(--number); }

span.Identifier {
color: var(--identifier); }

span.Keyword {
font-weight: 600;
color: var(--keyword); }

span.StringLit {
color: var(--literal); }

span.LongStringLit {
color: var(--literal); }

span.CharLit {
color: var(--literal); }

span.EscapeSequence {
color: var(--escapeSequence); }

span.Operator {
color: var(--operator); }

span.Punctuation {
color: var(--punctuation); }

span.Comment, span.LongComment {
font-style: italic;
font-weight: 400;
color: var(--comment); }

span.RegularExpression {
color: darkviolet; }

span.TagStart {
color: darkviolet; }

span.TagEnd {
color: darkviolet; }

span.option {
font-weight: bold;
font-family: "Source Code Pro", Monaco, Menlo, Consolas, "Courier New", monospace;
color: var(--option); }

span.Prompt {
font-weight: bold;
color: red; }

span.ProgramOutput {
font-weight: bold;
color: #808080; }

span.program {
font-weight: bold;
color: var(--program);
text-decoration: underline;
text-decoration-color: var(--hint);
text-decoration-thickness: 0.05em;
text-underline-offset: 0.15em; }

span.Command, span.Rule, span.Hyperlink,
span.Label, span.Reference, span.Other {
color: var(--other); }

/* Light theme color scheme (default) */
:root {
    --bg-primary: #ffffff;      /* White background */
    --bg-secondary: #f0f8f0;    /* Light green background */
    --third-background: #e8f5e8; /* Light green third level background */
    --text-primary: #2c3e50;    /* Dark blue-gray text */
    --text-secondary: #3498db;  /* Soft blue for highlights */
    --text-muted: #7f9f7f;      /* Muted green for secondary text */
    --border-color: #e0f0e0;    /* Light green border */
    --code-bg: #f0f8f0;         /* Light green for code blocks */
    --code-border: #d0e8d0;     /* Light green for code borders */
    --accent-color: #2c3e50;    /* Soft red for accents */
    --string-color: #27ae60;    /* Green for strings */
    --keyword-color: #e74c3c;   /* Soft red for keywords */
    --comment-color: #8faf8f;   /* Muted green for comments */
}

/* Dark theme color scheme */
[data-theme="dark"] {
    --bg-primary: #002451;      /* Dark blue background */
    --bg-secondary: #00346e;    /* Slightly lighter blue */
    --third-background: transparent; /* Third level background */
    --text-primary: #ffffff;    /* White text */
    --text-secondary: #ffff00;  /* Yellow for captions and highlights */
    --text-muted: #b4b4b4;      /* Light gray for secondary text */
    --border-color: #1d3f53;    /* Darker blue border */
    --code-bg: var(--bg-primary);         /* Darker blue for code blocks */
    --code-border: #1d3f53;     /* Darker blue for code borders */
    --accent-color: #ffff00;    /* Soft red for accents */
    --string-color: #d1f1a9;    /* Light green for strings */
    --keyword-color: #ff9da4;   /* Soft red for keywords */
    --comment-color: #7285b7;   /* Muted blue for comments */
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Restore proper indentation for definition lists */
dd {
    margin-left: 40px;
}

body {
    font-family: 'Segoe UI', 'Tahoma', 'Arial', sans-serif;
    background-color: var(--bg-primary);
    color: var(--text-primary);
    line-height: 1.6;
    font-size: 16px;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

/* Header */
header {
    background-color: var(--bg-secondary);
    border: 2px solid var(--border-color);
    padding: 20px;
    margin-bottom: 30px;
    text-align: center;
}

h1 {
    color: var(--text-secondary);
    font-size: 2.5em;
    margin-bottom: 10px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.subtitle {
    color: var(--text-muted);
    font-size: 1.2em;
    font-style: italic;
}

/* Navigation */
nav {
    background-color: var(--bg-secondary);
    border: 2px solid var(--border-color);
    padding: 15px;
    margin-bottom: 30px;
}

/* Navigation controls - always visible */
.nav-controls {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
}



.nav-link {
    color: var(--text-primary);
    text-decoration: none;
    padding: 8px 12px;
    border-radius: 5px;
    background-color: var(--accent-color);
    border: 2px solid var(--accent-color);
    font-weight: bold;
    transition: all 0.3s ease;
}

.nav-link:hover {
    background-color: var(--bg-primary);
    color: var(--accent-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* Hierarchical Navigation */
.nav-hierarchy {
    display: none;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
    margin-top: 15px;
}

.nav-hierarchy.active {
    display: grid;
}

.nav-section {
    background-color: var(--code-bg);
    border: 2px solid var(--code-border);
    padding: 15px;
    border-radius: 5px;
    transition: all 0.3s ease;
}

.nav-section:hover {
    border-color: var(--text-secondary);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.nav-section h3 {
    color: var(--text-secondary);
    margin-bottom: 10px;
    font-size: 1.1em;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 5px;
}

.nav-section ul {
    list-style: none;
}

.nav-section li {
    margin-bottom: 5px;
}

.nav-section a {
    color: var(--text-primary);
    text-decoration: none;
    padding: 3px 8px;
    border-radius: 3px;
    transition: all 0.2s ease;
    display: block;
}

.nav-section a:hover {
    background-color: var(--text-secondary);
    color: var(--bg-primary);
}

/* Global links styling */
#global-links a {
    color: var(--text-secondary);
    text-decoration: none;
    transition: all 0.2s ease;
}

#global-links a:hover {
    color: var(--accent-color);
    text-decoration: underline;
}

/* Minimap button */
.nav-btn {
    background-color: var(--text-secondary);
    color: var(--bg-primary);
    border: 2px solid var(--text-secondary);
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 5px;
    transition: all 0.3s ease;
    font-size: 1.1em;
}

.nav-btn:hover {
    background-color: var(--bg-primary);
    color: var(--text-secondary);
}

.nav-btn.expanded {
    background-color: var(--bg-primary);
    color: var(--text-secondary);
}

/* Main content */
main {
    background-color: var(--bg-secondary);
    border: 2px solid var(--border-color);
    padding: 30px;
    margin-bottom: 30px;
}

h2 {
    color: var(--text-secondary);
    font-size: 1.8em;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--border-color);
}

h3 {
    color: var(--text-secondary);
    font-size: 1.4em;
    margin: 25px 0 15px 0;
}

p {
    margin-bottom: 15px;
    text-align: justify;
}

/* Code blocks */
pre {
    background-color: var(--code-bg);
    border: 2px solid var(--code-border);
    padding: 20px;
    margin: 20px 0;
    overflow-x: auto;
    border-radius: 5px;
}

code {
    font-family: 'Courier New', 'Consolas', 'Monaco', monospace;
    background-color: var(--code-bg);
    color: var(--text-secondary);
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 0.9em;
}

pre code {
    background: none;
    padding: 0;
    color: var(--text-primary);
}

/* Inline code */
.inline-code {
    background-color: var(--code-bg);
    color: var(--text-secondary);
    padding: 2px 6px;
    border-radius: 3px;
    font-family: 'Courier New', 'Consolas', 'Monaco', monospace;
    font-size: 0.9em;
}

/* Links */
a {
    color: var(--text-secondary);
    text-decoration: none;
    transition: all 0.2s ease;
}

a:hover {
    color: var(--accent-color);
    text-decoration: underline;
}

a:visited {
    color: var(--text-secondary);
}

/* Lists */
ul, ol {
    margin: 15px 0;
    padding-left: 30px;
}

li {
    margin-bottom: 8px;
}

/* Tables */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    background-color: var(--code-bg);
    border: 2px solid var(--code-border);
}

th, td {
    padding: 12px;
    text-align: left;
    border: 1px solid var(--code-border);
}

th {
    background-color: var(--bg-secondary);
    color: var(--text-secondary);
    font-weight: bold;
}

/* Footer */
footer {
    background-color: var(--bg-secondary);
    border: 2px solid var(--border-color);
    padding: 20px;
    text-align: center;
    color: var(--text-muted);
}

/* Responsive design */
@media (max-width: 768px) {
    .container {
        padding: 10px;
    }

    .nav-hierarchy {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .nav-section {
        padding: 10px;
    }

    h1 {
        font-size: 2em;
    }

    main {
        padding: 20px;
    }
}

/* Scrollbar styling */
::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: var(--bg-primary);
}

::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--text-secondary);
}

/* Right sidebar */
.right-sidebar {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1000;
    width: 280px;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    background-color: var(--bg-secondary);
    border: 2px solid var(--accent-color);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
}

.right-sidebar.collapsed {
    width: 60px;
    overflow: hidden;
}

/* Theme switcher button */
.theme-switcher {
    width: 100%;
    background-color: var(--bg-secondary);
    border: none;
    border-bottom: 2px solid var(--border-color);
    color: var(--text-secondary);
    padding: 12px 15px;
    border-radius: 6px 6px 0 0;
    cursor: pointer;
    font-family: 'Segoe UI', 'Tahoma', 'Arial', sans-serif;
    font-size: 14px;
    font-weight: bold;
    transition: all 0.3s ease;
    text-align: center;
}

.theme-switcher:hover {
    background-color: var(--text-secondary);
    color: var(--bg-primary);
}

/* Disabled theme switcher button */
.theme-switcher-disabled {
    width: 100%;
    background-color: var(--third-background);
    border: none;
    border-bottom: 2px solid var(--border-color);
    color: var(--hint);
    padding: 12px 15px;
    border-radius: 6px 6px 0 0;
    cursor: not-allowed;
    font-family: 'Segoe UI', 'Tahoma', 'Arial', sans-serif;
    font-size: 14px;
    font-weight: bold;
    transition: all 0.3s ease;
    text-align: center;
    opacity: 0.6;
    pointer-events: none;
}

.theme-switcher-disabled:hover {
    background-color: var(--third-background);
    color: var(--hint);
    cursor: not-allowed;
}

/* File overview section */
.file-overview {
    padding: 15px;
    display: block;
}

.right-sidebar.collapsed .file-overview {
    display: none;
}

.file-overview h3 {
    color: var(--text-secondary);
    font-size: 16px;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-color);
}

.file-overview .current-section {
    background-color: var(--accent-color);
    color: var(--bg-primary);
    padding: 8px 12px;
    border-radius: 4px;
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 14px;
}

.file-overview .section-list li a {
    color: inherit;
    text-decoration: none;
    display: block;
    font-size: 13px;
}

.file-overview .section-list li a:hover {
    color: inherit;
}

/* File overview section list styling */
.file-overview .section-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.file-overview .section-list > li {
    margin-bottom: 6px;
    padding: 6px 8px;
    border-radius: 4px;
    background-color: var(--code-bg);
    border: 1px solid var(--code-border);
    transition: all 0.2s ease;
}

.file-overview .section-list > li:hover {
    background-color: var(--text-secondary);
    color: var(--bg-primary);
    cursor: pointer;
}

/* Nested list styling for hierarchy */
.file-overview .section-list ul {
    list-style: none;
    padding: 0;
    margin: 8px 0 0 0;
}

.file-overview .section-list ul li {
    margin-bottom: 4px;
    padding: 4px 8px 4px 16px;
    border-radius: 3px;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    font-size: 12px;
    transition: all 0.2s ease;
}

.file-overview .section-list ul ul li {
    padding-left: 24px;
    font-size: 11px;
    background-color: var(--code-bg);
}

.file-overview .section-list ul li:hover {
    background-color: var(--text-secondary);
    color: var(--bg-primary);
    cursor: pointer;
}

/* Toggle button for sidebar */
.sidebar-toggle {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1001;
    background-color: var(--accent-color);
    border: 2px solid var(--accent-color);
    color: var(--bg-primary);
    padding: 8px 12px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 12px;
    font-weight: bold;
    transition: all 0.3s ease;
    display: none;
}

.sidebar-toggle:hover {
    background-color: var(--bg-primary);
    color: var(--accent-color);
}

/* Responsive design for sidebar */
@media (max-width: 768px) {
    .right-sidebar {
        top: 10px;
        right: 10px;
        width: 250px;
        max-height: calc(100vh - 20px);
    }

    .sidebar-toggle {
        top: 10px;
        right: 10px;
        padding: 6px 10px;
        font-size: 11px;
    }

    .right-sidebar.collapsed {
        width: 50px;
    }
}

/* Print styles - hide navigation and sidebar elements */
@media print {
    /* Hide the right sidebar completely */
    .right-sidebar,
    .sidebar-toggle {
        display: none !important;
    }

    /* Hide navigation controls and hierarchy */
    .nav-controls,
    .nav-hierarchy {
        display: none !important;
    }

    /* Hide the entire nav element */
    nav {
        display: none !important;
    }

    /* Ensure main content takes full width */
    main {
        width: 100% !important;
        margin: 0 !important;
        padding: 20px !important;
        border: none !important;
        background: none !important;
    }

    /* Ensure container doesn't have max-width constraint */
    .container {
        max-width: none !important;
        padding: 0 !important;
    }

    /* Ensure header is properly styled for print */
    header {
        background: none !important;
        border: none !important;
        padding: 10px 0 !important;
        margin-bottom: 20px !important;
    }

    /* Ensure footer is properly styled for print */
    footer {
        background: none !important;
        border: none !important;
        padding: 10px 0 !important;
        margin-top: 20px !important;
    }

    /* Ensure code blocks are properly formatted for print */
    pre {
        background: #f5f5f5 !important;
        border: 1px solid #ccc !important;
        page-break-inside: avoid !important;
    }

    /* Ensure tables don't break across pages */
    table {
        page-break-inside: avoid !important;
    }

    /* Ensure headings don't break across pages */
    h1, h2, h3, h4, h5, h6 {
        page-break-after: avoid !important;
    }

    /* Remove shadows and decorative elements for print */
    * {
        box-shadow: none !important;
        text-shadow: none !important;
    }

    /* Ensure proper page breaks */
    .section {
        page-break-before: auto !important;
    }
}