/* Custom styling for LinFIR documentation */

:root {
    --linfir-red-dark: #b93737;
    /* RGB 185, 65, 65 - LinFIR dark mode */
    --linfir-red-light: #dc4646;
    /* RGB 220, 70, 70 - LinFIR light mode */
}

/* ============================================================
   SCREEN-ONLY STYLES — wrapped in @media screen so they don't
   leak into print.  This is the KEY fix: the `print` media
   context must keep default (light) colours.
   ============================================================ */

@media screen {
    /* Menu bar styling - light gray background (light themes only) */
    .auto #mdbook-menu-bar,
    .light #mdbook-menu-bar,
    .auto #mdbook-menu-bar {
        background-color: rgb(255, 255, 255) !important;
    }

    /* Media queries for OS colour-scheme preference (screen only) */
    @media (prefers-color-scheme: dark) {
        h1,
        h2,
        h3,
        h4,
        h5,
        h6 {
            color: var(--linfir-red-dark) !important;
        }

        a {
            color: var(--linfir-red-dark) !important;
        }

        a:hover {
            color: #cc3a3f !important;
        }

        blockquote {
            border-left: 4px solid var(--linfir-red-dark);
            padding-left: 1em;
            margin-left: 0;
            font-style: italic;
            background-color: rgba(170, 35, 40, 0.1);
        }
    }

    /* Media queries for OS colour-scheme preference (screen only) */
    @media (prefers-color-scheme: light) {
        h1,
        h2,
        h3,
        h4,
        h5,
        h6 {
            color: var(--linfir-red-light) !important;
        }

        a {
            color: var(--linfir-red-light) !important;
        }

        a:hover {
            color: var(--linfir-red-dark) !important;
        }

        blockquote {
            border-left: 4px solid var(--linfir-red-light);
            padding-left: 1em;
            margin-left: 0;
            font-style: italic;
            background-color: rgba(220, 70, 70, 0.05);
        }
    }

    @media (prefers-color-scheme: auto) {
        h1,
        h2,
        h3,
        h4,
        h5,
        h6 {
            color: var(--linfir-red-light) !important;
        }

        a {
            color: var(--linfir-red-light) !important;
        }

        a:hover {
            color: var(--linfir-red-dark) !important;
        }

        blockquote {
            border-left: 4px solid var(--linfir-red-light);
            padding-left: 1em;
            margin-left: 0;
            font-style: italic;
            background-color: rgba(220, 70, 70, 0.05);
        }
    }

    /* Apply LinFIR colors to ALL dark themes (coal, navy, ayu) */
    .coal h1,
    .coal h2,
    .coal h3,
    .coal h4,
    .coal h5,
    .coal h6,
    .navy h1,
    .navy h2,
    .navy h3,
    .navy h4,
    .navy h5,
    .navy h6,
    .ayu h1,
    .ayu h2,
    .ayu h3,
    .ayu h4,
    .ayu h5,
    .ayu h6 {
        color: var(--linfir-red-dark) !important;
    }

    .coal a,
    .navy a,
    .ayu a {
        color: var(--linfir-red-dark) !important;
    }

    .coal a:hover,
    .navy a:hover,
    .ayu a:hover {
        color: #cc3a3f !important;
    }

    .coal blockquote,
    .navy blockquote,
    .ayu blockquote {
        border-left: 4px solid var(--linfir-red-dark);
        padding-left: 1em;
        margin-left: 0;
        font-style: italic;
        background-color: rgba(170, 35, 40, 0.1);
    }

    /* Custom coal theme colors */
    .coal {
        --bg: rgb(8, 8, 8) !important;
        --fg: rgb(255, 255, 255) !important;
    }

    .coal body,
    .coal #content main,
    .coal .content {
        background-color: rgb(8, 8, 8) !important;
        color: rgb(255, 255, 255) !important;
    }

    .coal p,
    .coal li,
    .coal td,
    .coal th {
        color: rgb(255, 255, 255) !important;
    }

    /* Fix alternating table row backgrounds for dark theme */
    .coal table tr:nth-child(2n) {
        background-color: rgb(30, 30, 30) !important;
    }

    .coal table tr:nth-child(2n + 1) {
        background-color: rgb(18, 18, 18) !important;
    }

    .coal table thead tr {
        background-color: rgb(40, 40, 40) !important;
    }

    .coal .sidebar,
    .coal .sidebar-bg {
        background-color: rgb(22, 22, 22) !important;
    }

    /* Apply LinFIR colors to light themes (light, rust) */
    .auto h1,
    .auto h2,
    .auto h3,
    .auto h4,
    .auto h5,
    .auto h6,
    .light h1,
    .light h2,
    .light h3,
    .light h4,
    .light h5,
    .light h6,
    .rust h1,
    .rust h2,
    .rust h3,
    .rust h4,
    .rust h5,
    .rust h6 {
        color: var(--linfir-red-light) !important;
    }

    .auto a,
    .light a,
    .rust a {
        color: var(--linfir-red-light) !important;
    }

    .auto a:hover,
    .light a:hover,
    .rust a:hover {
        color: var(--linfir-red-dark) !important;
    }

    .auto blockquote,
    .light blockquote,
    .rust blockquote {
        border-left: 4px solid var(--linfir-red-light);
        padding-left: 1em;
        margin-left: 0;
        font-style: italic;
        background-color: rgba(220, 70, 70, 0.05);
    }

    /* Theme-aware images - show/hide based on theme */
    /* Dark theme images */
    img[src*="_dark.png"] {
        display: none;
    }

    .coal img[src*="_dark.png"],
    .navy img[src*="_dark.png"],
    .ayu img[src*="_dark.png"] {
        display: block;
    }

    .coal img[src*="_light.png"],
    .navy img[src*="_light.png"],
    .ayu img[src*="_light.png"] {
        display: none;
    }

    /* Light theme images */
    .light img[src*="_light.png"],
    .rust img[src*="_light.png"] {
        display: block;
    }

    .light img[src*="_dark.png"],
    .rust img[src*="_dark.png"] {
        display: none;
    }

    /* Auto mode - use media queries for images */
    @media (prefers-color-scheme: dark) {
        img[src*="_dark.png"] {
            display: block;
        }

        img[src*="_light.png"] {
            display: none;
        }
    }

    @media (prefers-color-scheme: light) {
        img[src*="_dark.png"] {
            display: none;
        }

        img[src*="_light.png"] {
            display: block;
        }
    }

    /* Zoom hover effect for toolbar images */
    .toolbar-image-zoom {
        display: inline-block;
        position: relative;
        cursor: zoom-in;
        margin: 0.5em 0;
        transition: border-color 0.2s ease;
    }

    .toolbar-image-zoom:hover {
        border-color: rgba(128, 128, 128, 0.6);
        z-index: 1000;
    }

    .toolbar-image-zoom img {
        display: block;
        width: 100%;
        transition: transform 0.15s ease;
        position: relative;
    }

    /* General utilities */
    .theme-popup .theme {
        width: auto;
    }

    .sidebar-scrollbox {
        overflow-y: auto;
    }

    .nav-chapters {
        font-size: 0.9em;
    }

    code {
        background-color: rgba(128, 128, 128, 0.1);
        border-radius: 3px;
        padding: 2px 4px;
    }

    .warning {
        background-color: rgba(255, 165, 0, 0.1);
        border-left: 4px solid orange;
        padding: 1em;
        margin: 1em 0;
    }

    /* Context breadcrumb bar - fixed position below menu */
    .context-breadcrumb {
        position: fixed;
        top: 50px;
        /* Below the menu bar */
        left: 300px;
        /* After the sidebar */
        right: 0;
        height: 35px;
        line-height: 35px;
        padding: 0 15px;
        font-size: 0.85em;
        font-weight: 500;
        z-index: 99;
        border-bottom: 1px solid rgba(128, 128, 128, 0.2);
        transition: all 0.2s ease;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* When sidebar is hidden (mobile or toggled off) */
    .sidebar-hidden .context-breadcrumb {
        display: none !important;
    }

    html.sidebar-hidden .context-breadcrumb {
        display: none !important;
    }

    body.sidebar-hidden .context-breadcrumb {
        display: none !important;
    }

    /* Responsive adjustments for smaller screens */
    @media only screen and (max-width: 1080px) {
        .context-breadcrumb {
            left: 0;
        }
    }

    /* Adjust main content to account for breadcrumb bar */
    #mdbook-content {
        padding-top: 35px;
    }

    /* When sidebar is hidden, remove breadcrumb padding */
    .sidebar-hidden #mdbook-content {
        padding-top: 0;
    }

    /* Dark theme breadcrumb bar */
    .coal .context-breadcrumb,
    .navy .context-breadcrumb,
    .ayu .context-breadcrumb {
        background-color: rgba(22, 22, 22, 0.95);
        color: var(--linfir-red-dark);
        backdrop-filter: blur(10px);
    }

    /* Light theme breadcrumb bar */
    .light .context-breadcrumb,
    .rust .context-breadcrumb,
    .auto .context-breadcrumb {
        background-color: rgba(255, 255, 255, 0.95);
        color: var(--linfir-red-light);
        backdrop-filter: blur(10px);
    }

    /* Media queries for auto theme mode */
    @media (prefers-color-scheme: dark) {
        .context-breadcrumb {
            background-color: rgba(22, 22, 22, 0.95);
            color: var(--linfir-red-dark);
        }
    }

    @media (prefers-color-scheme: light) {
        .context-breadcrumb {
            background-color: rgba(255, 255, 255, 0.95);
            color: var(--linfir-red-light);
        }
    }
} /* end @media screen */

