@font-face {
    font-family: 'Berkeley Mono';
    font-style: normal;
    font-weight: normal;
    src: url("/fonts/berkeley-mono/BerkeleyMono-Regular.woff2") format("woff2");
}
@font-face {
    font-family: 'Berkeley Mono';
    font-style: normal;
    font-weight: bold;
    src: url("/fonts/berkeley-mono/BerkeleyMono-Bold.woff2") format("woff2");
}
@font-face {
    font-family: 'Berkeley Mono';
    font-style: italic;
    font-weight: normal;
    src: url("/fonts/berkeley-mono/BerkeleyMono-Italic.woff2") format("woff2");
}
@font-face {
    font-family: 'Berkeley Mono';
    font-style: italic;
    font-weight: bold;
    src: url("/fonts/berkeley-mono/BerkeleyMono-BoldItalic.woff2") format("woff2");
}
body {
    font-family: "Berkeley Mono", monospace;
    font-size: .875rem;
    letter-spacing: -.03em;
    color: #ffe;
    background-color:#2e3440;
    margin: 0 auto;
    padding: len 0 len 0;
}
* {
    font-family: "Berkeley Mono", monospace;
    margin: 0 auto;
    padding: len 0 len 0;
    text-wrap: wrap;
}
/* a:link { */
    /* color: #88c0d0; */
/* } */
/* a:visited { */
    /* color: #5e81ac; */
/* } */
/* a:hover { */
    /* color: #81a1c1; */
/* } */
/* a.dir:after { */
    /* content: "/"; */
    /* color: #ffe; */
    /* border-bottom: none; */
/* } */

/* 
Note that:
    1. I am not a CSS expert and will likely use cringe-worthy terminology 
       and cringe-worthy methods to get the look I want
    2. I put little to no effort into organizing this file

Quick notes on things I learned while working on this (here so I remember them):
    * `>` selector applies to immediate descendants only
*/
.inline-block {
   display: inline-block;
}

/* fairly self-explanatory */
body {
    background-color: #0f1419;
    color: #c5c5c5;
}

/* remove lines below nav things */
nav {
    border-bottom: none;
    margin-bottom: 8px;
}

/* selected thing (function, method, etc.) */
:target {
    background: #0f1419;
    border-right: 3px solid #ffb44c;
}

/* fix selected thing code part */
h4:target code {
    background: inherit;
}

input:checked + .slider {
    background-color: #ffb454;
}

#all-types {
    background-color: #141920;
    color: #fff;
}

#all-types:hover {
    background-color: rgba(70, 70, 70, 0.33);
}

#settings-menu {
    margin-top: 3px;
    background-color: #141920;
}

#settings-menu > img {
    filter: invert(100);
}

/* global scrollbar */
::-webkit-scrollbar {
    /* actual width is 2px */
    width: 5px;
}

/* global scrollbar thumb (aka the part you see) */
::-webkit-scrollbar-thumb:vertical {
    background-color: #5c6773; 
    /* doesn't look right because of below hack */
    border-radius: 4px;
    /* hacky way to 'pad' right side */
    border-right: 3px solid #0f1419;
}

/* global scrollbar thumb horizontal (aka the part you see) */
::-webkit-scrollbar-thumb:horizontal {
    background-color: #5c6773; 
    /* doesn't look right because of below hack */
    border-radius: 4px;
    /* more ugly, ugly, ugly hacks */
    border-bottom: 3px solid #191f26;
    border-top: 11px solid #191f26;
}

/* change highlighted text color to look something like ayu */
::selection {
    background-color: rgba(37, 51, 64, 0.99);
}

/* fix sidebar */
.sidebar, .source .sidebar {
    background-color: #0f1419;
}

.line-numbers span {
    color: #5c67736e; 
}

.line-numbers .line-highlighted {
    background-color: rgba(255, 52, 52, 0.16) !important;
    border-right: 2px solid #ffb44c;
}

/* top left thing on sidebar */
.sidebar .location {
    background: #0f1419;
    color: #333;
}

div.modal-content {
    background-color: #14191f;
    box-shadow: 0px 6px 20px 0px black;
}

div.modal-content > .close {
    background-color: #14191f;
    border: 1px solid #999;
    border-left: none;
    
}

div.modal-content > .whiter {
    background-color: #14191f;
}

span.content .method .where, .content .fn .where, .content .where.fmt-newline {
    color: #c5c5c5;
}

.stab.portability > code {
    color: #c5c5c5;
}

div.theme-picker {
    visibility: hidden;
}

.tooltip .tooltiptext {
    color: #c5c5c5 !important;
    background-color: #314559 !important;
    border: 1px solid #5c6773 !important;
}

#titles > div.selected {
    background-color: #141920 !important;
    border-bottom: 1px solid #ffb44c !important;
}

#titles > div:hover {
    border-bottom: 1px solid rgba(242, 151, 24, 0.3);
}

#titles > div {
    background-color: transparent !important;
    border: none;
}

/* top left beneath logo, orange colons */
p.location {
    color: #ff7733 !important;
}

