.switch-component[data-v-0acbd334]{--default-switch-size:32px;--default-switch-container-width:52px;--_bg-color:var(--switch-bg-color,transparent);--_border-color:var( --switch-border-color,var(--default-form-control-border-color) );--_dot-bg-color:var( --switch-dot-bg-color,var(--default-form-control-border-color) );align-items:center;display:var(--switch-display,inline-grid);gap:var(--switch-gap,.5rem);grid-template-columns:var(--switch-columns);margin-block:var(--switch-margin-block);position:relative;width:-moz-fit-content;width:fit-content}.switch-component.disabled .switch-container[data-v-0acbd334]{opacity:.4;pointer-events:none}.switch-component[data-v-0acbd334]:has(input:checked){--_bg-color:var( --switch-bg-color-checked,var( --default-form-control-checked-bg-color,var(--color-primary,cyan) ) );--_border-color:var( --switch-border-color-checked,var( --default-form-control-checked-bg-color,var(--color-primary,cyan) ) );--_dot-bg-color:var(--switch-dot-bg-color-checked,#fff);--_dot-size:24px;--_dot-translate:calc(var(--switch-container-width, var(--default-switch-container-width)) - var(--switch-size, var(--default-switch-size)) + 2px)}.switch-component[data-v-0acbd334]:has(input:focus-visible){--_focus-color:var(--focus-color,var(--color-primary,#4d90fe))}.switch-container[data-v-0acbd334]{grid-area:area;-webkit-tap-highlight-color:transparent;align-items:center;background-color:var(--_bg-color);border:2px solid var(--_border-color,var(--input-border-color));border-radius:999px;cursor:pointer;display:flex;flex-shrink:0;height:var(--switch-size,var(--default-switch-size));outline-color:var(--_focus-color,transparent);outline-offset:var(--outline-offset,2px);outline-style:var(--outline-style,solid);outline-width:var(--outline-width,2px);pointer-events:none;position:relative;transition:all .3s ease;width:var(--switch-container-width,var(--default-switch-container-width))}.switch-container .dot[data-v-0acbd334]{background-color:var(--_dot-bg-color,var(--input-border-color));border-radius:999px;height:var(--_dot-size,16px);transition:all 256ms ease;translate:var(--_dot-translate,6px) 0;width:var(--_dot-size,16px)}.wrapper[data-v-0acbd334]{display:inline-grid;grid-template-areas:"area"}.input[data-v-0acbd334]{grid-area:area;opacity:0}.input[disabled][data-v-0acbd334]{pointer-events:none}label[data-v-0acbd334]{color:var(--input-label-color,var(--color-text));cursor:pointer;display:var(--switch-label-display,block);flex-basis:100%;font-size:var( --switch-label-font-size,var(--input-label-font-size,.875rem) );font-weight:var(--switch-label-font-weight,var(--input-label-font-weight))}.slider-component[data-v-9dbd8ff6]{align-items:center;cursor:pointer;display:flex;height:48px;min-width:var(--slider-min-width,200px);position:relative;width:100%}.slider-component.disabled[data-v-9dbd8ff6]{opacity:.5;pointer-events:none}.slider-component[data-v-9dbd8ff6]:hover{--_ripple-opacity:.08;--_scale:1}.slider-component[data-v-9dbd8ff6]:has(input:focus){--_ripple-opacity:.16;--_scale:1}input[data-v-9dbd8ff6]{-webkit-appearance:none;cursor:pointer;height:100%;left:0;margin:0;opacity:0;padding:0;position:absolute;top:0;width:100%;z-index:3}.track[data-v-9dbd8ff6]{background:#0000001a;border-radius:2px;height:4px;left:0;overflow:visible;position:absolute;right:0}.track .track__active[data-v-9dbd8ff6]{height:100%;position:absolute;width:100%}.track .track__active_fill[data-v-9dbd8ff6]{background-color:var(--slider-color);height:100%;transform-origin:left;transition:transform .1s cubic-bezier(.4,0,.2,1);width:100%}.tick-marks[data-v-9dbd8ff6]{height:100%;left:0;position:absolute;top:0;width:100%}.tick-marks .tick-mark[data-v-9dbd8ff6]{background:#00000080;border-radius:50%;height:2px;position:absolute;top:50%;transform:translate(-50%,-50%);width:2px}.tick-marks .tick-mark.active[data-v-9dbd8ff6]{background:#fff}#thumb[data-v-9dbd8ff6]{height:var(--thumb-size);pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:left .1s cubic-bezier(.4,0,.2,1);width:var(--thumb-size);z-index:2}#thumb .thumb-knob[data-v-9dbd8ff6]{background-color:var(--slider-color);border-radius:50%;box-shadow:0 2px 4px #0003;height:100%;width:100%}#thumb .thumb-knob[data-v-9dbd8ff6]:before{background:var(--slider-color);border-radius:50%;content:"";height:40px;left:50%;opacity:var(--_ripple-opacity,0);position:absolute;top:50%;transform:translate(-50%,-50%);width:40px}.value-indicator-container[data-v-9dbd8ff6]{bottom:100%;left:50%;margin-bottom:12px;position:absolute;transform:translate(-50%);transform-origin:bottom;transition:transform .15s cubic-bezier(.4,0,.2,1)}.value-indicator[data-v-9dbd8ff6]{background-color:var(--slider-color);border-radius:4px;color:#fff;font-size:.875rem;font-weight:500;padding:4px 8px;scale:var(--_scale,1);transition:scale .15s cubic-bezier(.4,0,.2,1);white-space:nowrap}.value-indicator[data-v-9dbd8ff6]:after{border:6px solid transparent;border-top:6px solid var(--slider-color);content:"";left:50%;position:absolute;top:100%;transform:translate(-50%)}.component-properties[data-v-94528121]{--_radius:12px;--color-primary:light-dark(#0e4dca,#9ec0f9);--default-form-control-border-radius:999px;--default-form-control-height:40px;--default-form-control-bg-color:var(--card-bg-color);--input-width:100px;--input-margin-block:0;--slider-track-bg-color:light-dark(#bae3ff,#00416c);--slider-min-width:60px;--switch-color-bg-active:#0e4dca;--switch-dot-bg-color-checked:light-dark(#fff,#00416c);--switch-margin-block:0;overflow-x:auto}ul[data-v-94528121]{display:grid;gap:4px}ul li[data-v-94528121]{align-items:center;background-color:light-dark(var(--color-grey-96),var(--color-grey-30));border-radius:4px;display:grid;gap:1rem;grid-template-columns:auto 1fr auto;min-height:64px;padding-inline:1.25rem 1.5rem;width:100%}ul li[data-v-94528121]:first-child{border-top-left-radius:var(--_radius);border-top-right-radius:var(--_radius)}ul li[data-v-94528121]:last-child{border-bottom-left-radius:var(--_radius);border-bottom-right-radius:var(--_radius)}ul li .label[data-v-94528121]{display:grid}ul li .label .name[data-v-94528121]{font-weight:700}ul li .label .description[data-v-94528121]{font-size:.875rem;opacity:.7}ul li .control[data-v-94528121]{align-items:center;display:flex;justify-content:flex-end}.attr[data-v-94528121]{background-color:var(--grey-neutral-alt);border:var(--border);border-radius:4px;padding:.25rem}.slots li[data-v-94528121]{grid-template-columns:1fr auto}.preview-component-element[data-v-5de962ce]{border-radius:12px;margin-block-end:2rem;width:100%}.preview-component-element.center[data-v-5de962ce]{align-items:center;display:flex;justify-content:center}.preview-component-code[data-v-fe98dd67]{background-color:var(--color-grey-0);border-radius:12px;color:#d4d4d4;font-family:monospace;min-height:56px;overflow:auto;padding:1rem 3rem 1rem 1rem;position:relative}.preview-component-code .name[data-v-fe98dd67]{color:#4ec9b0}.preview-component-code .value[data-v-fe98dd67]{color:#ce9178}.preview-component-code .attr[data-v-fe98dd67]{color:#9cdbfe}.preview-component-code [data-v-fe98dd67] .html{color:#579bd6}.preview-component-code [data-v-fe98dd67] .method{color:#dcdcaa}.preview-component-code .m-l-1[data-v-fe98dd67]{margin-left:1rem}.preview-component-code [data-v-fe98dd67] .m-l-2{margin-left:2rem}.preview-component-code [data-v-fe98dd67] .m-l-3{margin-left:3rem}.property[data-v-fe98dd67]{display:flex}.preview-component[data-v-39455554]{--h3-font-size:1.25rem;--h3-margin-block:2rem 1rem;--card-border-radius:24px;--demo-header-height:48px;--_padding:2rem;background-color:var(--card-bg-color);border-radius:var(--card-border-radius);margin-block:2rem;padding:var(--_padding);position:relative;width:100%}