.tx-segmented-slider{--tx-segmented-slider-height: 32px;--tx-segmented-slider-track-height: 4px;--tx-segmented-slider-dot-size: 16px;--tx-segmented-slider-dot-active-size: 20px;position:relative;width:100%;min-height:var(--tx-segmented-slider-height);padding:8px 0}.tx-segmented-slider__track{position:relative;height:var(--tx-segmented-slider-track-height);background:color-mix(in srgb,var(--tx-text-color-primary, #303133) 12%,transparent);border-radius:999px;margin:calc((var(--tx-segmented-slider-dot-size) - var(--tx-segmented-slider-track-height))/2) 0}.tx-segmented-slider__progress{position:absolute;left:0;top:0;height:100%;background:linear-gradient(90deg,color-mix(in srgb,var(--tx-color-primary, #409eff) 62%,transparent),var(--tx-color-primary, #409eff));border-radius:999px;transition:width .32s var(--tx-ease-out-strong, cubic-bezier(.23, 1, .32, 1)),height .32s var(--tx-ease-out-strong, cubic-bezier(.23, 1, .32, 1))}.tx-segmented-slider__segment{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:absolute;top:50%;transform:translate(-50%,-50%);padding:0;border:0;background:transparent;color:inherit;cursor:pointer;font:inherit;outline:none}.tx-segmented-slider__segment:disabled{cursor:not-allowed}.tx-segmented-slider__segment:focus-visible .tx-segmented-slider__dot{box-shadow:0 0 0 3px color-mix(in srgb,var(--tx-color-primary, #409eff) 35%,transparent)}.tx-segmented-slider__segment:hover:not(:disabled):not(.is-active) .tx-segmented-slider__dot{border-color:color-mix(in srgb,var(--tx-color-primary, #409eff) 55%,transparent);transform:scale(1.12)}.tx-segmented-slider__segment:hover:not(:disabled):not(.is-active) .tx-segmented-slider__label{color:var(--tx-text-color-primary, #303133)}.tx-segmented-slider__segment.is-active .tx-segmented-slider__dot{width:var(--tx-segmented-slider-dot-active-size);height:var(--tx-segmented-slider-dot-active-size);background:var(--tx-color-primary, #409eff);border-color:var(--tx-color-primary, #409eff);box-shadow:2px 4px 12px color-mix(in srgb,var(--tx-color-primary, #409eff) 35%,transparent)}.tx-segmented-slider__segment.is-active .tx-segmented-slider__label{color:var(--tx-color-primary, #409eff);font-weight:600}.tx-segmented-slider__segment.is-completed .tx-segmented-slider__dot{background:var(--tx-color-primary, #409eff);border-color:var(--tx-color-primary, #409eff)}.tx-segmented-slider__dot{display:block;box-sizing:border-box;width:var(--tx-segmented-slider-dot-size);height:var(--tx-segmented-slider-dot-size);border-radius:50%;background:var(--tx-bg-color, #fff);border:2px solid var(--tx-border-color, #dcdfe6);transition:width .2s var(--tx-ease-out-strong, cubic-bezier(.23, 1, .32, 1)),height .2s var(--tx-ease-out-strong, cubic-bezier(.23, 1, .32, 1)),transform .2s var(--tx-ease-out-strong, cubic-bezier(.23, 1, .32, 1)),background-color .2s ease,border-color .2s ease,box-shadow .2s ease;margin:0 auto;position:relative;z-index:2}.tx-segmented-slider__label{position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%);font-size:12px;color:var(--tx-text-color-secondary, #909399);white-space:nowrap;transition:color .2s ease,font-weight .2s ease;line-height:1.2}@media(prefers-reduced-motion:reduce){.tx-segmented-slider .tx-segmented-slider__dot,.tx-segmented-slider .tx-segmented-slider__label,.tx-segmented-slider .tx-segmented-slider__progress{transition:none}}.tx-segmented-slider.is-disabled{opacity:.6;pointer-events:none}.tx-segmented-slider.is-disabled .tx-segmented-slider__segment{cursor:not-allowed}.tx-segmented-slider.is-disabled .tx-segmented-slider__progress{background:var(--tx-text-color-placeholder, #a8abb2)}.tx-segmented-slider.is-vertical{width:var(--tx-segmented-slider-height);min-height:200px;padding:0 8px}.tx-segmented-slider.is-vertical .tx-segmented-slider__track{width:var(--tx-segmented-slider-track-height);height:100%;margin:0 calc((var(--tx-segmented-slider-dot-size) - var(--tx-segmented-slider-track-height))/2)}.tx-segmented-slider.is-vertical .tx-segmented-slider__progress{width:100%;height:var(--height, 0);top:auto;bottom:0}.tx-segmented-slider.is-vertical .tx-segmented-slider__segment{left:50%;top:auto;bottom:var(--bottom, 0);transform:translate(-50%,50%)}.tx-segmented-slider.is-vertical .tx-segmented-slider__label{top:50%;left:calc(100% + 8px);transform:translateY(-50%)}
