@layer shared{.toggle{--toggle-size:var(--main-spacing);--padding:var(--spacing-5xs);--width:calc((var(--toggle-size) + var(--padding)) * 2);--bg-color:var(--background-secondary);--bg-hover:var(--background-secondary-hover);--bg-selected:var(--background-focus-secondary);--bg-disabled:var(--background-disabled);--toggle-color:var(--background-icon-primary);--toggle-color-disabled:var(--background-icon-disabled);position:relative;display:block;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:var(--width);height:auto;padding:var(--padding);border-radius:var(--border-radius-round);background:var(--bg-color);margin:0;transition:background-color var(--main-transition),translate var(--main-transition)}.toggle:not(:disabled){cursor:pointer}.toggle:hover{background:var(--bg-hover)}.toggle:before{content:"";display:block;width:var(--toggle-size);aspect-ratio:1;border-radius:var(--border-radius-round);background:var(--toggle-color);transition:translate .2s}.toggle:checked{background-color:var(--bg-selected)}.toggle:checked:before{translate:var(--toggle-size)}.toggle:disabled{background:var(--bg-disabled)}.toggle:disabled:before{background:var(--toggle-color-disabled)}}