/* ============================================================
   PRINT STYLES — force light theme so text is visible
   ============================================================ */
@media print {
    /* ---- FORCE LIGHT THEME COLOURS ---- */
    /* Override the coal/navy/ayu theme variables that make text white */
    html.coal,
    html.navy,
    html.ayu {
        --bg: #ffffff !important;
        --fg: #000000 !important;
    }

    /* Hide chrome */
    .sidebar,
    .sidebar-bg,
    .context-breadcrumb,
    #mdbook-menu-bar,
    .menu-title,
    .nav-chapters,
    .menu-bar {
        display: none !important;
    }

    body,
    #mdbook-content main,
    .content,
    p,
    li,
    td,
    th,
    main {
        color: #000000 !important;
    }

    /* Only set background on body, not on div/span to avoid white bars */
    body {
        background-color: #ffffff !important;
    }

    /* LinFIR red titles — dark variant for better print contrast */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: var(--linfir-red-dark) !important;
    }

    /* Links — LinFIR red (dark variant for print) */
    a,
    a:visited,
    a:active,
    a:hover {
        color: var(--linfir-red-dark) !important;
        text-decoration: none;
    }

    blockquote {
        border-left: 4px solid var(--linfir-red-dark) !important;
        padding-left: 1em;
        margin-left: 0;
        font-style: italic;
        background-color: rgba(220, 70, 70, 0.05) !important;
        color: #000000 !important;
    }

    code {
        background-color: rgba(0, 0, 0, 0.08) !important;
        color: #000000 !important;
        direction: ltr !important;
    }

    /* Tables: light backgrounds for rows */
    table tr:nth-child(2n) {
        background-color: #f5f5f5 !important;
    }

    table tr:nth-child(2n + 1) {
        background-color: #ffffff !important;
    }

    table thead tr {
        background-color: #e8e8e8 !important;
    }

    td,
    th {
        color: #000000 !important;
        border-color: #cccccc !important;
    }

    /* Images: show light version in print */
    img[src*="_dark.png"] {
        display: none !important;
    }

    img[src*="_light.png"] {
        display: inline !important;
    }

    /* Page-break rules */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        page-break-inside: avoid;
        page-break-after: avoid;
    }

    pre,
    code {
        page-break-inside: avoid;
        white-space: pre-wrap;
    }

    .fa {
        display: none !important;
    }

    #mdbook-content {
        max-width: none;
        margin: 0;
        padding: 0;
    }

    #mdbook-content main {
        padding-top: 0 !important;
    }
}