/* Style template for orgmode exported HTML */

:root {
    --font: sans-serif;
    --background: #f8fafd;
    --text: #000000;
    --link: #000066;
    --linkhilite: #ffffaa;
    --pageborder: #c4c7c5;
    --pagebg: #ffffff;
    --subtitle: #666666;
    --hr: #aaaaaa;
    --achon: #aaffaa;
    --imgborder: #aaa;

    --tocbg: #f8fafd;
    --toclink: #444746;
    --tocborder: #c4c7c5;
    --tocselected: #d3e3fd;

    --reviewbg: #ffffaa;
    --reviewborder: #ffaa99;
    --reviewtext: #000000;

    --pretermbg: #333333;
    --pretermfg: #dddddd;
    --prefilebg: #ffffff;
    --prefilefg: #000000;
    --prefileborder: #666666;

    --codebg: #ffffcc;
    --umlbg: #ffffcc;

    --tablealtrow_cs200: #ffe4f2;
    --tablealtrow_cs235: #ffe3e2;
    --tablealtrow_cs250: #f2e4ff;
    --tablealtrow_other: #e2f0ff;
}


/* Dark mode styles */
@media (prefers-color-scheme: dark) {

    :root {
        --font: sans-serif;
        --background: #0f0f0f;
        --text: #ffffff;
        --link: #b6b891;
        --linkhilite: #494d01;
        --pageborder: #999999;
        --pagebg: #ffffff;
        --subtitle: #666666;
        --hr: #000000;
        --achon: #aaffaa;
        --imgborder: #a40033;

        --tocbg: #000000;
        --toclink: #e9eac5;
        --tocborder: #c4c7c5666666;
        --tocselected: #420080;

        --reviewbg: #601300;
        --reviewborder: #7f3320;
        --reviewtext: #f4e3b6;

        --pretermbg: #333333;
        --pretermfg: #dddddd;
        --prefilebg: #ffffff;
        --prefilefg: #000000;
        --prefileborder: #666666;

        --codebg: #482805;
        --umlbg: #482805;

        --tablealtrow_cs200: #5c001c;
        --tablealtrow_cs235: #560302;
        --tablealtrow_cs250: #250047;
        --tablealtrow_other: #e2f0ff;
    }

}

/* Colors */
body {
    font-family: var(--font);
    background-color: var(--background );
    color: var(--text);
}

pre {
    color: #000;
}

pre.src-cpp {
    background: #dddddd;
}

.hidden-spacer {
    color: var(--background);
}

hr {
    border: dashed 1px var(--hr);
}

img {
    border: double 3px var(--imgborder);
}

a:hover {
    background: var(--linkhilite);
}

.figure {
    color: var(--toclink);
}

a, a:active {
    color: var(--link);
}

pre.src-terminal {
    background-color: var(--pretermbg);
    color: var(--pretermfg);
}

pre.src-file {
    background-color: var(--prefilebg);
    color: var(--prefilefg);
    border: outset 2px var(--prefileborder);
}

table.cs200 tr:nth-child(even) {
    background-color: var(--tablealtrow_cs200);
}

table.cs235 tr:nth-child(even) {
    background-color: var(--tablealtrow_cs235);
}

table.cs250 tr:nth-child(even) {
    background-color: var(--tablealtrow_cs250);
}

table.other tr:nth-child(even) {
    background-color: var(--tablealtrow_other);
}

.content-subtitle {
    color: var(--subtitle);
}

.academic-honesty {
    background: var(--achon);
    border: solid 1px #000;
}

a, a:active, a:visited {
    color: var(--toclink);
}

#table-of-contents {
    border: solid 1px var(--tocborder);
    background-color: var(--tocbg);
}

#frame-table-of-contents ol li {
    color: #444746;
}

#table-of-contents #text-table-of-contents ul li a:hover,
#frame-table-of-contents ol li a:hover{
    background: var(--tocselected);
}
.outline-2 {
    border-bottom: solid 5px var(--pageborder);
    background-color: var(--background);
}

.outline-3 {
    border-top: dashed 1px var(--pageborder);
}

.REVIEW {
    border: solid 1px var(--reviewborder);
    background-color: var(--reviewbg);
    color: var(--reviewtext);
}



hr {
    margin: 20px auto;
    width: 75%;
}

