
.toc a {
    font-size: 0.875rem;
    color: #71717a;
    transition: color 0.2s;
}

.toc a:hover {
    color: #1f2937;
    text-decoration: underline;
}

.dark .toc a {
    color: #a1a1aa;
}

.toc ul ul {
    padding-left: 1rem;
}

/* Base styles for all pre elements */
pre {
    white-space: pre-wrap;
    word-wrap: break-word;
    overflow-x: auto;
    max-width: 100%;
}

/* Style all code blocks with language class */
pre[class*="language-"] {
    max-height: 300px !important;
    max-width: 100% !important;  /* Default for mobile */
    width: 100% !important;
    overflow: auto !important;
    padding: 1rem !important;
    margin: 1rem 0 !important;
    border-radius: 0.5rem !important;
    font-size: 0.875rem !important;
}


/* Scrollbar styling */
pre[class*="language-"]::-webkit-scrollbar {
    width: 0.5rem;
    height: 0.5rem;
}

pre[class*="language-"]::-webkit-scrollbar-track {
    border-radius: 0.25rem;
}

pre[class*="language-"]::-webkit-scrollbar-thumb {
    border-radius: 0.25rem;
}

/* Firefox scrollbar */
pre[class*="language-"] {
    scrollbar-width: thin;
    scrollbar-color: rgb(212 212 216) rgb(244 244 245);
}

.dark pre[class*="language-"] {
    scrollbar-color: rgb(82 82 91) rgb(39 39 42);
}