div#root {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.status-exact-score .badge {
  color: white;
  background-color: #008000;
}

.status-correct-result .badge {
  color: black;
  background-color: orange;
}

.status-one-score-correct .badge {
  color: white;
  background-color: #05a;
}

.status-wrong .badge {
  color: white;
  background-color: #e60000;
}

.status-unknown .badge {
  color: white;
  background-color: #95a5a6;
}

.player-me {
  font-weight: bold;
}

.player-non-human {
  font-style: italic;
}

.result-win {
  background-color: green;
}

.result-loss {
  background-color: red;
}

a.logo img.normal {
  display: inline;
}

a.logo img.hover {
  display: none;
}

a.logo:hover img.normal {
  display: none;
}

a.logo:hover img.hover {
  display: inline;
}

a.logo {
  color: white;
  font-size: 1.4rem;
  font-weight: bold;
}

a.logo:hover {
  color: #18bc9c;
  text-decoration: none;
}

.table-info a {
  color: #fff;
}

.table-info:hover a {
  color: #212529;
}

ul.rounds {
  padding-inline-start: 1rem;
  list-style-type: none;
}

footer {
  padding-bottom: env(safe-area-inset-bottom);
}

/* STICKY STUFF FOR BREAKDOWN PAGE */

.table-scrollable {
  max-width: 100vw;
  max-height: 100vh;
  overflow: scroll;
  position: relative;
}

.table-scrollable thead th {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background-color: white;
}

.table-scrollable thead th:first-child {
  left: 0;
  z-index: 2;
  background-color: white;
}

.table-scrollable tbody th {
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  z-index: 1;
  font-weight: normal;
}

.table-scrollable .table-striped thead th {
  background: white;
}

.table-scrollable .table-striped tbody tr:nth-child(even) th {
  background: white;
}

.table-scrollable .table-striped tbody tr:nth-child(odd) th {
  background: #ecf0f1;
}

.table-scrollable .table-striped tbody tr.table-info th {
  background: #3498db;
}
