/* Test2Go Documentation - GitHub Dark Theme */

/* CSS Reset & Base */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: #c9d1d9;
    background-color: #0d1117;
    margin: 0;
    padding: 0;
}

/* Sidebar Navigation (TOC) */
#TOC {
    position: fixed;
    top: 0;
    left: 0;
    width: 280px;
    height: 100vh;
    overflow-y: auto;
    background-color: #161b22;
    border-right: 1px solid #21262d;
    padding: 24px 16px;
    z-index: 100;
}

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

#TOC > ul > li {
    margin-bottom: 16px;
}

#TOC li {
    margin: 2px 0;
}

#TOC ul ul {
    padding-left: 16px;
    margin-top: 4px;
}

#TOC a {
    color: #58a6ff;
    text-decoration: none;
    display: block;
    padding: 4px 12px;
    border-radius: 6px;
    font-size: 14px;
    line-height: 1.5;
    transition: all 0.15s ease;
    word-wrap: break-word;
}

#TOC a:hover {
    background-color: #1f6feb;
    color: #ffffff;
    text-decoration: none;
}

#TOC > ul > li > a {
    font-weight: 600;
    font-size: 14px;
    color: #f0f6fc;
}

/* Main Content Container */
body {
    margin-left: 320px;
}

header, main, article, .content {
    max-width: 1012px;
    padding: 32px 64px 32px 48px;
    margin: 0 auto;
}

/* Hide duplicate title in header */
header#title-block-header {
    display: none;
}

/* Additional right margin to prevent content touching edge */
@media (min-width: 1400px) {
    body {
        margin-right: 48px;
    }
}

/* Title Header - Hide duplicate and clean up */
header#title-block-header {
    display: none;
}

/* Main title styling */
body > h1:first-of-type {
    font-size: 32px;
    padding-bottom: 8px;
    border-bottom: 1px solid #21262d;
    margin-top: 0;
    margin-bottom: 24px;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    margin-top: 24px;
    margin-bottom: 16px;
    font-weight: 600;
    line-height: 1.25;
    color: #f0f6fc;
}

h1 {
    font-size: 32px;
    padding-bottom: 8px;
    border-bottom: 1px solid #21262d;
    margin-top: 0;
    margin-bottom: 16px;
}

h2 {
    font-size: 24px;
    padding-bottom: 8px;
    border-bottom: 1px solid #21262d;
    margin-top: 32px;
}

h3 {
    font-size: 20px;
    margin-top: 24px;
}

h4 {
    font-size: 16px;
}

h5 {
    font-size: 14px;
}

h6 {
    font-size: 13px;
    color: #8b949e;
}

p {
    margin-top: 0;
    margin-bottom: 16px;
    line-height: 1.6;
}

/* Links */
a {
    color: #58a6ff;
    text-decoration: none;
    transition: color 0.15s ease;
}

a:hover {
    color: #79c0ff;
    text-decoration: underline;
}

a:visited {
    color: #a371f7;
}

/* Lists */
ul, ol {
    margin-top: 0;
    margin-bottom: 16px;
    padding-left: 32px;
}

li {
    margin-top: 4px;
    line-height: 1.6;
}

li + li {
    margin-top: 4px;
}

li > ul,
li > ol {
    margin-top: 4px;
    margin-bottom: 0;
}

/* Code */
code {
    background-color: rgba(110, 118, 129, 0.4);
    padding: 3px 6px;
    border-radius: 6px;
    font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
    font-size: 85%;
    color: #e6edf3;
}

pre {
    background-color: #161b22;
    border-radius: 6px;
    padding: 16px;
    overflow-x: auto;
    line-height: 1.45;
    margin-bottom: 16px;
    border: 1px solid #30363d;
}

pre code {
    background-color: transparent;
    padding: 0;
    color: #e6edf3;
    font-size: 100%;
    border-radius: 0;
}

