/* Custom styling for LinFIR documentation */

:root {
    --linfir-red-dark: #aa2328;
    /* RGB 170, 35, 40 - LinFIR dark mode */
    --linfir-red-light: #dc4646;
    /* RGB 220, 70, 70 - LinFIR light mode */
}

/* 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 auto theme mode (follows OS preference) */
@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 (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);
}

/* 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-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;
}

/* 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 */
@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;
}