/* Changes to DocFX's own docfx.css and vendor styles, kept here so the theme stays a diff of the statictoc template */

/* Wide pages for code-heavy documents: Bootstrap stops at 1170px; continue in 200px steps */
@media (min-width: 1400px) {
  .container {
    width: 1370px;
  }
}

@media (min-width: 1600px) {
  .container {
    width: 1570px;
  }
}

@media (min-width: 1800px) {
  .container {
    width: 1770px;
  }
}

@media (min-width: 2000px) {
  .container {
    width: 1970px;
  }
}

@media (min-width: 2200px) {
  .container {
    width: 2170px;
  }
}

@media (min-width: 2400px) {
  .container {
    width: 2370px;
  }
}

@media (min-width: 2600px) {
  .container {
    width: 2570px;
  }
}

@media (min-width: 2800px) {
  .container {
    width: 2770px;
  }
}

/* Wider table of contents and its filter, and the article beside them; only where docfx.css puts them side by side,
   as below 769px it stacks the table of contents over a full-width article */
@media (min-width: 769px) {
  .sidetoc {
    width: 340px;
  }

  .sidefilter {
    width: 320px;
  }

  .article.grid-right {
    margin-left: 340px;
  }
}

/* Phones and narrow windows: the table of contents as a plain list, as its rows are blocks here, without docfx.css's commas
   between inline rows; tables wrap their text instead of scrolling one long line per row */
@media only screen and (max-width: 768px) {
  .toc li:after {
    display: none;
  }

  .toc .nav > li {
    display: block;
  }

  .table {
    white-space: normal;
  }

  .article {
    overflow-wrap: break-word;
  }
}

/* Code snippets: light text on dark */
code {
  color: #cccccc;
  background-color: #22222280;
}

/* Code inside links: docfx.css's "a code" outranks plain "code", so it needs a rule of the same weight */
a code {
  color: #539ac7;
  background-color: #22222280;
}

/* Code blocks: the block's own 16px padding only, as with the highlight.js version this theme was made with; newer ones add 1em */
pre code.hljs {
  padding: 0;
}

/* Plain text blocks, such as screen drawings, were not highlighted then: the whole block scrolls, not the text inside it */
pre code.hljs.language-plaintext {
  display: inline;
  overflow-x: visible;
}

/* Styles of the DocFX version this theme was made with, changed upstream since */

/* Table of contents entries with children take their weight from the row, not bold */
.expand-stub, .expand-stub + a {
  font-weight: inherit;
}

/* The logo turns white on hover */
svg:hover path {
  fill: #ffffff;
}

body {
   /* variables are disabled, because IE doesn't support them. */
   --bg0: #1a1a1a;
   --bg1: #242424;
   --bg2: #357dc7; /* main toc */
   --fg0: #cccccc;
   --fg1: #008bf5; /* sidetoc, breadcrumb */
   --fg2: #337ab7; /* affix */
   --border: #2f2f2f;
   background-color: #1a1a1a;
   color: #cccccc;
   line-height: 155%;
}
.toc .nav > li.active > a {
   color: #eee;
}
a {
   color: #4c8bc1;
}
button:hover, button:focus, a:hover, a:focus {
   color : #3070b0;
}
/* First topic line */
#autocollapse {
   background-color: #357dc7;
   font-size: 115%;
}

label {
   font-weight: 400
}

.toc-filter {
   background: #555;
}

.anchorjs-link:hover {
   color: #008bf5;
}

.navbar-inverse .navbar-nav > li > a, .navbar-inverse .navbar-text {
   color: #000;
   padding-bottom: 0px;
   margin-bottom: 15px;
   margin-left: 15px;
   padding-left: 0px;
   padding-right: 0px;
   margin-right: 15px;
   padding-top: 0px;
   margin-top: 15px;
}

