/*
Dark Mode colors and other variables copied from "doxygen-awesome.css".
We could potentially import the entire style sheet here, but we're only
interested in the color definitions and a select few other styles.
DoxygenAwesome is licensed under the MIT License.
*/
html {
    /* font-families. will affect all text on the website
     * font-family: the normal font for text, headlines, menus
     * font-family-monospace: used for preformatted text in memtitle, code, fragments
     */
    --font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;
    --font-family-monospace: ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;

    /* font sizes */
    --page-font-size: 15.6px;
    --navigation-font-size: 14.4px;
    --toc-font-size: 13.4px;
    --code-font-size: 14px; /* affects code, fragment */
    --title-font-size: 22px;

    /* border radius for all rounded components. Will affect many components, like dropdowns, memitems, codeblocks, ... */
    --border-radius-large: 8px;
    --border-radius-small: 4px;
    --border-radius-medium: 6px;

    color-scheme: dark;

    --primary-color: #1982d2;
    --primary-dark-color: #86a9c4;
    --primary-light-color: #4779ac;

    --box-shadow: 0 2px 8px 0 rgba(0,0,0,.30);

    --odd-color: rgba(100,100,100,.06);

    --menu-selected-background: rgba(0,0,0,.4);

    --page-background-color: #1C1D1F;
    --page-foreground-color: #d2dbde;
    --page-secondary-foreground-color: #859399;
    --separator-color: #38393b;
    --side-nav-background: #252628;

    --code-background: #2a2c2f;
    --code-background-brighter: #3a3c3f;

    --tablehead-background: #2a2c2f;

    --blockquote-background: #222325;
    --blockquote-foreground: #7e8c92;

    --warning-color: #2e1917;
    --warning-color-dark: #ad2617;
    --warning-color-darker: #f5b1aa;
    --note-color: #3b2e04;
    --note-color-dark: #f1b602;
    --note-color-darker: #ceb670;
    --todo-color: #163750;
    --todo-color-dark: #1982D2;
    --todo-color-darker: #dcf0fa;
    --deprecated-color: #2e323b;
    --deprecated-color-dark: #738396;
    --deprecated-color-darker: #abb0bd;
    --bug-color: #2a2536;
    --bug-color-dark: #7661b3;
    --bug-color-darker: #ae9ed6;
    --invariant-color: #303a35;
    --invariant-color-dark: #76ce96;
    --invariant-color-darker: #cceed5;

    --fragment-background: #282c34;
    --fragment-foreground: #dbe4eb;
    --fragment-keyword: #cc99cd;
    --fragment-keywordtype: #ab99cd;
    --fragment-keywordflow: #e08000;
    --fragment-token: #7ec699;
    --fragment-comment: #999999;
    --fragment-link: #98c0e3;
    --fragment-preprocessor: #65cabe;
    --fragment-linenumber-color: #cccccc;
    --fragment-linenumber-background: #35393c;
    --fragment-linenumber-border: #1f1f1f;

    /* Additional custom color variables */
    --highlight-color: #fbe54e;
    --target-color: #204D79;
}

/*
Apply the dark mode colors and other styles on top of the default Alabaster
styles
*/
body,
div.body {
    background-color: var(--page-background-color);
    color: var(--page-foreground-color);
    font-family: var(--font-family);
    font-size: var(--page-font-size);
}
div.sphinxsidebar {
    background-color: var(--side-nav-background);
    border: 1px solid var(--separator-color);
    border-radius: var(--border-radius-large);
}
div.sphinxsidebar p {
    margin-bottom: 14px;
}
div.sphinxsidebar p,
div.sphinxsidebar h3,
div.sphinxsidebar h4 {
    color: var(--page-foreground-color);
    font-family: var(--font-family);
}
div.sphinxsidebar ul {
    color: inherit !important;
}
div.sphinxsidebar input {
    font-family: var(--font-family);
}
a {
    color: var(--primary-color) !important;
    text-decoration: none;
}
a:link, a:visited, a:hover, a:focus, a:active {
    font-weight: 500;
}
a.reference,
div.sphinxsidebar a {
    text-decoration: none;
    border-bottom: none;
}
a.reference:hover,
div.sphinxsidebar a:hover {
    border-bottom: none;
    color: var(--page-foreground-color) !important;
    text-decoration: none !important;
}
div.body h1,
div.body h2,
div.body h3,
div.body h4,
div.body h5,
div.body h6
{
    font-family: var(--font-family);
}
div.body h2 {
    margin-bottom: 20px;
}
dl {
    margin-bottom: 40px;
}
dl.simple,
div.body li {
    margin-bottom: 3px;
}
dt:target {
    background: var(--target-color);
}
span.highlighted {
    background-color: var(--highlight-color);
    color: black;
}
dt.sig {
    background-color: var(--code-background);
    border: 1px solid var(--separator-color);
    border-radius: var(--border-radius-medium);
    padding: 10px;
    margin-bottom: 8px;
}
dt.sig:target {
    border: 2px solid var(--target-color);
    padding: 9px;
}
div.admonition {
    background-color: var(--side-nav-background);
    border: 1px solid var(--separator-color);
    border-radius: var(--border-radius-medium);
}
pre {
    background-color: var(--code-background);
    border-radius: var(--border-radius-small);
    padding: 10px;
    padding-left: 10px !important;
}
code,
div.fragment,
pre.fragment {
    border-radius: var(--border-radius-small);
    border: 1px solid var(--separator-color);
    overflow: hidden;
}
code {
    display: inline;
    color: var(--code-foreground);
    padding: 2px 6px;
}
tt,
tt.xref,
code,
code.xref,
a em,
a tt {
    background-color: var(--code-background);
    border-bottom: none;
}
code,
code a,
a em,
pre.fragment,
div.fragment,
div.fragment span,
div.fragment .line,
div.fragment .line a,
div.fragment .line span {
    font-family: var(--font-family-monospace);
    font-size: var(--code-font-size) !important;
    font-style: normal;
}
code.xref,
a code {
    font-weight: normal;
}
a:hover tt,
a:hover code {
    background-color: var(--code-background-brighter);
    color: var(--page-foreground-color);
}

