.ds-segmented-control{align-items:center;gap:var(--gap-050);padding:var(--padding-100);border-radius:calc(var(--radius-pill) + var(--padding-100) + var(--border-025));background-color:var(--color-bg-container-primary);border:var(--border-025) solid var(--color-bg-container-border);display:inline-flex;position:relative}.ds-segmented-control__pill{border-radius:var(--radius-pill);background-color:var(--color-action-primary-bg);opacity:0;pointer-events:none;will-change:transform, width;width:0;height:0;transition:transform var(--motion-duration-base) var(--motion-ease-entrance), width var(--motion-duration-base) var(--motion-ease-entrance), background-color var(--motion-duration-base) var(--motion-ease-standard);position:absolute;top:0;left:0}.ds-segmented-control--pill-ready .ds-segmented-control__pill{opacity:1}.ds-segmented-control--pill-ready .ds-segmented-control__segment--active,.ds-segmented-control--pill-ready .ds-segmented-control__segment--active:hover,.ds-segmented-control--pill-ready.ds-segmented-control--neutral .ds-segmented-control__segment--active,.ds-segmented-control--pill-ready.ds-segmented-control--neutral .ds-segmented-control__segment--active:hover{background-color:#0000}.ds-segmented-control--pill-ready:has(.ds-segmented-control__segment--active:hover) .ds-segmented-control__pill{background-color:var(--color-action-primary-bg-hover)}.ds-segmented-control--neutral .ds-segmented-control__pill{background-color:var(--color-action-neutral-bg)}.ds-segmented-control--pill-ready.ds-segmented-control--neutral:has(.ds-segmented-control__segment--active:hover) .ds-segmented-control__pill{background-color:var(--color-action-neutral-bg-hover)}.ds-segmented-control--full-width{width:100%}.ds-segmented-control--full-width .ds-segmented-control__segment{flex:1}.ds-segmented-control__segment{justify-content:center;align-items:center;gap:var(--gap-200);padding:var(--padding-200) var(--padding-400);border-radius:var(--radius-pill);cursor:pointer;transition:background-color var(--motion-duration-base) var(--motion-ease-standard), color var(--motion-duration-base) var(--motion-ease-standard);white-space:nowrap;z-index:1;box-sizing:border-box;height:calc(var(--control-height-default) - 2 * var(--padding-100) - 2 * var(--border-025));background-color:#0000;border:none;padding-block:0;display:inline-flex;position:relative}.ds-segmented-control__label{font-family:var(--font-paragraph-emphasis-family);font-size:var(--font-paragraph-emphasis-size);font-weight:var(--font-paragraph-emphasis-weight);line-height:var(--font-paragraph-emphasis-line-height);letter-spacing:var(--font-paragraph-emphasis-letter-spacing);color:var(--color-text-secondary);transition:color var(--motion-duration-base) var(--motion-ease-standard)}.ds-segmented-control__icon{--icon-size:var(--icon-size-600);color:var(--color-text-secondary);transition:color var(--motion-duration-base) var(--motion-ease-standard);flex-shrink:0;line-height:1}.ds-segmented-control__segment:not(.ds-segmented-control__segment--active):not(.ds-segmented-control__segment--disabled):hover{background-color:var(--color-action-passive-bg-hover)}.ds-segmented-control__segment--active{background-color:var(--color-action-primary-bg)}.ds-segmented-control__segment--active .ds-segmented-control__label,.ds-segmented-control__segment--active .ds-segmented-control__icon{color:var(--color-action-primary-text)}.ds-segmented-control__segment--active:hover{background-color:var(--color-action-primary-bg-hover)}.ds-segmented-control--neutral .ds-segmented-control__segment--active{background-color:var(--color-action-neutral-bg)}.ds-segmented-control--neutral .ds-segmented-control__segment--active .ds-segmented-control__label,.ds-segmented-control--neutral .ds-segmented-control__segment--active .ds-segmented-control__icon{color:var(--color-action-neutral-text)}.ds-segmented-control--neutral .ds-segmented-control__segment--active:hover{background-color:var(--color-action-neutral-bg-hover)}.ds-segmented-control__segment--disabled{opacity:.4;cursor:not-allowed}.ds-segmented-control__segment:focus-visible{outline:2px solid var(--color-action-primary-bg);outline-offset:2px}.ds-segmented-control--compact .ds-segmented-control__segment{padding:var(--padding-150) var(--padding-300);height:calc(var(--control-height-compact) - 2 * var(--padding-100) - 2 * var(--border-025));padding-block:0}.ds-segmented-control--compact .ds-segmented-control__label{font-size:var(--font-paragraph-sm-emphasis-size);line-height:var(--font-paragraph-sm-emphasis-line-height);letter-spacing:var(--font-paragraph-sm-emphasis-letter-spacing)}.ds-segmented-control--compact .ds-segmented-control__icon{--icon-size:var(--icon-size-500)}.ds-segmented-control__label--tip{z-index:var(--layer-floating);padding:var(--padding-150) var(--padding-200);border-radius:var(--radius-100);border:var(--border-025) solid var(--color-bg-container-border);background-color:var(--color-bg-page-primary);color:var(--color-text-primary);box-shadow:var(--shadow-floating);font-family:var(--font-paragraph-sm-family);font-size:var(--font-paragraph-sm-size);font-weight:var(--font-paragraph-sm-weight);line-height:var(--font-paragraph-sm-line-height);letter-spacing:var(--font-paragraph-sm-letter-spacing);white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(calc(-1 * var(--gap-100)));transition:opacity var(--motion-duration-fast) var(--motion-ease-standard), transform var(--motion-duration-fast) var(--motion-ease-standard);position:absolute}.ds-segmented-control .ds-segmented-control__segment .ds-segmented-control__label--tip{color:var(--color-text-primary)}.ds-segmented-control__segment:hover .ds-segmented-control__label--tip,.ds-segmented-control__segment:focus-visible .ds-segmented-control__label--tip{opacity:1;transition-delay:var(--motion-duration-slow);transform:none}.ds-segmented-control__label--tip[data-side=top]{transform:translateY(var(--gap-100))}.ds-segmented-control--icons .ds-segmented-control__segment{padding-inline:var(--padding-200)}@media (prefers-reduced-motion:reduce){.ds-segmented-control__label--tip{transition:none}}.ds-segmented-control--cycle{background:0 0;border:none;padding:0;display:inline-flex}.ds-segmented-control--cycle .ds-circular-button{background-color:var(--color-bg-container-primary);border:var(--border-025) solid var(--color-bg-container-border);border-radius:calc(var(--radius-pill) + var(--padding-100))}.ds-segmented-control--cycle .ds-circular-button:not(.ds-circular-button--disabled):hover{background-color:var(--color-bg-container-secondary)}.ds-segmented-control--cycle .ds-circular-button .ds-circular-button__icon,.ds-segmented-control--cycle .ds-circular-button:not(.ds-circular-button--disabled):hover .ds-circular-button__icon,.ds-segmented-control--cycle .ds-circular-button:not(.ds-circular-button--disabled):active .ds-circular-button__icon{color:var(--color-action-icon-default)}