.navbar-inverse .navbar-nav > li > a {
   color: #fff;
   border-bottom: solid transparent 2px;
   text-shadow: 0.2px 0.4px #000000;
}

   .navbar-inverse .navbar-nav > li > a:hover {
      color: #fff;
      border-bottom: solid 2px;
      -webkit-box-shadow: 0 2px 2px -4px #000;
      -moz-box-shadow: 0 2px 2px -4px #000;
      box-shadow: 0 2px 2px -4px #000;
      text-shadow: 0.2px 0.4px #000000;
   }

.navbar-nav > li {
   background-color: #357dc7;
}

   .navbar-nav > li.active {
      background-color: #000;
   }
/* First and second line in the top */
.navbar {
   background-color: #1a1a1a;
}

/* Form input colors */
input, textarea {
   color: #ccc;
   background-color: #2f2f2f;
}

   input:focus, textarea:focus {
      color: #eee;
   }

.form-control:focus {
   color: #000;
}

select {
   color: #000;
   background-color: #b0b0b0;
}

::-moz-placeholder, textarea::-moz-placeholder, ::-ms-input-placeholder, :-ms-input-placeholder, ::placeholder {
   color: #050505;
}

/* Emphasis for .md tags */
em {
   font-style: normal;
   color: white;
}

/* Second line in the navigation bar "Topic / Blaa / Introduction" */
.breadcrumb {
   background-color: #1c1c1c;
}

/* Hide white lines in bread crumb */
header .navbar {
   border-width: 0 0 0px;
}

.sidetoc {
   border-width: 0 0 0px;
}

.sidefilter {
   border-width: 0 0 0px;
}

/* Affix title, right navigation panel */
/*.affix { color: #f00; }*/
/* Move affix lines a bit */
.affix > ul > li.active > a {
   padding-top: 3px;
   padding-bottom: 6px;
}

.affix ul ul > li > a:before {
   top: 1px;
   left: 5px;
}

.affix ul > li.active > a, .affix ul > li.active > a::before {
   color: #008bf5;
}
/* Move right navigation panel, level2 elements bit further */
.affix ul ul > li {
   padding-left: 7px;
}

   .affix ul ul > li > a {
      padding-left: 18px;
   }

pre {
   border-radius: 0px;
   color: #cccccc;
   border-color: #2f2f2f;
   background-color: #242424;
   padding: 16px;
   margin: 0px 0px 16px;
   font-size: 11px;
}

   /* Horizontal borderlines to code */
   pre code {
      word-wrap: normal;
      white-space: pre;
   }

/* Directory tree lines more condense */
pre { /*line-height:1.3;*/
}

/* Basic text color in pre and code, highlight javascript? */
.hljs {
   color: #bfc6c6;
}

/* Attributes, such as JSON keys: the github.css blue is too dark here */
.hljs-attr {
   color: #bfc6c6;
}

/* Sections, such as headings in Markdown and INI */
.hljs-section {
   color: #407ce0;
}

.hljs-comment {
   color: #5aa74d;
}

.hljs-title {
   color: #55c6af;
}

.hljs-keyword {
   color: #5198cf;
}

.hljs-string {
   color: #d4997e;
}

.hljs-tag {
   color: #eee;
}

/* Background of side panel */
body .toc {
   background-color: #1a1a1a;
}

.sidenav, .fixed_header, .toc, .sidetoc, .sidefilter {
   background-color: #1a1a1a;
}

.docs-search {
   background: black;
}

/* Configure side panel anchors and list items */
.toc .nav > li {
   font-weight: normal;
   font-size: 14px;
}

/* Color for selected line */
.toc .nav > li > a.selectedLine, span.selectedLine {
   background-color: #008bf5;
   color: #1a1a1a;
}

/* Make '>' and 'v' stubs a bit wider */
.expand-stub {
   position: absolute;
   left: -20px;
   top: -2px;
}

/* More margin to leaf nodes, as there is no expand-stub */
.toc .level1 > li > a.leaf {
   margin-left: -20px;
   padding-left: 25px;
}

.toc .level2 > li > a.leaf {
   margin-left: -20px;
   padding-left: 25px;
}

