/* Theme loading - hide page until theme is applied to prevent flash */ html.theme-loading { visibility: hidden; } html.theme-loading body { visibility: hidden; } /* General heading weight - lighter H1/H2 for a cleaner look */ h1, h2 { font-weight: 500; } /* Reduce top margin on reference page object titles */ h2.title { margin-top: 0.5rem; border-bottom: none; padding-bottom: 0; } .table a { text-underline-offset: 4px; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; color: inherit; font-weight: bold; font-size: 0.875em; word-break: initial; text-decoration-thickness: 2px; } /* Signature highlighting - class name (e.g., "Graph" in Graph.add_node) */ code span.sig-class { color: #0e84b5; font-weight: 600; } /* Signature highlighting - method/function name (e.g., "add_node" in Graph.add_node) */ code span.sig-name { color: #4758AB; font-weight: 600; } /* Signature highlighting - None constant */ code span.cn-none { color: #7D4E9E; font-weight: 500; } /* Signature highlighting - True/False boolean constants */ code span.cn-bool { color: #0077AA; font-weight: 600; } /* Signature highlighting - operators (=, **, etc.) - override Quarto default */ #cb1 code span.op { color: #D14D00; font-weight: 500; } /* Spacer between overloaded function signatures */ #cb1 code span.overload-spacer { display: block; height: 0.35em; user-select: none; } .navbar-brand img { max-height: 45px; padding-right: 0px; margin-left: 5px; margin-right: 12px; transition: transform 0.3s ease; } .navbar-brand img:hover { transform: scale(1.15); } body { background-color: var(--gd-bg-primary, #FCFEFF); } p a { color: black; text-underline-offset: 4px; } li a { color: black; text-underline-offset: 4px; } /* Author/funder icon links in the landing page margin sidebar */ .column-margin a:has(.bi), .column-margin a:has(.fa-brands), .column-margin a:has(.ror-sidebar-icon) { color: #495057; text-decoration: none; } .column-margin a:has(.bi):hover, .column-margin a:has(.fa-brands):hover, .column-margin a:has(.ror-sidebar-icon):hover { color: #212529; } /* ── Blended-homepage metadata sidebar ── In blended mode the first UG page becomes the site index page. Project metadata (links, license, community, …) is placed in a panel that mirrors the right-margin column of a normal homepage. We use a custom class (.gd-meta-sidebar) instead of Quarto’s .column-margin because .column-margin triggers slimcontent/page-full body & main classes that change the outer CSS-grid template, shifting the left sidebar and content area out of alignment with other user-guide pages. With a custom class, body/main keep the same classes as regular UG pages and the metadata panel is positioned via CSS absolute positioning. Because toc: false + no margin content causes Quarto to add "fullcontent" to , the outer grid template collapses the right-margin tracks and uses different left-side tracks than a plain floating page. We override the grid template back to the default floating layout so the sidebar and content align with subsequent UG pages. */ @media (min-width: 992px) { /* Fix outer grid: match the default floating (no-modifier) template so the left sidebar and content area align with regular UG pages. */ body.nav-sidebar.floating.fullcontent .page-columns { grid-template-columns: [screen-start] 1.5em [screen-start-inset] 5fr [page-start] minmax(25px, 50px) [page-start-inset] minmax(50px, 150px) [body-start-outset] minmax(25px, 50px) [body-start] 1.5em [body-content-start] minmax(500px, calc(800px - 3em)) [body-content-end] 1.5em [body-end] minmax(25px, 50px) [body-end-outset] minmax(50px, 150px) [page-end-inset] minmax(25px, 50px) [page-end] 5fr [screen-end-inset] 1.5em [screen-end] !important; } main.content:has(.gd-meta-sidebar) { position: relative; overflow: visible; } .gd-meta-sidebar { position: absolute; top: 0; left: 100%; margin-left: 1.5em; width: 200px; } .gd-meta-sidebar h3, .gd-meta-sidebar h4 { font-size: 0.9em; font-weight: 600; margin-top: 0.8em; margin-bottom: 0.25em; border-bottom: none; padding-bottom: 0; } .gd-meta-sidebar h3:first-child, .gd-meta-sidebar h4:first-child { margin-top: 0; } } @media (max-width: 991.98px) { .gd-meta-sidebar { border-top: 1px solid var(--bs-border-color, #dee2e6); padding-top: 1em; margin-top: 2em; } } dt { height: 32px; overflow-x: visible; margin-left: -4px; } dd { padding-left: 1.5rem; } /* Lists inside definition descriptions (e.g., Returns with bullet points) */ dd > p + ul, dd > p + ol { margin-top: -0.5em; /* pull list closer to the preceding paragraph */ } dd > ul > li::marker, dd > ol > li::marker { color: #9ca3af; /* lighter bullet / number color */ } /* API reference section headings (Parameters, Returns, Examples, etc.) */ h2.doc-section { font-size: 22px; border-bottom: none; padding-bottom: 0; } /* Ensure parameter descriptions are indented within doc sections */ .doc-section-parameters dd { padding-left: 1.5rem; margin-left: 0; } .doc-section-parameters dd p { margin-left: 0; } /* Warnings section: h2 header above, body in callout box */ .doc-section-warnings > h2 { color: Crimson; font-weight: 600; margin-bottom: 0.5rem; border-left: none; border-bottom: none; padding-left: 0; } .doc-section-warnings > h2::before { content: "⚠️ "; } .doc-section-warnings > p { margin: 0.5rem 0; padding: 0.75rem 1rem; background-color: #FEF2F2; border-left: 4px solid #DC2626; border-radius: 4px; font-size: 0.9rem; } .table td { padding-left: 0px; text-indent: 0.5rem; } code { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 0.875em; color: rgb(18, 18, 18); } .blockquote { font-size: 13px; background-color: #E8E8E8; border-left-color: #4682B4; } p,h1,h2,h3,#toc-title,#toc-function-reference,.nav-link,.table { font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; } .cell-output.cell-output-stdout { border-style: solid; border-width: 1px; border-color: #A1A1A165; border-radius: 4px; padding: 0.4em; background-color: #F7F1EB65; margin-bottom: 12px; } summary::marker { font-size: 1.5em; } .parameter-name { margin-right: -10px; } #toc-title { font-size: 16px; } #toc-title > ul { font-size: 14px; } /* Prevent Quarto from collapsing the TOC entry list */ #TOC > ul.collapse { display: block !important; visibility: visible !important; } #quarto-margin-sidebar { margin-left: 20px; padding-top: 30px; } #quarto-margin-sidebar nav ul li { padding-top: 3px; } #navbarCollapse > ul.navbar-nav.navbar-nav-scroll.me-auto > li > a:hover { background-color: rgb(240, 112, 0); color: white; border-radius: 5px; } #navbarCollapse > ul.navbar-nav.navbar-nav-scroll.me-auto > li > a { color: var(--gd-navbar-text); font-weight: bold; } a.sidebar-item-text.sidebar-link.text-start[data-bs-toggle="collapse"] { pointer-events: none; cursor: default; } div.sidebar-item-container { cursor: default !important; } a.sidebar-item-toggle.text-start > i { color: #FAFAFD; } #quarto-sidebar a.sidebar-item-text.sidebar-link.active { color: rgb(244, 121, 0); text-decoration: underline; text-decoration-thickness: 3px; text-decoration-color: rgba(101, 180, 237, 0.75); text-underline-offset: 3px; } #api-reference > h1 { margin: 0; } .navbar-title { font-family: Inter, Roboto, "Helvetica Neue", "Arial Nova", "Nimbus Sans", Arial, sans-serif; font-weight: bold; color: var(--gd-navbar-text); border-style: solid; border-width: 2px; border-radius: 8px; padding-left: 10px; padding-right: 10px; padding-top: 3px; padding-bottom: 4px; } /* Version badge in navbar title */ .version-badge { font-size: 0.65em; font-weight: 500; color: rgba(0, 0, 0, 0.55); background-color: rgba(0, 0, 0, 0.08); border-radius: 4px; padding: 1px 6px; margin-left: 6px; vertical-align: middle; letter-spacing: 0.02em; cursor: default; } #quarto-sidebar { background-color: #FAFAFD; } /* Sidebar API items: monospace font with smart line-breaking for long names. Line breaks are controlled by tags inserted by sidebar-wrap.js; overflow-wrap is intentionally NOT set so the browser only breaks at those designated points (not in the middle of words). */ #quarto-sidebar .sidebar-item-text { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 0.85em; display: block; max-width: 100%; white-space: normal; hyphens: none; } /* Keep section headers (categories) in their original sans-serif uppercase style */ a.sidebar-item-text.sidebar-link.text-start > span { text-transform: uppercase; font-weight: 600; color: dimgray; font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-size: 1em; hyphens: none; } .sidebar-menu-container { border-bottom-style: solid; border-bottom-width: 3px; border-bottom-color: #E7EAF6; } #quarto-sidebar .sidebar-item .menu-text { font-size: 12px; } .sidebar-item-section { padding-bottom: 8px; } #quarto-header > nav > div { margin-left: 5%; margin-right: 5%; } .navbar { background: var(--gd-navbar-bg); border-bottom: 1px solid rgba(0, 0, 0, 0.08); } .nav-link.active { text-decoration: underline; text-decoration-thickness: 2px; text-decoration-color: rgba(101, 180, 237, 0.75); text-underline-offset: 4px; } /* Light-mode navbar overrides (counteract Bootstrap data-bs-theme="dark") */ body.quarto-light .navbar .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0,0,0,0.65)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); } body.quarto-light .navbar .aa-DetachedSearchButton, body.quarto-light .navbar .aa-DetachedSearchButton svg, body.quarto-light .navbar .aa-SubmitButton, body.quarto-light .navbar .aa-SubmitButton svg { color: var(--gd-navbar-text) !important; fill: var(--gd-navbar-text); } body.quarto-light .navbar .quarto-navbar-tools button, body.quarto-light .navbar .quarto-navbar-tools .quarto-navigation-tool { color: var(--gd-navbar-text); } body.quarto-light .navbar .quarto-navbar-tools button:hover, body.quarto-light .navbar .quarto-navbar-tools .quarto-navigation-tool:hover { background-color: rgba(0, 0, 0, 0.06); } #navbarCollapse > ul.navbar-nav.navbar-nav-scroll.ms-auto > li { padding-right: 5px } .shrink-example .cell-output table { zoom: 60%; } .nav-footer-left { color: rgb(48, 48, 48); } .nav-footer-right { color: rgb(48, 48, 48); } /* Footer alignment - add left margin to match content area on large viewports */ @media (min-width: 992px) { .nav-footer { padding-left: calc((100vw - 900px) / 2); padding-right: calc((100vw - 900px) / 2); } .nav-footer-left { margin-left: 1rem; margin-top: 0.5rem; } } @media (min-width: 1200px) { .nav-footer { padding-left: calc((100vw - 1100px) / 2); padding-right: calc((100vw - 1100px) / 2); } } @media (min-width: 1400px) { .nav-footer { padding-left: calc((100vw - 1300px) / 2); padding-right: calc((100vw - 1300px) / 2); } } /* Footer author links styling */ .nav-footer-left a { color: inherit; text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; } .nav-footer-left a:hover { text-decoration-thickness: 2px; } /* Page navigation (prev/next) at bottom of pages - use code font for API names */ .nav-page-text { font-family: var(--bs-font-monospace); font-size: 0.875em; } /* Source link styling */ .source-link { font-size: 12px; font-weight: 600; color: steelblue !important; text-decoration: underline !important; text-underline-offset: 3px; text-decoration-thickness: 1.5px; letter-spacing: 0.5px; transition: color 0.2s ease; } .source-link:hover { color: #2a5f8a !important; text-decoration-thickness: 2px; } /* Usage/Source row container */ .usage-source-row { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: -14px; } /* Fix copy button positioning when usage-source-row is inside code-copy-outer-scaffold */ .code-copy-outer-scaffold > .usage-source-row { position: relative; z-index: 1; } .code-copy-outer-scaffold { position: relative; } .code-copy-outer-scaffold > .code-copy-button { position: absolute; top: auto; bottom: 0.5em; right: 0.5em; } /* Adjust mobile secondary nav positioning */ @media (max-width: 991.98px) { #quarto-header .container-fluid.d-flex { margin-left: 0; padding-left: 5px; } .quarto-secondary-nav-title { padding-top: 7px; } /* Move margin/sidebar content below main content on mobile (like pkgdown) */ #quarto-document-content { display: flex; flex-direction: column; } /* The column-margin content should appear after main content */ .column-margin { order: 2; margin-top: 2rem; padding: 0.75rem 1.5rem 1.5rem 1.5rem; background-color: #f8f9fa; border-radius: 8px; border: 1px solid #e9ecef; } /* Remove top margin from only the first heading */ .column-margin > div > section:first-child > h3 { margin-top: 0.5em; } /* Ensure all child elements inside column-margin have transparent background */ .column-margin, .column-margin > *, .column-margin section, .column-margin p, .column-margin code { background-color: #f8f9fa; } /* Main content comes first */ #quarto-document-content > *:not(.column-margin) { order: 1; } /* Style adjustments for the collapsed sidebar content */ .column-margin h4 { font-size: 0.9rem; color: #495057; border-bottom: 1px solid #dee2e6; padding-bottom: 0.5rem; margin-top: 1rem; } .column-margin h4:first-child { margin-top: 0; } /* Add horizontal padding to main content on mobile */ #quarto-content { padding-left: 12px; padding-right: 12px; } } /* ========================================================================== GitHub Widget Styles ========================================================================== */ #github-widget { position: relative; display: inline-flex; align-items: center; margin-left: 8px; } .gh-widget-trigger { display: flex; align-items: center; gap: 6px; padding: 6px 10px; background: rgba(0, 0, 0, 0.06); border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 6px; color: var(--gd-navbar-text); cursor: pointer; transition: all 0.2s ease; font-size: 13px; } .gh-widget-trigger:hover { background: rgba(0, 0, 0, 0.10); border-color: rgba(0, 0, 0, 0.25); } .gh-widget-open .gh-widget-trigger { background: rgba(0, 0, 0, 0.12); border-color: rgba(0, 0, 0, 0.25); } .gh-icon { flex-shrink: 0; } .gh-stats { display: flex; align-items: center; gap: 10px; margin-left: 4px; } .gh-stat { display: flex; align-items: center; gap: 3px; font-weight: 500; } .gh-stat svg { opacity: 0.85; } .gh-count { min-width: 16px; text-align: center; } .gh-dropdown-arrow { margin-left: 2px; opacity: 0.7; transition: transform 0.2s ease; } .gh-widget-open .gh-dropdown-arrow { transform: rotate(180deg); } .gh-dropdown { position: absolute; top: calc(100% + 6px); right: 0; min-width: 180px; background: #ffffff; border: 1px solid #d0d7de; border-radius: 8px; box-shadow: 0 8px 24px rgba(31, 35, 40, 0.12); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: all 0.2s ease; z-index: 1000; overflow: hidden; } .gh-widget-open .gh-dropdown { opacity: 1; visibility: visible; transform: translateY(0); } .gh-dropdown-item { display: flex; align-items: center; gap: 10px; padding: 10px 14px; color: #24292f !important; text-decoration: none !important; font-size: 14px; font-weight: 500; transition: background 0.15s ease; } .gh-dropdown-item:hover { background: #f6f8fa; text-decoration: none !important; } .gh-dropdown-item svg { color: #57606a; flex-shrink: 0; } .gh-dropdown-divider { height: 1px; margin: 4px 0; background: #d8dee4; } .gh-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; margin-left: auto; background: #ddf4ff; color: #0969da; border-radius: 10px; font-size: 12px; font-weight: 600; } /* Mobile responsive adjustments */ @media (max-width: 991.98px) { /* Align both widgets with consistent left positioning */ #github-widget { margin-left: 0; } #dark-mode-toggle-container { margin-right: 8px; } /* Stack widgets vertically with consistent width */ .nav-item:has(#dark-mode-toggle-container), .nav-item:has(#github-widget) { display: flex; width: 100%; padding: 4px 0; } /* Make dark mode toggle full width to match GitHub widget */ #dark-mode-toggle-container .dark-mode-toggle { margin-left: 10px; } /* Make GitHub widget full width */ .gh-widget-trigger { width: 100%; justify-content: flex-start; } } @media (max-width: 768px) { .gh-stats { display: none; } .gh-widget-trigger { padding: 6px 8px; } .gh-dropdown { right: auto; left: 0; min-width: 160px; } } /* Ensure navbar doesn't clip the dropdown */ #quarto-header, #quarto-header nav, #quarto-header .navbar, #quarto-header .container-fluid, #navbarCollapse, .navbar-nav, .navbar-nav.ms-auto, .navbar-nav.ms-auto > li, .navbar-nav.ms-auto > li > .nav-link { overflow: visible !important; } /* Print styles - hide widget */ @media print { #github-widget { display: none; } } /* ============================================ Reference Switcher Styles ============================================ */ .reference-switcher-container { padding: 0.5rem 0.65rem; border-bottom: 1px solid rgba(0, 0, 0, 0.06); background: transparent; } .reference-switcher { display: flex; gap: 0.25rem; background: #f0f0f0; border-radius: 6px; padding: 0.2rem; } .reference-switcher-btn { flex: 1; display: flex; align-items: center; justify-content: center; gap: 0.35rem; padding: 0.35rem 0.5rem; border: none; border-radius: 4px; background: transparent; color: #666; font-size: 0.8rem; font-weight: 500; cursor: pointer; transition: all 0.15s ease; } .reference-switcher-btn:hover { background: rgba(255, 255, 255, 0.5); color: #333; } .reference-switcher-btn.active { background: #fff; color: #333; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); } .reference-switcher-btn i { font-size: 0.9rem; } /* Dark mode support for switcher */ body.quarto-dark .reference-switcher { background: #2a2a2a; } body.quarto-dark .reference-switcher-btn { color: #999; } body.quarto-dark .reference-switcher-btn:hover { background: rgba(255, 255, 255, 0.1); color: #ccc; } body.quarto-dark .reference-switcher-btn.active { background: #3a3a3a; color: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); } /* ============================================ Sidebar Filter Styles ============================================ */ .sidebar-filter-container { padding: 0.35rem 0.65rem 0.65rem 0rem; border-bottom: 1px solid rgba(0, 0, 0, 0.05); background: transparent; position: sticky; top: 0; z-index: 10; } .sidebar-filter-wrapper { position: relative; display: flex; align-items: center; } .sidebar-filter-input { width: 100%; padding: 0.3rem 1.75rem 0.3rem 1.85rem; font-size: 0.8rem; border: 1px solid #e9e9e9; border-radius: 4px; background-color: #fff; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out; } .sidebar-filter-input:focus { outline: none; border-color: #86b7fe; box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, 0.12); background-color: #fff; } .sidebar-filter-input::placeholder { color: #999; opacity: 1; } .sidebar-filter-icon { position: absolute; left: 0.55rem; top: 50%; transform: translateY(-50%); color: #999; pointer-events: none; font-size: 0.75rem; display: flex; align-items: center; justify-content: center; } .sidebar-filter-clear { position: absolute; right: 0.35rem; top: 50%; transform: translateY(-50%); background: none; border: none; color: #999; cursor: pointer; padding: 0.15rem; line-height: 1; border-radius: 3px; transition: color 0.15s ease, background-color 0.15s ease; font-size: 0.7rem; } .sidebar-filter-clear:hover { color: #666; background-color: rgba(0, 0, 0, 0.04); } .sidebar-filter-count { font-size: 0.7rem; color: #888; text-align: center; margin-top: 0.25rem; padding: 0.1rem 0.4rem; background: transparent; border-radius: 3px; } .sidebar-filter-count .filter-count-num { font-weight: 600; color: #666; } /* Highlight matched items */ .sidebar-item.sidebar-filter-match .sidebar-link { background-color: rgba(255, 243, 205, 0.5); } /* Smooth transitions for showing/hiding items */ .sidebar-item { transition: opacity 0.15s ease; } /* Keyboard shortcut hint */ .sidebar-filter-input:not(:focus)::placeholder { /* Could show "/" hint here */ } /* Mobile adjustments */ @media (max-width: 991.98px) { .sidebar-filter-container { padding: 0.4rem 0.65rem; } .sidebar-filter-input { font-size: 0.85rem; padding: 0.35rem 1.75rem 0.35rem 1.85rem; } } /* Dark mode support - uses Quarto's dark mode class */ body.quarto-dark .sidebar-filter-container { background: transparent; border-bottom-color: rgba(255, 255, 255, 0.08); } body.quarto-dark .sidebar-filter-input { background-color: #2a2a2a; border-color: #3d3d3d; color: #e0e0e0; } body.quarto-dark .sidebar-filter-input:focus { border-color: #6ea8fe; box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, 0.25); background-color: #333; } body.quarto-dark .sidebar-filter-input::placeholder { color: #9e9e9e; } body.quarto-dark .sidebar-filter-icon, body.quarto-dark .sidebar-filter-clear { color: #9e9e9e; } body.quarto-dark .sidebar-filter-clear:hover { color: #e0e0e0; background-color: rgba(255, 255, 255, 0.1); } body.quarto-dark .sidebar-filter-count { color: #9e9e9e; } body.quarto-dark .sidebar-filter-count .filter-count-num { color: #e0e0e0; } body.quarto-dark .sidebar-item.sidebar-filter-match .sidebar-link { background-color: rgba(255, 193, 7, 0.2); } /* ===================================================== CLI Man-Page Styling Terminal-like appearance for CLI documentation ===================================================== */ /* Style CLI page titles like API reference pages */ /* Applied via post-render.py to CLI reference pages */ h1.title.cli-title { font-family: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; font-size: 1.25rem; font-weight: 600; } .cli-manpage { max-width: 90ch; margin: 0 auto; width: 100%; } /* Main man-page code block */ .cli-manpage pre { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 13px; line-height: 1.6; background: #012b15; color: #d4d4d4; border: none; border-radius: 6px; padding: 1.25rem 1.5rem; overflow-x: auto; white-space: pre; margin-bottom: 1rem; max-width: 100%; } .cli-manpage pre code { font-family: inherit; font-size: inherit; background: transparent; color: inherit; padding: 0; white-space: pre; } /* Light mode - keep the dark terminal look */ [data-bs-theme="light"] .cli-manpage pre { background: #1e1e1e; color: #d4d4d4; } /* On large screens, expand CLI content area into the unused right margin space */ /* The right sidebar ("On this page") is ~250px; we use half of that */ @media (min-width: 992px) and (max-width: 1199.98px) { /* Expand the main content area on pages with CLI help */ main.content:has(.cli-manpage) { width: calc(90ch + 30px); max-width: none; } .cli-manpage { width: calc(90ch + 30px); max-width: none; margin-top: 1.5rem; } } /* On extra large screens, we can use a bit more of that space */ @media (min-width: 1200px) { main.content:has(.cli-manpage) { width: calc(90ch + 50px); max-width: none; } .cli-manpage { width: calc(90ch + 50px); max-width: none; } } /* Responsive adjustments for CLI docs */ @media (min-width: 768px) and (max-width: 991.98px) { .cli-manpage { width: calc(100% + 150px); max-width: none; margin-top: 1.5rem; } .cli-manpage pre { font-size: 12px; padding: 1rem 1.25rem; border-radius: 4px; } h1.title.cli-title { font-size: 1.1rem; } } @media (max-width: 767.98px) { .cli-manpage { margin-top: 1.5rem; } .cli-manpage pre { font-size: 11px; padding: 0.875rem 1rem; line-height: 1.5; } h1.title.cli-title { font-size: 1rem; } } @media (max-width: 575.98px) { .cli-manpage { margin-top: 1.5rem; } .cli-manpage pre { font-size: 10px; padding: 0.75rem 0.875rem; border-radius: 3px; } h1.title.cli-title { font-size: 0.95rem; } } /* ========================================================================== Dark Mode Toggle Button Styles ========================================================================== */ /* Nav item containing the toggle - vertical alignment with GitHub widget */ .nav-item:has(#dark-mode-toggle-container) { display: flex; align-items: center; } #dark-mode-toggle-container { display: flex; align-items: center; justify-content: center; margin-right: 0; } .dark-mode-toggle { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; background: rgba(0, 0, 0, 0.06); border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 6px; color: var(--gd-navbar-text); cursor: pointer; transition: all 0.2s ease; } .dark-mode-toggle:hover { background: rgba(0, 0, 0, 0.10); border-color: rgba(0, 0, 0, 0.25); } .dark-mode-toggle:focus { outline: none; box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.15); } .dark-mode-toggle svg { display: block; } .theme-icon-light, .theme-icon-dark { display: flex; align-items: center; justify-content: center; } /* ========================================================================== Dark Mode - Core Styles ========================================================================== */ /* CSS Custom Properties for theming */ :root { --gd-bg-primary: #FCFEFF; --gd-bg-secondary: #FAFAFD; --gd-bg-tertiary: #F7F1EB; --gd-text-primary: rgb(18, 18, 18); --gd-text-secondary: #333; --gd-text-muted: #666; --gd-border-color: #e9e9e9; --gd-border-light: #E7EAF6; --gd-link-color: black; --gd-code-bg: #f8f9fa; --gd-code-color: rgb(18, 18, 18); --gd-blockquote-bg: #E8E8E8; --gd-sidebar-bg: #FAFAFD; --gd-navbar-bg: #e3f2fd; --gd-navbar-text: #2d2d2d; --gd-footer-text: rgb(48, 48, 48); --gd-highlight-color: rgba(255, 243, 205, 0.5); --gd-active-link: rgb(244, 121, 0); --gd-accent-blue: rgba(101, 180, 237, 0.75); /* Syntax highlighting - light mode */ --gd-syn-class: #0e84b5; --gd-syn-name: #4758AB; --gd-syn-none: #7D4E9E; --gd-syn-bool: #0077AA; --gd-syn-operator: #D14D00; --gd-syn-keyword: #008000; --gd-syn-string: #BA2121; --gd-syn-number: #666666; --gd-syn-comment: #408080; --gd-syn-function: #0000FF; --gd-syn-builtin: #008000; } /* Dark mode custom properties */ html.quarto-dark, body.quarto-dark { --gd-bg-primary: #1a1a1a; --gd-bg-secondary: #222222; --gd-bg-tertiary: #2a2a2a; --gd-text-primary: #e0e0e0; --gd-text-secondary: #c8c8c8; --gd-text-muted: #999; --gd-border-color: #3d3d3d; --gd-border-light: #333; --gd-link-color: #7cb8e8; --gd-code-bg: #2a2a2a; --gd-code-color: #e0e0e0; --gd-blockquote-bg: #2a2a2a; --gd-sidebar-bg: #1e1e1e; --gd-navbar-bg: #1a1a1a; --gd-navbar-text: #e0e0e0; --gd-footer-text: #b0b0b0; --gd-highlight-color: rgba(255, 193, 7, 0.2); --gd-active-link: #ff9f43; --gd-accent-blue: rgba(101, 180, 237, 0.6); /* Syntax highlighting - dark mode (optimized for contrast) */ --gd-syn-class: #56c8ff; --gd-syn-name: #8cb4ff; --gd-syn-none: #c792ea; --gd-syn-bool: #56c8ff; --gd-syn-operator: #ff9f43; --gd-syn-keyword: #c792ea; --gd-syn-string: #c3e88d; --gd-syn-number: #f78c6c; --gd-syn-comment: #697098; --gd-syn-function: #82aaff; --gd-syn-builtin: #ffcb6b; } /* ========================================================================== Dark Mode - Body & Background ========================================================================== */ body.quarto-dark { background-color: var(--gd-bg-primary); color: var(--gd-text-primary); } body.quarto-dark .quarto-body-content { background-color: var(--gd-bg-primary); } /* Main page structure elements */ body.quarto-dark #quarto-content { background-color: var(--gd-bg-primary); } body.quarto-dark #quarto-document-content { background-color: var(--gd-bg-primary); } body.quarto-dark main.content { background-color: var(--gd-bg-primary); } body.quarto-dark .page-columns { background-color: var(--gd-bg-primary); } body.quarto-dark .page-rows-contents { background-color: var(--gd-bg-primary); } body.quarto-dark .column-body { background-color: var(--gd-bg-primary); } body.quarto-dark .column-page { background-color: var(--gd-bg-primary); } body.quarto-dark article { background-color: var(--gd-bg-primary); } body.quarto-dark section { background-color: var(--gd-bg-primary); } /* Ensure the html element also has dark background */ html.quarto-dark { background-color: var(--gd-bg-primary); } /* ========================================================================== Dark Mode - Typography & Links ========================================================================== */ body.quarto-dark h1, body.quarto-dark h2, body.quarto-dark h3, body.quarto-dark h4, body.quarto-dark h5, body.quarto-dark h6 { color: var(--gd-text-primary); } body.quarto-dark p, body.quarto-dark li, body.quarto-dark dd, body.quarto-dark dt { color: var(--gd-text-primary); } body.quarto-dark p a, body.quarto-dark li a { color: var(--gd-link-color); } body.quarto-dark p a:hover, body.quarto-dark li a:hover { color: #9dcaf0; } /* Author/funder icon links in dark mode */ body.quarto-dark .column-margin a:has(.bi), body.quarto-dark .column-margin a:has(.fa-brands), body.quarto-dark .column-margin a:has(.ror-sidebar-icon) { color: #adb5bd; } body.quarto-dark .column-margin a:has(.bi):hover, body.quarto-dark .column-margin a:has(.fa-brands):hover, body.quarto-dark .column-margin a:has(.ror-sidebar-icon):hover { color: #dee2e6; } body.quarto-dark .table a { color: var(--gd-link-color); } /* ========================================================================== Dark Mode - Code & Syntax Highlighting ========================================================================== */ body.quarto-dark code { color: var(--gd-code-color); background-color: var(--gd-code-bg); } body.quarto-dark pre { background-color: var(--gd-bg-tertiary); border-color: var(--gd-border-color); } body.quarto-dark pre code { background-color: transparent; color: var(--gd-text-primary); } /* Override Quarto's default code token colors for dark mode */ body.quarto-dark .sourceCode span, body.quarto-dark pre.sourceCode code span { color: var(--gd-text-primary); } /* Shell/bash specific - ensure all text is readable */ body.quarto-dark pre.bash code, body.quarto-dark pre.sh code, body.quarto-dark pre.shell code, body.quarto-dark .sourceCode.bash code, body.quarto-dark .sourceCode.sh code, body.quarto-dark div.sourceCode[data-language="bash"] code, body.quarto-dark div.sourceCode[data-language="sh"] code { color: var(--gd-text-primary); } body.quarto-dark .sourceCode.bash span, body.quarto-dark .sourceCode.sh span, body.quarto-dark div.sourceCode[data-language="bash"] span, body.quarto-dark div.sourceCode[data-language="sh"] span { color: var(--gd-text-primary) !important; } /* Ensure inline code in dark mode has proper contrast */ body.quarto-dark :not(pre) > code { color: #f0a0a0; background-color: var(--gd-code-bg); } /* Signature highlighting - dark mode */ body.quarto-dark code span.sig-class { color: var(--gd-syn-class); } body.quarto-dark code span.sig-name { color: var(--gd-syn-name); } body.quarto-dark code span.cn-none { color: var(--gd-syn-none); } body.quarto-dark code span.cn-bool { color: var(--gd-syn-bool); } body.quarto-dark #cb1 code span.op { color: var(--gd-syn-operator); } /* Spacer between overloaded function signatures - dark mode inherits from light */ body.quarto-dark #cb1 code span.overload-spacer { display: block; height: 0.35em; user-select: none; } /* Pandoc/Quarto syntax highlighting tokens - dark mode */ body.quarto-dark .sourceCode span.kw, /* Keywords */ body.quarto-dark .highlight span.k { color: var(--gd-syn-keyword); } body.quarto-dark .sourceCode span.cf { /* Control flow */ color: var(--gd-syn-keyword); } body.quarto-dark .sourceCode span.op { /* Operators */ color: var(--gd-syn-operator); } body.quarto-dark .sourceCode span.st, /* Strings */ body.quarto-dark .highlight span.s, body.quarto-dark .highlight span.s1, body.quarto-dark .highlight span.s2 { color: var(--gd-syn-string); } body.quarto-dark .sourceCode span.dv, /* Decimal values */ body.quarto-dark .sourceCode span.fl, /* Floats */ body.quarto-dark .sourceCode span.bn, /* Base-N integers */ body.quarto-dark .highlight span.mi, body.quarto-dark .highlight span.mf { color: var(--gd-syn-number); } body.quarto-dark .sourceCode span.co, /* Comments */ body.quarto-dark .highlight span.c, body.quarto-dark .highlight span.c1, body.quarto-dark .highlight span.cm { color: var(--gd-syn-comment); font-style: italic; } body.quarto-dark .sourceCode span.fu, /* Functions */ body.quarto-dark .highlight span.nf { color: var(--gd-syn-function); } body.quarto-dark .sourceCode span.bu, /* Built-ins */ body.quarto-dark .highlight span.nb { color: var(--gd-syn-builtin); } body.quarto-dark .sourceCode span.va, /* Variables */ body.quarto-dark .sourceCode span.at, /* Attributes */ body.quarto-dark .highlight span.n { color: var(--gd-text-primary); } body.quarto-dark .sourceCode span.sc { /* Special characters */ color: var(--gd-syn-string); } body.quarto-dark .sourceCode span.ss { /* Special strings */ color: var(--gd-syn-string); } body.quarto-dark .sourceCode span.im { /* Import */ color: var(--gd-syn-keyword); } body.quarto-dark .sourceCode span.cn { /* Constants (None, True, False) */ color: var(--gd-syn-none); } body.quarto-dark .sourceCode span.dt { /* Data types */ color: var(--gd-syn-class); } body.quarto-dark .sourceCode span.an { /* Annotation */ color: var(--gd-syn-comment); } body.quarto-dark .sourceCode span.pp { /* Preprocessor */ color: var(--gd-syn-keyword); } body.quarto-dark .sourceCode span.ex { /* Extension */ color: var(--gd-syn-function); } body.quarto-dark .sourceCode span.do { /* Documentation */ color: var(--gd-syn-comment); font-style: italic; } body.quarto-dark .sourceCode span.al { /* Alert */ color: #ff5555; font-weight: bold; } body.quarto-dark .sourceCode span.er { /* Error */ color: #ff5555; } body.quarto-dark .sourceCode span.wa { /* Warning */ color: #ffb86c; } body.quarto-dark .sourceCode span.in { /* Information */ color: var(--gd-syn-comment); } /* ========================================================================== Dark Mode - Parameter Documentation ========================================================================== */ /* Parameter definitions in dt elements */ body.quarto-dark dt code { color: var(--gd-text-primary); background-color: var(--gd-code-bg); } body.quarto-dark .parameter-name { color: #82aaff; } body.quarto-dark .parameter-name strong { color: #82aaff; } body.quarto-dark .parameter-annotation { color: #c792ea; } body.quarto-dark .parameter-annotation-sep { color: var(--gd-text-muted); } body.quarto-dark .parameter-default { color: #c3e88d; } body.quarto-dark .parameter-default-sep { color: var(--gd-text-muted); } /* Doc section styling */ body.quarto-dark .doc-section dt { color: var(--gd-text-primary); } body.quarto-dark .doc-section dd { color: var(--gd-text-primary); } body.quarto-dark .doc-section-parameters dt code { color: var(--gd-text-primary); } /* Warnings section dark mode */ body.quarto-dark .doc-section-warnings > h2 { color: #FCA5A5; } body.quarto-dark .doc-section-warnings > p { background-color: rgba(220, 38, 38, 0.1); border-left-color: #EF4444; color: var(--gd-text-primary); } /* ========================================================================== Dark Mode - Cell Output ========================================================================== */ body.quarto-dark .cell-output.cell-output-stdout { background-color: var(--gd-bg-tertiary); border-color: var(--gd-border-color); color: var(--gd-text-primary); } body.quarto-dark .cell-output.cell-output-stderr { background-color: rgba(255, 85, 85, 0.1); border-color: rgba(255, 85, 85, 0.3); } /* ========================================================================== Dark Mode - Blockquotes ========================================================================== */ body.quarto-dark .blockquote, body.quarto-dark blockquote { background-color: var(--gd-blockquote-bg); border-left-color: var(--gd-accent-blue); color: var(--gd-text-secondary); } /* ========================================================================== Dark Mode - Sidebar ========================================================================== */ body.quarto-dark #quarto-sidebar { background-color: var(--gd-sidebar-bg); border-right-color: var(--gd-border-color); } body.quarto-dark .sidebar-menu-container { border-bottom-color: var(--gd-border-color); } body.quarto-dark #quarto-sidebar .sidebar-item-text { color: var(--gd-text-secondary); } body.quarto-dark #quarto-sidebar .sidebar-item-text:hover { color: var(--gd-text-primary); } body.quarto-dark #quarto-sidebar a.sidebar-item-text.sidebar-link.active { color: var(--gd-active-link); } body.quarto-dark a.sidebar-item-text.sidebar-link.text-start > span { color: #9e9e9e; } body.quarto-dark a.sidebar-item-toggle.text-start > i { color: #9e9e9e; } body.quarto-dark .sidebar-tools-collapse { color: var(--gd-text-muted); } /* ========================================================================== Dark Mode - Navbar ========================================================================== */ body.quarto-dark .navbar { background: var(--gd-navbar-bg) !important; border-bottom: 1px solid var(--gd-border-color); } body.quarto-dark .navbar-brand img { /* no border overrides needed */ } body.quarto-dark .navbar-title { color: var(--gd-navbar-text); } body.quarto-dark .version-badge { color: rgba(224, 224, 224, 0.75); background-color: rgba(255, 255, 255, 0.1); } body.quarto-dark #navbarCollapse > ul.navbar-nav.navbar-nav-scroll.me-auto > li > a { color: #e0e0e0; } body.quarto-dark #navbarCollapse > ul.navbar-nav.navbar-nav-scroll.me-auto > li > a:hover { background-color: rgb(240, 112, 0); color: white; } /* Dark mode toggle in dark mode */ body.quarto-dark .dark-mode-toggle { background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.15); color: #e0e0e0; } body.quarto-dark .dark-mode-toggle:hover { background: rgba(255, 255, 255, 0.12); border-color: rgba(255, 255, 255, 0.25); } /* ========================================================================== Dark Mode - Right Sidebar (TOC) ========================================================================== */ body.quarto-dark #quarto-margin-sidebar { color: var(--gd-text-secondary); } body.quarto-dark #quarto-margin-sidebar nav a { color: var(--gd-text-muted); } body.quarto-dark #quarto-margin-sidebar nav a:hover { color: var(--gd-text-primary); } body.quarto-dark #quarto-margin-sidebar nav a.active { color: var(--gd-active-link); } body.quarto-dark #toc-title { color: var(--gd-text-primary); } /* ========================================================================== Dark Mode - Footer ========================================================================== */ body.quarto-dark .nav-footer { background-color: var(--gd-bg-secondary); border-top: 1px solid var(--gd-border-color); } body.quarto-dark .nav-footer-left, body.quarto-dark .nav-footer-right, body.quarto-dark .nav-footer-center { color: var(--gd-footer-text); } body.quarto-dark .nav-footer a { color: var(--gd-link-color); } /* ========================================================================== Dark Mode - Tables ========================================================================== */ body.quarto-dark .table { color: var(--gd-text-primary); border-color: var(--gd-border-color); } body.quarto-dark .table th { background-color: var(--gd-bg-secondary); border-color: var(--gd-border-color); } body.quarto-dark .table td { border-color: var(--gd-border-color); } body.quarto-dark .table-striped > tbody > tr:nth-of-type(odd) > * { background-color: var(--gd-bg-tertiary); } body.quarto-dark .table-hover > tbody > tr:hover > * { background-color: rgba(255, 255, 255, 0.05); } /* ========================================================================== Dark Mode - Cards & Panels ========================================================================== */ body.quarto-dark .card { background-color: var(--gd-bg-secondary); border-color: var(--gd-border-color); } body.quarto-dark .card-header { background-color: var(--gd-bg-tertiary); border-color: var(--gd-border-color); } body.quarto-dark .callout { background-color: var(--gd-bg-secondary); border-color: var(--gd-border-color); } body.quarto-dark .callout-note { border-left-color: #6ea8fe; } body.quarto-dark .callout-warning { border-left-color: #ffb86c; } body.quarto-dark .callout-important { border-left-color: #ff5555; } body.quarto-dark .callout-tip { border-left-color: #50fa7b; } /* ========================================================================== Dark Mode - Forms & Inputs ========================================================================== */ body.quarto-dark input, body.quarto-dark textarea, body.quarto-dark select { background-color: var(--gd-bg-tertiary); border-color: var(--gd-border-color); color: var(--gd-text-primary); } body.quarto-dark input:focus, body.quarto-dark textarea:focus, body.quarto-dark select:focus { border-color: #6ea8fe; box-shadow: 0 0 0 0.15rem rgba(110, 168, 254, 0.25); } body.quarto-dark input::placeholder { color: var(--gd-text-muted); } /* ========================================================================== Dark Mode - Search ========================================================================== */ body.quarto-dark #quarto-search { background-color: transparent; } body.quarto-dark #quarto-search input { background-color: var(--gd-bg-tertiary); border-color: var(--gd-border-color); color: var(--gd-text-primary); } body.quarto-dark #quarto-search .aa-SubmitButton, body.quarto-dark #quarto-search .aa-DetachedSearchButton { background-color: transparent; color: var(--gd-text-muted); } body.quarto-dark .navbar .quarto-navbar-tools button, body.quarto-dark .navbar .quarto-navbar-tools .quarto-navigation-tool { background-color: transparent; color: #e0e0e0; } body.quarto-dark .navbar .quarto-navbar-tools button:hover, body.quarto-dark .navbar .quarto-navbar-tools .quarto-navigation-tool:hover { background-color: rgba(255, 255, 255, 0.1); } body.quarto-dark .aa-Panel { background-color: var(--gd-bg-secondary); border-color: var(--gd-border-color); } body.quarto-dark .aa-Item { color: var(--gd-text-primary); } body.quarto-dark .aa-Item:hover, body.quarto-dark .aa-Item[aria-selected="true"] { background-color: var(--gd-bg-tertiary); } /* Search results styling - keep light background but ensure dark text */ body.quarto-dark .search-result-title, body.quarto-dark p.search-result-title, body.quarto-dark .aa-Panel .search-result-title, body.quarto-dark #quarto-search-results .search-result-title, html.quarto-dark .search-result-title, html.quarto-dark p.search-result-title { color: #1a1a1a !important; } body.quarto-dark .search-result-header, body.quarto-dark div.search-result-header, body.quarto-dark .aa-Panel .search-result-header, body.quarto-dark #quarto-search-results .search-result-header, html.quarto-dark .search-result-header, html.quarto-dark div.search-result-header { color: #333 !important; } body.quarto-dark .search-result-text { color: var(--gd-text-secondary); } body.quarto-dark .search-result-doc-title { color: var(--gd-text-primary); } body.quarto-dark .search-result-section { color: var(--gd-text-muted); } body.quarto-dark .aa-SourceHeader { color: var(--gd-text-muted); border-bottom-color: var(--gd-border-color); } body.quarto-dark .aa-SourceNoResults { color: var(--gd-text-muted); } body.quarto-dark .quarto-search-results { background-color: var(--gd-bg-secondary); } body.quarto-dark .search-result-link { color: var(--gd-link-color); } body.quarto-dark .search-result-link:hover { color: #9dcaf0; } /* Algolia/Autocomplete specific dark mode */ body.quarto-dark .aa-Autocomplete { background-color: transparent; } body.quarto-dark .aa-Form { background-color: var(--gd-bg-tertiary); border-color: var(--gd-border-color); } body.quarto-dark .aa-Input { color: var(--gd-text-primary); } body.quarto-dark .aa-InputWrapperPrefix, body.quarto-dark .aa-InputWrapperSuffix { color: var(--gd-text-muted); } body.quarto-dark .aa-ClearButton { color: var(--gd-text-muted); } body.quarto-dark .aa-ClearButton:hover { color: var(--gd-text-primary); } /* ========================================================================== Dark Mode - GitHub Widget ========================================================================== */ body.quarto-dark .gh-widget-trigger { background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.15); color: #e0e0e0; } body.quarto-dark .gh-widget-trigger:hover { background: rgba(255, 255, 255, 0.12); border-color: rgba(255, 255, 255, 0.25); } body.quarto-dark .gh-dropdown { background: var(--gd-bg-secondary); border-color: var(--gd-border-color); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4); } body.quarto-dark .gh-dropdown-item { color: var(--gd-text-primary) !important; } body.quarto-dark .gh-dropdown-item:hover { background: var(--gd-bg-tertiary); } body.quarto-dark .gh-dropdown-item svg { color: var(--gd-text-muted); } body.quarto-dark .gh-dropdown-divider { background: var(--gd-border-color); } body.quarto-dark .gh-badge { background: rgba(110, 168, 254, 0.2); color: #6ea8fe; } /* ========================================================================== Dark Mode - Source Link ========================================================================== */ body.quarto-dark .source-link { color: #7cb8e8 !important; } body.quarto-dark .source-link:hover { color: #9dcaf0 !important; } /* ========================================================================== Dark Mode - Mobile Responsive ========================================================================== */ @media (max-width: 991.98px) { body.quarto-dark .column-margin { background-color: var(--gd-bg-secondary); border-color: var(--gd-border-color); } /* Ensure all child elements inside column-margin have matching background in dark mode */ body.quarto-dark .column-margin, body.quarto-dark .column-margin > *, body.quarto-dark .column-margin section, body.quarto-dark .column-margin p, body.quarto-dark .column-margin code { background-color: var(--gd-bg-secondary); } body.quarto-dark .column-margin h4 { color: var(--gd-text-secondary); border-bottom-color: var(--gd-border-color); } body.quarto-dark .quarto-secondary-nav { background-color: var(--gd-bg-secondary); border-bottom-color: var(--gd-border-color); } } /* ========================================================================== Dark Mode - Copy Button ========================================================================== */ body.quarto-dark .code-copy-button { background-color: var(--gd-bg-tertiary); border-color: var(--gd-border-color); color: var(--gd-text-muted); } body.quarto-dark .code-copy-button:hover { background-color: rgba(255, 255, 255, 0.1); color: var(--gd-text-primary); } /* ========================================================================== Dark Mode - Code Filename/Caption Bar ========================================================================== */ body.quarto-dark .code-with-filename .code-with-filename-file { background-color: var(--gd-bg-tertiary); border-color: var(--gd-border-color); } body.quarto-dark .code-with-filename .code-with-filename-file pre { background-color: var(--gd-bg-tertiary); color: var(--gd-text-primary); } body.quarto-dark .code-with-filename .code-with-filename-file pre strong { color: var(--gd-text-primary); } body.quarto-dark .code-with-filename-file { background-color: var(--gd-bg-tertiary); } body.quarto-dark .code-with-filename-file pre { background-color: transparent; color: var(--gd-text-primary); margin: 0; } /* ========================================================================== Dark Mode - Scrollbars (WebKit browsers) ========================================================================== */ body.quarto-dark ::-webkit-scrollbar { width: 10px; height: 10px; } body.quarto-dark ::-webkit-scrollbar-track { background: var(--gd-bg-secondary); } body.quarto-dark ::-webkit-scrollbar-thumb { background: var(--gd-border-color); border-radius: 5px; } body.quarto-dark ::-webkit-scrollbar-thumb:hover { background: #555; } /* ========================================================================== Dark Mode - Transitions ========================================================================== */ /* Smooth transitions for theme switching */ body, .navbar, #quarto-sidebar, .nav-footer, .card, pre, code, .table, input, textarea, .gh-dropdown, .dark-mode-toggle { transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; } /* ========================================================================== Section Cards (Custom Sections index pages) ========================================================================== */ .section-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; margin-top: 0.5rem; } .section-card { display: block; padding: 1.25rem 1.5rem; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 0.5rem; color: inherit; text-decoration: none; transition: box-shadow 0.2s ease-out, border-color 0.2s ease-out, transform 0.2s ease-out; } .section-card:hover { border-color: var(--bs-primary, #0d6efd); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); transform: translateY(-2px); color: inherit; text-decoration: none; } .section-card-img { width: 100%; border-radius: 0.375rem; margin-bottom: 0.75rem; } .section-card-title { font-size: 1.1rem; font-weight: 600; margin-bottom: 0.35rem; color: var(--bs-primary, #0d6efd); } .section-card-desc { font-size: 0.9rem; color: var(--bs-secondary-color, #6c757d); line-height: 1.45; } /* Dark mode adjustments */ body.quarto-dark .section-card { border-color: var(--bs-border-color, #495057); } body.quarto-dark .section-card:hover { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); } body.quarto-dark .section-card-title { color: #599CFF !important; } body.quarto-dark .section-card-desc { color: #9ca3af !important; } body.quarto-dark .section-card:hover { border-color: #599CFF; } /* Disable transitions on initial page load to prevent flash */ html:not(.theme-loaded) *, html:not(.theme-loaded) *::before, html:not(.theme-loaded) *::after { transition: none !important; } /* Home page layout: widen main content since there's no left sidebar */ /* On home page, expand content to use the space normally reserved for left sidebar */ @media (min-width: 992px) { body[data-page="index"] #quarto-document-content > section:not(.column-margin) { grid-column: page-start-inset / body-content-end !important; } /* Keep the column-margin where it should be */ body[data-page="index"] .column-margin { grid-column: body-end / page-end !important; } }