/* Global Transitions */

{
transition-property: background-color, border-color, color, fill, stroke;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 300ms;
}

/* Custom Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
background: #cbd5e1;
border-radius: 10px;
}
.dark ::-webkit-scrollbar-thumb { background: #334155; }

/* Navigation States */
.nav-active {
background-color: rgba(20, 184, 166, 0.1);
color: #0d9488 !important;
font-weight: 600;
border-right: 3px solid #0d9488;
}
.dark .nav-active {
background-color: rgba(45, 212, 191, 0.1);
color: #2dd4bf !important;
border-right-color: #2dd4bf;
}

.nav-item { transition: all 0.2s ease; border-right: 3px solid transparent; }

/* Glass Effects */
.glass-sidebar {
background-color: #f9fafb;
}
.dark .glass-sidebar {
background-color: #0b0f1a;
}

@supports (backdrop-filter: blur(12px)) {
.glass-sidebar {
backdrop-filter: blur(12px);
background-color: rgba(249, 250, 251, 0.8);
}
.dark .glass-sidebar {
background-color: rgba(11, 15, 26, 0.8);
}
}

/* Code Block Styling */
.code-block-wrapper { position: relative; }
.copy-btn {
position: absolute;
top: 0.5rem;
right: 0.5rem;
padding: 0.25rem 0.5rem;
background: rgba(255,255,255,0.1);
border: 1px solid rgba(255,255,255,0.2);
color: #cbd5e1;
font-size: 0.75rem;
border-radius: 4px;
opacity: 0;
transition: opacity 0.2s;
}
.code-block-wrapper:hover .copy-btn { opacity: 1; }
/* ... existing code ... /
/ --- FALLBACK STYLES FOR MARKDOWN --- /
/ This ensures bullet points and tables show up even if the prose class has issues */

#content ul {
list-style-type: disc !important;
padding-left: 1.5rem !important;
margin-bottom: 1.25rem !important;
}

#content ol {
list-style-type: decimal !important;
padding-left: 1.5rem !important;
margin-bottom: 1.25rem !important;
}

#content li {
margin-bottom: 0.5rem !important;
display: list-item !important;
}

#content table {
width: 100% !important;
border-collapse: collapse !important;
margin: 2rem 0 !important;
font-size: 0.9rem !important;
}

#content th, #content td {
border: 1px solid #e2e8f0 !important;
padding: 0.75rem !important;
text-align: left !important;
}

.dark #content th, .dark #content td {
border-color: #334155 !important;
}

#content th {
background-color: #f8fafc !important;
font-weight: 600 !important;
}

.dark #content th {
background-color: #1e293b !important;
}

/* ... existing code ... */