@use '../base/common/base-variables' as *;

$switch-wrapper-width: 48px !default;
$switch-wrapper-height: 24px !default;
$switch-inner-width: 100% !default;
$switch-inner-height: 100% !default;
$switch-handle-top: 1.5px !default;
$switch-handle-left: 6px !default;
$switch-handle-margin: auto 0 !default;
$switch-inner-top: 0 !default;
$switch-inner-left: 0 !default;
$switch-off-text-indent: 18px !default;
$switch-on-text-indent: -16px !default;
$switch-handle-active: 100% !default;
$switch-handle-margin-left: -22px !default;
$switch-active-on-opacity: 1 !default;
$switch-off-opacity: 1 !default;
$switch-handle-height: 12px !default;
$switch-handle-width: 12px !default;
$switch-transition: all .2s ease-in-out .1s !default;
$switch-inner-transition: all .2s ease-in-out !default;
$switch-handle-transition: all .2s linear !default;
$switch-active-on-position-left: 0 !default;
$switch-off-active-left: 100% !default;
$switch-on-position-left: -100% !default;
$switch-on-position-left-rtl: 0 !default;
$switch-off-position-left: 0 !default;
$switch-off-position-left-rtl: -100% !default;
$switch-on-rtl: 100% !default;
$switch-off-rtl: 0 !default;
$switch-handle-radius: $radius-full !default;
$switch-handle-bottom: 2px !default;
$switch-border-radius: $radius-20 !default;
$switch-ripple-height: 32px !default;
$switch-ripple-width: 32px !default;
$switch-ripple-left: -6px !default;
$switch-ripple-top: -6.5px !default;
$switch-small-ripple-height: 24px !default;
$switch-small-ripple-left: -3px !default;
$switch-small-ripple-top: -5px !default;
$switch-small-ripple-width: 24px !default;
$switch-small-wrapper-height: 20px !default;
$switch-small-wrapper-width: 46px !default;
$switch-small-handle-width: 10px !default;
$switch-small-handle-height: 10px !default;
$switch-small-handle-active-left: 100% !default;
$switch-small-handle-margin-left: -19px !default;
$switch-small-handle-active-left-rtl: 22px !default;
$switch-small-font-size: $text-xxs !default;
$small-switch-text-indent: 14px !default;
$switch-small-on-rtl: 100% !default;
$switch-small-off-rtl: 0 !default;
$switch-small-on-position-left-rtl: 0 !default;
$switch-small-off-position-left-rtl: -100% !default;
$switch-small-on-text-indent: -11px !default;
$switch-small-off-text-indent: 14px !default;
$switch-bigger-wrapper-height: 32px !default;
$switch-bigger-wrapper-width: 66px !default;
$switch-bigger-handle-width: 16px !default;
$switch-bigger-handle-height: 16px !default;
$switch-bigger-handle-active-left: 100% !default;
$switch-bigger-handle-margin-left: -29px !default;
$switch-bigger-handle-active-left-rtl: 32px !default;
$switch-bigger-font-size: $text-sm !default;
$switch-bigger-on-text-indent: -15px !default;
$switch-bigger-off-text-indent: 18px !default;
$switch-bigger-on-rtl: 100% !default;
$switch-bigger-off-rtl: 0 !default;
$switch-bigger-on-position-left-rtl: 0 !default;
$switch-bigger-off-position-left-rtl: -100% !default;
$switch-bigger-handle-top: 2px !default;
$switch-bigger-handle-left: 6px !default;
$switch-bigger-ripple-height: 40px !default;
$switch-bigger-ripple-left: -7px !default;
$switch-bigger-ripple-top: -8px !default;
$switch-bigger-ripple-width: 40px !default;
$switch-focused-outline: none !default;
$switch-focused-outline-offset: initial !default;
$switch-focused-outline-active: none !default;
$switch-bigger-small-wrapper-height: 28px !default;
$switch-bigger-small-wrapper-width: 60px !default;
$switch-bigger-small-handle-width: 16px !default;
$switch-bigger-small-handle-height: 16px !default;
$switch-bigger-small-handle-active-left: 100% !default;
$switch-bigger-small-handle-margin-left: -25px !default;
$switch-bigger-small-handle-active-left-rtl: 30px !default;
$switch-bigger-small-font-size: $text-xs !default;
$bigger-small-switch-text-indent: 14px !default;
$switch-bigger-small-on-rtl: 100% !default;
$switch-bigger-small-off-rtl: 0 !default;
$switch-bigger-small-on-position-left-rtl: 0 !default;
$switch-bigger-small-off-position-left-rtl: -100% !default;
$switch-bigger-small-on-text-indent: -14px !default;
$switch-bigger-small-off-text-indent: 14px !default;
$switch-bigger-small-handle-to: 1px !default;
$switch-bigger-small-handle-left: 6px !default;
$switch-bigger-small-ripple-height: 36px !default;
$switch-bigger-small-ripple-left: -7px !default;
$switch-bigger-small-ripple-top: -8px !default;
$switch-bigger-small-ripple-width: 36px !default;
$switch-on-off-disabled-bg-color-opacity: 1 !default;
$switch-active-handle-bg: rgba($content-bg-color) !default;
$switch-inner-border-style: 2px solid rgba($border) !default;
$switch-inner-active: rgba($primary) !default;
$switch-inner-active-bg: rgba($primary) !default;
$switch-focus-inner-box-shadow: none !default;
$switch-inner-active-border-color: rgba($primary) !default;
$switch-active-background: transparent !default;
$switch-handle-shadow: none !default;
$switch-handle-shadow-disabled: none !default;
$switch-off-bg-color: rgba($series-1) !default;
$switch-inner-bg: rgba($content-bg-color) !default;
$switch-handle-bg-color: rgba($border) !default;
$switch-hover-bg-color: $content-bg-color-alt3 !default;
$switch-font-family: $font-family !default;
$switch-font-size: $text-xs !default;
$switch-inner-hover-bg-color: rgba($primary) !default;
$switch-inner-hover-border-color: rgba($primary) !default;
$switch-inner-on-font-color: rgba($primary-text-color) !default;
$switch-inner-off-font-color: rgba($content-text-color) !default;
$switch-inner-focus-border: $content-bg-color-alt3 !default;
$switch-on-hover-bg-color: rgba($primary) !default;
$switch-on-off-disabled-bg-color: $content-bg-color-alt1 !default;
$switch-handle-disabled-bg-color: rgba($white) !default;
$switch-handle-disabled-border-color: rgba($content-text-color, .12) !default;
$switch-handle-on-disabled-bg-color: rgba($content-bg-color) !default;
$switch-border-disabled-bg-color: rgba($content-text-color, .12) !default;
$switch-disabled-font-color: $content-text-color-disabled !default;
$switch-on-off-hover-bg-color: rgba($content-bg-color) !default;
$switch-inner-focus-bg-color: rgba($primary) !default;
$switch-inner-focus-off-bg: rgba($content-bg-color) !default;
$switch-focus-border-color-active: rgba($primary) !default;
$switch-hover-border: rgba($border) !default;
$switch-hover-active-border: rgba($primary) !default;
$switch-handle-hover-bg-color: rgba($content-bg-color) !default;
$switch-small-disabled-rtl-active-bg-color: transparent !default;
$switch-on-bg-color: rgba($primary) !default;
$switch-checked-ripple-bg-color: rgba($primary, .08) !default;
$switch-ripple-bg-color: rgba($content-text-color-alt1, .08) !default;
$switch-on-disabled-bg-color: rgba($content-text-color, .12) !default;
$switch-inner-hover-on-font-color: rgba($primary-text-color) !default;
$switch-handle-off-hover-bg-color: rgba($border) !default;

