.theme-toggle {
  background: transparent;
  padding: 0;

  & svg {
    cursor: pointer;
  }

  &:hover,
  & svg:hover {
    stroke-width: var(--stroke-width-bold);
  }

  & > .light svg { stroke: var(--sun) !important; }
  & > .dark svg { stroke: var(--moon) !important; }

  & > .light ,
  & > .dark {
    display: none;
  }
}

.theme__dark {
  & .theme-toggle > .light {
    display: inline;
  }

  & .theme-toggle > .dark {
    display: none;
  }
}

.theme__light {
  & .theme-toggle > .light {
    display: none;
  }

  & .theme-toggle > .dark {
    display: inline;
  }
}