@layer ds-reset,ds-foundation,ds-subatoms,ds-atoms,ds-molecules,ds-organisms,ds-templates,ds-landing;@layer ds-molecules{.chip--skin-default{--border-color: var(--control-colors-border-default);--start-icon-color: var(--control-colors-start-icon-default);--text-color: var(--control-colors-text-default);--end-icon-color: var(--control-colors-end-icon-default);--bg-color: var(--control-colors-button-background-default)}@media(hover:hover)and (pointer:fine){.chip--skin-default:hover{--border-color: var(--control-colors-border-action);--start-icon-color: var(--control-colors-start-icon-action);--text-color: var(--control-colors-text-action);--end-icon-color: var(--control-colors-end-icon-action);--bg-color: var(--control-colors-button-background-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-default:active{--border-color: var(--control-colors-border-action);--start-icon-color: var(--control-colors-start-icon-action);--text-color: var(--control-colors-text-action);--end-icon-color: var(--control-colors-end-icon-action);--bg-color: var(--control-colors-button-background-action)}}.chip--skin-default-active{--border-color: var(--control-colors-button-background-active);--start-icon-color: var(--control-colors-start-icon-active);--text-color: var(--control-colors-text-active);--end-icon-color: var(--control-colors-end-icon-active);--bg-color: var(--control-colors-button-background-active)}@media(hover:hover)and (pointer:fine){.chip--skin-default-active:hover{--border-color: var(--control-colors-button-background-active-action);--start-icon-color: var(--control-colors-start-icon-active-action);--text-color: var(--control-colors-text-active-action);--end-icon-color: var(--control-colors-end-icon-active-action);--bg-color: var(--control-colors-button-background-active-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-default-active:active{--border-color: var(--control-colors-button-background-active-action);--start-icon-color: var(--control-colors-start-icon-active-action);--text-color: var(--control-colors-text-active-action);--end-icon-color: var(--control-colors-end-icon-active-action);--bg-color: var(--control-colors-button-background-active-action)}}.chip--skin-primary{--border-color: var(--primary-colors-base-default);--start-icon-color: var(--primary-colors-text-default);--text-color: var(--primary-colors-text-default);--end-icon-color: var(--primary-colors-text-default);--bg-color: var(--primary-colors-base-default)}@media(hover:hover)and (pointer:fine){.chip--skin-primary:hover{--border-color: var(--primary-colors-base-action);--start-icon-color: var(--primary-colors-text-action);--text-color: var(--primary-colors-text-action);--end-icon-color: var(--primary-colors-text-action);--bg-color: var(--primary-colors-base-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-primary:active{--border-color: var(--primary-colors-base-action);--start-icon-color: var(--primary-colors-text-action);--text-color: var(--primary-colors-text-action);--end-icon-color: var(--primary-colors-text-action);--bg-color: var(--primary-colors-base-action)}}.chip--skin-primary-active{--border-color: var(--primary-colors-base-active);--start-icon-color: var(--primary-colors-text-active);--text-color: var(--primary-colors-text-active);--end-icon-color: var(--primary-colors-text-active);--bg-color: var(--primary-colors-base-active)}@media(hover:hover)and (pointer:fine){.chip--skin-primary-active:hover{--border-color: var(--primary-colors-base-active-action);--start-icon-color: var(--primary-colors-text-active-action);--text-color: var(--primary-colors-text-active-action);--end-icon-color: var(--primary-colors-text-active-action);--bg-color: var(--primary-colors-base-active-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-primary-active:active{--border-color: var(--primary-colors-base-active-action);--start-icon-color: var(--primary-colors-text-active-action);--text-color: var(--primary-colors-text-active-action);--end-icon-color: var(--primary-colors-text-active-action);--bg-color: var(--primary-colors-base-active-action)}}.chip--skin-secondary{--border-color: var(--primary-colors-base-default);--start-icon-color: var(--primary-colors-text-default);--text-color: var(--primary-colors-text-default);--end-icon-color: var(--primary-colors-text-default);--bg-color: var(--primary-colors-base-default)}@media(hover:hover)and (pointer:fine){.chip--skin-secondary:hover{--border-color: var(--primary-colors-base-action);--start-icon-color: var(--primary-colors-text-action);--text-color: var(--primary-colors-text-action);--end-icon-color: var(--primary-colors-text-action);--bg-color: var(--primary-colors-base-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-secondary:active{--border-color: var(--primary-colors-base-action);--start-icon-color: var(--primary-colors-text-action);--text-color: var(--primary-colors-text-action);--end-icon-color: var(--primary-colors-text-action);--bg-color: var(--primary-colors-base-action)}}.chip--skin-secondary-active{--border-color: var(--primary-colors-base-active);--start-icon-color: var(--primary-colors-text-active);--text-color: var(--primary-colors-text-active);--end-icon-color: var(--primary-colors-text-active);--bg-color: var(--primary-colors-base-active)}@media(hover:hover)and (pointer:fine){.chip--skin-secondary-active:hover{--border-color: var(--primary-colors-base-active-action);--start-icon-color: var(--primary-colors-text-active-action);--text-color: var(--primary-colors-text-active-action);--end-icon-color: var(--primary-colors-text-active-action);--bg-color: var(--primary-colors-base-active-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-secondary-active:active{--border-color: var(--primary-colors-base-active-action);--start-icon-color: var(--primary-colors-text-active-action);--text-color: var(--primary-colors-text-active-action);--end-icon-color: var(--primary-colors-text-active-action);--bg-color: var(--primary-colors-base-active-action)}}.chip--skin-tertiary{--border-color: var(--neutral-colors-base-default);--start-icon-color: var(--neutral-colors-text-default);--text-color: var(--neutral-colors-text-default);--end-icon-color: var(--neutral-colors-text-default);--bg-color: var(--neutral-colors-base-default)}@media(hover:hover)and (pointer:fine){.chip--skin-tertiary:hover{--border-color: var(--neutral-colors-base-action);--start-icon-color: var(--neutral-colors-text-action);--text-color: var(--neutral-colors-text-action);--end-icon-color: var(--neutral-colors-text-action);--bg-color: var(--neutral-colors-base-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-tertiary:active{--border-color: var(--neutral-colors-base-action);--start-icon-color: var(--neutral-colors-text-action);--text-color: var(--neutral-colors-text-action);--end-icon-color: var(--neutral-colors-text-action);--bg-color: var(--neutral-colors-base-action)}}.chip--skin-tertiary-active{--border-color: var(--neutral-colors-base-active);--start-icon-color: var(--neutral-colors-text-active);--text-color: var(--neutral-colors-text-active);--end-icon-color: var(--neutral-colors-text-active);--bg-color: var(--neutral-colors-base-active)}@media(hover:hover)and (pointer:fine){.chip--skin-tertiary-active:hover{--border-color: var(--neutral-colors-base-active-action);--start-icon-color: var(--neutral-colors-text-active-action);--text-color: var(--neutral-colors-text-active-action);--end-icon-color: var(--neutral-colors-text-active-action);--bg-color: var(--neutral-colors-base-active-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-tertiary-active:active{--border-color: var(--neutral-colors-base-active-action);--start-icon-color: var(--neutral-colors-text-active-action);--text-color: var(--neutral-colors-text-active-action);--end-icon-color: var(--neutral-colors-text-active-action);--bg-color: var(--neutral-colors-base-active-action)}}.chip--skin-positive{--border-color: var(--positive-colors-base-default);--start-icon-color: var(--positive-colors-text-default);--text-color: var(--positive-colors-text-default);--end-icon-color: var(--positive-colors-text-default);--bg-color: var(--positive-colors-base-default)}@media(hover:hover)and (pointer:fine){.chip--skin-positive:hover{--border-color: var(--positive-colors-base-action);--start-icon-color: var(--positive-colors-text-action);--text-color: var(--positive-colors-text-action);--end-icon-color: var(--positive-colors-text-action);--bg-color: var(--positive-colors-base-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-positive:active{--border-color: var(--positive-colors-base-action);--start-icon-color: var(--positive-colors-text-action);--text-color: var(--positive-colors-text-action);--end-icon-color: var(--positive-colors-text-action);--bg-color: var(--positive-colors-base-action)}}.chip--skin-positive-active{--border-color: var(--positive-colors-base-active);--start-icon-color: var(--positive-colors-text-active);--text-color: var(--positive-colors-text-active);--end-icon-color: var(--positive-colors-text-active);--bg-color: var(--positive-colors-base-active)}@media(hover:hover)and (pointer:fine){.chip--skin-positive-active:hover{--border-color: var(--positive-colors-base-active-action);--start-icon-color: var(--positive-colors-text-active-action);--text-color: var(--positive-colors-text-active-action);--end-icon-color: var(--positive-colors-text-active-action);--bg-color: var(--positive-colors-base-active-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-positive-active:active{--border-color: var(--positive-colors-base-active-action);--start-icon-color: var(--positive-colors-text-active-action);--text-color: var(--positive-colors-text-active-action);--end-icon-color: var(--positive-colors-text-active-action);--bg-color: var(--positive-colors-base-active-action)}}.chip--skin-negative{--border-color: var(--negative-colors-base-default);--start-icon-color: var(--negative-colors-text-default);--text-color: var(--negative-colors-text-default);--end-icon-color: var(--negative-colors-text-default);--bg-color: var(--negative-colors-base-default)}@media(hover:hover)and (pointer:fine){.chip--skin-negative:hover{--border-color: var(--negative-colors-base-action);--start-icon-color: var(--negative-colors-text-action);--text-color: var(--negative-colors-text-action);--end-icon-color: var(--negative-colors-text-action);--bg-color: var(--negative-colors-base-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-negative:active{--border-color: var(--negative-colors-base-action);--start-icon-color: var(--negative-colors-text-action);--text-color: var(--negative-colors-text-action);--end-icon-color: var(--negative-colors-text-action);--bg-color: var(--negative-colors-base-action)}}.chip--skin-negative-active{--border-color: var(--negative-colors-base-active);--start-icon-color: var(--negative-colors-text-active);--text-color: var(--negative-colors-text-active);--end-icon-color: var(--negative-colors-text-active);--bg-color: var(--negative-colors-base-active)}@media(hover:hover)and (pointer:fine){.chip--skin-negative-active:hover{--border-color: var(--negative-colors-base-active-action);--start-icon-color: var(--negative-colors-text-active-action);--text-color: var(--negative-colors-text-active-action);--end-icon-color: var(--negative-colors-text-active-action);--bg-color: var(--negative-colors-base-active-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-negative-active:active{--border-color: var(--negative-colors-base-active-action);--start-icon-color: var(--negative-colors-text-active-action);--text-color: var(--negative-colors-text-active-action);--end-icon-color: var(--negative-colors-text-active-action);--bg-color: var(--negative-colors-base-active-action)}}.chip--skin-success{--border-color: var(--success-colors-base-default);--start-icon-color: var(--success-colors-text-default);--text-color: var(--success-colors-text-default);--end-icon-color: var(--success-colors-text-default);--bg-color: var(--success-colors-base-default)}@media(hover:hover)and (pointer:fine){.chip--skin-success:hover{--border-color: var(--success-colors-base-action);--start-icon-color: var(--success-colors-text-action);--text-color: var(--success-colors-text-action);--end-icon-color: var(--success-colors-text-action);--bg-color: var(--success-colors-base-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-success:active{--border-color: var(--success-colors-base-action);--start-icon-color: var(--success-colors-text-action);--text-color: var(--success-colors-text-action);--end-icon-color: var(--success-colors-text-action);--bg-color: var(--success-colors-base-action)}}.chip--skin-success-active{--border-color: var(--success-colors-base-active);--start-icon-color: var(--success-colors-text-active);--text-color: var(--success-colors-text-active);--end-icon-color: var(--success-colors-text-active);--bg-color: var(--success-colors-base-active)}@media(hover:hover)and (pointer:fine){.chip--skin-success-active:hover{--border-color: var(--success-colors-base-active-action);--start-icon-color: var(--success-colors-text-active-action);--text-color: var(--success-colors-text-active-action);--end-icon-color: var(--success-colors-text-active-action);--bg-color: var(--success-colors-base-active-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-success-active:active{--border-color: var(--success-colors-base-active-action);--start-icon-color: var(--success-colors-text-active-action);--text-color: var(--success-colors-text-active-action);--end-icon-color: var(--success-colors-text-active-action);--bg-color: var(--success-colors-base-active-action)}}.chip--skin-warning{--border-color: var(--warning-colors-base-default);--start-icon-color: var(--warning-colors-text-default);--text-color: var(--warning-colors-text-default);--end-icon-color: var(--warning-colors-text-default);--bg-color: var(--warning-colors-base-default)}@media(hover:hover)and (pointer:fine){.chip--skin-warning:hover{--border-color: var(--warning-colors-base-action);--start-icon-color: var(--warning-colors-text-action);--text-color: var(--warning-colors-text-action);--end-icon-color: var(--warning-colors-text-action);--bg-color: var(--warning-colors-base-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-warning:active{--border-color: var(--warning-colors-base-action);--start-icon-color: var(--warning-colors-text-action);--text-color: var(--warning-colors-text-action);--end-icon-color: var(--warning-colors-text-action);--bg-color: var(--warning-colors-base-action)}}.chip--skin-warning-active{--border-color: var(--warning-colors-base-active);--start-icon-color: var(--warning-colors-text-active);--text-color: var(--warning-colors-text-active);--end-icon-color: var(--warning-colors-text-active);--bg-color: var(--warning-colors-base-active)}@media(hover:hover)and (pointer:fine){.chip--skin-warning-active:hover{--border-color: var(--warning-colors-base-active-action);--start-icon-color: var(--warning-colors-text-active-action);--text-color: var(--warning-colors-text-active-action);--end-icon-color: var(--warning-colors-text-active-action);--bg-color: var(--warning-colors-base-active-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-warning-active:active{--border-color: var(--warning-colors-base-active-action);--start-icon-color: var(--warning-colors-text-active-action);--text-color: var(--warning-colors-text-active-action);--end-icon-color: var(--warning-colors-text-active-action);--bg-color: var(--warning-colors-base-active-action)}}.chip--skin-error{--border-color: var(--error-colors-base-default);--start-icon-color: var(--error-colors-text-default);--text-color: var(--error-colors-text-default);--end-icon-color: var(--error-colors-text-default);--bg-color: var(--error-colors-base-default)}@media(hover:hover)and (pointer:fine){.chip--skin-error:hover{--border-color: var(--error-colors-base-action);--start-icon-color: var(--error-colors-text-action);--text-color: var(--error-colors-text-action);--end-icon-color: var(--error-colors-text-action);--bg-color: var(--error-colors-base-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-error:active{--border-color: var(--error-colors-base-action);--start-icon-color: var(--error-colors-text-action);--text-color: var(--error-colors-text-action);--end-icon-color: var(--error-colors-text-action);--bg-color: var(--error-colors-base-action)}}.chip--skin-error-active{--border-color: var(--error-colors-base-active);--start-icon-color: var(--error-colors-text-active);--text-color: var(--error-colors-text-active);--end-icon-color: var(--error-colors-text-active);--bg-color: var(--error-colors-base-active)}@media(hover:hover)and (pointer:fine){.chip--skin-error-active:hover{--border-color: var(--error-colors-base-active-action);--start-icon-color: var(--error-colors-text-active-action);--text-color: var(--error-colors-text-active-action);--end-icon-color: var(--error-colors-text-active-action);--bg-color: var(--error-colors-base-active-action)}}@media(hover:none)and (pointer:coarse){.chip--skin-error-active:active{--border-color: var(--error-colors-base-active-action);--start-icon-color: var(--error-colors-text-active-action);--text-color: var(--error-colors-text-active-action);--end-icon-color: var(--error-colors-text-active-action);--bg-color: var(--error-colors-base-active-action)}}@keyframes chip-rotate{to{transform:rotate(360deg)}}.chip{display:inline-grid;align-items:center;justify-content:center;vertical-align:top;max-width:100%;background-color:var(--bg-color);border-style:solid;border-color:var(--border-color);transition-property:background-color,border;transition-timing-function:var(--easings-ease);transition-duration:var(--timings-default);cursor:pointer;overflow:hidden;position:relative;grid-template-columns:var(--chip-grid-cols, auto);width:var(--chip-width, auto);pointer-events:var(--chip-pointer-events, auto)}.chip--large{height:40px;border-width:1px;border-radius:var(--corner-radius-r8);column-gap:var(--spacings-s2);font-weight:600;font-size:var(--typography-t4-font-size);line-height:var(--typography-t4-line-height)}.chip--large .chip__interactive-area{gap:var(--spacings-s2);padding:calc(var(--spacings-s10) - 1px) calc(var(--spacings-s10) - 1px);padding-inline-end:var(--chip-ia-pie, calc(var(--spacings-s10) - 1px))}.chip--large .chip__icon-holder{flex:0 0 20px;width:20px;height:20px}.chip--large .chip__text{padding:var(--spacings-s0) var(--spacings-s2)}.chip--large .chip__badge{margin:0 var(--spacings-s2)}.chip--large .chip__dismiss-button,.chip--large .chip__dismiss-icon{width:40px;height:40px}.chip--large .chip__dismiss-icon{width:20px;height:20px}.chip--small{height:32px;border-width:1px;border-radius:var(--corner-radius-r8);column-gap:var(--spacings-s2);font-weight:600;font-size:var(--typography-t3-font-size);line-height:var(--typography-t3-line-height)}.chip--small .chip__interactive-area{gap:var(--spacings-s2);padding:calc(var(--spacings-s6) - 1px) calc(var(--spacings-s6) - 1px);padding-inline-end:var(--chip-ia-pie, calc(var(--spacings-s6) - 1px))}.chip--small .chip__icon-holder{flex:0 0 20px;width:20px;height:20px}.chip--small .chip__text{padding:var(--spacings-s0) var(--spacings-s2)}.chip--small .chip__badge{margin:0 var(--spacings-s2)}.chip--small .chip__dismiss-button{width:32px;height:32px}.chip--small .chip__dismiss-icon{width:20px;height:20px}.chip__interactive-area{min-width:0;display:flex;align-items:center;visibility:var(--chip-ia-visibility, visible)}.chip__icon{display:block;width:100%;height:100%}.chip__icon-holder{min-width:0}.chip__icon-holder path{fill:var(--start-icon-color);transition:fill var(--timings-default) var(--easings-ease)}.chip__loading-icon{animation:chip-rotate var(--timings-long) var(--easings-linear) infinite}.chip__loading-icon-layout{position:absolute;inset:0;margin:auto;fill:var(--end-icon-color);width:24px;height:24px}.chip__text-wrap{min-width:0;flex-grow:1;color:var(--text-color);text-align:center;word-break:break-all}.chip__text{width:100%;color:var(--text-color);text-align:center;word-break:break-all;max-width:100%;display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;transition:color var(--timings-default) var(--easings-ease)}.chip__badge{min-width:0}.chip__dismiss-button{display:grid;place-items:center;min-width:0;cursor:pointer}.chip__dismiss-icon path{fill:var(--end-icon-color);transition:fill var(--timings-default) var(--easings-ease)}}
