/* Loaded into every book after shared/brand/brand.css (see additional-css in each book.toml).
   Maps the brand palette onto mdBook's theme variables: Light and Rust use the light
   palette, Coal, Navy and Ayu the dark one. library.js trims the theme menu to
   Auto / Light / Dark, so the others only apply to a theme saved before. */

.light, .rust {
    --muted: var(--light-mu);
    --line: var(--light-ln);
    --field: var(--light-field);

    --bg: var(--light-bg);
    --fg: var(--light-fg);
    --sidebar-bg: var(--light-bg);
    --sidebar-fg: var(--light-mu);
    --sidebar-non-existant: var(--light-ln2);
    --sidebar-active: var(--light-fg);
    --sidebar-spacer: var(--light-ln);
    --sidebar-header-border-color: var(--light-ac);
    --scrollbar: var(--light-ln2);
    --icons: var(--light-mu);
    --icons-hover: var(--light-fg);
    --links: var(--light-ac);
    --inline-code-color: var(--light-fg);
    --theme-popup-bg: var(--light-field);
    --theme-popup-border: var(--light-ln2);
    --theme-hover: var(--light-soft);
    --quote-bg: var(--light-soft);
    --quote-border: var(--light-ac);
    --table-border-color: var(--light-ln);
    --table-header-bg: var(--light-soft);
    --table-alternate-bg: var(--light-field);
    --searchbar-border-color: var(--light-ln2);
    --searchbar-bg: var(--light-field);
    --searchbar-fg: var(--light-fg);
    --searchbar-shadow-color: transparent;
    --searchresults-header-fg: var(--light-mu);
    --searchresults-border-color: var(--light-ln);
    --searchresults-li-bg: var(--light-soft);
    --search-mark-bg: color-mix(in srgb, var(--light-ac) 30%, transparent);
    --footnote-highlight: var(--light-ac);
    --color-scheme: light;
}

.coal, .navy, .ayu {
    --muted: var(--dark-mu);
    --line: var(--dark-ln);
    --field: var(--dark-field);

    --bg: var(--dark-bg);
    --fg: var(--dark-fg);
    --sidebar-bg: var(--dark-bg);
    --sidebar-fg: var(--dark-mu);
    --sidebar-non-existant: var(--dark-ln2);
    --sidebar-active: var(--dark-fg);
    --sidebar-spacer: var(--dark-ln);
    --sidebar-header-border-color: var(--dark-ac);
    --scrollbar: var(--dark-ln2);
    --icons: var(--dark-mu);
    --icons-hover: var(--dark-fg);
    --links: var(--dark-ac);
    --inline-code-color: var(--dark-fg);
    --theme-popup-bg: var(--dark-field);
    --theme-popup-border: var(--dark-ln2);
    --theme-hover: var(--dark-soft);
    --quote-bg: var(--dark-soft);
    --quote-border: var(--dark-ac);
    --table-border-color: var(--dark-ln);
    --table-header-bg: var(--dark-soft);
    --table-alternate-bg: var(--dark-field);
    --searchbar-border-color: var(--dark-ln2);
    --searchbar-bg: var(--dark-field);
    --searchbar-fg: var(--dark-fg);
    --searchbar-shadow-color: transparent;
    --searchresults-header-fg: var(--dark-mu);
    --searchresults-border-color: var(--dark-ln);
    --searchresults-li-bg: var(--dark-soft);
    --search-mark-bg: color-mix(in srgb, var(--dark-ac) 35%, transparent);
    --footnote-highlight: var(--dark-ac);
    --color-scheme: dark;
}

/* Type: Cascadia Code for text and code, Courier Prime for the title and h1/h2. */
:root {
    --mono-font: var(--mono);
    --code-font-size: 0.93em;
}
html {
    font-family: var(--mono);
    /* Cascadia Code draws operators like := and != as ligatures; readers need to see
       the characters they will type. */
    font-variant-ligatures: none;
    font-feature-settings: "calt" 0;
}
body {
    font-size: 1.5rem;
}
.content {
    line-height: 1.7;
}
.content h1, .content h2, .menu-title {
    font-family: var(--display);
    font-weight: 700;
}
.menu-title {
    font-size: 2rem;
}

/* Sidebar: same surface as the page with a hairline, as on tools.rupeshbhandari.com.np. */
.sidebar {
    border-inline-end: 1px solid var(--line);
}
.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 8px 18px;
    margin-block-end: 8px;
    border-block-end: 1px solid var(--line);
    font-family: var(--display);
    font-weight: 700;
    font-size: 15px;
    line-height: 1.3;
    color: var(--fg);
    text-decoration: none;
}
.sidebar-brand img {
    border-radius: 50%;
    flex: none;
}
.sidebar-brand small {
    display: block;
    font-family: var(--mono);
    font-weight: 400;
    font-size: 12px;
    color: var(--muted);
}
.chapter li a {
    border-radius: 6px;
    padding: 2px 6px;
    margin-inline: -6px;
}
.chapter li a.active {
    background: var(--fg);
    color: var(--bg);
}
.chapter li.part-title {
    color: var(--muted);
    font-size: 0.9em;
}

/* Menu bar: the RB logo links back to the library, followed by the blog and tools sites. */
.library-link img {
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
    vertical-align: middle;
}
.menu-bar .site-link {
    font-size: 1.3rem;
    color: var(--icons);
    text-decoration: none;
}
/* On the narrowest phones those links leave the book title room for a letter or two. */
@media only screen and (max-width: 350px) {
    .menu-title {
        visibility: hidden;
    }
}

/* Code: raised surface with a hairline, like the fields on tools.rupeshbhandari.com.np. */
.hljs {
    background: var(--field);
}
pre {
    border: 1px solid var(--line);
    border-radius: 8px;
}
:not(pre) > code {
    border: 1px solid var(--line);
    border-radius: 4px;
}

pre.mermaid {
    background: none;
    border: 0;
    text-align: center;
}

/* Collapsible exercise solutions (<details><summary>Solution</summary> ...). */
.content details > summary {
    cursor: pointer;
    color: var(--links);
    font-weight: 600;
}
.content details[open] > summary {
    margin-block-end: 0.5em;
}