.calendar a:hover, .list dd:hover {
  background-color: var(--list-hover-bg);
}

.calendar a,
.list a {
  text-decoration: none;
}
.calendar a,
.list a,
.calendar a:hover,
.list a:hover {
  color: var(--bs-body-color);
}

.filler {
  background: var(--filler-background-color);
}

.filler>* {
  opacity: .5;
}

.calendar {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.calendar.events li {
  min-height: 8rem;
  outline: 1px solid var(--list-separator-color);
}

.calendar.events li a,
.calendar.events li .no-trails {
  font-size: clamp(0.5rem, 2.5vw, 1rem);
}

@media (max-width: 767px) {
  .calendar.events li a .one-line {
    text-overflow: unset;
  }
}

.frosted-background {
  -webkit-backdrop-filter: var(--table-header-backdrop-filter);
  backdrop-filter: var(--table-header-backdrop-filter);
  background: var(--table-header-background-color);
  border-bottom: 1px solid var(--table-header-border-color);
}

.list dd {
  border-bottom: 1px solid var(--list-separator-color);
  margin: 0;
  overflow: hidden;
}

.list dt {
  padding: .5rem .5rem .5rem .75rem;
  position: sticky;
  top: 0px;
}

.one-line {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-muted {
  color: var(--text-muted-color) !important;
}

:root {
  --bs-list-group-action-hover-bg: var(--list-hover-bg);
  --filler-background-color: #ddd;
  --list-hover-bg: rgba(0, 0, 0, .03);
  --list-separator-color: rgba(0, 0, 0, 0.1);
  --table-header-backdrop-filter: saturate(180%) blur(20px);
  --table-header-background-color: rgba(255, 255, 255, .75);
  --table-header-border-color: rgba(0, 0, 0, 0.2);
  --text-muted-color: #6c757d;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bs-body-bg: #000;
    --bs-body-color: #eee;
    --bs-link-color: #6ea8fe;
    --bs-link-hover-color: #0d6efd;
    --filler-background-color: #222;
    --link-hover-color: rgba(255, 255, 255, .9);
    --list-hover-bg: rgba(255, 255, 255, .075);
    --list-separator-color: rgba(255, 255, 255, .1);
    --table-header-background-color: rgba(0, 0, 0, 0.75);
    --table-header-border-color: rgba(255, 255, 255, .2);
    --text-muted-color: #bbb;
  }
  .list-group {
    --bs-list-group-action-active-bg: #111;
    --bs-list-group-action-active-color: var(--bs-body-color);
    --bs-list-group-action-hover-bg: var(--list-hover-bg);
    --bs-list-group-action-hover-color: var(--bs-body-color);
    --bs-list-group-bg: var(--bs-body-bg);
    --bs-list-group-border-color: rgba(255, 255, 255, 0.125);
    --bs-list-group-color: var(--bs-body-color);
  }
  .modal {
    --bs-modal-bg: #111;
    --bs-modal-border-color: rgba(255, 255, 255, .25);
    --bs-modal-header-border-color: var(--bs-modal-border-color);
  }
  .modal-header .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
  }
  .navbar {
    --bs-navbar-brand-color: var(--bs-body-color);
    --bs-navbar-brand-hover-color: var(--bs-body-color);
  }
  .nav-link {
    --bs-nav-link-color: var(--bs-body-color);
    --bs-nav-link-hover-color: var(--bs-body-color);
  }
}