@charset "utf-8";

.ds-tag { background: rgba(var(--b-sc),var(--fds-ref-alpha-12)); box-sizing: content-box; display: inline-flex; align-items: center; border-radius: var(--fds-ref-radius-full); white-space: nowrap; user-select: none; padding: var(--fds-ref-spacing-3xsmall) var(--fds-ref-spacing-2xsmall); gap: var(--fds-ref-spacing-3xsmall); }

.ds-tag .tag__icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: var(--fds-sem-dimension-xsmall); height: var(--fds-sem-dimension-xsmall); }

.ds-tag .tag__icon svg { width: 100%; height: 100%; display: block; }

.ds-tag .tag__close-icon { width: var(--fds-sem-dimension-xsmall); height: var(--fds-sem-dimension-xsmall); }

.ds-tag .tag__close-icon svg { width: 100%; height: 100%; display: block; }

.ds-tag.ds-tag-size--xs { height: var(--fds-sem-dimension-xsmall); }

.ds-tag.ds-tag-size--sm { height: var(--fds-sem-dimension-small); }

.ds-tag .tag__title { color: rgba(var(--b-sc),var(--fds-ref-alpha-64)); }

.ds-tag .tag__title:first-child { padding-inline-start: var(--fds-ref-spacing-3xsmall); }

.ds-tag .tag__label { color: rgba(var(--b-sc),var(--fds-ref-alpha-90)); }

.ds-tag .tag__label:first-child { padding-inline-start: var(--fds-ref-spacing-3xsmall); }

.ds-tag .tag__label:last-child { padding-inline-end: var(--fds-ref-spacing-3xsmall); }

.ds-tag .tag__icon { color: rgba(var(--b-sc),var(--fds-ref-alpha-90)); }

.ds-tag .tag__close { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background: none; cursor: pointer; }

.ds-tag .tag__close .tag__close-wrapper { display: inline-flex; align-items: center; justify-content: center; width: var(--fds-sem-dimension-xsmall); height: var(--fds-sem-dimension-xsmall); border-radius: var(--fds-ref-radius-xsmall); transition: background-color 0.2s; }

.ds-tag .tag__close .tag__close-icon { color: rgba(var(--b-sc),var(--fds-ref-alpha-72)); }

[class*="is-web"] .ds-tag .tag__close:hover:not(:disabled) .tag__close-wrapper { background: rgba(var(--b-sc),var(--fds-ref-alpha-8)); }

[class*="is-web"] .ds-tag .tag__close:hover:not(:disabled) .tag__close-icon { color: rgba(var(--b-sc),var(--fds-ref-alpha-100)); }

[class*="is-web"] .ds-tag .tag__close:active:not(:disabled) .tag__close-wrapper { background: rgba(var(--b-sc),var(--fds-ref-alpha-16)); }

.ds-tag .tag__close:active:not(:disabled) .tag__close-wrapper { background: rgba(var(--b-sc),var(--fds-ref-alpha-16)); }

.ds-tag .tag__close:disabled { cursor: not-allowed; }

.ds-tag--disabled { pointer-events: none; background: rgba(var(--b-sc),var(--fds-ref-alpha-8)); }

.ds-tag--disabled .tag__title, .ds-tag--disabled .tag__label, .ds-tag--disabled .tag__icon, .ds-tag--disabled .tag__close .tag__close-icon { color: rgba(var(--b-sc),var(--fds-ref-alpha-24)); }