/* Tables */
table {
    border-collapse: collapse;
    width: 100%;
    margin-bottom: 16px;
    border-spacing: 0;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid #30363d;
}

th, td {
    border: 1px solid #30363d;
    padding: 8px 13px;
    text-align: left;
}

th {
    background-color: #161b22;
    color: #f0f6fc;
    font-weight: 600;
}

tr {
    background-color: #0d1117;
}

tr:nth-child(2n) {
    background-color: #161b22;
}

tr:hover {
    background-color: #1c2128;
}

/* Images */
img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
    border: 1px solid #30363d;
    margin: 16px 0;
    display: block;
    background-color: #0d1117;
}

/* Figures */
figure {
    margin: 16px 0;
}

figcaption {
    font-size: 14px;
    color: #8b949e;
    margin-top: 8px;
    text-align: center;
}

/* Blockquotes */
blockquote {
    border-left: 4px solid #30363d;
    margin: 0 0 16px 0;
    padding: 0 16px;
    color: #8b949e;
}

blockquote p {
    margin-bottom: 8px;
}

blockquote p:last-child {
    margin-bottom: 0;
}

/* Horizontal Rule */
hr {
    border: 0;
    border-bottom: 1px solid #21262d;
    margin: 24px 0;
    height: 0;
}

/* Strong and Emphasis */
strong {
    font-weight: 600;
    color: #f0f6fc;
}

em {
    font-style: italic;
}

/* Responsive Design */

/* Large Desktop - extra right padding and left spacing */
@media (min-width: 1600px) {
    header, main, article, .content {
        padding-right: 96px;
        padding-left: 64px;
    }
}

@media (min-width: 1400px) and (max-width: 1599px) {
    header, main, article, .content {
        padding-left: 56px;
    }
}

/* Desktop */
@media (max-width: 1200px) {
    #TOC {
        width: 240px;
    }
    
    body {
        margin-left: 280px;
    }
    
    header, main, article, .content {
        padding: 24px 40px 24px 40px;
    }
}

/* Tablet */
@media (max-width: 992px) {
    #TOC {
        width: 220px;
        padding: 16px 12px;
    }
    
    #TOC a {
        font-size: 13px;
        padding: 3px 8px;
    }
    
    body {
        margin-left: 240px;
    }
    
    header, main, article, .content {
        padding: 20px 32px 20px 32px;
    }
    
    h1 {
        font-size: 28px;
    }
    
    h2 {
        font-size: 22px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    #TOC {
        position: static;
        width: 100%;
        height: auto;
        border-right: none;
        border-bottom: 1px solid #21262d;
        padding: 16px;
        max-height: 300px;
        overflow-y: auto;
    }
    
    body {
        margin-left: 0;
        margin-right: 0;
    }
    
    header, main, article, .content {
        padding: 16px 20px;
    }
    
    h1 {
        font-size: 26px;
    }
    
    h2 {
        font-size: 20px;
    }
    
    h3 {
        font-size: 18px;
    }
    
    pre {
        padding: 12px;
        font-size: 14px;
    }
    
    table {
        font-size: 14px;
    }
    
    th, td {
        padding: 6px 8px;
    }
}

/* Small Mobile */
@media (max-width: 480px) {
    header, main, article, .content {
        padding: 12px 16px;
    }
    
    h1 {
        font-size: 24px;
    }
    
    h2 {
        font-size: 20px;
    }
    
    h3 {
        font-size: 18px;
    }
    
    #TOC a {
        font-size: 13px;
    }
}

/* Scrollbar Styling for Sidebar */
#TOC::-webkit-scrollbar {
    width: 8px;
}

#TOC::-webkit-scrollbar-track {
    background: #161b22;
}

#TOC::-webkit-scrollbar-thumb {
    background: #30363d;
    border-radius: 4px;
}

#TOC::-webkit-scrollbar-thumb:hover {
    background: #484f58;
}

/* Scrollbar for main content */
body::-webkit-scrollbar {
    width: 12px;
}

