/* vim: set tabstop=2 shiftwidth=2 expandtab smarttab: */

:root {
  color-scheme: dark;
}

body {
  background-color: #406561;
  color: #c1bbb3;
  /* rgb is same as color above */
  -webkit-tap-highlight-color: rgba(193, 187, 179, 0.05);
}

/* More distinctive body background color when we might possibly see it on the
   left/right of the main content (otherwise, leave it as the theme color in
   case it peeks out at the top or bottom, e.g. behind christmas lights) */
@media screen and (min-width: 700px) {
  body {
    background-color: #18423d;
  }
}

th {
  color: #d3cfc9;
}

a, .fakelink {
  color: #61caff;
}

a:hover, .fakelink:hover {
  text-shadow: 0 0 1px rgba(255, 255, 255, .6);
}

hr {
  border: 0;
  border-top: 1px solid #484e51;
}

.header-columns, .content-columns .left-column, footer {
  /* #406561 is also set as the theme color in a meta tag at the top of the template when in dark mode */
  background-color: #406561;
  color: #e8e6e3;
}

.content-columns, .sticky-header {
  background-color: #1b1d1e;
}

.content-columns .left-column hr {
  border: 0;
  border-top: 1px solid #e8e6e3;
}

th, td {
  border-color: #484e51;
}

tr.highlighted > td, tr.highlighted > th,
.highlighted-evens > tr:nth-child(even) > td,
.highlighted-evens > tr:nth-child(even) > th,
.highlighted-odds > tr:nth-child(odd) > td,
.highlighted-odds > tr:nth-child(odd) > th
{
  background-color: rgba(24, 66, 61, 0.33);
}

td.slightly-highlighted {
  background-color: rgba(80, 126, 121, .13);
}

nav li.selected > h3 > a, nav li.selected > a {
  color: #b9e6e0;
}

tr.gf-onseen > td, tr.gf-onseen > th,
tr.yellow-highlighted > td, tr.yellow-highlighted > th,
span.yellow-highlighted {
  /* I'm still not really satisfied with this color...
     The recommendation from dark reader is #484000 which also isn't great... */
  background-color: #554c00 !important;
}

.subtag {
  background-color: rgba(255,255,255,0.2);
  color: #fff;
}

.money-green {
  color: #72ff72;
}

.money-red {
  color: #ff1a1a;
}

.money-grey {
  color: #988f81;
}

.money-orange {
  color: #ffae1a;
}

.money-black {
  color: #e8e6e3;
}

.if-light-mode {
  display: none;
}