.radio-years{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 0.5rem;

}
.per-year-items .years-checkbox-container {
  transform:translateX(0.8rem);
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding-top: 0.5rem;
}

.filter-group:has(#only-future:checked) .years-checkbox-container
  input[type="checkbox"],
.filter-group:has(#only-future:checked) .years-checkbox-container
  label.container {
  opacity: 0.5;
  filter: grayscale(1);
  pointer-events: none;
  transition-property: opacity, filter;
  transition-duration: 200ms;
  transition-timing-function: ease-in-out;
}

.filter-group:has(#per-year:checked) .years-checkbox-container
  input[type="checkbox"],
.filter-group:has(#per-year:checked) .years-checkbox-container
  label.container {
  opacity: 1;
  filter: grayscale(0);
  pointer-events: auto;
  transition-property: opacity, filter;
  transition-duration: 200ms;
  transition-timing-function: ease-in-out;
}