/* shift + ? */
#help dt {
    background: #0f1419;
}

/* shift + ? */
#help > div {
    background: #14191f;
    box-shadow: 0px 6px 20px 0px black;
    border: none;
    border-radius: 4px;
}

/* change color of headers and the lines that go under them */
h1, h2, h3:not(.impl):not(.method):not(.type):not(.tymethod), h4:not(.method):not(.type):not(.tymethod) {
    color: white;
    border-bottom-color: #5c6773 !important;
    border-bottom:1px solid;
}

/* links inside headers - no underline */
h1 a:link, h1 a:visited, h2 a:link, h2 a:visited, h3 a:link, h3 a:visited, h4 a:link, h4 a:visited, h5 a:link, h5 a:visited, h6 a:link, h6 a:visited {
    color: white;
    text-decoration: none;
}

h1 {
  font-size: 2em;
  line-height: 1.25;
  padding-top: 3px;
  padding-bottom: 9px;
}

h2 {
  font-size: 1.5em;
  line-height: 1.25;
  padding-top: 3px;
  padding-bottom: 9px;
}

h3 {
  font-size: 1.25em;
  line-height: 1.25;
  padding-top: 2px;
  padding-bottom: 7px;
}

h4 {
  font-size: 1.1em;
  line-height: 1.25;
  padding-top: 2px;
  padding-bottom: 5px;
}

h5 {
  font-size: 1em;
  line-height: 1.25;
}

h6 {
  font-size: 0.9em;
  line-height: 1.25;
}

/* fixes things related to code backing */
h4 > code, h3 > code, h2 > code, h1 > code, td > code, .in-band > code, p > code, .invisible > code, .in-band {
    background-color: #0f1419;
}

code {
    color: #ffb454;
}

pre > code {
    color: #e6e1cf;
    background-color: transparent;
}

span code {
    color: #e6e1cf;
}

a {
    color: #0096cf;
    text-decoration: none;
}

.docblock a > code {
    color: #0096cf !important;
}

/* hover highlight for blocks on sidebar */
.block a:hover {
    background: rgba(70, 70, 70, 0.33);
}

/* `Run` button on code blocks */
a.test-arrow {
    font-family: "Roboto Mono";
    font-size: 90%;
    color: #5c6773 !important;
    border-radius: 4px;
    font-weight: 400;
    background-color: rgba(255, 255, 255, 0);
    border: none;
}

/* when button is hovered */
a.test-arrow:hover {
    background-color: rgba(242, 151, 24, 0.05);
    color: #ffb44c !important;
    font-weight: 300;
}

/* modules, crates, types, etc. on sidebar */
.block a, .block a.current.crate {
    color: #5c6773 !important;
    font-family: "Roboto Mono", "Fira Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 80%;
    font-weight: 400;
}

/* selected one */
a.current {
    color: #fff !important;
    background-color: transparent !important;
}

/* more color changes for the lines below headers */
.docblock h1, .docblock h2, .docblock h3, .docblock h4, .docblock h5 {
    border-bottom-color: #5c6773;
}

/* I don't remember, other than that this is the color for URLs */
.docblock:not(.type-decl) a:not(.srclink):not(.test-arrow), .docblock-short a:not(.srclink):not(.test-arrow), .stability a {
    color: #0096cf;
    text-decoration: none;
}

/* search bar */
.search-input {
    color: #ffffff;
    background-color: #141920;
    box-shadow: none !important;
    transition: box-shadow 150ms ease-in-out;
    border-radius: 4px;
    margin-left: 8px;
    margin-top: 8px;
}

/* when typing in it */
.search-input:focus {
    border-radius: 4px;
    box-shadow: 0px 6px 20px 0px black !important;
}

/* crate search selector button */
select#crate-search {
    color: #c5c5c5;
    background-color: #141920;
    border-radius: 4px;
    box-shadow: none;
    border-color: #5c6773;
    margin-top: 8px;
    background-position-x: calc(100% - 3px);
    padding-right: 22px;
}

/* move docs down from top */
div.search-container {
    margin-top: 20px;
}

/* code in between backticks */
.docblock code, .docblock-short code {
    background-color: #191f26 !important;
}

/* ensure code inside pre blocks has no background */
.docblock pre code {
    background-color: transparent !important;
}

/* stability notes (such as unstable) */
.stab {
    border-style: none;
    border-top: 1px solid #5c6773;
    margin-bottom: 5px;
    color: #c5c5c5 !important;
}

em.stab, .stab.deprecated, .stab.unstable, .stab.portability {
    background: #314559 !important;
    border-style: none !important;
    border-radius: 4px;
    padding: 3px 6px 3px 6px;
}

.module-item .stab {
    color: #c5c5c5 !important;
    background: none !important;
}

/* fix methods */
.method.stab {
    border-top-style: none;
}

/* code blocks */
pre {
    background-color: #191f26;
    color: #e6e1cf;
}

/* black background for example-wrap code blocks */
.example-wrap pre {
    background-color: #000000;
    padding: 10px;
    overflow-x: auto;
    max-width: 100%;
    box-sizing: border-box;
}

