/* Switches */

.toggle-switch {
  width: 44px;
  height: 26px;
  background-size: contain;
  background-image: url("assets/toggle-off.svg");
  background-color: transparent;
  padding: 0;
  margin: 0;

  &:checked {
    background-image: url("assets/toggle-on.svg");
    background-color: transparent;
    color: transparent;

    &:hover {
      background-color: transparent;
      color: transparent;
    }

    .handle {
      background: none;
    }
  }

  @if $submenu_style == 'false' and $variant == 'dark' {
    .popup-sub-menu &,
    .quick-toggle-menu & {
      background-image: url("assets/menu-toggle-off.svg") !important;

      &:checked { background-image: url("assets/toggle-on.svg") !important; }
    }
  }

  StIcon {
    icon-size: 0;
  }

  .handle {
    margin: 0;
    width: 0;
    height: 0;
    background: none;
    box-shadow: none;
    transition-duration: none;
  }
}
