@i-cell/ids-styles 0.0.18 → 0.0.20

package/dist/components.css

@@ -3748,16 +3748,6 @@
   border-style: solid;
   box-sizing: border-box;
 }
-.ids-chip[role=button]:focus, .ids-chip[role=button]:focus-visible {
-  outline-offset: 2px;
-  outline-style: solid;
-}
-.ids-chip:not([role=button]):focus, .ids-chip:not([role=button]):focus-visible {
-  outline-style: none;
-}
-.ids-chip.ids-chip-disabled {
-  cursor: not-allowed;
-}
 .ids-chip > .ids-chip__label {
   display: flex;
   align-items: center;
@@ -3768,9 +3758,6 @@
   border-radius: var(--ids-comp-chip-container-size-border-radius-compact);
   border-width: var(--ids-comp-chip-container-size-border-width-compact);
 }
-.ids-chip.ids-chip-compact:focus, .ids-chip.ids-chip-compact:focus-visible {
-  outline-width: var(--ids-comp-chip-focused-outline-size-outline-compact);
-}
 .ids-chip.ids-chip-compact > .ids-avatar {
   width: var(--ids-comp-chip-avatar-size-avatar-compact);
   height: var(--ids-comp-chip-avatar-size-avatar-compact);
@@ -3803,9 +3790,6 @@
   border-radius: var(--ids-comp-chip-container-size-border-radius-comfortable);
   border-width: var(--ids-comp-chip-container-size-border-width-comfortable);
 }
-.ids-chip.ids-chip-comfortable:focus, .ids-chip.ids-chip-comfortable:focus-visible {
-  outline-width: var(--ids-comp-chip-focused-outline-size-outline-comfortable);
-}
 .ids-chip.ids-chip-comfortable > .ids-avatar {
   width: var(--ids-comp-chip-avatar-size-avatar-comfortable);
   height: var(--ids-comp-chip-avatar-size-avatar-comfortable);
@@ -3838,9 +3822,6 @@
   border-radius: var(--ids-comp-chip-container-size-border-radius-spacious);
   border-width: var(--ids-comp-chip-container-size-border-width-spacious);
 }
-.ids-chip.ids-chip-spacious:focus, .ids-chip.ids-chip-spacious:focus-visible {
-  outline-width: var(--ids-comp-chip-focused-outline-size-outline-spacious);
-}
 .ids-chip.ids-chip-spacious > .ids-avatar {
   width: var(--ids-comp-chip-avatar-size-avatar-spacious);
   height: var(--ids-comp-chip-avatar-size-avatar-spacious);
@@ -3873,9 +3854,6 @@
   border-radius: var(--ids-comp-chip-container-size-border-radius-dense);
   border-width: var(--ids-comp-chip-container-size-border-width-dense);
 }