.toc .level3 > li > a.leaf {
   margin-left: -20px;
   padding-left: 25px;
}

.toc .level4 > li > a.leaf {
   margin-left: -20px;
   padding-left: 25px;
}

.toc .level5 > li > a.leaf {
   margin-left: -20px;
   padding-left: 25px;
}

.toc .level6 > li > a.leaf {
   margin-left: -20px;
   padding-left: 25px;
}

.toc .level7 > li > a.leaf {
   margin-left: -20px;
   padding-left: 25px;
}

.toc .level8 > li > a.leaf {
   margin-left: -20px;
   padding-left: 25px;
}

.toc .level9 > li > a.leaf {
   margin-left: -20px;
   padding-left: 25px;
}

.toc ul.nav.level1 {
   margin-left: 15px
}

.toc ul.nav.level2 {
   margin-left: 15px
}

.toc ul.nav.level3 {
   margin-left: 15px
}

.toc ul.nav.level4 {
   margin-left: 15px
}

.toc ul.nav.level5 {
   margin-left: 15px
}
.toc ul.nav.level6 {
   margin-left: 15px
}
.toc ul.nav.level7 {
   margin-left: 15px
}
.toc ul.nav.level8 {
   margin-left: 15px
}
.toc ul.nav.level9 {
   margin-left: 15px
}

.toc .nav > li > a, .expand-stub {
   display: block;
   line-height: 1.3;
   margin-right: 1rem;
   padding-bottom: 6px;
   padding-top: 4px;
   word-wrap: break-word;
   color: #cccccc;
}

.expand-stub {
   color: #ccc;
   right: 0px;
   margin-left: 0px;
   padding-left: 10px;
}

/* Add underlines to breadcrumb */
.breadcrumb > li > a {
   text-decoration: none;
   color: #337ab7;
}

   .breadcrumb > li > a:hover {
      text-decoration: underline;
      color: #008bf5;
   }


/* Add underlines to side toc */
.toc .nav > li > a:hover, .toc .nav > li > a:active {
   text-decoration: underline;
   color: #fff;
}

.toc .nav > li.selectedLine > a:hover, .toc .nav > li.selectedLine > a:active {
   background-color: #008bf5;
   text-decoration: underline;
   color: #000;
}

/* After click */
.toc .nav > li > a:visited {
   color: #eee;
}

.toc .nav > li.selectedLine > a:visited {
   color: #111;
}

/* Angle brackets to side toc */
.toc .nav > li.active > .expand-stub::before, .toc .nav > li.in > .expand-stub::before, .toc .nav > li.in.active > .expand-stub::before, .toc .nav > li.filtered > .expand-stub::before {
   content: "▽";
   font-size: 80%;
}

.toc .nav > li > .expand-stub::before, .toc .nav > li.active > .expand-stub::before {
   content: "▷";
   font-size: 80%;
}

.table {
   border: none;
   border-bottom: 1px solid #2f2f2f;
   border-top: 1px solid #2f2f2f;
   border-collapse: collapse;
   /* Horizontal scrollbar */
   display: block;
   overflow-x: auto;
   white-space: nowrap;
}

/* Add padding to table cells */
.table-condensed > tbody > tr > td, .table-condensed > tbody > tr > th, .table-condensed > tfoot > tr > td, .table-condensed > tfoot > tr > th, .table-condensed > thead > tr > td, .table-condensed > thead > tr > th {
   padding: 12px 16px;
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
   padding: 12px 16px;
}

/* Keep border lines only in top and bottom */
.table tr {
   border: none;
   border-bottom: 1px solid #2f2f2f;
   border-top: 1px solid #2f2f2f;
   border-collapse: collapse;
}

/* Bg color for every other table line to black */
.table-striped > tbody > tr:nth-of-type(2n+1) {
   background-color: #1a1a1a;
}

/* Remove other borders */
.table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > thead > tr > th {
   border: 0px solid #ddd;
}

