body {
  max-width: 55rem;
}

#content {
  height: 100%;
}

h1 {
  color: #bd93f9;
}

ul.nav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #44475a;
}

li.nav {
  float: left;
}

li.nav a {
  display: block;
  color: #bd93f9;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li.nav a:hover {
  background-color: #6272a4;
}

li.active {
  background-color: #6272a4;
}

li.login {
  float: right;
}

footer {
  position: sticky;
  top: 100vh;
}

a.paging-icon {
  color: #50fa7b;
}

div.pagination {
  text-align: center;
}

a,
a:visited,
a:hover {
  color: #8be9fd;
}

p.error {
  color: #ff5555;
}

.table-head {
  font-size: 1.5rem;
  font-weight: bold;
  font-style: italic;
}

.centered-text {
  text-align: center;
}

div.searchopts {
  display: grid;
  grid-template-columns: max-content 1fr;
  grid-gap: 5px;
  width: 100%;
  align-items: center;
}

div.searchopts label {
  text-align: right;
}

div.searchopts label::after {
  content: ":";
}

.selected {
  background-color: #50fa7b;
}

.fixed-width {
  width: 125px;
}

.expired {
  color: #ff5555;
}

.expired {
  color: #ff5555 !important;
}

strong.enabled {
  color: #50fa7b;
}

strong.disabled {
  color: #ff5555;
}

.apexcharts-tooltip {
  background: #282a36 !important;
}

.apexcharts-tooltip-title {
  font-weight: bold;
  font-size: 14px;
  color: #f8f8f2;
  background: #282a36 !important;
}