:root {
    --bs-font-sans-serif: "Segoe UI", Tahoma, Helvetica, sans-serif;
    --bs-link-color: #7e4ed1;
    --bs-link-color-rgb: 126, 78, 209;
    --bs-link-hover-color: #6a3eb8;
    --bs-link-hover-color-rgb: 106, 62, 184;
    --bs-primary: #7e4ed1;
    --bs-primary-rgb: 126, 78, 209;
}

[data-bs-theme="dark"] {
    --bs-link-color: #b18cf0;
    --bs-link-color-rgb: 177, 140, 240;
    --bs-link-hover-color: #c8aef5;
    --bs-link-hover-color-rgb: 200, 174, 245;
}

/* Reserve scrollbar space so layout doesn't shift between
   pages with vs. without a vertical scrollbar. */
html {
    scrollbar-gutter: stable;
}

/* Site-wide max width — matches navbar, main, footer. */
.container-xxl {
    max-width: 1300px;
}

/* ===== Navbar ===== */
header > nav.navbar {
    background-color: #00263C;
    --bs-navbar-color: #ffffff;
    --bs-navbar-hover-color: #f569d5;
    --bs-navbar-active-color: #ffffff;
    --bs-navbar-disabled-color: rgba(255, 255, 255, 0.5);
    --bs-navbar-brand-color: #ffffff;
    --bs-navbar-brand-hover-color: #ffffff;
    --bs-nav-link-font-size: 14px;
    --bs-navbar-nav-link-padding-x: 1.5em;
}

header > nav.navbar .nav-link {
    border-radius: 999px;
}

header > nav.navbar .nav-link.active {
    background-color: #7e4ed1;
}

/* Hide the "Orbital Cam" text node next to the logo image. */
header > nav.navbar .navbar-brand {
    font-size: 0;
}

/* Hide the first navbar item ("Home"). It's kept in toc.yml with hidden:true
   for the PDF outline, but DocFx's navbar JS doesn't honour that flag. */
header > nav.navbar .navbar-nav > .nav-item:first-child {
    display: none;
}

header > nav.navbar .navbar-toggler {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
}

/* Theme toggle position. main.js moves form.icons out of #navbar (which sits
   inside the burger collapse, hidden on mobile) into .container-xxl directly.
   order:99 keeps it at the far-right on desktop; the mobile media query below
   re-positions it next to the burger button. */
header > nav.navbar > .container-xxl > form.icons {
    order: 99;
}

body .affix ul li {
    margin: .4rem 2px;
}

/* ===== Mobile navbar (below md) =====
   DocFx Modern uses a custom <button> (not Bootstrap's .navbar-toggler) and
   the in-flow collapse pushes page content down when opened. The fixes below
   replace the icon with a white hamburger SVG, overlay the open menu instead
   of pushing content, and add padding so items aren't flush to the edges. */
@media (max-width: 767.98px) {
    /* Burger icon: white. Bootstrap's .btn defaults to dark text colour,
       which is invisible on the navy navbar. */
    header > nav.navbar button[data-bs-target="#navpanel"] {
        color: #ffffff;
    }

    /* Replace DocFx's three-dots icon with a hamburger SVG. */
    header > nav.navbar button[data-bs-target="#navpanel"] .bi-three-dots {
        display: none;
    }

    header > nav.navbar button[data-bs-target="#navpanel"]::after {
        content: "";
        display: inline-block;
        width: 1.6em;
        height: 1.6em;
        vertical-align: middle;
        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h22M4 15h22M4 22h22'/></svg>");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }

    /* Open menu floats over content instead of pushing it down — the burger
       button stays put because the collapse no longer affects navbar height. */
    header > nav.navbar > .container-xxl > .navbar-collapse {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: #00263C;
        z-index: 1030;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    }

    header > nav.navbar > .container-xxl > .navbar-collapse #navbar {
        padding: 1rem;
    }

    header > nav.navbar .navbar-collapse .nav-link {
        padding: 0.5rem 1rem;
    }

    /* Theme toggle (moved by main.js) sits next to the burger button. */
    header > nav.navbar > .container-xxl > form.icons {
        order: unset;
        margin-left: auto;
        margin-right: 0.5rem;
    }
}

/* Theme-toggle button (and any other navbar icon button) — Bootstrap's
   default .btn colour is dark, which is invisible on our navy navbar. */
header > nav.navbar form.icons .btn {
    color: #ffffff;
}

header > nav.navbar form.icons .btn:hover,
header > nav.navbar form.icons .btn:focus {
    color: #f569d5;
}

/* ===== Download PDF link =====
   Hide DocFx's default placement (inside the toc-offcanvas drawer) so the
   button doesn't appear there or anywhere else. main.js re-injects the
   link inside .affix so it lives in a single, consistent spot on every
   page (next to the in-this-article nav). */
.pdf-link {
    display: none;
}

.affix .pdf-link {
    display: inline-block;
    margin-top: 1rem;
    padding: 0.4rem 0.9rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 999px;
    color: var(--bs-link-color);
    text-decoration: none;
    font-size: 14px;
}

.affix .pdf-link:hover,
.affix .pdf-link:focus {
    border-color: var(--bs-link-color);
    color: var(--bs-link-hover-color);
    text-decoration: none;
}

