theme-toggle {
  width: var(--sizing-svg-base);
  height: var(--sizing-svg-base);
  display: flex;
}

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

  & svg {
    cursor: pointer;
  }

  & > .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;
  }
}