/* Indexes */
div.modindex-jumpbox {
    border-top: 1px solid var(--separator-color);
    border-bottom: 1px solid var(--separator-color);
    color: var(--separator-color);
}

div.genindex-jumpbox {
    border-top: 1px solid var(--separator-color);
    border-bottom: 1px solid var(--separator-color);
    color: var(--separator-color);
}

/* Tables */
table,
table.docutils {
    border: none;
    border-collapse: collapse;
    -webkit-box-shadow: none;
    box-shadow: none;
}
table.align-default {
    margin-left: inherit !important;
    margin-right: inherit !important;
}
table tr:nth-child(even) {
    background-color: transparent;
}
table tr:nth-child(odd) {
    background-color: var(--odd-color);
}
/* table header rows */
table tr.row-odd:nth-child(odd) {
    background-color: transparent;
    border-bottom: 1px solid var(--separator-color);
}
table tr.row-even:nth-child(even) {
    border-bottom: 1px solid var(--separator-color);
}
table.docutils td,
table.docutils th {
    border: none;
}

/* Pygments syntax highlighting */
.highlight {
    background: inherit !important;
}

/* Make the MaterialX logo a little smaller */
img.logo {
    width: 60%;
    height: 60%;
}

/* Turn off auto-hyphenation in text blocks */
div.body p,
div.body dd,
div.body li,
div.body blockquote {
    -moz-hyphens: none;
    -ms-hyphens: none;
    -webkit-hyphens: none;
    hyphens: none;
}

/* Input elements */
input[type="text"] {
    border: 1px solid var(--separator-color);
    font-size: 14px !important;
    padding: 6px;
    width: 300px;
}
input[type="submit"],
div.sphinxsidebar #searchbox input[type="submit"] {
    background: #204D79;
}

/*
Blue button style copied from https://materialx.org/style/flavor.css and
extended
*/
div.body form input[type="submit"],
.blueButton {
    background: #204D79;
    border: 1px solid black !important;
    box-shadow: 0 1px 0px #3471aa inset;
    color: #ccc !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 14px !important;
    font-weight: bold !important;
    letter-spacing: 1px;
    margin: auto;
    padding: 6px;
    text-align: center;
    text-decoration: none !important;
    text-shadow: 0 1px 0 black;
    text-transform: uppercase;
    width: 115px;

    /* for IE */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#204D79', endColorstr='#003260');

    /* for webkit browsers */
    background: -webkit-gradient(linear, left top, left bottom, from(#204D79), to(#003260));
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 1px 0px #3471aa inset;

    /* for Firefox */
    background: -moz-linear-gradient(bottom, #003260, #204D79);
    -moz-border-radius: 5px;
    -moz-box-shadow: 0 1px 0 #3471aa inset;
}
div.body form input[type="submit"],
.blueButton:hover {
    background: #204D79;
    cursor: pointer;
/*    text-decoration: none !important;*/

    /* for IE */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#275d8e', endColorstr='#003d72');

    /* for webkit browsers */
    background: -webkit-gradient(linear, left top, left bottom, from(#275d8e), to(#003d72));

    /* for Firefox */
    background: -moz-linear-gradient(bottom, #003d72, #275d8e);
}
.blueButton:active {
    background: #000;
    box-shadow: 0px 1px 0px #444;
    color: #fff;
/*    text-decoration: none !important;*/

    /* for IE */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#002345', endColorstr='#204D79');

    /* for webkit browsers */
    background: -webkit-gradient(linear, left top, left bottom, from(#002345), to(#204D79));
    -webkit-box-shadow: 0px 1px 0px #444;

    /* for Firefox */
    background: -moz-linear-gradient(bottom, #204D79, #002345);
    -moz-box-shadow: 0px 1px 0px #444;
}
