html{--switch-button_bg-color:var(--color-grey-200);--switch-button_bg-disabled:var(--color-grey-200);--switch-button_bg-color-active:var(--color-green-400);--switch-button_min-width:3rem;--switch-button_height:1.5rem;--switch-button_switch-ball-bg-color:var(--color-white);--switch-button_switch-ball-position-inactive:.125rem;--switch-button_switch-ball-position-active: calc(100% - 1.375rem) ;--switch-button_switch-ball-position-animation:left .3s ease;--switch-button_switch-ball-dimension:1.25rem;--switch-button_switch-ball-focus:2px solid #3b82f6;--element-border-radius-round:999px;--switch-button_fixed-gap:1rem;--switch-button_max-gap:space-between;--switch-button_label-color:var(--color-dark-600)}.switch-button{align-items:center;display:flex;gap:var(--switch-button_fixed-gap)}.switch-button__max-gap{justify-content:var(--switch-button_max-gap)}.switch-button__label{color:var(--switch-button_label-color)}.switch-button__control{background-color:var(--switch-button_bg-color);cursor:pointer;display:block;height:var(--switch-button_height);min-width:var(--switch-button_min-width);position:relative}.switch-button__control.switch-button--disabled{background-color:var(--switch-button_bg-disabled);cursor:not-allowed}.switch-button__switch_ball{background-color:var(--switch-button_switch-ball-bg-color);border-radius:var(--element-border-radius-round);bottom:0;height:var(--switch-button_switch-ball-dimension);left:var(--switch-button_switch-ball-position-inactive);margin:auto 0;position:absolute;top:0;transition:var(--switch-button_switch-ball-position-animation);width:var(--switch-button_switch-ball-dimension)}.switch-button__control--is-active:not(.switch-button--disabled){background-color:var(--switch-button_bg-color-active)}.switch-button__control--round{border-radius:var(--element-border-radius-round)}.switch-button__control--is-active .switch-button__switch_ball{left:var(--switch-button_switch-ball-position-active)}.switch-button--disabled.switch-button__control--is-active .switch-button__switch_ball{left:var(--switch-button_switch-ball-position-inactive)}.switch-button input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:0;margin:0;opacity:0;position:absolute;width:0;z-index:var(--z-index-behind)}.switch-button input[type=checkbox]:focus-visible+.switch-button__switch_ball{outline:var(--switch-button_switch-ball-focus)}