:root,.vp--dark-mode,.vp--wonder-theme,.vp--legacy-theme{--vp-component-toggle-motion-easing: var(--vp-semantic-motion-easing-expressive-ease-in-out);--vp-component-toggle-motion-duration: var(--vp-semantic-motion-duration-quick);--vp-component-toggle-color-border-checked: var(--vp-core-color-transparent);--vp-component-toggle-spacing-small-track-unchecked-inline-start: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-small-track-unchecked-inline-end: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-small-track-unchecked-block-start: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-small-track-unchecked-block-end: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-small-track-checked-inline-start: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-small-track-checked-inline-end: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-small-track-checked-block-start: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-small-track-checked-block-end: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-medium-track-unchecked-inline-start: var(--vp-semantic-spacing-xs);--vp-component-toggle-spacing-medium-track-unchecked-inline-end: var(--vp-semantic-spacing-xs);--vp-component-toggle-spacing-medium-track-unchecked-block-start: var(--vp-semantic-spacing-xs);--vp-component-toggle-spacing-medium-track-unchecked-block-end: var(--vp-semantic-spacing-xs);--vp-component-toggle-spacing-medium-track-checked-inline-start: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-medium-track-checked-inline-end: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-medium-track-checked-block-start: var(--vp-semantic-spacing-2xs);--vp-component-toggle-spacing-medium-track-checked-block-end: var(--vp-semantic-spacing-2xs);--vp-component-toggle-sizing-small-track-width: var(--vp-semantic-sizing-3xl);--vp-component-toggle-sizing-small-track-height: var(--vp-semantic-sizing-xl);--vp-component-toggle-sizing-small-icon-width: var(--vp-semantic-sizing-m);--vp-component-toggle-sizing-small-icon-height: var(--vp-semantic-sizing-m);--vp-component-toggle-sizing-small-handle-unchecked-width: var(--vp-semantic-sizing-m);--vp-component-toggle-sizing-small-handle-unchecked-height: var(--vp-semantic-sizing-m);--vp-component-toggle-sizing-small-handle-checked-width: var(--vp-semantic-sizing-m);--vp-component-toggle-sizing-small-handle-checked-height: var(--vp-semantic-sizing-m);--vp-component-toggle-sizing-small-halo-width: var(--vp-semantic-sizing-2xl);--vp-component-toggle-sizing-small-halo-height: var(--vp-semantic-sizing-2xl);--vp-component-toggle-sizing-min-height: var(--vp-semantic-sizing-accessibility-touch-size);--vp-component-toggle-sizing-medium-track-width: var(--vp-semantic-sizing-5xl);--vp-component-toggle-sizing-medium-track-height: var(--vp-semantic-sizing-2xl);--vp-component-toggle-sizing-medium-icon-width: var(--vp-semantic-sizing-xl);--vp-component-toggle-sizing-medium-icon-height: var(--vp-semantic-sizing-xl);--vp-component-toggle-sizing-medium-handle-unchecked-width: var(--vp-semantic-sizing-m);--vp-component-toggle-sizing-medium-handle-unchecked-height: var(--vp-semantic-sizing-m);--vp-component-toggle-sizing-medium-handle-checked-width: var(--vp-semantic-sizing-xl);--vp-component-toggle-sizing-medium-handle-checked-height: var(--vp-semantic-sizing-xl);--vp-component-toggle-sizing-medium-halo-width: var(--vp-semantic-sizing-3xl);--vp-component-toggle-sizing-medium-halo-height: var(--vp-semantic-sizing-3xl);--vp-component-toggle-opacity-disabled: var(--vp-semantic-opacity-s);--vp-component-toggle-color-track-unchecked: var(--vp-semantic-color-container-quiet);--vp-component-toggle-color-track-checked: var(--vp-semantic-color-container-brand);--vp-component-toggle-color-handle-unchecked: var(--vp-semantic-color-content-quiet);--vp-component-toggle-color-handle-checked: var(--vp-semantic-color-content-on-brand-neutral);--vp-component-toggle-color-border-unchecked: var(--vp-semantic-color-border-neutral);--vp-component-toggle-border-width-track-unchecked: var(--vp-semantic-border-width-s);--vp-component-toggle-border-width-track-checked: var(--vp-semantic-border-width-none);--vp-component-toggle-border-radius-container: var(--vp-semantic-border-radius-full);--vp-component-toggle-color-halo-unchecked-hover: var(--vp-semantic-color-alpha-quiet-s);--vp-component-toggle-color-halo-unchecked-active: var(--vp-semantic-color-alpha-quiet-m);--vp-component-toggle-color-halo-checked-hover: var(--vp-semantic-color-alpha-brand-s);--vp-component-toggle-color-halo-checked-active: var(--vp-semantic-color-alpha-brand-m)}.vp-toggle{--toggle-transition:var(--vp-semantic-motion-duration-quick) var(--vp-component-toggle-motion-easing);--toggle-disabled-opacity:var(--vp-component-toggle-opacity-disabled);--touch-height:var(--vp-component-toggle-sizing-min-height);--track-background:var(--vp-component-toggle-color-track-unchecked);--track-border-radius:var(--vp-component-toggle-border-radius-container);--toggle-border-width:var(--vp-component-toggle-border-width-track-unchecked);--track-border:var(--toggle-border-width) solid var(--vp-component-toggle-color-border-unchecked);--track-width:var(--vp-component-toggle-sizing-medium-track-width);--track-height:var(--vp-component-toggle-sizing-medium-track-height);--container-spacing-block-start:var(--vp-component-toggle-spacing-medium-track-unchecked-block-start);--container-spacing-block-end:var(--vp-component-toggle-spacing-medium-track-unchecked-block-end);--container-spacing-inline-start:var(--vp-component-toggle-spacing-medium-track-unchecked-inline-start);--container-spacing-inline-end:var(--vp-component-toggle-spacing-medium-track-unchecked-inline-end);--checked-icon:url("data:image/svg+xml;utf8,<svg width='20' height='21' viewBox='0 0 20 21' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M3.48861 9.66681L8.2225 14.4007L16.5367 6.08646' stroke='black' stroke-width='2'/></svg>");--checked-ball-mask:var(--checked-icon) no-repeat 50% 50%,linear-gradient(#fff,#fff);--checked-icon-width:var(--vp-component-toggle-sizing-medium-icon-width);--checked-icon-height:var(--vp-component-toggle-sizing-medium-icon-height);--checked-icon-size:var(--checked-icon-width) var(--checked-icon-height);--handle-background:var(--vp-component-toggle-color-handle-unchecked);--handle-width:var(--vp-component-toggle-sizing-medium-handle-unchecked-width);--handle-height:var(--vp-component-toggle-sizing-medium-handle-unchecked-height);--halo-width:var(--vp-component-toggle-sizing-medium-halo-width);--halo-height:var(--vp-component-toggle-sizing-medium-halo-height);--halo-color:transparent;--halo-color-checked-active:var(--vp-component-toggle-color-halo-checked-active);--halo-color-checked-hover:var(--vp-component-toggle-color-halo-checked-hover);--halo-color-unchecked-active:var(--vp-component-toggle-color-halo-unchecked-active);--halo-color-unchecked-hover:var(--vp-component-toggle-color-halo-unchecked-hover);--halo-offset:calc(var(--halo-width)/2 - var(--handle-width)/2 - var(--container-spacing-inline-start))}.vp-toggle:checked{--track-background:var(--vp-component-toggle-color-track-checked);--handle-background:var(--vp-component-toggle-color-handle-checked);--toggle-border-width:var(--vp-component-toggle-border-width-track-checked);--track-border:var(--toggle-border-width) solid var(--vp-component-toggle-color-border-checked);--handle-width:var(--vp-component-toggle-sizing-medium-handle-checked-width);--handle-height:var(--vp-component-toggle-sizing-medium-handle-checked-height);--container-spacing-block-start:var(--vp-component-toggle-spacing-medium-track-checked-block-start);--container-spacing-block-end:var(--vp-component-toggle-spacing-medium-track-checked-block-end);--container-spacing-inline-start:var(--vp-component-toggle-spacing-medium-track-checked-inline-start);--container-spacing-inline-end:var(--vp-component-toggle-spacing-medium-track-checked-inline-end)}.vp-toggle--small{--track-width:var(--vp-component-toggle-sizing-small-track-width);--track-height:var(--vp-component-toggle-sizing-small-track-height);--checked-icon-width:var(--vp-component-toggle-sizing-small-icon-width);--checked-icon-height:var(--vp-component-toggle-sizing-small-icon-height);--handle-width:var(--vp-component-toggle-sizing-small-handle-unchecked-width);--handle-height:var(--vp-component-toggle-sizing-small-handle-unchecked-height);--container-spacing-block-start:var(--vp-component-toggle-spacing-small-track-unchecked-block-start);--container-spacing-block-end:var(--vp-component-toggle-spacing-small-track-unchecked-block-end);--container-spacing-inline-start:var(--vp-component-toggle-spacing-small-track-unchecked-inline-start);--container-spacing-inline-end:var(--vp-component-toggle-spacing-small-track-unchecked-inline-end);--halo-width:var(--vp-component-toggle-sizing-small-halo-width);--halo-height:var(--vp-component-toggle-sizing-small-halo-height)}.vp-toggle--small:checked{--handle-width:var(--vp-component-toggle-sizing-small-handle-checked-width);--handle-height:var(--vp-component-toggle-sizing-small-handle-checked-height);--container-spacing-block-start:var(--vp-component-toggle-spacing-small-track-checked-block-start);--container-spacing-block-end:var(--vp-component-toggle-spacing-small-track-checked-block-end);--container-spacing-inline-start:var(--vp-component-toggle-spacing-small-track-checked-inline-start);--container-spacing-inline-end:var(--vp-component-toggle-spacing-small-track-checked-inline-end)}.vp-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--track-background);border:var(--track-border);border-radius:var(--track-border-radius);box-sizing:border-box;cursor:pointer;flex-grow:0;flex-shrink:0;height:var(--track-height);margin:0;padding:0;position:relative;transition:background-color var(--toggle-transition);width:var(--track-width)}.vp-toggle:before{background-image:radial-gradient(circle at center,var(--halo-color) 0,var(--halo-color) 70%,transparent 70%,transparent 100%);background-position-x:0;background-position-y:center;background-repeat:no-repeat;background-size:var(--halo-width) var(--halo-height);content:"";height:max(var(--touch-height),var(--halo-height));left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:background-position-x var(--toggle-transition);width:calc(100% + var(--halo-offset)*2)}.vp-toggle:after{background-color:var(--handle-background);border-radius:100%;content:"";height:var(--handle-height);top:0;right:0;bottom:0;left:0;margin-block:var(--container-spacing-block-start) var(--container-spacing-block-end);margin-inline:var(--container-spacing-inline-start) var(--container-spacing-inline-end);position:absolute;top:calc(var(--toggle-border-width)*-1);transition:transform var(--toggle-transition),width var(--toggle-transition),height var(--toggle-transition),margin var(--toggle-transition);width:var(--handle-width);z-index:1}.vp-toggle:checked:before{background-position-x:100%}.vp-toggle:checked:after{-webkit-mask-composite:destination-out;-webkit-mask-size:var(--checked-icon-size);-webkit-mask:var(--checked-ball-mask);mask:var(--checked-ball-mask);-webkit-mask-composite:xor;mask-composite:exclude;mask-size:var(--checked-icon-size);transform:translate(calc(var(--track-width) - var(--handle-width) - var(--container-spacing-inline-start) - var(--container-spacing-inline-end)))}.vp-toggle[data-hover]{--halo-color:var(--halo-color-unchecked-hover)}.vp-toggle[data-hover][data-checked]{--halo-color:var(--halo-color-checked-hover)}.vp-toggle[data-active]{--halo-color:var(--halo-color-unchecked-active)}.vp-toggle[data-active][data-checked]{--halo-color:var(--halo-color-checked-active)}.vp-toggle[data-disabled]{cursor:default;opacity:var(--toggle-disabled-opacity)}