-.ids-chip.ids-chip-dense:focus, .ids-chip.ids-chip-dense:focus-visible {
-  outline-width: var(--ids-comp-chip-focused-outline-size-outline-dense);
-}
 .ids-chip.ids-chip-dense > .ids-avatar {
   width: var(--ids-comp-chip-avatar-size-avatar-dense);
   height: var(--ids-comp-chip-avatar-size-avatar-dense);
@@ -3902,521 +3880,552 @@
   font-weight: var(--ids-comp-chip-icon-typography-font-weight-dense);
   line-height: var(--ids-comp-chip-icon-typography-line-height-dense);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled) {
+.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled) {
   background: var(--ids-comp-chip-filled-color-bg-primary-default);
   border-color: var(--ids-comp-chip-filled-color-border-primary-default);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled) > .ids-icon {
+.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled) > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-primary-default);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled) > .ids-chip__label {
+.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled) > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-primary-default);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:hover {
+.ids-chip.ids-chip-filled.ids-chip-primary:disabled {
+  background: var(--ids-comp-chip-filled-color-bg-primary-disabled);
+  border-color: var(--ids-comp-chip-filled-color-border-primary-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-primary:disabled > .ids-icon {
+  color: var(--ids-comp-chip-filled-color-fg-icon-primary-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-primary:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-filled-color-fg-label-primary-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled) {
+  background: var(--ids-comp-chip-filled-color-bg-secondary-default);
+  border-color: var(--ids-comp-chip-filled-color-border-secondary-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled) > .ids-icon {
+  color: var(--ids-comp-chip-filled-color-fg-icon-secondary-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled) > .ids-chip__label {
+  color: var(--ids-comp-chip-filled-color-fg-label-secondary-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-secondary:disabled {
+  background: var(--ids-comp-chip-filled-color-bg-secondary-disabled);
+  border-color: var(--ids-comp-chip-filled-color-border-secondary-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-secondary:disabled > .ids-icon {
+  color: var(--ids-comp-chip-filled-color-fg-icon-secondary-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-secondary:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-filled-color-fg-label-secondary-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled) {
+  background: var(--ids-comp-chip-filled-color-bg-surface-default);
+  border-color: var(--ids-comp-chip-filled-color-border-surface-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled) > .ids-icon {
+  color: var(--ids-comp-chip-filled-color-fg-icon-surface-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled) > .ids-chip__label {
+  color: var(--ids-comp-chip-filled-color-fg-label-surface-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-surface:disabled {
+  background: var(--ids-comp-chip-filled-color-bg-surface-disabled);
+  border-color: var(--ids-comp-chip-filled-color-border-surface-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-surface:disabled > .ids-icon {
+  color: var(--ids-comp-chip-filled-color-fg-icon-surface-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-surface:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-filled-color-fg-label-surface-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled) {
+  background: var(--ids-comp-chip-filled-color-bg-light-default);
+  border-color: var(--ids-comp-chip-filled-color-border-light-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled) > .ids-icon {
+  color: var(--ids-comp-chip-filled-color-fg-icon-light-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled) > .ids-chip__label {
+  color: var(--ids-comp-chip-filled-color-fg-label-light-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-light:disabled {
+  background: var(--ids-comp-chip-filled-color-bg-light-disabled);
+  border-color: var(--ids-comp-chip-filled-color-border-light-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-light:disabled > .ids-icon {
+  color: var(--ids-comp-chip-filled-color-fg-icon-light-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-light:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-filled-color-fg-label-light-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled) {
+  background: var(--ids-comp-chip-filled-color-bg-dark-default);
+  border-color: var(--ids-comp-chip-filled-color-border-dark-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled) > .ids-icon {
+  color: var(--ids-comp-chip-filled-color-fg-icon-dark-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled) > .ids-chip__label {
+  color: var(--ids-comp-chip-filled-color-fg-label-dark-default);
+}
+.ids-chip.ids-chip-filled.ids-chip-dark:disabled {
+  background: var(--ids-comp-chip-filled-color-bg-dark-disabled);
+  border-color: var(--ids-comp-chip-filled-color-border-dark-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-dark:disabled > .ids-icon {
+  color: var(--ids-comp-chip-filled-color-fg-icon-dark-disabled);
+}
+.ids-chip.ids-chip-filled.ids-chip-dark:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-filled-color-fg-label-dark-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled) {
+  background: var(--ids-comp-chip-outlined-color-bg-primary-default);
+  border-color: var(--ids-comp-chip-outlined-color-border-primary-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled) > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-primary-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled) > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-primary-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-primary:disabled {
+  background: var(--ids-comp-chip-outlined-color-bg-primary-disabled);
+  border-color: var(--ids-comp-chip-outlined-color-border-primary-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-primary:disabled > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-primary-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-primary:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-primary-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled) {
+  background: var(--ids-comp-chip-outlined-color-bg-secondary-default);
+  border-color: var(--ids-comp-chip-outlined-color-border-secondary-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled) > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-secondary-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled) > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-secondary-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-secondary:disabled {
+  background: var(--ids-comp-chip-outlined-color-bg-secondary-disabled);
+  border-color: var(--ids-comp-chip-outlined-color-border-secondary-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-secondary:disabled > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-secondary-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-secondary:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-secondary-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled) {
+  background: var(--ids-comp-chip-outlined-color-bg-surface-default);
+  border-color: var(--ids-comp-chip-outlined-color-border-surface-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled) > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-surface-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled) > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-surface-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-surface:disabled {
+  background: var(--ids-comp-chip-outlined-color-bg-surface-disabled);
+  border-color: var(--ids-comp-chip-outlined-color-border-surface-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-surface:disabled > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-surface-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-surface:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-surface-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled) {
+  background: var(--ids-comp-chip-outlined-color-bg-light-default);
+  border-color: var(--ids-comp-chip-outlined-color-border-light-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled) > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-light-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled) > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-light-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-light:disabled {
+  background: var(--ids-comp-chip-outlined-color-bg-light-disabled);
+  border-color: var(--ids-comp-chip-outlined-color-border-light-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-light:disabled > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-light-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-light:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-light-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled) {
+  background: var(--ids-comp-chip-outlined-color-bg-dark-default);
+  border-color: var(--ids-comp-chip-outlined-color-border-dark-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled) > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-dark-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled) > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-dark-default);
+}
+.ids-chip.ids-chip-outlined.ids-chip-dark:disabled {
+  background: var(--ids-comp-chip-outlined-color-bg-dark-disabled);
+  border-color: var(--ids-comp-chip-outlined-color-border-dark-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-dark:disabled > .ids-icon {
+  color: var(--ids-comp-chip-outlined-color-fg-icon-dark-disabled);
+}
+.ids-chip.ids-chip-outlined.ids-chip-dark:disabled > .ids-chip__label {
+  color: var(--ids-comp-chip-outlined-color-fg-label-dark-disabled);
+}
+
+ids-chip {
+  cursor: default;
+}
+ids-chip:focus, ids-chip:focus-visible {
+  outline-style: none;
+}
+
+button.ids-chip {
+  cursor: pointer;
+}
+button.ids-chip:focus, button.ids-chip:focus-visible {
+  outline-offset: 2px;
+  outline-style: solid;
+}
+button.ids-chip:disabled {
+  cursor: not-allowed;
+}
+button.ids-chip.ids-chip-compact:focus, button.ids-chip.ids-chip-compact:focus-visible {
+  outline-width: var(--ids-comp-chip-focused-outline-size-outline-compact);
+}
+button.ids-chip.ids-chip-comfortable:focus, button.ids-chip.ids-chip-comfortable:focus-visible {
+  outline-width: var(--ids-comp-chip-focused-outline-size-outline-comfortable);
+}
+button.ids-chip.ids-chip-spacious:focus, button.ids-chip.ids-chip-spacious:focus-visible {
+  outline-width: var(--ids-comp-chip-focused-outline-size-outline-spacious);
+}
+button.ids-chip.ids-chip-dense:focus, button.ids-chip.ids-chip-dense:focus-visible {
+  outline-width: var(--ids-comp-chip-focused-outline-size-outline-dense);
+}
+button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):hover {
   background: var(--ids-comp-chip-filled-color-bg-primary-hovered);
   border-color: var(--ids-comp-chip-filled-color-border-primary-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-primary-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-primary-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):focus, button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-filled-color-bg-primary-focused);
   border-color: var(--ids-comp-chip-filled-color-border-primary-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-primary-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-primary-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):active {
   background: var(--ids-comp-chip-filled-color-bg-primary-pressed);
   border-color: var(--ids-comp-chip-filled-color-border-primary-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-primary-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-primary:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-primary-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-primary.ids-chip-disabled {
-  background: var(--ids-comp-chip-filled-color-bg-primary-disabled);
-  border-color: var(--ids-comp-chip-filled-color-border-primary-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-primary.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-filled-color-fg-icon-primary-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-primary.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-filled-color-fg-label-primary-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled) {
-  background: var(--ids-comp-chip-filled-color-bg-secondary-default);
-  border-color: var(--ids-comp-chip-filled-color-border-secondary-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled) > .ids-icon {
-  color: var(--ids-comp-chip-filled-color-fg-icon-secondary-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled) > .ids-chip__label {
-  color: var(--ids-comp-chip-filled-color-fg-label-secondary-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:hover {
+button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):hover {
   background: var(--ids-comp-chip-filled-color-bg-secondary-hovered);
   border-color: var(--ids-comp-chip-filled-color-border-secondary-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-secondary-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-secondary-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):focus, button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-filled-color-bg-secondary-focused);
   border-color: var(--ids-comp-chip-filled-color-border-secondary-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-secondary-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-secondary-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):active {
   background: var(--ids-comp-chip-filled-color-bg-secondary-pressed);
   border-color: var(--ids-comp-chip-filled-color-border-secondary-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-secondary-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-secondary:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-secondary-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-secondary.ids-chip-disabled {
-  background: var(--ids-comp-chip-filled-color-bg-secondary-disabled);
-  border-color: var(--ids-comp-chip-filled-color-border-secondary-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-secondary.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-filled-color-fg-icon-secondary-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-secondary.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-filled-color-fg-label-secondary-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled) {
-  background: var(--ids-comp-chip-filled-color-bg-surface-default);
-  border-color: var(--ids-comp-chip-filled-color-border-surface-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled) > .ids-icon {
-  color: var(--ids-comp-chip-filled-color-fg-icon-surface-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled) > .ids-chip__label {
-  color: var(--ids-comp-chip-filled-color-fg-label-surface-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:hover {
+button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):hover {
   background: var(--ids-comp-chip-filled-color-bg-surface-hovered);
   border-color: var(--ids-comp-chip-filled-color-border-surface-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-surface-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-surface-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):focus, button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-filled-color-bg-surface-focused);
   border-color: var(--ids-comp-chip-filled-color-border-surface-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-surface-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-surface-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):active {
   background: var(--ids-comp-chip-filled-color-bg-surface-pressed);
   border-color: var(--ids-comp-chip-filled-color-border-surface-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-surface-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-surface:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-surface:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-surface-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-surface.ids-chip-disabled {
-  background: var(--ids-comp-chip-filled-color-bg-surface-disabled);
-  border-color: var(--ids-comp-chip-filled-color-border-surface-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-surface.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-filled-color-fg-icon-surface-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-surface.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-filled-color-fg-label-surface-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled) {
-  background: var(--ids-comp-chip-filled-color-bg-light-default);
-  border-color: var(--ids-comp-chip-filled-color-border-light-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled) > .ids-icon {
-  color: var(--ids-comp-chip-filled-color-fg-icon-light-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled) > .ids-chip__label {
-  color: var(--ids-comp-chip-filled-color-fg-label-light-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:hover {
+button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):hover {
   background: var(--ids-comp-chip-filled-color-bg-light-hovered);
   border-color: var(--ids-comp-chip-filled-color-border-light-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-light-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-light-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):focus, button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-filled-color-bg-light-focused);
   border-color: var(--ids-comp-chip-filled-color-border-light-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-light-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-light-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):active {
   background: var(--ids-comp-chip-filled-color-bg-light-pressed);
   border-color: var(--ids-comp-chip-filled-color-border-light-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-light-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-light:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-light:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-light-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-light.ids-chip-disabled {
-  background: var(--ids-comp-chip-filled-color-bg-light-disabled);
-  border-color: var(--ids-comp-chip-filled-color-border-light-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-light.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-filled-color-fg-icon-light-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-light.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-filled-color-fg-label-light-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled) {
-  background: var(--ids-comp-chip-filled-color-bg-dark-default);
-  border-color: var(--ids-comp-chip-filled-color-border-dark-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled) > .ids-icon {
-  color: var(--ids-comp-chip-filled-color-fg-icon-dark-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled) > .ids-chip__label {
-  color: var(--ids-comp-chip-filled-color-fg-label-dark-default);
-}
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:hover {
+button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):hover {
   background: var(--ids-comp-chip-filled-color-bg-dark-hovered);
   border-color: var(--ids-comp-chip-filled-color-border-dark-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-dark-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-dark-hovered);
 }
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):focus, button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-filled-color-bg-dark-focused);
   border-color: var(--ids-comp-chip-filled-color-border-dark-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-dark-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-dark-focused);
 }
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):active {
   background: var(--ids-comp-chip-filled-color-bg-dark-pressed);
   border-color: var(--ids-comp-chip-filled-color-border-dark-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-filled-color-fg-icon-dark-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-dark:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-filled.ids-chip-dark:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-filled-color-fg-label-dark-pressed);
 }
-.ids-chip.ids-chip-filled.ids-chip-dark.ids-chip-disabled {
-  background: var(--ids-comp-chip-filled-color-bg-dark-disabled);
-  border-color: var(--ids-comp-chip-filled-color-border-dark-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-dark.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-filled-color-fg-icon-dark-disabled);
-}
-.ids-chip.ids-chip-filled.ids-chip-dark.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-filled-color-fg-label-dark-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled) {
-  background: var(--ids-comp-chip-outlined-color-bg-primary-default);
-  border-color: var(--ids-comp-chip-outlined-color-border-primary-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled) > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-primary-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled) > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-primary-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:hover {
+button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):hover {
   background: var(--ids-comp-chip-outlined-color-bg-primary-hovered);
   border-color: var(--ids-comp-chip-outlined-color-border-primary-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-primary-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-primary-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):focus, button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-outlined-color-bg-primary-focused);
   border-color: var(--ids-comp-chip-outlined-color-border-primary-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-primary-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-primary-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):active {
   background: var(--ids-comp-chip-outlined-color-bg-primary-pressed);
   border-color: var(--ids-comp-chip-outlined-color-border-primary-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-primary-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-primary:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-primary:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-primary-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-primary.ids-chip-disabled {
-  background: var(--ids-comp-chip-outlined-color-bg-primary-disabled);
-  border-color: var(--ids-comp-chip-outlined-color-border-primary-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-primary.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-primary-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-primary.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-primary-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled) {
-  background: var(--ids-comp-chip-outlined-color-bg-secondary-default);
-  border-color: var(--ids-comp-chip-outlined-color-border-secondary-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled) > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-secondary-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled) > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-secondary-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:hover {
+button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):hover {
   background: var(--ids-comp-chip-outlined-color-bg-secondary-hovered);
   border-color: var(--ids-comp-chip-outlined-color-border-secondary-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-secondary-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-secondary-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):focus, button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-outlined-color-bg-secondary-focused);
   border-color: var(--ids-comp-chip-outlined-color-border-secondary-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-secondary-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-secondary-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):active {
   background: var(--ids-comp-chip-outlined-color-bg-secondary-pressed);
   border-color: var(--ids-comp-chip-outlined-color-border-secondary-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-secondary-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-secondary:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-secondary:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-secondary-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-secondary.ids-chip-disabled {
-  background: var(--ids-comp-chip-outlined-color-bg-secondary-disabled);
-  border-color: var(--ids-comp-chip-outlined-color-border-secondary-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-secondary.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-secondary-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-secondary.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-secondary-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled) {
-  background: var(--ids-comp-chip-outlined-color-bg-surface-default);
-  border-color: var(--ids-comp-chip-outlined-color-border-surface-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled) > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-surface-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled) > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-surface-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:hover {
+button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):hover {
   background: var(--ids-comp-chip-outlined-color-bg-surface-hovered);
   border-color: var(--ids-comp-chip-outlined-color-border-surface-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-surface-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-surface-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):focus, button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-outlined-color-bg-surface-focused);
   border-color: var(--ids-comp-chip-outlined-color-border-surface-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-surface-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-surface-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):active {
   background: var(--ids-comp-chip-outlined-color-bg-surface-pressed);
   border-color: var(--ids-comp-chip-outlined-color-border-surface-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-surface-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-surface:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-surface:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-surface-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-surface.ids-chip-disabled {
-  background: var(--ids-comp-chip-outlined-color-bg-surface-disabled);
-  border-color: var(--ids-comp-chip-outlined-color-border-surface-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-surface.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-surface-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-surface.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-surface-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled) {
-  background: var(--ids-comp-chip-outlined-color-bg-light-default);
-  border-color: var(--ids-comp-chip-outlined-color-border-light-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled) > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-light-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled) > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-light-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:hover {
+button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):hover {
   background: var(--ids-comp-chip-outlined-color-bg-light-hovered);
   border-color: var(--ids-comp-chip-outlined-color-border-light-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-light-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-light-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):focus, button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-outlined-color-bg-light-focused);
   border-color: var(--ids-comp-chip-outlined-color-border-light-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-light-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-light-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):active {
   background: var(--ids-comp-chip-outlined-color-bg-light-pressed);
   border-color: var(--ids-comp-chip-outlined-color-border-light-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-light-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-light:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-light:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-light-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-light.ids-chip-disabled {
-  background: var(--ids-comp-chip-outlined-color-bg-light-disabled);
-  border-color: var(--ids-comp-chip-outlined-color-border-light-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-light.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-light-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-light.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-light-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled) {
-  background: var(--ids-comp-chip-outlined-color-bg-dark-default);
-  border-color: var(--ids-comp-chip-outlined-color-border-dark-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled) > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-dark-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled) > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-dark-default);
-}
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:hover {
+button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):hover {
   background: var(--ids-comp-chip-outlined-color-bg-dark-hovered);
   border-color: var(--ids-comp-chip-outlined-color-border-dark-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:hover > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):hover > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-dark-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:hover > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):hover > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-dark-hovered);
 }
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus, .ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus-visible {
+button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):focus, button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):focus-visible {
   background: var(--ids-comp-chip-outlined-color-bg-dark-focused);
   border-color: var(--ids-comp-chip-outlined-color-border-dark-focused);
   outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus > .ids-icon, .ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):focus > .ids-icon, button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):focus-visible > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-dark-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus > .ids-chip__label, .ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:focus-visible > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):focus > .ids-chip__label, button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):focus-visible > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-dark-focused);
 }
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:active {
+button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):active {
   background: var(--ids-comp-chip-outlined-color-bg-dark-pressed);
   border-color: var(--ids-comp-chip-outlined-color-border-dark-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:active > .ids-icon {
+button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):active > .ids-icon {
   color: var(--ids-comp-chip-outlined-color-fg-icon-dark-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-dark:not(.ids-chip-disabled)[role=button]:active > .ids-chip__label {
+button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):active > .ids-chip__label {
   color: var(--ids-comp-chip-outlined-color-fg-label-dark-pressed);
 }
-.ids-chip.ids-chip-outlined.ids-chip-dark.ids-chip-disabled {
-  background: var(--ids-comp-chip-outlined-color-bg-dark-disabled);
-  border-color: var(--ids-comp-chip-outlined-color-border-dark-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-dark.ids-chip-disabled > .ids-icon {
-  color: var(--ids-comp-chip-outlined-color-fg-icon-dark-disabled);
-}
-.ids-chip.ids-chip-outlined.ids-chip-dark.ids-chip-disabled > .ids-chip__label {
-  color: var(--ids-comp-chip-outlined-color-fg-label-dark-disabled);
-}
 
 .ids-chip-group {
   display: inline-flex;
-  align-items: center;
   flex-wrap: wrap;
+  align-items: center;
+  align-content: center;
 }
 .ids-chip-group.ids-chip-group-compact {
   padding: var(--ids-comp-chip-group-size-padding-y-compact) var(--ids-comp-chip-group-size-padding-x-compact);
@@ -10412,6 +10421,13 @@
 }
 .ids-switch > .ids-switch__label {
   font-style: normal;
+  flex-grow: 1;
+}
+.ids-switch.ids-switch-label-right {
+  flex-direction: row;
+}
+.ids-switch.ids-switch-label-left {
+  flex-direction: row-reverse;
 }
 .ids-switch.ids-switch-compact {
   gap: var(--ids-comp-switch-container-size-gap-compact);
@@ -11032,8 +11048,6 @@
 }
 
 .ids-tag {
-  flex-shrink: 0;
-  width: fit-content;
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -11055,7 +11069,7 @@
   height: var(--ids-comp-tag-size-height-compact);
   padding: var(--ids-comp-tag-size-padding-y-compact) var(--ids-comp-tag-size-padding-x-compact);
   border-radius: var(--ids-comp-tag-size-border-radius-compact);
-  border: var(--ids-comp-tag-size-border-width-compact);
+  border-width: var(--ids-comp-tag-size-border-width-compact);
 }
 .ids-tag.ids-tag-compact:focus, .ids-tag.ids-tag-compact:focus-visible {
   outline-width: var(--ids-comp-tag-focused-outline-size-outline-compact);
@@ -11079,7 +11093,7 @@
   height: var(--ids-comp-tag-size-height-comfortable);
   padding: var(--ids-comp-tag-size-padding-y-comfortable) var(--ids-comp-tag-size-padding-x-comfortable);
   border-radius: var(--ids-comp-tag-size-border-radius-comfortable);
-  border: var(--ids-comp-tag-size-border-width-comfortable);
+  border-width: var(--ids-comp-tag-size-border-width-comfortable);
 }
 .ids-tag.ids-tag-comfortable:focus, .ids-tag.ids-tag-comfortable:focus-visible {
   outline-width: var(--ids-comp-tag-focused-outline-size-outline-comfortable);
@@ -11103,7 +11117,7 @@
   height: var(--ids-comp-tag-size-height-spacious);
   padding: var(--ids-comp-tag-size-padding-y-spacious) var(--ids-comp-tag-size-padding-x-spacious);
   border-radius: var(--ids-comp-tag-size-border-radius-spacious);
-  border: var(--ids-comp-tag-size-border-width-spacious);
+  border-width: var(--ids-comp-tag-size-border-width-spacious);
 }
 .ids-tag.ids-tag-spacious:focus, .ids-tag.ids-tag-spacious:focus-visible {
   outline-width: var(--ids-comp-tag-focused-outline-size-outline-spacious);
@@ -11127,7 +11141,7 @@
   height: var(--ids-comp-tag-size-height-dense);
   padding: var(--ids-comp-tag-size-padding-y-dense) var(--ids-comp-tag-size-padding-x-dense);
   border-radius: var(--ids-comp-tag-size-border-radius-dense);
-  border: var(--ids-comp-tag-size-border-width-dense);
+  border-width: var(--ids-comp-tag-size-border-width-dense);
 }
 .ids-tag.ids-tag-dense:focus, .ids-tag.ids-tag-dense:focus-visible {
   outline-width: var(--ids-comp-tag-focused-outline-size-outline-dense);
@@ -11151,385 +11165,500 @@
   background: var(--ids-comp-tag-filled-color-bg-primary-default);
   border-color: var(--ids-comp-tag-filled-color-border-primary-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-primary:hover {
-  color: var(--ids-comp-tag-filled-color-fg-label-primary-default);
-  background: var(--ids-comp-tag-filled-color-bg-primary-default);
-  border-color: var(--ids-comp-tag-filled-color-border-primary-default);
+.ids-tag.ids-tag-filled.ids-tag-secondary {
+  color: var(--ids-comp-tag-filled-color-fg-label-secondary-default);
+  background: var(--ids-comp-tag-filled-color-bg-secondary-default);
+  border-color: var(--ids-comp-tag-filled-color-border-secondary-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-primary:focus, .ids-tag.ids-tag-filled.ids-tag-primary:focus-visible {
+.ids-tag.ids-tag-filled.ids-tag-brand {
+  color: var(--ids-comp-tag-filled-color-fg-label-brand-default);
+  background: var(--ids-comp-tag-filled-color-bg-brand-default);
+  border-color: var(--ids-comp-tag-filled-color-border-brand-default);
+}
+.ids-tag.ids-tag-filled.ids-tag-error {
+  color: var(--ids-comp-tag-filled-color-fg-label-error-default);
+  background: var(--ids-comp-tag-filled-color-bg-error-default);
+  border-color: var(--ids-comp-tag-filled-color-border-error-default);
+}
+.ids-tag.ids-tag-filled.ids-tag-success {
+  color: var(--ids-comp-tag-filled-color-fg-label-success-default);
+  background: var(--ids-comp-tag-filled-color-bg-success-default);
+  border-color: var(--ids-comp-tag-filled-color-border-success-default);
+}
+.ids-tag.ids-tag-filled.ids-tag-warning {
+  color: var(--ids-comp-tag-filled-color-fg-label-warning-default);
+  background: var(--ids-comp-tag-filled-color-bg-warning-default);
+  border-color: var(--ids-comp-tag-filled-color-border-warning-default);
+}
+.ids-tag.ids-tag-filled.ids-tag-light {
+  color: var(--ids-comp-tag-filled-color-fg-label-light-default);
+  background: var(--ids-comp-tag-filled-color-bg-light-default);
+  border-color: var(--ids-comp-tag-filled-color-border-light-default);
+}
+.ids-tag.ids-tag-filled.ids-tag-dark {
+  color: var(--ids-comp-tag-filled-color-fg-label-dark-default);
+  background: var(--ids-comp-tag-filled-color-bg-dark-default);
+  border-color: var(--ids-comp-tag-filled-color-border-dark-default);
+}
+.ids-tag.ids-tag-filled.ids-tag-surface {
+  color: var(--ids-comp-tag-filled-color-fg-label-surface-default);
+  background: var(--ids-comp-tag-filled-color-bg-surface-default);
+  border-color: var(--ids-comp-tag-filled-color-border-surface-default);
+}
+.ids-tag.ids-tag-outlined.ids-tag-primary {
+  color: var(--ids-comp-tag-outlined-color-fg-label-primary-default);
+  background: var(--ids-comp-tag-outlined-color-bg-primary-default);
+  border-color: var(--ids-comp-tag-outlined-color-border-primary-default);
+}
+.ids-tag.ids-tag-outlined.ids-tag-secondary {
+  color: var(--ids-comp-tag-outlined-color-fg-label-secondary-default);
+  background: var(--ids-comp-tag-outlined-color-bg-secondary-default);
+  border-color: var(--ids-comp-tag-outlined-color-border-secondary-default);
+}
+.ids-tag.ids-tag-outlined.ids-tag-brand {
+  color: var(--ids-comp-tag-outlined-color-fg-label-brand-default);
+  background: var(--ids-comp-tag-outlined-color-bg-brand-default);
+  border-color: var(--ids-comp-tag-outlined-color-border-brand-default);
+}
+.ids-tag.ids-tag-outlined.ids-tag-error {
+  color: var(--ids-comp-tag-outlined-color-fg-label-error-default);
+  background: var(--ids-comp-tag-outlined-color-bg-error-default);
+  border-color: var(--ids-comp-tag-outlined-color-border-error-default);
+}
+.ids-tag.ids-tag-outlined.ids-tag-success {
+  color: var(--ids-comp-tag-outlined-color-fg-label-success-default);
+  background: var(--ids-comp-tag-outlined-color-bg-success-default);
+  border-color: var(--ids-comp-tag-outlined-color-border-success-default);
+}
+.ids-tag.ids-tag-outlined.ids-tag-warning {
+  color: var(--ids-comp-tag-outlined-color-fg-label-warning-default);
+  background: var(--ids-comp-tag-outlined-color-bg-warning-default);
+  border-color: var(--ids-comp-tag-outlined-color-border-warning-default);
+}
+.ids-tag.ids-tag-outlined.ids-tag-light {
+  color: var(--ids-comp-tag-outlined-color-fg-label-light-default);
+  background: var(--ids-comp-tag-outlined-color-bg-light-default);
+  border-color: var(--ids-comp-tag-outlined-color-border-light-default);
+}
+.ids-tag.ids-tag-outlined.ids-tag-dark {
+  color: var(--ids-comp-tag-outlined-color-fg-label-dark-default);
+  background: var(--ids-comp-tag-outlined-color-bg-dark-default);
+  border-color: var(--ids-comp-tag-outlined-color-border-dark-default);
+}
+.ids-tag.ids-tag-outlined.ids-tag-surface {
+  color: var(--ids-comp-tag-outlined-color-fg-label-surface-default);
+  background: var(--ids-comp-tag-outlined-color-bg-surface-default);
+  border-color: var(--ids-comp-tag-outlined-color-border-surface-default);
+}
+
+ids-tag {
+  cursor: default;
+}
+
+a.ids-tag {
+  cursor: pointer;
+  text-decoration: none;
+}
+a.ids-tag.ids-tag-filled.ids-tag-primary {
   color: var(--ids-comp-tag-filled-color-fg-label-primary-default);
   background: var(--ids-comp-tag-filled-color-bg-primary-default);
   border-color: var(--ids-comp-tag-filled-color-border-primary-default);
+}
+a.ids-tag.ids-tag-filled.ids-tag-primary:hover {
+  color: var(--ids-comp-tag-filled-color-fg-label-primary-hovered);
+  background: var(--ids-comp-tag-filled-color-bg-primary-hovered);
+  border-color: var(--ids-comp-tag-filled-color-border-primary-hovered);
+}
+a.ids-tag.ids-tag-filled.ids-tag-primary:focus, a.ids-tag.ids-tag-filled.ids-tag-primary:focus-visible {
+  color: var(--ids-comp-tag-filled-color-fg-label-primary-focused);
+  background: var(--ids-comp-tag-filled-color-bg-primary-focused);
+  border-color: var(--ids-comp-tag-filled-color-border-primary-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-filled.ids-tag-primary:active {
-  color: var(--ids-comp-tag-filled-color-fg-label-primary-default);
-  background: var(--ids-comp-tag-filled-color-bg-primary-default);
-  border-color: var(--ids-comp-tag-filled-color-border-primary-default);
+a.ids-tag.ids-tag-filled.ids-tag-primary:active {
+  color: var(--ids-comp-tag-filled-color-fg-label-primary-pressed);
+  background: var(--ids-comp-tag-filled-color-bg-primary-pressed);
+  border-color: var(--ids-comp-tag-filled-color-border-primary-pressed);
 }
-.ids-tag.ids-tag-filled.ids-tag-secondary {
+a.ids-tag.ids-tag-filled.ids-tag-secondary {
   color: var(--ids-comp-tag-filled-color-fg-label-secondary-default);
   background: var(--ids-comp-tag-filled-color-bg-secondary-default);
   border-color: var(--ids-comp-tag-filled-color-border-secondary-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-secondary:hover {
-  color: var(--ids-comp-tag-filled-color-fg-label-secondary-default);
-  background: var(--ids-comp-tag-filled-color-bg-secondary-default);
-  border-color: var(--ids-comp-tag-filled-color-border-secondary-default);
+a.ids-tag.ids-tag-filled.ids-tag-secondary:hover {
+  color: var(--ids-comp-tag-filled-color-fg-label-secondary-hovered);
+  background: var(--ids-comp-tag-filled-color-bg-secondary-hovered);
+  border-color: var(--ids-comp-tag-filled-color-border-secondary-hovered);
 }
-.ids-tag.ids-tag-filled.ids-tag-secondary:focus, .ids-tag.ids-tag-filled.ids-tag-secondary:focus-visible {
-  color: var(--ids-comp-tag-filled-color-fg-label-secondary-default);
-  background: var(--ids-comp-tag-filled-color-bg-secondary-default);
-  border-color: var(--ids-comp-tag-filled-color-border-secondary-default);
+a.ids-tag.ids-tag-filled.ids-tag-secondary:focus, a.ids-tag.ids-tag-filled.ids-tag-secondary:focus-visible {
+  color: var(--ids-comp-tag-filled-color-fg-label-secondary-focused);
+  background: var(--ids-comp-tag-filled-color-bg-secondary-focused);
+  border-color: var(--ids-comp-tag-filled-color-border-secondary-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-filled.ids-tag-secondary:active {
-  color: var(--ids-comp-tag-filled-color-fg-label-secondary-default);
-  background: var(--ids-comp-tag-filled-color-bg-secondary-default);
-  border-color: var(--ids-comp-tag-filled-color-border-secondary-default);
+a.ids-tag.ids-tag-filled.ids-tag-secondary:active {
+  color: var(--ids-comp-tag-filled-color-fg-label-secondary-pressed);
+  background: var(--ids-comp-tag-filled-color-bg-secondary-pressed);
+  border-color: var(--ids-comp-tag-filled-color-border-secondary-pressed);
 }
-.ids-tag.ids-tag-filled.ids-tag-brand {
+a.ids-tag.ids-tag-filled.ids-tag-brand {
   color: var(--ids-comp-tag-filled-color-fg-label-brand-default);
   background: var(--ids-comp-tag-filled-color-bg-brand-default);
   border-color: var(--ids-comp-tag-filled-color-border-brand-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-brand:hover {
-  color: var(--ids-comp-tag-filled-color-fg-label-brand-default);
-  background: var(--ids-comp-tag-filled-color-bg-brand-default);
-  border-color: var(--ids-comp-tag-filled-color-border-brand-default);
+a.ids-tag.ids-tag-filled.ids-tag-brand:hover {
+  color: var(--ids-comp-tag-filled-color-fg-label-brand-hovered);
+  background: var(--ids-comp-tag-filled-color-bg-brand-hovered);
+  border-color: var(--ids-comp-tag-filled-color-border-brand-hovered);
 }
-.ids-tag.ids-tag-filled.ids-tag-brand:focus, .ids-tag.ids-tag-filled.ids-tag-brand:focus-visible {
-  color: var(--ids-comp-tag-filled-color-fg-label-brand-default);
-  background: var(--ids-comp-tag-filled-color-bg-brand-default);
-  border-color: var(--ids-comp-tag-filled-color-border-brand-default);
+a.ids-tag.ids-tag-filled.ids-tag-brand:focus, a.ids-tag.ids-tag-filled.ids-tag-brand:focus-visible {
+  color: var(--ids-comp-tag-filled-color-fg-label-brand-focused);
+  background: var(--ids-comp-tag-filled-color-bg-brand-focused);
+  border-color: var(--ids-comp-tag-filled-color-border-brand-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-filled.ids-tag-brand:active {
-  color: var(--ids-comp-tag-filled-color-fg-label-brand-default);
-  background: var(--ids-comp-tag-filled-color-bg-brand-default);
-  border-color: var(--ids-comp-tag-filled-color-border-brand-default);
+a.ids-tag.ids-tag-filled.ids-tag-brand:active {
+  color: var(--ids-comp-tag-filled-color-fg-label-brand-pressed);
+  background: var(--ids-comp-tag-filled-color-bg-brand-pressed);
+  border-color: var(--ids-comp-tag-filled-color-border-brand-pressed);
 }
-.ids-tag.ids-tag-filled.ids-tag-error {
+a.ids-tag.ids-tag-filled.ids-tag-error {
   color: var(--ids-comp-tag-filled-color-fg-label-error-default);
   background: var(--ids-comp-tag-filled-color-bg-error-default);
   border-color: var(--ids-comp-tag-filled-color-border-error-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-error:hover {
-  color: var(--ids-comp-tag-filled-color-fg-label-error-default);
-  background: var(--ids-comp-tag-filled-color-bg-error-default);
-  border-color: var(--ids-comp-tag-filled-color-border-error-default);
+a.ids-tag.ids-tag-filled.ids-tag-error:hover {
+  color: var(--ids-comp-tag-filled-color-fg-label-error-hovered);
+  background: var(--ids-comp-tag-filled-color-bg-error-hovered);
+  border-color: var(--ids-comp-tag-filled-color-border-error-hovered);
 }
-.ids-tag.ids-tag-filled.ids-tag-error:focus, .ids-tag.ids-tag-filled.ids-tag-error:focus-visible {
-  color: var(--ids-comp-tag-filled-color-fg-label-error-default);
-  background: var(--ids-comp-tag-filled-color-bg-error-default);
-  border-color: var(--ids-comp-tag-filled-color-border-error-default);
+a.ids-tag.ids-tag-filled.ids-tag-error:focus, a.ids-tag.ids-tag-filled.ids-tag-error:focus-visible {
+  color: var(--ids-comp-tag-filled-color-fg-label-error-focused);
+  background: var(--ids-comp-tag-filled-color-bg-error-focused);
+  border-color: var(--ids-comp-tag-filled-color-border-error-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-filled.ids-tag-error:active {
-  color: var(--ids-comp-tag-filled-color-fg-label-error-default);
-  background: var(--ids-comp-tag-filled-color-bg-error-default);
-  border-color: var(--ids-comp-tag-filled-color-border-error-default);
+a.ids-tag.ids-tag-filled.ids-tag-error:active {
+  color: var(--ids-comp-tag-filled-color-fg-label-error-pressed);
+  background: var(--ids-comp-tag-filled-color-bg-error-pressed);
+  border-color: var(--ids-comp-tag-filled-color-border-error-pressed);
 }
-.ids-tag.ids-tag-filled.ids-tag-success {
+a.ids-tag.ids-tag-filled.ids-tag-success {
   color: var(--ids-comp-tag-filled-color-fg-label-success-default);
   background: var(--ids-comp-tag-filled-color-bg-success-default);
   border-color: var(--ids-comp-tag-filled-color-border-success-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-success:hover {
-  color: var(--ids-comp-tag-filled-color-fg-label-success-default);
-  background: var(--ids-comp-tag-filled-color-bg-success-default);
-  border-color: var(--ids-comp-tag-filled-color-border-success-default);
+a.ids-tag.ids-tag-filled.ids-tag-success:hover {
+  color: var(--ids-comp-tag-filled-color-fg-label-success-hovered);
+  background: var(--ids-comp-tag-filled-color-bg-success-hovered);
+  border-color: var(--ids-comp-tag-filled-color-border-success-hovered);
 }
-.ids-tag.ids-tag-filled.ids-tag-success:focus, .ids-tag.ids-tag-filled.ids-tag-success:focus-visible {
-  color: var(--ids-comp-tag-filled-color-fg-label-success-default);
-  background: var(--ids-comp-tag-filled-color-bg-success-default);
-  border-color: var(--ids-comp-tag-filled-color-border-success-default);
+a.ids-tag.ids-tag-filled.ids-tag-success:focus, a.ids-tag.ids-tag-filled.ids-tag-success:focus-visible {
+  color: var(--ids-comp-tag-filled-color-fg-label-success-focused);
+  background: var(--ids-comp-tag-filled-color-bg-success-focused);
+  border-color: var(--ids-comp-tag-filled-color-border-success-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-filled.ids-tag-success:active {
-  color: var(--ids-comp-tag-filled-color-fg-label-success-default);
-  background: var(--ids-comp-tag-filled-color-bg-success-default);
-  border-color: var(--ids-comp-tag-filled-color-border-success-default);
+a.ids-tag.ids-tag-filled.ids-tag-success:active {
+  color: var(--ids-comp-tag-filled-color-fg-label-success-pressed);
+  background: var(--ids-comp-tag-filled-color-bg-success-pressed);
+  border-color: var(--ids-comp-tag-filled-color-border-success-pressed);
 }
-.ids-tag.ids-tag-filled.ids-tag-warning {
+a.ids-tag.ids-tag-filled.ids-tag-warning {
   color: var(--ids-comp-tag-filled-color-fg-label-warning-default);
   background: var(--ids-comp-tag-filled-color-bg-warning-default);
   border-color: var(--ids-comp-tag-filled-color-border-warning-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-warning:hover {
-  color: var(--ids-comp-tag-filled-color-fg-label-warning-default);
-  background: var(--ids-comp-tag-filled-color-bg-warning-default);
-  border-color: var(--ids-comp-tag-filled-color-border-warning-default);
+a.ids-tag.ids-tag-filled.ids-tag-warning:hover {
+  color: var(--ids-comp-tag-filled-color-fg-label-warning-hovered);
+  background: var(--ids-comp-tag-filled-color-bg-warning-hovered);
+  border-color: var(--ids-comp-tag-filled-color-border-warning-hovered);
 }
-.ids-tag.ids-tag-filled.ids-tag-warning:focus, .ids-tag.ids-tag-filled.ids-tag-warning:focus-visible {
-  color: var(--ids-comp-tag-filled-color-fg-label-warning-default);
-  background: var(--ids-comp-tag-filled-color-bg-warning-default);
-  border-color: var(--ids-comp-tag-filled-color-border-warning-default);
+a.ids-tag.ids-tag-filled.ids-tag-warning:focus, a.ids-tag.ids-tag-filled.ids-tag-warning:focus-visible {
+  color: var(--ids-comp-tag-filled-color-fg-label-warning-focused);
+  background: var(--ids-comp-tag-filled-color-bg-warning-focused);
+  border-color: var(--ids-comp-tag-filled-color-border-warning-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-filled.ids-tag-warning:active {
-  color: var(--ids-comp-tag-filled-color-fg-label-warning-default);
-  background: var(--ids-comp-tag-filled-color-bg-warning-default);
-  border-color: var(--ids-comp-tag-filled-color-border-warning-default);
+a.ids-tag.ids-tag-filled.ids-tag-warning:active {
+  color: var(--ids-comp-tag-filled-color-fg-label-warning-pressed);
+  background: var(--ids-comp-tag-filled-color-bg-warning-pressed);
+  border-color: var(--ids-comp-tag-filled-color-border-warning-pressed);
 }
-.ids-tag.ids-tag-filled.ids-tag-light {
+a.ids-tag.ids-tag-filled.ids-tag-light {
   color: var(--ids-comp-tag-filled-color-fg-label-light-default);
   background: var(--ids-comp-tag-filled-color-bg-light-default);
   border-color: var(--ids-comp-tag-filled-color-border-light-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-light:hover {
-  color: var(--ids-comp-tag-filled-color-fg-label-light-default);
-  background: var(--ids-comp-tag-filled-color-bg-light-default);
-  border-color: var(--ids-comp-tag-filled-color-border-light-default);
+a.ids-tag.ids-tag-filled.ids-tag-light:hover {
+  color: var(--ids-comp-tag-filled-color-fg-label-light-hovered);
+  background: var(--ids-comp-tag-filled-color-bg-light-hovered);
+  border-color: var(--ids-comp-tag-filled-color-border-light-hovered);
 }
-.ids-tag.ids-tag-filled.ids-tag-light:focus, .ids-tag.ids-tag-filled.ids-tag-light:focus-visible {
-  color: var(--ids-comp-tag-filled-color-fg-label-light-default);
-  background: var(--ids-comp-tag-filled-color-bg-light-default);
-  border-color: var(--ids-comp-tag-filled-color-border-light-default);
+a.ids-tag.ids-tag-filled.ids-tag-light:focus, a.ids-tag.ids-tag-filled.ids-tag-light:focus-visible {
+  color: var(--ids-comp-tag-filled-color-fg-label-light-focused);
+  background: var(--ids-comp-tag-filled-color-bg-light-focused);
+  border-color: var(--ids-comp-tag-filled-color-border-light-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-light-focused);
 }
-.ids-tag.ids-tag-filled.ids-tag-light:active {
-  color: var(--ids-comp-tag-filled-color-fg-label-light-default);
-  background: var(--ids-comp-tag-filled-color-bg-light-default);
-  border-color: var(--ids-comp-tag-filled-color-border-light-default);
+a.ids-tag.ids-tag-filled.ids-tag-light:active {
+  color: var(--ids-comp-tag-filled-color-fg-label-light-pressed);
+  background: var(--ids-comp-tag-filled-color-bg-light-pressed);
+  border-color: var(--ids-comp-tag-filled-color-border-light-pressed);
 }
-.ids-tag.ids-tag-filled.ids-tag-dark {
+a.ids-tag.ids-tag-filled.ids-tag-dark {
   color: var(--ids-comp-tag-filled-color-fg-label-dark-default);
   background: var(--ids-comp-tag-filled-color-bg-dark-default);
   border-color: var(--ids-comp-tag-filled-color-border-dark-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-dark:hover {
-  color: var(--ids-comp-tag-filled-color-fg-label-dark-default);
-  background: var(--ids-comp-tag-filled-color-bg-dark-default);
-  border-color: var(--ids-comp-tag-filled-color-border-dark-default);
+a.ids-tag.ids-tag-filled.ids-tag-dark:hover {
+  color: var(--ids-comp-tag-filled-color-fg-label-dark-hovered);
+  background: var(--ids-comp-tag-filled-color-bg-dark-hovered);
+  border-color: var(--ids-comp-tag-filled-color-border-dark-hovered);
 }
-.ids-tag.ids-tag-filled.ids-tag-dark:focus, .ids-tag.ids-tag-filled.ids-tag-dark:focus-visible {
-  color: var(--ids-comp-tag-filled-color-fg-label-dark-default);
-  background: var(--ids-comp-tag-filled-color-bg-dark-default);
-  border-color: var(--ids-comp-tag-filled-color-border-dark-default);
+a.ids-tag.ids-tag-filled.ids-tag-dark:focus, a.ids-tag.ids-tag-filled.ids-tag-dark:focus-visible {
+  color: var(--ids-comp-tag-filled-color-fg-label-dark-focused);
+  background: var(--ids-comp-tag-filled-color-bg-dark-focused);
+  border-color: var(--ids-comp-tag-filled-color-border-dark-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-filled.ids-tag-dark:active {
-  color: var(--ids-comp-tag-filled-color-fg-label-dark-default);
-  background: var(--ids-comp-tag-filled-color-bg-dark-default);
-  border-color: var(--ids-comp-tag-filled-color-border-dark-default);
+a.ids-tag.ids-tag-filled.ids-tag-dark:active {
+  color: var(--ids-comp-tag-filled-color-fg-label-dark-pressed);
+  background: var(--ids-comp-tag-filled-color-bg-dark-pressed);
+  border-color: var(--ids-comp-tag-filled-color-border-dark-pressed);
 }
-.ids-tag.ids-tag-filled.ids-tag-surface {
+a.ids-tag.ids-tag-filled.ids-tag-surface {
   color: var(--ids-comp-tag-filled-color-fg-label-surface-default);
   background: var(--ids-comp-tag-filled-color-bg-surface-default);
   border-color: var(--ids-comp-tag-filled-color-border-surface-default);
 }
-.ids-tag.ids-tag-filled.ids-tag-surface:hover {
-  color: var(--ids-comp-tag-filled-color-fg-label-surface-default);
-  background: var(--ids-comp-tag-filled-color-bg-surface-default);
-  border-color: var(--ids-comp-tag-filled-color-border-surface-default);
+a.ids-tag.ids-tag-filled.ids-tag-surface:hover {
+  color: var(--ids-comp-tag-filled-color-fg-label-surface-hovered);
+  background: var(--ids-comp-tag-filled-color-bg-surface-hovered);
+  border-color: var(--ids-comp-tag-filled-color-border-surface-hovered);
 }
-.ids-tag.ids-tag-filled.ids-tag-surface:focus, .ids-tag.ids-tag-filled.ids-tag-surface:focus-visible {
-  color: var(--ids-comp-tag-filled-color-fg-label-surface-default);
-  background: var(--ids-comp-tag-filled-color-bg-surface-default);
-  border-color: var(--ids-comp-tag-filled-color-border-surface-default);
+a.ids-tag.ids-tag-filled.ids-tag-surface:focus, a.ids-tag.ids-tag-filled.ids-tag-surface:focus-visible {
+  color: var(--ids-comp-tag-filled-color-fg-label-surface-focused);
+  background: var(--ids-comp-tag-filled-color-bg-surface-focused);
+  border-color: var(--ids-comp-tag-filled-color-border-surface-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-filled.ids-tag-surface:active {
-  color: var(--ids-comp-tag-filled-color-fg-label-surface-default);
-  background: var(--ids-comp-tag-filled-color-bg-surface-default);
-  border-color: var(--ids-comp-tag-filled-color-border-surface-default);
+a.ids-tag.ids-tag-filled.ids-tag-surface:active {
+  color: var(--ids-comp-tag-filled-color-fg-label-surface-pressed);
+  background: var(--ids-comp-tag-filled-color-bg-surface-pressed);
+  border-color: var(--ids-comp-tag-filled-color-border-surface-pressed);
 }
-.ids-tag.ids-tag-outlined.ids-tag-primary {
+a.ids-tag.ids-tag-outlined.ids-tag-primary {
   color: var(--ids-comp-tag-outlined-color-fg-label-primary-default);
   background: var(--ids-comp-tag-outlined-color-bg-primary-default);
   border-color: var(--ids-comp-tag-outlined-color-border-primary-default);
 }
-.ids-tag.ids-tag-outlined.ids-tag-primary:hover {
-  color: var(--ids-comp-tag-outlined-color-fg-label-primary-default);
-  background: var(--ids-comp-tag-outlined-color-bg-primary-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-primary-default);
+a.ids-tag.ids-tag-outlined.ids-tag-primary:hover {
+  color: var(--ids-comp-tag-outlined-color-fg-label-primary-hovered);
+  background: var(--ids-comp-tag-outlined-color-bg-primary-hovered);
+  border-color: var(--ids-comp-tag-outlined-color-border-primary-hovered);
 }
-.ids-tag.ids-tag-outlined.ids-tag-primary:focus, .ids-tag.ids-tag-outlined.ids-tag-primary:focus-visible {
-  color: var(--ids-comp-tag-outlined-color-fg-label-primary-default);
-  background: var(--ids-comp-tag-outlined-color-bg-primary-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-primary-default);
+a.ids-tag.ids-tag-outlined.ids-tag-primary:focus, a.ids-tag.ids-tag-outlined.ids-tag-primary:focus-visible {
+  color: var(--ids-comp-tag-outlined-color-fg-label-primary-focused);
+  background: var(--ids-comp-tag-outlined-color-bg-primary-focused);
+  border-color: var(--ids-comp-tag-outlined-color-border-primary-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-outlined.ids-tag-primary:active {
-  color: var(--ids-comp-tag-outlined-color-fg-label-primary-default);
-  background: var(--ids-comp-tag-outlined-color-bg-primary-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-primary-default);
+a.ids-tag.ids-tag-outlined.ids-tag-primary:active {
+  color: var(--ids-comp-tag-outlined-color-fg-label-primary-pressed);
+  background: var(--ids-comp-tag-outlined-color-bg-primary-pressed);
+  border-color: var(--ids-comp-tag-outlined-color-border-primary-pressed);
 }
-.ids-tag.ids-tag-outlined.ids-tag-secondary {
+a.ids-tag.ids-tag-outlined.ids-tag-secondary {
   color: var(--ids-comp-tag-outlined-color-fg-label-secondary-default);
   background: var(--ids-comp-tag-outlined-color-bg-secondary-default);
   border-color: var(--ids-comp-tag-outlined-color-border-secondary-default);
 }
-.ids-tag.ids-tag-outlined.ids-tag-secondary:hover {
-  color: var(--ids-comp-tag-outlined-color-fg-label-secondary-default);
-  background: var(--ids-comp-tag-outlined-color-bg-secondary-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-secondary-default);
+a.ids-tag.ids-tag-outlined.ids-tag-secondary:hover {
+  color: var(--ids-comp-tag-outlined-color-fg-label-secondary-hovered);
+  background: var(--ids-comp-tag-outlined-color-bg-secondary-hovered);
+  border-color: var(--ids-comp-tag-outlined-color-border-secondary-hovered);
 }
-.ids-tag.ids-tag-outlined.ids-tag-secondary:focus, .ids-tag.ids-tag-outlined.ids-tag-secondary:focus-visible {
-  color: var(--ids-comp-tag-outlined-color-fg-label-secondary-default);
-  background: var(--ids-comp-tag-outlined-color-bg-secondary-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-secondary-default);
+a.ids-tag.ids-tag-outlined.ids-tag-secondary:focus, a.ids-tag.ids-tag-outlined.ids-tag-secondary:focus-visible {
+  color: var(--ids-comp-tag-outlined-color-fg-label-secondary-focused);
+  background: var(--ids-comp-tag-outlined-color-bg-secondary-focused);
+  border-color: var(--ids-comp-tag-outlined-color-border-secondary-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-outlined.ids-tag-secondary:active {
-  color: var(--ids-comp-tag-outlined-color-fg-label-secondary-default);
-  background: var(--ids-comp-tag-outlined-color-bg-secondary-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-secondary-default);
+a.ids-tag.ids-tag-outlined.ids-tag-secondary:active {
+  color: var(--ids-comp-tag-outlined-color-fg-label-secondary-pressed);
+  background: var(--ids-comp-tag-outlined-color-bg-secondary-pressed);
+  border-color: var(--ids-comp-tag-outlined-color-border-secondary-pressed);
 }
-.ids-tag.ids-tag-outlined.ids-tag-brand {
+a.ids-tag.ids-tag-outlined.ids-tag-brand {
   color: var(--ids-comp-tag-outlined-color-fg-label-brand-default);
   background: var(--ids-comp-tag-outlined-color-bg-brand-default);
   border-color: var(--ids-comp-tag-outlined-color-border-brand-default);
 }
-.ids-tag.ids-tag-outlined.ids-tag-brand:hover {
-  color: var(--ids-comp-tag-outlined-color-fg-label-brand-default);
-  background: var(--ids-comp-tag-outlined-color-bg-brand-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-brand-default);
+a.ids-tag.ids-tag-outlined.ids-tag-brand:hover {
+  color: var(--ids-comp-tag-outlined-color-fg-label-brand-hovered);
+  background: var(--ids-comp-tag-outlined-color-bg-brand-hovered);
+  border-color: var(--ids-comp-tag-outlined-color-border-brand-hovered);
 }
-.ids-tag.ids-tag-outlined.ids-tag-brand:focus, .ids-tag.ids-tag-outlined.ids-tag-brand:focus-visible {
-  color: var(--ids-comp-tag-outlined-color-fg-label-brand-default);
-  background: var(--ids-comp-tag-outlined-color-bg-brand-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-brand-default);
+a.ids-tag.ids-tag-outlined.ids-tag-brand:focus, a.ids-tag.ids-tag-outlined.ids-tag-brand:focus-visible {
+  color: var(--ids-comp-tag-outlined-color-fg-label-brand-focused);
+  background: var(--ids-comp-tag-outlined-color-bg-brand-focused);
+  border-color: var(--ids-comp-tag-outlined-color-border-brand-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-outlined.ids-tag-brand:active {
-  color: var(--ids-comp-tag-outlined-color-fg-label-brand-default);
-  background: var(--ids-comp-tag-outlined-color-bg-brand-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-brand-default);
+a.ids-tag.ids-tag-outlined.ids-tag-brand:active {
+  color: var(--ids-comp-tag-outlined-color-fg-label-brand-pressed);
+  background: var(--ids-comp-tag-outlined-color-bg-brand-pressed);
+  border-color: var(--ids-comp-tag-outlined-color-border-brand-pressed);
 }
-.ids-tag.ids-tag-outlined.ids-tag-error {
+a.ids-tag.ids-tag-outlined.ids-tag-error {
   color: var(--ids-comp-tag-outlined-color-fg-label-error-default);
   background: var(--ids-comp-tag-outlined-color-bg-error-default);
   border-color: var(--ids-comp-tag-outlined-color-border-error-default);
 }
-.ids-tag.ids-tag-outlined.ids-tag-error:hover {
-  color: var(--ids-comp-tag-outlined-color-fg-label-error-default);
-  background: var(--ids-comp-tag-outlined-color-bg-error-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-error-default);
+a.ids-tag.ids-tag-outlined.ids-tag-error:hover {
+  color: var(--ids-comp-tag-outlined-color-fg-label-error-hovered);
+  background: var(--ids-comp-tag-outlined-color-bg-error-hovered);
+  border-color: var(--ids-comp-tag-outlined-color-border-error-hovered);
 }
-.ids-tag.ids-tag-outlined.ids-tag-error:focus, .ids-tag.ids-tag-outlined.ids-tag-error:focus-visible {
-  color: var(--ids-comp-tag-outlined-color-fg-label-error-default);
-  background: var(--ids-comp-tag-outlined-color-bg-error-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-error-default);
+a.ids-tag.ids-tag-outlined.ids-tag-error:focus, a.ids-tag.ids-tag-outlined.ids-tag-error:focus-visible {
+  color: var(--ids-comp-tag-outlined-color-fg-label-error-focused);
+  background: var(--ids-comp-tag-outlined-color-bg-error-focused);
+  border-color: var(--ids-comp-tag-outlined-color-border-error-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-outlined.ids-tag-error:active {
-  color: var(--ids-comp-tag-outlined-color-fg-label-error-default);
-  background: var(--ids-comp-tag-outlined-color-bg-error-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-error-default);
+a.ids-tag.ids-tag-outlined.ids-tag-error:active {
+  color: var(--ids-comp-tag-outlined-color-fg-label-error-pressed);
+  background: var(--ids-comp-tag-outlined-color-bg-error-pressed);
+  border-color: var(--ids-comp-tag-outlined-color-border-error-pressed);
 }
-.ids-tag.ids-tag-outlined.ids-tag-success {
+a.ids-tag.ids-tag-outlined.ids-tag-success {
   color: var(--ids-comp-tag-outlined-color-fg-label-success-default);
   background: var(--ids-comp-tag-outlined-color-bg-success-default);
   border-color: var(--ids-comp-tag-outlined-color-border-success-default);
 }
-.ids-tag.ids-tag-outlined.ids-tag-success:hover {
-  color: var(--ids-comp-tag-outlined-color-fg-label-success-default);
-  background: var(--ids-comp-tag-outlined-color-bg-success-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-success-default);
+a.ids-tag.ids-tag-outlined.ids-tag-success:hover {
+  color: var(--ids-comp-tag-outlined-color-fg-label-success-hovered);
+  background: var(--ids-comp-tag-outlined-color-bg-success-hovered);
+  border-color: var(--ids-comp-tag-outlined-color-border-success-hovered);
 }
-.ids-tag.ids-tag-outlined.ids-tag-success:focus, .ids-tag.ids-tag-outlined.ids-tag-success:focus-visible {
-  color: var(--ids-comp-tag-outlined-color-fg-label-success-default);
-  background: var(--ids-comp-tag-outlined-color-bg-success-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-success-default);
+a.ids-tag.ids-tag-outlined.ids-tag-success:focus, a.ids-tag.ids-tag-outlined.ids-tag-success:focus-visible {
+  color: var(--ids-comp-tag-outlined-color-fg-label-success-focused);
+  background: var(--ids-comp-tag-outlined-color-bg-success-focused);
+  border-color: var(--ids-comp-tag-outlined-color-border-success-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-outlined.ids-tag-success:active {
-  color: var(--ids-comp-tag-outlined-color-fg-label-success-default);
-  background: var(--ids-comp-tag-outlined-color-bg-success-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-success-default);
+a.ids-tag.ids-tag-outlined.ids-tag-success:active {
+  color: var(--ids-comp-tag-outlined-color-fg-label-success-pressed);
+  background: var(--ids-comp-tag-outlined-color-bg-success-pressed);
+  border-color: var(--ids-comp-tag-outlined-color-border-success-pressed);
 }
-.ids-tag.ids-tag-outlined.ids-tag-warning {
+a.ids-tag.ids-tag-outlined.ids-tag-warning {
   color: var(--ids-comp-tag-outlined-color-fg-label-warning-default);
   background: var(--ids-comp-tag-outlined-color-bg-warning-default);
   border-color: var(--ids-comp-tag-outlined-color-border-warning-default);
 }
-.ids-tag.ids-tag-outlined.ids-tag-warning:hover {
-  color: var(--ids-comp-tag-outlined-color-fg-label-warning-default);
-  background: var(--ids-comp-tag-outlined-color-bg-warning-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-warning-default);
+a.ids-tag.ids-tag-outlined.ids-tag-warning:hover {
+  color: var(--ids-comp-tag-outlined-color-fg-label-warning-hovered);
+  background: var(--ids-comp-tag-outlined-color-bg-warning-hovered);
+  border-color: var(--ids-comp-tag-outlined-color-border-warning-hovered);
 }
-.ids-tag.ids-tag-outlined.ids-tag-warning:focus, .ids-tag.ids-tag-outlined.ids-tag-warning:focus-visible {
-  color: var(--ids-comp-tag-outlined-color-fg-label-warning-default);
-  background: var(--ids-comp-tag-outlined-color-bg-warning-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-warning-default);
+a.ids-tag.ids-tag-outlined.ids-tag-warning:focus, a.ids-tag.ids-tag-outlined.ids-tag-warning:focus-visible {
+  color: var(--ids-comp-tag-outlined-color-fg-label-warning-focused);
+  background: var(--ids-comp-tag-outlined-color-bg-warning-focused);
+  border-color: var(--ids-comp-tag-outlined-color-border-warning-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-outlined.ids-tag-warning:active {
-  color: var(--ids-comp-tag-outlined-color-fg-label-warning-default);
-  background: var(--ids-comp-tag-outlined-color-bg-warning-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-warning-default);
+a.ids-tag.ids-tag-outlined.ids-tag-warning:active {
+  color: var(--ids-comp-tag-outlined-color-fg-label-warning-pressed);
+  background: var(--ids-comp-tag-outlined-color-bg-warning-pressed);
+  border-color: var(--ids-comp-tag-outlined-color-border-warning-pressed);
 }
-.ids-tag.ids-tag-outlined.ids-tag-light {
+a.ids-tag.ids-tag-outlined.ids-tag-light {
   color: var(--ids-comp-tag-outlined-color-fg-label-light-default);
   background: var(--ids-comp-tag-outlined-color-bg-light-default);
   border-color: var(--ids-comp-tag-outlined-color-border-light-default);
 }
-.ids-tag.ids-tag-outlined.ids-tag-light:hover {
-  color: var(--ids-comp-tag-outlined-color-fg-label-light-default);
-  background: var(--ids-comp-tag-outlined-color-bg-light-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-light-default);
+a.ids-tag.ids-tag-outlined.ids-tag-light:hover {
+  color: var(--ids-comp-tag-outlined-color-fg-label-light-hovered);
+  background: var(--ids-comp-tag-outlined-color-bg-light-hovered);
+  border-color: var(--ids-comp-tag-outlined-color-border-light-hovered);
 }
-.ids-tag.ids-tag-outlined.ids-tag-light:focus, .ids-tag.ids-tag-outlined.ids-tag-light:focus-visible {
-  color: var(--ids-comp-tag-outlined-color-fg-label-light-default);
-  background: var(--ids-comp-tag-outlined-color-bg-light-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-light-default);
+a.ids-tag.ids-tag-outlined.ids-tag-light:focus, a.ids-tag.ids-tag-outlined.ids-tag-light:focus-visible {
+  color: var(--ids-comp-tag-outlined-color-fg-label-light-focused);
+  background: var(--ids-comp-tag-outlined-color-bg-light-focused);
+  border-color: var(--ids-comp-tag-outlined-color-border-light-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-light-focused);
 }
-.ids-tag.ids-tag-outlined.ids-tag-light:active {
-  color: var(--ids-comp-tag-outlined-color-fg-label-light-default);
-  background: var(--ids-comp-tag-outlined-color-bg-light-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-light-default);
+a.ids-tag.ids-tag-outlined.ids-tag-light:active {
+  color: var(--ids-comp-tag-outlined-color-fg-label-light-pressed);
+  background: var(--ids-comp-tag-outlined-color-bg-light-pressed);
+  border-color: var(--ids-comp-tag-outlined-color-border-light-pressed);
 }
-.ids-tag.ids-tag-outlined.ids-tag-dark {
+a.ids-tag.ids-tag-outlined.ids-tag-dark {
   color: var(--ids-comp-tag-outlined-color-fg-label-dark-default);
   background: var(--ids-comp-tag-outlined-color-bg-dark-default);
   border-color: var(--ids-comp-tag-outlined-color-border-dark-default);
 }
-.ids-tag.ids-tag-outlined.ids-tag-dark:hover {
-  color: var(--ids-comp-tag-outlined-color-fg-label-dark-default);
-  background: var(--ids-comp-tag-outlined-color-bg-dark-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-dark-default);
+a.ids-tag.ids-tag-outlined.ids-tag-dark:hover {
+  color: var(--ids-comp-tag-outlined-color-fg-label-dark-hovered);
+  background: var(--ids-comp-tag-outlined-color-bg-dark-hovered);
+  border-color: var(--ids-comp-tag-outlined-color-border-dark-hovered);
 }
-.ids-tag.ids-tag-outlined.ids-tag-dark:focus, .ids-tag.ids-tag-outlined.ids-tag-dark:focus-visible {
-  color: var(--ids-comp-tag-outlined-color-fg-label-dark-default);
-  background: var(--ids-comp-tag-outlined-color-bg-dark-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-dark-default);
+a.ids-tag.ids-tag-outlined.ids-tag-dark:focus, a.ids-tag.ids-tag-outlined.ids-tag-dark:focus-visible {
+  color: var(--ids-comp-tag-outlined-color-fg-label-dark-focused);
+  background: var(--ids-comp-tag-outlined-color-bg-dark-focused);
+  border-color: var(--ids-comp-tag-outlined-color-border-dark-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-outlined.ids-tag-dark:active {
-  color: var(--ids-comp-tag-outlined-color-fg-label-dark-default);
-  background: var(--ids-comp-tag-outlined-color-bg-dark-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-dark-default);
+a.ids-tag.ids-tag-outlined.ids-tag-dark:active {
+  color: var(--ids-comp-tag-outlined-color-fg-label-dark-pressed);
+  background: var(--ids-comp-tag-outlined-color-bg-dark-pressed);
+  border-color: var(--ids-comp-tag-outlined-color-border-dark-pressed);
 }
-.ids-tag.ids-tag-outlined.ids-tag-surface {
+a.ids-tag.ids-tag-outlined.ids-tag-surface {
   color: var(--ids-comp-tag-outlined-color-fg-label-surface-default);
   background: var(--ids-comp-tag-outlined-color-bg-surface-default);
   border-color: var(--ids-comp-tag-outlined-color-border-surface-default);
 }
-.ids-tag.ids-tag-outlined.ids-tag-surface:hover {
-  color: var(--ids-comp-tag-outlined-color-fg-label-surface-default);
-  background: var(--ids-comp-tag-outlined-color-bg-surface-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-surface-default);
+a.ids-tag.ids-tag-outlined.ids-tag-surface:hover {
+  color: var(--ids-comp-tag-outlined-color-fg-label-surface-hovered);
+  background: var(--ids-comp-tag-outlined-color-bg-surface-hovered);
+  border-color: var(--ids-comp-tag-outlined-color-border-surface-hovered);
 }
-.ids-tag.ids-tag-outlined.ids-tag-surface:focus, .ids-tag.ids-tag-outlined.ids-tag-surface:focus-visible {
-  color: var(--ids-comp-tag-outlined-color-fg-label-surface-default);
-  background: var(--ids-comp-tag-outlined-color-bg-surface-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-surface-default);
+a.ids-tag.ids-tag-outlined.ids-tag-surface:focus, a.ids-tag.ids-tag-outlined.ids-tag-surface:focus-visible {
+  color: var(--ids-comp-tag-outlined-color-fg-label-surface-focused);
+  background: var(--ids-comp-tag-outlined-color-bg-surface-focused);
+  border-color: var(--ids-comp-tag-outlined-color-border-surface-focused);
   outline-color: var(--ids-comp-tag-focused-outline-color-dark-focused);
 }
-.ids-tag.ids-tag-outlined.ids-tag-surface:active {
-  color: var(--ids-comp-tag-outlined-color-fg-label-surface-default);
-  background: var(--ids-comp-tag-outlined-color-bg-surface-default);
-  border-color: var(--ids-comp-tag-outlined-color-border-surface-default);
+a.ids-tag.ids-tag-outlined.ids-tag-surface:active {
+  color: var(--ids-comp-tag-outlined-color-fg-label-surface-pressed);
+  background: var(--ids-comp-tag-outlined-color-bg-surface-pressed);
+  border-color: var(--ids-comp-tag-outlined-color-border-surface-pressed);
 }
 
-button.ids-tag :not(:disabled) {
-  cursor: pointer;
+.ids-tag-group {
+  display: inline-flex;
+  flex-wrap: wrap;
+  align-items: center;
+  align-content: center;
 }
-button.ids-tag :disabled {
-  cursor: not-allowed;
+.ids-tag-group.ids-tag-group-compact {
+  gap: var(--ids-comp-tag-group-size-row-gap-compact) var(--ids-comp-tag-group-size-column-gap-compact);
+  padding: var(--ids-comp-tag-group-size-padding-y-compact) var(--ids-comp-tag-group-size-padding-x-compact);
+}
+.ids-tag-group.ids-tag-group-comfortable {
+  gap: var(--ids-comp-tag-group-size-row-gap-comfortable) var(--ids-comp-tag-group-size-column-gap-comfortable);
+  padding: var(--ids-comp-tag-group-size-padding-y-comfortable) var(--ids-comp-tag-group-size-padding-x-comfortable);
+}
+.ids-tag-group.ids-tag-group-spacious {
+  gap: var(--ids-comp-tag-group-size-row-gap-spacious) var(--ids-comp-tag-group-size-column-gap-spacious);
+  padding: var(--ids-comp-tag-group-size-padding-y-spacious) var(--ids-comp-tag-group-size-padding-x-spacious);
+}
+.ids-tag-group.ids-tag-group-dense {
+  gap: var(--ids-comp-tag-group-size-row-gap-dense) var(--ids-comp-tag-group-size-column-gap-dense);
+  padding: var(--ids-comp-tag-group-size-padding-y-dense) var(--ids-comp-tag-group-size-padding-x-dense);
 }
 
 .ids-tooltip {