body.dark {
  font-family: var(--font-family);
  background: var(--background-dark);
  color: var(--text-light);
}

body.dark .timeline-container {
  border-bottom: 1px solid var(--gray-dark);
  border-right: 1px solid var(--gray-dark);
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0.06)), to(var(--background-dark)));
}

body.dark .timeline-years {
  border-top-color: var(--gray-dark);
}

body.dark .timeline-year-label-dash::before {
  background-color: var(--gray-dark);
}


body.dark .timeline-item span {
  color: var(--text-light);
}

body.dark .timeline-bar, body.dark .timeline-barrtl {
  background-color: var(--secondary-color);
}

body.dark .timeline-bar:hover, body.dark .timeline-barrtl:hover {
  background-color: #9370DB;
  transition: var(--transition-speed);
  cursor: pointer;
}

body.dark .timeline-year-span {
  color: #d3d3d3;
}

body.dark .timeline-bar.ongoing, body.dark .timeline-barrtl.ongoing {
  background: linear-gradient(to right, var(--secondary-color), #fff);
}
body.dark .direction-rtl .timeline-bar.ongoing, body.dark .direction-rtl .timeline-barrtl.ongoing {
  background: linear-gradient(to right, #fff, var(--secondary-color));
}


body.dark .timeline-popup {
  background-color: var(--popup-bg-dark);
  border: 1px solid var(--border-color-dark);
  color: var(--text-light);
  -webkit-box-shadow: 0px 1px 0px 0px #FA5560, 0px 0px 0px 1px #B14BF4, 0px 1px 0px 0px var(--primary-color);
  box-shadow: 0px 1px 0px 0px #FA5560, 0px 0px 0px 1px #B14BF4, 0px 1px 0px 0px var(--primary-color);
}


body.dark .timeline-close-btn {
  color: #fff;
}

body.dark .highlight {
  background-color: #9370DB;
}


body.dark .highlight-ongoing {
  background: linear-gradient(to right, var(--secondary-color), #b3b3b3);
}
body.dark .small-ticks{
  background-color: var(--gray-dark);;
}
body.dark .current-year .timeline-year-span::after {
    border-top-color: var(--secondary-color);
}

body.dark .current-year .timeline-year-span:hover::before {
    background-color: var(--secondary-color);
    color: var(--text-white);
}