body::-webkit-scrollbar-track {
    background: #0d1117;
}

body::-webkit-scrollbar-thumb {
    background: #30363d;
    border-radius: 6px;
}

body::-webkit-scrollbar-thumb:hover {
    background: #484f58;
}

/* Print Styles */
@media print {
    #TOC {
        display: none;
    }
    
    body {
        margin-left: 0;
        margin-right: 0;
        background-color: white;
        color: black;
    }
    
    a {
        color: #000;
        text-decoration: underline;
    }
    
    h1, h2 {
        page-break-after: avoid;
    }
    
    pre, blockquote, table {
        page-break-inside: avoid;
    }
    
    pre {
        border: 1px solid #000;
    }
}

/* Selection Color */
::selection {
    background-color: #1f6feb;
    color: #ffffff;
}

::-moz-selection {
    background-color: #1f6feb;
    color: #ffffff;
}

/* Syntax Highlighting for Code Blocks */
/* Based on GitHub Dark Theme */

/* Keywords */
code span.kw { color: #ff7b72; font-weight: bold; } /* Keyword */
code span.dt { color: #ffa657; } /* DataType */
code span.dv { color: #79c0ff; } /* DecVal */
code span.bn { color: #79c0ff; } /* BaseN */
code span.fl { color: #79c0ff; } /* Float */
code span.ch { color: #a5d6ff; } /* Char */
code span.st { color: #a5d6ff; } /* String */
code span.co { color: #8b949e; font-style: italic; } /* Comment */
code span.ot { color: #d2a8ff; } /* Other */
code span.al { color: #ff7b72; font-weight: bold; } /* Alert */
code span.fu { color: #d2a8ff; } /* Function */
code span.er { color: #f85149; font-weight: bold; } /* Error */
code span.wa { color: #ffa657; font-weight: bold; } /* Warning */
code span.cn { color: #79c0ff; } /* Constant */
code span.sc { color: #a5d6ff; } /* SpecialChar */
code span.vs { color: #a5d6ff; } /* VerbatimString */
code span.ss { color: #a5d6ff; } /* SpecialString */
code span.im { color: #ff7b72; } /* Import */
code span.va { color: #79c0ff; } /* Variable */
code span.cf { color: #ff7b72; font-weight: bold; } /* ControlFlow */
code span.op { color: #ff7b72; } /* Operator */
code span.bu { color: #d2a8ff; } /* BuiltIn */
code span.ex { color: #ffa657; } /* Extension */
code span.pp { color: #ff7b72; } /* Preprocessor */
code span.at { color: #79c0ff; } /* Attribute */
code span.do { color: #8b949e; font-style: italic; } /* Documentation */
code span.an { color: #8b949e; font-style: italic; } /* Annotation */
code span.cv { color: #8b949e; font-style: italic; } /* CommentVar */
code span.in { color: #8b949e; font-style: italic; } /* Information */

/* Additional Language-Specific Highlighting */
.language-php code span.kw,
.language-php code span.cf { color: #ff7b72; }
.language-php code span.fu { color: #d2a8ff; }
.language-php code span.st { color: #a5d6ff; }
.language-php code span.va { color: #ffa657; }

.language-javascript code span.kw,
.language-js code span.kw { color: #ff7b72; }
.language-javascript code span.fu,
.language-js code span.fu { color: #d2a8ff; }

.language-bash code span.ex,
.language-sh code span.ex { color: #d2a8ff; }
.language-bash code span.st,
.language-sh code span.st { color: #a5d6ff; }

.language-sql code span.kw { color: #ff7b72; font-weight: bold; }
.language-sql code span.dt { color: #ffa657; }

/* Better code block borders and background */
pre.sourceCode {
    background-color: #161b22;
    border: 1px solid #30363d;
    border-radius: 6px;
    padding: 16px;
    overflow-x: auto;
}

div.sourceCode {
    margin: 16px 0;
}