::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #11111b; }
::-webkit-scrollbar-thumb { background: #313244; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #45475a; }

body { background-color: #11111b; }

.glass-header {
    background: rgba(17, 17, 27, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(49, 50, 68, 0.3);
}

/* MARKDOWN OVERRIDES */
.markdown-body {
    background-color: transparent !important;
    font-family: 'Inter', sans-serif !important;
    color: #a6adc8 !important; /* subtext0 */
    --color-canvas-default: transparent;
    --color-canvas-subtle: #1e1e2e; /* base */
    --color-border-default: #45475a; /* surface1 */
    --color-border-muted: #313244; /* surface0 */
    --color-fg-default: #cdd6f4; /* text */
    --color-fg-muted: #a6adc8; /* subtext0 */
    --color-accent-fg: #89b4fa; /* blue */
    --color-accent-emphasis: #89b4fa;
    --color-danger-fg: #f38ba8; /* red */
}

/* Typography overrides */
.markdown-body h1, .markdown-body h2, .markdown-body h3 {
    border-bottom-color: #313244;
    color: #b4befe !important; /* lavender */
}
.markdown-body h2 { color: #cba6f7 !important; /* mauve */ }
.markdown-body h3 { color: #89b4fa !important; /* blue */ }

/* Code Blocks */
.markdown-body pre {
    background-color: #181825 !important; /* mantle */
    border: none !important;
    border-radius: 0.75rem;
    padding: 1rem !important;
}

/* Inline Code */
.markdown-body code {
    color: #fab387 !important; /* peach */
    background-color: #313244 !important; /* surface0 */
    border-radius: 4px;
}
.markdown-body pre code {
    color: inherit !important;
    background-color: transparent !important;
}

/* Lists */
.markdown-body ul,
.markdown-body ol {
    list-style-position: outside;
    padding-left: 2em;
    margin-bottom: 1rem;
}
.markdown-body ul {
    list-style-type: disc;
}
.markdown-body ol {
    list-style-type: decimal;
}
.markdown-body ul ul {
    list-style-type: circle;
}
.markdown-body ul ul ul {
    list-style-type: square;
}
.markdown-body li {
    margin-bottom: 0.25rem;
}

/* TABLE OVERRIDES */
.markdown-body table {
    display: table !important; /* Force table display to stretch */
    width: 100% !important;    /* Force full width */
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #45475a; /* surface1 */
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 1.5rem;
}

.markdown-body table thead {
    background-color: rgba(203, 166, 247, 0.1); /* Mauve hint */
}

.markdown-body table tr {
    background-color: transparent !important;
    border: none !important;
}

.markdown-body table tr:nth-child(2n) {
    background-color: rgba(49, 50, 68, 0.3) !important; /* surface0/30 */
}

.markdown-body table th {
    color: #cba6f7 !important; /* mauve */
    font-weight: 600;
    border: none !important; /* Override github-markdown-css */
    border-bottom: 1px solid #45475a !important; /* surface1 */
    border-right: 1px solid #313244; /* surface0 */
    padding: 12px 16px !important;
}

.markdown-body table td {
    border: none !important; /* Override github-markdown-css */
    border-bottom: 1px solid #313244 !important; /* surface0 */
    border-right: 1px solid #313244;
    color: #a6adc8 !important; /* subtext0 */
    padding: 12px 16px !important;
}

.markdown-body table th:last-child,
.markdown-body table td:last-child {
    border-right: none;
}
.markdown-body table tr:last-child td {
    border-bottom: none !important;
}

/* Callouts */
.callout {
    padding: 1rem;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    border-left: none; 
    display: flex;
    gap: 0.75rem;
    align-items: baseline;
    background-color: rgba(49, 50, 68, 0.2);
}
.callout-icon { 
    font-size: 1.1rem; 
    transform: translateY(2px);
    flex-shrink: 0;
}
.callout-content { flex: 1; }
.callout-content p { margin: 0 !important; }

.callout.tip { background-color: rgba(166, 227, 161, 0.1); }
.callout.tip .callout-icon { color: #a6e3a1; }

.callout.info { background-color: rgba(137, 180, 250, 0.1); }
.callout.info .callout-icon { color: #89b4fa; }

.callout.danger { background-color: rgba(243, 139, 168, 0.1); }
.callout.danger .callout-icon { color: #f38ba8; }

/* Misc */
#markdown-container { position: relative; z-index: 45; }
.search-match { background-color: #f9e2af; color: #11111b; padding: 0 2px; border-radius: 2px; position: relative; z-index: 45; }
.toc-link.active {
    color: #cba6f7;
    border-left-color: #cba6f7;
    background-color: rgba(203, 166, 247, 0.05);
}

/* Copy Button */
.copy-code-btn {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    padding: 0.5rem;
    background-color: rgba(49, 50, 68, 0.95); /* surface0 */
    border: 1px solid rgba(69, 71, 90, 0.8); /* surface1 */
    border-radius: 0.375rem;
    color: #a6adc8; /* subtext0 */
    cursor: pointer;
    opacity: 0;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    pointer-events: auto;
}
pre {
    position: relative;
}
pre:hover .copy-code-btn {
    opacity: 1;
}
.copy-code-btn:hover {
    background-color: rgba(69, 71, 90, 1);
    color: #cba6f7; /* mauve */
    border-color: #cba6f7;
}
.copy-code-btn.copied {
    color: #a6e3a1; /* green */
    border-color: #a6e3a1;
}
.copy-code-btn:active {
    transform: scale(0.95);
}