/* Expand-button, add underline */
/* summary { text-decoration: underline; } */

/* Note */
.NOTE {
    border-color: #004c7d;
    background-color: #003c5d;
    color: #a8d1e7;
}
/* Warnings */
.WARNING {
   border-color: #6b5e4c;
   background-color: #6b5e4c;
   color: #eee;
}
/* Tip */
.TIP {
    border-color: #3d5e55;
    background-color: #1d3e35;
    color: #eee;
}

   /* Lightbulb */
   .TIP h5::before {
      content: url(/styles/lightbulb.svg);
   }

/* Tab panels */
.tabGroup a[role="tab"][aria-selected="true"] {
   color: #cccccc;
   border: none;
   border-top: solid 4px #008bf5;
}

.tabGroup a[role="tab"][aria-selected="false"] {
   color: #777;
   border: none;
   border-top: solid 4px #242424;
}

.tabGroup a[role="tab"]:focus {
   outline: inherit;
}

.tabGroup ul[role="tablist"] > li {
   border: solid 1px #2f2f2f;
   border-bottom: none;
}

.tabGroup section[role="tabpanel"] {
   border: solid 1px #2f2f2f;
   padding-top: 0px;
}

/* Button */
.button {
   font-size: 20px;
   font-family: inherit;
   border-radius: 4px;
   padding: 12px 24px;
   margin: 0 12px;
   box-shadow: 3px 3px 4px rgba(0,0,0,0.3);
   color: #e2efef;
   background: #3e645a;
   cursor: pointer;
}

   .button i.glyphicon {
      font-size: 20px;
   }

a i.glyphicon:hover {
   -webkit-transform: rotate(10deg);
}

a i.glyphicon:focus {
   -webkit-transform: rotate(30deg);
}

a.button:hover {
   color: #fff;
}

a.button:focus {
   color: #f0f0f0;
}

/* Gradient for index page */
body.index {
   padding-top: 75px;
   background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.18, rgb(26,26,26)), color-stop(0.87, rgb(32,47,55)) );
   background: -webkit-linear-gradient(top, #1a1a1a 0%,#30444e 100%); /* Chrome10+,Safari5.1+ */
   background: -moz-linear-gradient(top, #1a1a1a 0%, #30444e 100%); /* FF3.6+ */
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1a1a1a), color-stop(100%,#30444e)); /* Chrome,Safari4+ */
   background: -o-linear-gradient(top, #1a1a1a 0%,#30444e 100%); /* Opera11.10+ */
   background: -ms-linear-gradient(top, #1a1a1a 0%,#30444e 100%); /* IE10+ */
   background: linear-gradient(top, #1a1a1a 0%,#30444e 100%); /* W3C */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a1a1a', endColorstr='#30444e',GradientType=0 ); /* IE6-9 */
   background-repeat: no-repeat;
   background-color: #30444e;
}

html.index {
   height: 100%
}

/* Footer */
.footer {
   background-color: #242424;
   border-width: 0 0 0px;
}
/* Back to top */
.footer, .pull-right a {
   color: #cccccc;
}

/* Code snippets: a copy button at the top right corner, shown on hover or keyboard focus */
.code-block {
  position: relative;
}

.code-block .copy-code {
  position: absolute;
  top: 6px;
  right: 6px;
  padding: 2px 10px;
  font-size: 12px;
  color: #dddddd;
  background-color: #333333e6;
  border: 1px solid #666666;
  border-radius: 4px;
  opacity: 0;
  transition: opacity 0.15s;
  cursor: pointer;
}

.code-block:hover .copy-code,
.code-block .copy-code:focus {
  opacity: 1;
}

.code-block .copy-code:hover {
  background-color: #444444;
}

.code-block .copy-code.done {
  color: #9be29b;
  border-color: #5a9a5a;
}

/* The off-screen text area of copying without the Clipboard API */
.copy-code-buffer {
  position: fixed;
  top: -1000px;
  opacity: 0;
}
