@layer themeSwitcher.shadow {

  :host {
    --theme-switcher-hitbox-padding: var(--spacing) ;
    --theme-switcher-icon-opacity: 0.6;
    --theme-switcher-icon-opacity-active: 1;
    --theme-switcher-transition: opacity var(--duration) var(--easing);
  }

  .hitbox {
    display: inline-block;
    cursor: pointer;
    padding: var(--theme-switcher-hitbox-padding);
    margin: 0px;
  }
  .hitbox ui-icon {
    margin: 0px;
    transition: var(--theme-switcher-transition);
    opacity: var(--theme-switcher-icon-opacity);
  }
  .hitbox:hover ui-icon {
    opacity: var(--theme-switcher-icon-opacity-active);
  }
}