/* line numbers in front of code blocks */
.example-wrap > pre.line-number {
    color: #5c67736e;
    border: none;
}

/* code blocks not on a `src` page */
body:not(.source) pre {
    border-radius: 4px;
}

/* `#[]` */
pre.rust .attribute {
    color: #5c6773 !important;
    font-style: italic;
}

/* making it work */
pre.rust .attribute, pre.rust .attribute .ident, pre.rust .attribute .op {
    color: #5c6773;
}

/* lots of things, main orange color */
pre.rust .kw, pre.rust .kw-2, pre.rust .prelude-ty, pre.rust .bool-val, pre.rust .prelude-val, pre.rust .op, pre.rust .lifetime {
    color: #ff7733;
}

/* numbers and strings */
pre.rust .number, pre.rust .string {
    color: #b8cc52;
}

/* self */
pre.rust .self {
    color: #36a3d9;
    font-style: italic;
}

/* comments */
pre.rust .comment {
    color: #5c6773;
    font-style: italic;
}

/* struct in code */
pre.rust .struct {
    color: #36a3d9;
}

/* enum in code */
pre.rust .enum {
    color: #99e0c9;
}

/* trait in code */
pre.rust .trait {
    color: #36a3d9;
}

/* type definition in code */
pre.rust .type {
    color: #cfbcf5;
}

/* function/method names in code */
pre.rust .fnname {
    color: #fdd687;
}

/* macro names in code */
pre.rust .macro {
    color: #a37acc;
}

/* module color in doc listing */
.content span.externcrate, .content span.mod, .content a.mod, .block a.current.mod {
    color: #acccf9;
}

/* struct color */
.content span.struct, .content a.struct, .block a.current.struct {
    color: #ffa0a5;
}

/* enum color */
.content span.enum, .content a.enum, .block a.current.enum {
    color: #99e0c9;
}

/* trait color */
.content span.trait, .content a.trait, .block a.current.trait {
    color: #36a3d9;
}
 /* type definition color */
.content span.type, .content a.type, .block a.current.type {
    color: #cfbcf5;
}

/* function name color */
.content span.fn, .content a.fn, .block a.current.fn, .content span.method, .content a.method, .block a.current.method, .content span.tymethod, .content a.tymethod, .block a.current.tymethod, .content .fnname {
    color: #fdd687;
}

/* macro name color */
.content span.attr, .content a.attr, .block a.current.attr, .content span.derive, .content a.derive, .block a.current.derive, .content span.macro, .content a.macro, .block a.current.macro {
    color: #a37acc;
}
.content h2,
.top-doc .docblock>h3,
.top-doc .docblock>h4 {
}

/* Project description indentation */
.project-description {
    margin-left: 0.5em;
    margin-right: 0.5em;
    margin-bottom: 0.5em;
}

/* Regular paragraphs in docblock */
.docblock > p {
    margin-left: 0.5em;
    margin-right: 0.5em;
    margin-bottom: 0.5em;
}

/* Remove underline from doc-anchor links */
a.doc-anchor {
    text-decoration: none;
    font-size: 1.1em;
}

/* Indent banners and examples under project headers */
.docblock .banner,
.docblock .example-wrap {
    margin-left: 0.5em !important;
    margin-right: 0.5em !important;
}

.docblock ul {
    margin-left: 0.5em;
    margin-right: 0.5em;
    padding-left: 1.5em;
}

.example-wrap {
    overflow-x: auto;
    max-width: 100%;
}

/* Indent project sections */
.docblock .project-section {
    margin-left: 0.5em;
    margin-right: 0.5em;
}

/* Indent images within docblock (but not the header profile image) */
.docblock > img {
    margin-left: 0.5em;
    margin-right: 0.5em;
    max-width: calc(100% - 1em);
}

/* Responsive images */
img {
    max-width: 100%;
    height: auto;
}

/* Add left and right padding to docblock */
.docblock {
    padding-left: 15px;
    padding-right: 15px;
}

/* Make badge images same height as text */
.banner img {
    height: 1.5em;
    vertical-align: middle;
}

/* Arborium syntax highlighting custom elements */
a-k { color: #ff7733; } /* keywords */
a-t { color: #36a3d9; } /* types */
a-f { color: #fdd687; } /* functions */
a-m { color: #a37acc; } /* macros */
a-s { color: #b8cc52; } /* strings */
a-co { color: #b8cc52; } /* constants/numbers */
a-c { color: #5c6773; font-style: italic; } /* comments */
a-p { color: #ff7733; } /* punctuation */
a-o { color: #ff7733; } /* operators */
a-pr { color: #e6e1cf; } /* properties */
a-at { color: #5c6773; font-style: italic; } /* attributes */
a-cr { color: #36a3d9; } /* constructors */
a-v { color: #e6e1cf; } /* variables */
a-l { color: #ff7733; } /* lifetimes */
a-tt { color: #ffb454; } /* inline code/monospace text */
a-tl { color: #0096cf; } /* links */
