/**********
 * Switch *
 **********/
switch {
  font-size: 1px;
  min-width: 40px;
  min-height: 25px;
  background-color: transparent;
  background-size: 40px 24px;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: if($variant == 'light', 
                      -gtk-scaled(url("../assets/switch-off.svg"),url("../assets/switch-off.svg")),
                      -gtk-scaled(url("../assets/switch-off-dark.svg"),url("../assets/switch-off-dark.svg"))
                    );

  &:disabled {
    background-image: if($variant == 'light', 
                        -gtk-scaled(url("../assets/switch-insensitive.svg"),url("../assets/switch-insensitive.svg")),
                        -gtk-scaled(url("../assets/switch-insensitive-dark.svg"),url("../assets/switch-insensitive-dark.svg"))
                      );
    slider {
      background-image: if($variant == 'light', 
                        -gtk-scaled(url("../assets/switch-slider-insensitive.svg"),url("../assets/switch-slider-insensitive@2.png")),
                        -gtk-scaled(url("../assets/switch-slider-insensitive-dark.svg"),url("../assets/switch-slider-insensitive-dark@2.png"))
                      );
    }
  }

  &, & slider {
    outline-color: transparent;
    color: transparent;
    border: none;
    box-shadow: none; 
  }
  
  &:checked {
    background-image: -gtk-scaled(url("../assets/switch-on.svg"),url("../assets/switch-on.svg"));
    slider {
      background-image: -gtk-scaled(url("../assets/switch-slider-on.svg"),url("../assets/switch-slider-on@2.png"));
    }
    &:disabled {
      background-image: -gtk-scaled(url("../assets/switch-on-insensitive.svg"),url("../assets/switch-on-insensitive.svg"));
      slider {
        background-image: -gtk-scaled(url("../assets/switch-slider-on-insensitive.svg"),url("../assets/switch-slider-on-insensitive@2.png"));
      }
    }
  }

  // Handle
  slider {
    min-width: 1px;
    min-height: 1px;
    background-repeat: no-repeat;
    background-position: left center;
    background-color: transparent;
    background-image: if($variant == 'light', 
                        -gtk-scaled(url("../assets/switch-slider-off.svg"),url("../assets/switch-slider-off@2.png")),
                        -gtk-scaled(url("../assets/switch-slider-off-dark.svg"),url("../assets/switch-slider-off-dark@2.png"))
                      );
  }
}
