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


/* 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: rgba(255, 52, 52, 0.33);
    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), 
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 {
    color: white;
    border-bottom-color: #5c6773 !important;
}

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

span code {
    color: #e6e1cf;
}

a {
    color: #0096cf;
}

.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;
}

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

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

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

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

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