img {
    max-width: 100%;
    padding: 10px;
}

#table-of-contents {
}

#content {
    margin-left: 0%;
    margin-right: 20%;
    width: 80%;
    max-width: 80%;
}

.figure {
    font-size: 0.8em;
}

pre.src-cpp {
    font-weight: bold;
}

pre.src-terminal:before {
    content: "Terminal";
}

pre.src-file:before {
    content: "File";
}

code {
    background-color: var(--codebg);
    font-weight: bold;
}

pre, code {
    font-size: 12pt;
}

table.contents-table tr td {
    text-align: left;
}

table.UML,
table.uml {
    font-family: monospace;
    background: var(--umlbg);
    font-size: 1.5em;
    border: solid 2px #000;
}

table.UML tr th,
table.uml tr th { text-align: center; }

table.table-contents-centered tr td {
    text-align: center;
}

table.assignments-table td:nth-child(2),
table.assignments-table td:nth-child(3) {
    text-align: center;
}

.content-title {
    font-size: 2em;
    font-weight: bold;
    margin: 0 10px;
}

.content-subtitle {
    font-size: 1.2em;
    text-align:center;
}

.academic-honesty {
    padding: 10px;
}

ol li,
ul li {
    margin: 10px 0;
}

/* -- Table of contents -- */
#table-of-contents {
    width: 20%;
    overflow-x: hidden;
    overflow-y: scroll;
    position: fixed;
    right: 0;
    top: 0;
    height: 100%;
}

a, a:active, a:visited {
    font-weight: bold;
}

table {
    margin: 10px auto;
}

#table-of-contents h2,
#frame-table-of-contents h2 {
    text-align: center;
}

#table-of-contents #text-table-of-contents {
    margin: 10px;
}
#table-of-contents #text-table-of-contents ul,
#frame-table-of-contents ul{
    padding-left: 10px;
}

#frame-table-of-contents ol li {
    font-weight: bold;
}

#table-of-contents #text-table-of-contents ul li {
    /*white-space: nowrap;*/
}

#table-of-contents #text-table-of-contents ul li a,
#table-of-contents #text-table-of-contents ul li a:hover,
#frame-table-of-contents ol li a,
#frame-table-of-contents ol li a:hover {
    border-radius: 15px;
    padding: 10px;
    display: block;
}

#table-of-contents #text-table-of-contents ul li ul li ul li a,
#frame-table-of-contents ol li ul li ul li a {
    font-weight: normal;
    font-size: 0.9em;
}

/* -- Postamble -- */
#postamble {}

/* -- Main document body -- */
.outline-2 {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 10px;
}
.outline-2 h2 {}
.outline-text-2 {}

.outline-3 {
    margin-left: 10px;
    margin-top: 50px;
}
.outline-3 h3 {}
.outline-text-3 {}

.outline-4 {
    /*border: solid 1px var(--pageborder);*/
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 10px;
    padding: 10px;
    /*background-color: var(--pagebg);*/
}
.outline-4 h4 {}
.outline-text-4 {}

/* At level 5, stops using h tags; becomes an OL. */
.org-ol li { font-weight: bold; margin: 25px 0; }
.org-ol li p { font-weight: normal; margin-top: 0px; }

.REVIEW {
    margin: 20px;
    padding: 20px;
}

.REVIEW p {
    margin: 0;
}

/* Screens */
@media only screen and (max-width:1280px) {
    #table-of-contents {
        position: relative;
        width: 100%;
        margin: 0;
    }

    #content {
        padding-left: 0;
        margin: 0;
        width: 100%;
        max-width: 100%;
    }
}

/* Printer */
@media print {
    img {
        max-width: 100%;
    }

    #table-of-contents {
        position: relative;
        width: 100%;
    }

    #content {
        padding-left: 0;
    }

    .outline-2 {
        page-break-before: always;
    }

    #table-of-contents #text-table-of-contents,
    #table-of-contents #text-table-of-contents ul,
    #table-of-contents #text-table-of-contents ul li,
    #table-of-contents #text-table-of-contents ul li a
    {
        margin-left: 10px;
        padding: 0px;
    }
}





/* I just like using this
   https://nicolasgallagher.com/micro-clearfix-hack/
 */

.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}