/* ===== Dropdown menu in navbar =====
   DocFx renders the section dropdown's items as <a class="nav-link">,
   not <a class="dropdown-item">, so the Bootstrap 5 dropdown variables
   don't apply automatically — we have to wire them in by hand. We use
   the same --bs-dropdown-* variables Bootstrap uses for .dropdown-item
   so light/dark theming is automatic. We do NOT override the
   .dropdown-menu's own bg/border — Bootstrap already themes those. */
header > nav.navbar .dropdown-menu .nav-link {
    color: var(--bs-dropdown-link-color);
}

header > nav.navbar .dropdown-menu .nav-link:hover,
header > nav.navbar .dropdown-menu .nav-link:focus {
    color: var(--bs-dropdown-link-hover-color);
    background-color: var(--bs-dropdown-link-hover-bg);
}

header > nav.navbar .dropdown-menu .nav-link.active {
    color: var(--bs-dropdown-link-active-color);
    background-color: var(--bs-dropdown-link-active-bg);
    border-radius: 0;
}

/* ===== Footer ===== */
footer {
    text-align: center;
}

/* ===== Headings ===== */
article h1,
article h2,
article h3,
article h4,
article h5,
article h6 {
    font-weight: 400;
    margin-bottom:0.5em;
}

/* ===== Inline code =====
   Bootstrap defaults to pink text on no background. Match the legacy
   site's gray-pill style for both screen and print. */
article :not(pre) > code {
    background: #f1f2f3;
    color: #717374;
    padding: 0.15em 0.4em;
    border-radius: 0.35em;
    font-size: 0.92em;
}

[data-bs-theme="dark"] article :not(pre) > code {
    background: #2a2f36;
    color: #e6edf3;
}

/* ===== Article width ===== */
main.container-xxl > .content > article {
    max-width: 60rem;
}

/* Front page has no .toc-offcanvas, so .content sits at the left edge
   of <main>. Inject a phantom flex item that mirrors the real offcanvas
   (flex: .35; max-width: 360px) so .content — including its breadcrumb
   and article — gets pushed right by exactly the sidebar's rendered width.
   Only above md, since below md the offcanvas collapses to a drawer and
   the home page should run full width like the other pages do. */
@media (min-width: 768px) {
    main.container-xxl:has(> .content:first-child)::before {
        content: "";
        flex: .35;
        max-width: 360px;
    }
}


dl.jumplist {
    margin-bottom: 2rem;
}

/* ===== Print / PDF =====
   Playwright (used by `docfx pdf`) honours @page and @media print. */
@page {
    size: A4;
    margin: 2.2cm 2.6cm;
    /* Suppress DocFx's auto-generated page numbers in the corners. */
    @top-left { content: ""; }
    @top-center { content: ""; }
    @top-right { content: ""; }
    @bottom-left { content: ""; }
    @bottom-center { content: ""; }
    @bottom-right { content: ""; }
}

@media print {
    /* Values ported verbatim from the legacy site's CSS
       (Docs_legacy_2026-05/_site_legacy/styles/) so the PDF looks like
       the original Acrobat-captured manual. Bootstrap 3 defaults +
       docfx.css article overrides. */
    body {
        font-family: 'Segoe UI', Tahoma, Helvetica, sans-serif;
        font-size: 14px;
        line-height: 1.42857143;
        color: #333;
        background: #fff;
        font-weight: 300;
        /* Force Chromium to honour authored colours instead of its
           "economy" mode which halves saturated channels in print. */
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* Hide site chrome that does not belong in a printed manual. */
    header,
    .toc-offcanvas,
    .actionbar,
    .pdf-link,
    .affix,
    #affix,
    .next-article,
    .prev-article,
    footer {
        display: none !important;
    }

    /* Suppress DocFx's external-link box-arrow icon (e.g. next to URLs
       to Unity / MS docs). Useful in HTML, visual noise on paper. */
    article a.external[href]::after {
        content: none !important;
    }

    /* Pull content full-width on the page. */
    main.container-xxl,
    main.container-xxl > .content,
    main.container-xxl > .content > article {
        max-width: none;
        margin: 0;
        padding: 0;
    }

    /* Headings — legacy article-override sizes & spacing, with weights
       reduced ~100-200 from the legacy values to feel lighter on paper. */
    article h1,
    article h2,
    article h3,
    article h4 {
        margin-top: 25px;
        margin-bottom: 10px;
        font-weight: 300;
        page-break-after: avoid;
    }
    article h1 { font-size: 36px; page-break-before: always; }
    article h1:first-of-type { page-break-before: avoid; }
    article h2 { font-size: 30px; }
    article h3 { font-size: 24px; }
    /* h4: legacy was bold (700); semibold (500) reads cleaner. */
    article h4 { font-size: 18px; font-weight: 500; margin-top: 2em; }
    article h5 { font-size: 14px; font-weight: 500; }
    article h6 { font-size: 12px; font-weight: 500; }

    article p { margin: 0 0 10px; }

    /* Inline code — legacy gray-on-light-gray. */
    article :not(pre) > code {
        color: #717374;
        background-color: #f1f2f3;
        padding: 2px 4px;
        font-size: 90%;
        border-radius: 4px;
    }

    /* Blockquote — legacy values. */
    article blockquote {
        padding: 10px 20px;
        margin: 0 0 20px;
        font-size: 17.5px;
        border-left: 5px solid #eeeeee;
    }

    /* Links — legacy blue, no underline. */
    article a {
        color: #337ab7;
        text-decoration: none;
    }

    article img,
    article figure,
    article pre,
    article table {
        page-break-inside: avoid;
        max-width: 100%;
    }
}