// Material3
$switch-small-handle-left: 5px !default;
$switch-small-handle-top: 2px !default;
$switch-handle-active-height: 18px !default;
$switch-handle-active-width: 18px !default;
$switch-handle-small-active-height: 14px !default;
$switch-handle-small-active-width: 14px !default;
$switch-handle-bigger-active-height: 24px !default;
$switch-handle-bigger-active-width: 24px !default;
$switch-handle-bigger-small-active-height: 20px !default;
$switch-handle-bigger-small-active-width: 20px !default;
$switch-off-ripple-top: -10px !default;
$switch-off-ripple-left: -10px !default;
$switch-bigger-off-ripple-top: -12px !default;
$switch-bigger-off-ripple-left: -12px !default;
$switch-bigger-small-off-ripple-left: -10px !default;
$switch-bigger-small-off-ripple-top: -10px !default;
$switch-small-off-ripple-top: -7px !default;
$switch-small-off-ripple-left: -7px !default;
$switch-ripple-border-radius: $radius-full !default;
$switch-height: 1px !default;
$switch-ripple-container-height: 52px !default;
$switch-width: 1px !default;
$switch-ripple-container-width: 52px !default;
$switch-ripple-container-bottom: -9px !default;
$switch-ripple-container-left: -17px !default;
$switch-ripple-container-top: -17px !default;
$switch-ripple-element-border-radius: $radius-full !default;
