npm - @i-cell/ids-styles - Versions diffs - 0.0.21 → 0.0.23 - Mend

@i-cell/ids-styles 0.0.21 → 0.0.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/dist/components.css +819 -187
package/dist/components.min.css +1 -1
package/dist/components.plugin.js +822 -112
package/dist/notification/notification.css +61 -187
package/dist/notification/notification.min.css +1 -1
package/dist/notification/notification.plugin.js +171 -112
package/dist/tab/tab.css +757 -0
package/dist/tab/tab.min.css +1 -0
package/dist/tab/tab.plugin.js +660 -0
package/package.json +1 -1

package/dist/components.plugin.js CHANGED Viewed

@@ -6723,10 +6723,8 @@ module.exports = function ComponentsPlugin() {
       '.ids-notification>.ids-notification__content-wrapper>.ids-notification__container': {
         display: 'flex',
         justifyContent: 'space-between',
-        alignItems: 'center',
         alignContent: 'center',
         flex: '1 0 0',
-        flexWrap: 'wrap',
       },
       '.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container': {
         display: 'flex',
@@ -6739,11 +6737,19 @@ module.exports = function ComponentsPlugin() {
       '.ids-notification>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action': {
         display: 'flex',
         alignItems: 'center',
+        flexShrink: 0,
       },
-      '.ids-notification>.ids-notification__content-wrapper>.ids-notification__close-btn-container.ids-notification__label-btn': {
+      '.ids-notification>.ids-notification__content-wrapper>.ids-notification__close-button-container.ids-notification__label-button': {
         display: 'flex',
         alignSelf: 'center',
       },
+      '.ids-notification.ids-notification-actions-bottom-mode>.ids-notification__content-wrapper>.ids-notification__container': {
+        flexDirection: 'column',
+        alignItems: 'flex-start',
+      },
+      '.ids-notification:not(.ids-notification-actions-bottom-mode)>.ids-notification__content-wrapper>.ids-notification__container': {
+        alignItems: 'center',
+      },
       '.ids-notification.ids-notification-filled.ids-notification-error>.ids-notification__content-wrapper': {
         borderColor: 'var(--ids-comp-notification-filled-color-border-error-default)',
         background: 'var(--ids-comp-notification-filled-color-bg-error-default)',
@@ -6814,7 +6820,126 @@ module.exports = function ComponentsPlugin() {
         { color: 'var(--ids-comp-notification-filled-color-fg-title-info-default)' },
       '.ids-notification.ids-notification-filled.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
         { color: 'var(--ids-comp-notification-filled-color-fg-message-info-default)' },
-      '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper': {
+      '.ids-notification.ids-notification-filled.ids-notification-compact>.ids-notification__content-wrapper': {
+        gap: 'var(--ids-comp-notification-filled-container-size-gap-compact)',
+        padding:
+          'var(--ids-comp-notification-filled-container-size-padding-y-compact) var(--ids-comp-notification-filled-container-size-padding-x-compact)',
+        borderRadius: 'var(--ids-comp-notification-filled-container-size-border-radius-compact)',
+        borderTopWidth: 'var(--ids-comp-notification-filled-container-size-border-top-width-compact)',
+        borderRightWidth: 'var(--ids-comp-notification-filled-container-size-border-right-width-compact)',
+        borderBottomWidth: 'var(--ids-comp-notification-filled-container-size-border-bottom-width-compact)',
+        borderLeftWidth: 'var(--ids-comp-notification-filled-container-size-border-left-width-compact)',
+      },
+      '.ids-notification.ids-notification-filled.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container':
+        { minWidth: 'var(--ids-comp-notification-filled-container-size-min-width-compact)' },
+      '.ids-notification.ids-notification-filled.ids-notification-comfortable>.ids-notification__content-wrapper': {
+        gap: 'var(--ids-comp-notification-filled-container-size-gap-comfortable)',
+        padding:
+          'var(--ids-comp-notification-filled-container-size-padding-y-comfortable) var(--ids-comp-notification-filled-container-size-padding-x-comfortable)',
+        borderRadius: 'var(--ids-comp-notification-filled-container-size-border-radius-comfortable)',
+        borderTopWidth: 'var(--ids-comp-notification-filled-container-size-border-top-width-comfortable)',
+        borderRightWidth: 'var(--ids-comp-notification-filled-container-size-border-right-width-comfortable)',
+        borderBottomWidth: 'var(--ids-comp-notification-filled-container-size-border-bottom-width-comfortable)',
+        borderLeftWidth: 'var(--ids-comp-notification-filled-container-size-border-left-width-comfortable)',
+      },
+      '.ids-notification.ids-notification-filled.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container':
+        { minWidth: 'var(--ids-comp-notification-filled-container-size-min-width-comfortable)' },
+      '.ids-notification.ids-notification-filled.ids-notification-spacious>.ids-notification__content-wrapper': {
+        gap: 'var(--ids-comp-notification-filled-container-size-gap-spacious)',
+        padding:
+          'var(--ids-comp-notification-filled-container-size-padding-y-spacious) var(--ids-comp-notification-filled-container-size-padding-x-spacious)',
+        borderRadius: 'var(--ids-comp-notification-filled-container-size-border-radius-spacious)',
+        borderTopWidth: 'var(--ids-comp-notification-filled-container-size-border-top-width-spacious)',
+        borderRightWidth: 'var(--ids-comp-notification-filled-container-size-border-right-width-spacious)',
+        borderBottomWidth: 'var(--ids-comp-notification-filled-container-size-border-bottom-width-spacious)',
+        borderLeftWidth: 'var(--ids-comp-notification-filled-container-size-border-left-width-spacious)',
+      },
+      '.ids-notification.ids-notification-filled.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container':
+        { minWidth: 'var(--ids-comp-notification-filled-container-size-min-width-spacious)' },
+      '.ids-notification.ids-notification-filled.ids-notification-dense>.ids-notification__content-wrapper': {
+        gap: 'var(--ids-comp-notification-filled-container-size-gap-dense)',
+        padding:
+          'var(--ids-comp-notification-filled-container-size-padding-y-dense) var(--ids-comp-notification-filled-container-size-padding-x-dense)',
+        borderRadius: 'var(--ids-comp-notification-filled-container-size-border-radius-dense)',
+        borderTopWidth: 'var(--ids-comp-notification-filled-container-size-border-top-width-dense)',
+        borderRightWidth: 'var(--ids-comp-notification-filled-container-size-border-right-width-dense)',
+        borderBottomWidth: 'var(--ids-comp-notification-filled-container-size-border-bottom-width-dense)',
+        borderLeftWidth: 'var(--ids-comp-notification-filled-container-size-border-left-width-dense)',
+      },
+      '.ids-notification.ids-notification-filled.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container': {
+        minWidth: 'var(--ids-comp-notification-filled-container-size-min-width-dense)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper': {
+        borderColor: 'var(--ids-comp-notification-outlined-color-border-error-default)',
+        background: 'var(--ids-comp-notification-outlined-color-bg-error-default)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-error-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-title-error-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-message-error-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper': {
+        borderColor: 'var(--ids-comp-notification-outlined-color-border-success-default)',
+        background: 'var(--ids-comp-notification-outlined-color-bg-success-default)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-success-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-title-success-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-message-success-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper': {
+        borderColor: 'var(--ids-comp-notification-outlined-color-border-warning-default)',
+        background: 'var(--ids-comp-notification-outlined-color-bg-warning-default)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-warning-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-title-warning-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-message-warning-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper': {
+        borderColor: 'var(--ids-comp-notification-outlined-color-border-light-default)',
+        background: 'var(--ids-comp-notification-outlined-color-bg-light-default)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-light-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-title-light-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-message-light-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper': {
+        borderColor: 'var(--ids-comp-notification-outlined-color-border-dark-default)',
+        background: 'var(--ids-comp-notification-outlined-color-bg-dark-default)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-dark-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-title-dark-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-message-dark-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper': {
+        borderColor: 'var(--ids-comp-notification-outlined-color-border-surface-default)',
+        background: 'var(--ids-comp-notification-outlined-color-bg-surface-default)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-surface-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-title-surface-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-message-surface-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper': {
+        borderColor: 'var(--ids-comp-notification-outlined-color-border-info-default)',
+        background: 'var(--ids-comp-notification-outlined-color-bg-info-default)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-info-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-title-info-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
+        { color: 'var(--ids-comp-notification-outlined-color-fg-message-info-default)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-compact>.ids-notification__content-wrapper': {
         gap: 'var(--ids-comp-notification-outlined-container-size-gap-compact)',
         padding:
           'var(--ids-comp-notification-outlined-container-size-padding-y-compact) var(--ids-comp-notification-outlined-container-size-padding-x-compact)',
@@ -6824,6 +6949,44 @@ module.exports = function ComponentsPlugin() {
         borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-compact)',
         borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-compact)',
       },
+      '.ids-notification.ids-notification-outlined.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container':
+        { minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-compact)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-comfortable>.ids-notification__content-wrapper': {
+        gap: 'var(--ids-comp-notification-outlined-container-size-gap-comfortable)',
+        padding:
+          'var(--ids-comp-notification-outlined-container-size-padding-y-comfortable) var(--ids-comp-notification-outlined-container-size-padding-x-comfortable)',
+        borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-comfortable)',
+        borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-comfortable)',
+        borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-comfortable)',
+        borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-comfortable)',
+        borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-comfortable)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container':
+        { minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-comfortable)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-spacious>.ids-notification__content-wrapper': {
+        gap: 'var(--ids-comp-notification-outlined-container-size-gap-spacious)',
+        padding:
+          'var(--ids-comp-notification-outlined-container-size-padding-y-spacious) var(--ids-comp-notification-outlined-container-size-padding-x-spacious)',
+        borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-spacious)',
+        borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-spacious)',
+        borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-spacious)',
+        borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-spacious)',
+        borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-spacious)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container':
+        { minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-spacious)' },
+      '.ids-notification.ids-notification-outlined.ids-notification-dense>.ids-notification__content-wrapper': {
+        gap: 'var(--ids-comp-notification-outlined-container-size-gap-dense)',
+        padding:
+          'var(--ids-comp-notification-outlined-container-size-padding-y-dense) var(--ids-comp-notification-outlined-container-size-padding-x-dense)',
+        borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-dense)',
+        borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-dense)',
+        borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-dense)',
+        borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-dense)',
+        borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-dense)',
+      },
+      '.ids-notification.ids-notification-outlined.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container':
+        { minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-dense)' },
       '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__leading-element': {
         paddingLeft: 'var(--ids-comp-notification-icon-size-padding-left-compact)',
         paddingRight: 'var(--ids-comp-notification-icon-size-padding-right-compact)',
@@ -6836,7 +6999,6 @@ module.exports = function ComponentsPlugin() {
         lineHeight: 'var(--ids-comp-notification-icon-typography-line-height-compact)',
       },
       '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container': {
-        minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-compact)',
         paddingRight: 'var(--ids-comp-notification-message-size-padding-right-compact)',
         gap: 'var(--ids-comp-notification-message-size-gap-compact)',
       },
@@ -6858,21 +7020,11 @@ module.exports = function ComponentsPlugin() {
         },
       '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action':
         { gap: 'var(--ids-comp-notification-actions-size-gap-compact)' },
-      '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon':
+      '.ids-notification.ids-notification-compact>.ids-notification__content-wrapper>.ids-notification__close-button-container>.ids-icon-button>.ids-icon':
         {
           width: 'var(--ids-comp-notification-icon-button-size-icon-button-compact)',
           height: 'var(--ids-comp-notification-icon-button-size-icon-button-compact)',
         },
-      '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper': {
-        gap: 'var(--ids-comp-notification-outlined-container-size-gap-comfortable)',
-        padding:
-          'var(--ids-comp-notification-outlined-container-size-padding-y-comfortable) var(--ids-comp-notification-outlined-container-size-padding-x-comfortable)',
-        borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-comfortable)',
-        borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-comfortable)',
-        borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-comfortable)',
-        borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-comfortable)',
-        borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-comfortable)',
-      },
       '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__leading-element': {
         paddingLeft: 'var(--ids-comp-notification-icon-size-padding-left-comfortable)',
         paddingRight: 'var(--ids-comp-notification-icon-size-padding-right-comfortable)',
@@ -6885,7 +7037,6 @@ module.exports = function ComponentsPlugin() {
         lineHeight: 'var(--ids-comp-notification-icon-typography-line-height-comfortable)',
       },
       '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container': {
-        minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-comfortable)',
         paddingRight: 'var(--ids-comp-notification-message-size-padding-right-comfortable)',
         gap: 'var(--ids-comp-notification-message-size-gap-comfortable)',
       },
@@ -6907,21 +7058,11 @@ module.exports = function ComponentsPlugin() {
         },
       '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action':
         { gap: 'var(--ids-comp-notification-actions-size-gap-comfortable)' },
-      '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon':
+      '.ids-notification.ids-notification-comfortable>.ids-notification__content-wrapper>.ids-notification__close-button-container>.ids-icon-button>.ids-icon':
         {
           width: 'var(--ids-comp-notification-icon-button-size-icon-button-comfortable)',
           height: 'var(--ids-comp-notification-icon-button-size-icon-button-comfortable)',
         },
-      '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper': {
-        gap: 'var(--ids-comp-notification-outlined-container-size-gap-spacious)',
-        padding:
-          'var(--ids-comp-notification-outlined-container-size-padding-y-spacious) var(--ids-comp-notification-outlined-container-size-padding-x-spacious)',
-        borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-spacious)',
-        borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-spacious)',
-        borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-spacious)',
-        borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-spacious)',
-        borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-spacious)',
-      },
       '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__leading-element': {
         paddingLeft: 'var(--ids-comp-notification-icon-size-padding-left-spacious)',
         paddingRight: 'var(--ids-comp-notification-icon-size-padding-right-spacious)',
@@ -6934,7 +7075,6 @@ module.exports = function ComponentsPlugin() {
         lineHeight: 'var(--ids-comp-notification-icon-typography-line-height-spacious)',
       },
       '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container': {
-        minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-spacious)',
         paddingRight: 'var(--ids-comp-notification-message-size-padding-right-spacious)',
         gap: 'var(--ids-comp-notification-message-size-gap-spacious)',
       },
@@ -6956,21 +7096,11 @@ module.exports = function ComponentsPlugin() {
         },
       '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action':
         { gap: 'var(--ids-comp-notification-actions-size-gap-spacious)' },
-      '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon':
+      '.ids-notification.ids-notification-spacious>.ids-notification__content-wrapper>.ids-notification__close-button-container>.ids-icon-button>.ids-icon':
         {
           width: 'var(--ids-comp-notification-icon-button-size-icon-button-spacious)',
           height: 'var(--ids-comp-notification-icon-button-size-icon-button-spacious)',
         },
-      '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper': {
-        gap: 'var(--ids-comp-notification-outlined-container-size-gap-dense)',
-        padding:
-          'var(--ids-comp-notification-outlined-container-size-padding-y-dense) var(--ids-comp-notification-outlined-container-size-padding-x-dense)',
-        borderRadius: 'var(--ids-comp-notification-outlined-container-size-border-radius-dense)',
-        borderTopWidth: 'var(--ids-comp-notification-outlined-container-size-border-top-width-dense)',
-        borderRightWidth: 'var(--ids-comp-notification-outlined-container-size-border-right-width-dense)',
-        borderBottomWidth: 'var(--ids-comp-notification-outlined-container-size-border-bottom-width-dense)',
-        borderLeftWidth: 'var(--ids-comp-notification-outlined-container-size-border-left-width-dense)',
-      },
       '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__leading-element': {
         paddingLeft: 'var(--ids-comp-notification-icon-size-padding-left-dense)',
         paddingRight: 'var(--ids-comp-notification-icon-size-padding-right-dense)',
@@ -6983,7 +7113,6 @@ module.exports = function ComponentsPlugin() {
         lineHeight: 'var(--ids-comp-notification-icon-typography-line-height-dense)',
       },
       '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container': {
-        minWidth: 'var(--ids-comp-notification-outlined-container-size-min-width-dense)',
         paddingRight: 'var(--ids-comp-notification-message-size-padding-right-dense)',
         gap: 'var(--ids-comp-notification-message-size-gap-dense)',
       },
@@ -7005,81 +7134,11 @@ module.exports = function ComponentsPlugin() {
         },
       '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__action':
         { gap: 'var(--ids-comp-notification-actions-size-gap-dense)' },
-      '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__close-btn-container>.ids-icon-button>.ids-icon':
+      '.ids-notification.ids-notification-dense>.ids-notification__content-wrapper>.ids-notification__close-button-container>.ids-icon-button>.ids-icon':
         {
           width: 'var(--ids-comp-notification-icon-button-size-icon-button-dense)',
           height: 'var(--ids-comp-notification-icon-button-size-icon-button-dense)',
         },
-      '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper': {
-        borderColor: 'var(--ids-comp-notification-outlined-color-border-error-default)',
-        background: 'var(--ids-comp-notification-outlined-color-bg-error-default)',
-      },
-      '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-error-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-title-error-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-error>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-message-error-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper': {
-        borderColor: 'var(--ids-comp-notification-outlined-color-border-success-default)',
-        background: 'var(--ids-comp-notification-outlined-color-bg-success-default)',
-      },
-      '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-success-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-title-success-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-success>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-message-success-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper': {
-        borderColor: 'var(--ids-comp-notification-outlined-color-border-warning-default)',
-        background: 'var(--ids-comp-notification-outlined-color-bg-warning-default)',
-      },
-      '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-warning-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-title-warning-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-warning>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-message-warning-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper': {
-        borderColor: 'var(--ids-comp-notification-outlined-color-border-light-default)',
-        background: 'var(--ids-comp-notification-outlined-color-bg-light-default)',
-      },
-      '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-light-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-title-light-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-light>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-message-light-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper': {
-        borderColor: 'var(--ids-comp-notification-outlined-color-border-dark-default)',
-        background: 'var(--ids-comp-notification-outlined-color-bg-dark-default)',
-      },
-      '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-dark-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-title-dark-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-dark>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-message-dark-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper': {
-        borderColor: 'var(--ids-comp-notification-outlined-color-border-surface-default)',
-        background: 'var(--ids-comp-notification-outlined-color-bg-surface-default)',
-      },
-      '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-surface-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-title-surface-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-surface>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-message-surface-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper': {
-        borderColor: 'var(--ids-comp-notification-outlined-color-border-info-default)',
-        background: 'var(--ids-comp-notification-outlined-color-bg-info-default)',
-      },
-      '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__leading-element>.ids-icon':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-icon-info-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__title':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-title-info-default)' },
-      '.ids-notification.ids-notification-outlined.ids-notification-info>.ids-notification__content-wrapper>.ids-notification__container>.ids-notification__title-msg-container>.ids-notification__message':
-        { color: 'var(--ids-comp-notification-outlined-color-fg-message-info-default)' },
       '.ids-option': { display: 'flex', alignItems: 'center', alignSelf: 'stretch', boxSizing: 'border-box', userSelect: 'none' },
       '.ids-option>.ids-option__text': { overflow: 'hidden', textOverflow: 'ellipsis', fontStyle: 'normal' },
       '.ids-option:not(.ids-option-disabled)': { cursor: 'pointer' },
@@ -10707,6 +10766,657 @@ module.exports = function ComponentsPlugin() {
       '.ids-switch.ids-switch-primary.ids-switch-disabled.ids-switch-on>.ids-switch__button>.ids-switch__track>.ids-switch__handle>.ids-icon':
         { color: 'var(--ids-comp-switch-handle-on-color-fg-icon-primary-disabled)' },
       '.ids-switch.ids-switch-disabled': { cursor: 'not-allowed' },
+      '.ids-tab-group': { display: 'flex' },
+      '.ids-tab-group .ids-tab-group__container': { display: 'flex', flexDirection: 'column', position: 'relative', flexShrink: 0 },
+      '.ids-tab-group .ids-tab-item__indicator': {
+        display: 'flex',
+        justifyContent: 'center',
+        position: 'absolute',
+        height: '100%',
+        pointerEvents: 'none',
+        zIndex: 1,
+      },
+      '.ids-tab-group .ids-tab-item__indicator .ids-tab-item__line': { position: 'relative', boxSizing: 'border-box', opacity: 0 },
+      '.ids-tab-group.ids-tab-group-horizontal': { flexDirection: 'column', alignItems: 'center', flexShrink: 0 },
+      '.ids-tab-group.ids-tab-group-horizontal>.ids-tab-group__container': { width: '100%' },
+      '.ids-tab-group.ids-tab-group-horizontal>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        justifyContent: 'center',
+      },
+      '.ids-tab-group.ids-tab-group-horizontal>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group.ids-tab-group-horizontal>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        { outlineOffset: '4px' },
+      '.ids-tab-group.ids-tab-group-horizontal.ids-tab-group-indicator-bottom>.ids-tab-group__container': {
+        borderBottomStyle: 'solid',
+        borderBottomColor: 'var(--ids-comp-tab-tabgroup-color-border-default)',
+      },
+      '.ids-tab-group.ids-tab-group-horizontal.ids-tab-group-indicator-bottom>.ids-tab-group__container .ids-tab-item__line': {
+        alignSelf: 'flex-end',
+        borderBottomStyle: 'solid',
+      },
+      '.ids-tab-group.ids-tab-group-horizontal.ids-tab-group-indicator-top>.ids-tab-group__container': {
+        borderTopStyle: 'solid',
+        borderTopColor: 'var(--ids-comp-tab-tabgroup-color-border-default)',
+      },
+      '.ids-tab-group.ids-tab-group-horizontal.ids-tab-group-indicator-top>.ids-tab-group__container .ids-tab-item__line': {
+        alignSelf: 'flex-start',
+        borderTopStyle: 'solid',
+      },
+      '.ids-tab-group.ids-tab-group-horizontal.ids-tab-group-stretch-tabs>.ids-tab-group__container .ids-tab-group__header': {
+        alignSelf: 'stretch',
+      },
+      '.ids-tab-group.ids-tab-group-horizontal.ids-tab-group-stretch-tabs>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        flexGrow: 1,
+      },
+      '.ids-tab-group.ids-tab-group-horizontal.ids-tab-group-start>.ids-tab-group__container .ids-tab-group__header': {
+        alignSelf: 'flex-start',
+      },
+      '.ids-tab-group.ids-tab-group-horizontal.ids-tab-group-center>.ids-tab-group__container .ids-tab-group__header': {
+        alignSelf: 'center',
+      },
+      '.ids-tab-group.ids-tab-group-horizontal.ids-tab-group-end>.ids-tab-group__container .ids-tab-group__header': {
+        alignSelf: 'flex-end',
+      },
+      '.ids-tab-group.ids-tab-group-horizontal>.ids-tab-body-content': { display: 'flex', alignItems: 'flex-start', alignSelf: 'stretch' },
+      '.ids-tab-group.ids-tab-group-horizontal .ids-tab-item__indicator': { left: '0', width: '100%' },
+      '.ids-tab-group.ids-tab-group-horizontal .ids-tab-item__indicator .ids-tab-item__line': { width: '100%' },
+      '.ids-tab-group.ids-tab-group-vertical': { display: 'inline-flex', alignItems: 'flex-start', width: '100%' },
+      '.ids-tab-group.ids-tab-group-vertical>.ids-tab-group__container .ids-tab-group__header': {
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        flexShrink: 0,
+      },
+      '.ids-tab-group.ids-tab-group-vertical>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': { alignSelf: 'stretch' },
+      '.ids-tab-group.ids-tab-group-vertical>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group.ids-tab-group-vertical>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        { outlineOffset: '2px' },
+      '.ids-tab-group.ids-tab-group-vertical>.ids-tab-body-content': { display: 'flex', justifyContent: 'center', alignSelf: 'stretch' },
+      '.ids-tab-group.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator': { left: '0' },
+      '.ids-tab-group.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator .ids-tab-item__line': {
+        borderLeftStyle: 'solid',
+      },
+      '.ids-tab-group.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator': { right: '0' },
+      '.ids-tab-group.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator .ids-tab-item__line': {
+        borderRightStyle: 'solid',
+      },
+      '.ids-tab-group.ids-tab-group-vertical .ids-tab-item__indicator': { top: '0' },
+      '.ids-tab-group.ids-tab-group-vertical .ids-tab-item__indicator .ids-tab-item__line': { alignSelf: 'flex-start', height: '100%' },
+      '.ids-tab-group .ids-tab-group__container .ids-tab-group__header': {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'flex-start',
+        listStyleType: 'none',
+        margin: '0',
+      },
+      '.ids-tab-group .ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        display: 'flex',
+        alignItems: 'center',
+        cursor: 'pointer',
+        position: 'relative',
+        borderStyle: 'solid',
+      },
+      '.ids-tab-group .ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group .ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        { outlineStyle: 'solid' },
+      '.ids-tab-group .ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item__label': {
+        display: 'inline-block',
+        textOverflow: 'ellipsis',
+        overflow: 'hidden',
+        whiteSpace: 'nowrap',
+      },
+      '.ids-tab-group .ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled': {
+        pointerEvents: 'none',
+        userSelect: 'none',
+      },
+      '.ids-tab-group .ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active>.ids-tab-item__indicator .ids-tab-item__line':
+        { opacity: 1 },
+      '.ids-tab-group.ids-tab-group-compact': {
+        padding: 'var(--ids-comp-tab-container-size-padding-y-compact) var(--ids-comp-tab-container-size-padding-x-compact)',
+        gap: 'var(--ids-comp-tab-container-size-gap-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-horizontal.ids-tab-group-indicator-bottom': {
+        borderBottomWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-horizontal.ids-tab-group-indicator-bottom .ids-tab-item__indicator': {
+        bottom:
+          'calc(0px - (var(--ids-comp-tab-item-active-indicator-size-width-compact) + var(--ids-comp-tab-item-size-border-width-compact)))',
+      },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-horizontal.ids-tab-group-indicator-bottom .ids-tab-item__indicator .ids-tab-item__line':
+        { borderBottomWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-compact)' },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-horizontal.ids-tab-group-indicator-top': {
+        borderTopWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-horizontal.ids-tab-group-indicator-top .ids-tab-item__indicator': {
+        top: 'calc(0px - (var(--ids-comp-tab-item-active-indicator-size-width-compact) + var(--ids-comp-tab-item-size-border-width-compact)))',
+      },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-horizontal.ids-tab-group-indicator-top .ids-tab-item__indicator .ids-tab-item__line':
+        { borderTopWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-compact)' },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator': {
+        borderLeftWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator .ids-tab-item__line':
+        { borderLeftWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-compact)' },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator': {
+        borderRightWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-compact.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator .ids-tab-item__line':
+        { borderRightWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-compact)' },
+      '.ids-tab-group.ids-tab-group-compact>.ids-tab-body-content': {
+        padding: 'var(--ids-comp-tab-tabpanel-size-padding-y-compact) var(--ids-comp-tab-tabpanel-size-padding-x-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-compact>.ids-tab-group__container .ids-tab-group__header': {
+        padding: 'var(--ids-comp-tab-tabgroup-size-padding-y-compact) var(--ids-comp-tab-tabgroup-size-padding-x-compact)',
+        gap: 'var(--ids-comp-tab-tabgroup-size-gap-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-compact>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        padding: 'var(--ids-comp-tab-item-size-padding-y-compact) var(--ids-comp-tab-item-size-padding-x-compact)',
+        gap: 'var(--ids-comp-tab-item-size-gap-compact)',
+        borderRadius: 'var(--ids-comp-tab-item-size-border-radius-compact)',
+        borderWidth: 'var(--ids-comp-tab-item-size-border-width-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-compact>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group.ids-tab-group-compact>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        { outlineWidth: 'var(--ids-comp-tab-item-focused-outline-size-outline-compact)' },
+      '.ids-tab-group.ids-tab-group-compact>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-tab-item__label': {
+        fontFamily: 'var(--ids-comp-tab-item-label-typography-font-family-compact)',
+        fontSize: 'var(--ids-comp-tab-item-label-typography-font-size-compact)',
+        fontWeight: 'var(--ids-comp-tab-item-label-typography-font-weight-compact)',
+        letterSpacing: 'var(--ids-comp-tab-item-label-typography-letter-spacing-compact)',
+        lineHeight: 'var(--ids-comp-tab-item-label-typography-line-height-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-compact>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-icon': {
+        fontSize: 'var(--ids-comp-tab-item-icon-typography-font-size-compact)',
+        fontWeight: 'var(--ids-comp-tab-item-icon-typography-font-weight-compact)',
+        lineHeight: 'var(--ids-comp-tab-item-icon-typography-line-height-compact)',
+        width: 'var(--ids-comp-tab-item-icon-size-width-compact)',
+        height: 'var(--ids-comp-tab-item-icon-size-height-compact)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable': {
+        padding: 'var(--ids-comp-tab-container-size-padding-y-comfortable) var(--ids-comp-tab-container-size-padding-x-comfortable)',
+        gap: 'var(--ids-comp-tab-container-size-gap-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-horizontal.ids-tab-group-indicator-bottom': {
+        borderBottomWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-horizontal.ids-tab-group-indicator-bottom .ids-tab-item__indicator': {
+        bottom:
+          'calc(0px - (var(--ids-comp-tab-item-active-indicator-size-width-comfortable) + var(--ids-comp-tab-item-size-border-width-comfortable)))',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-horizontal.ids-tab-group-indicator-bottom .ids-tab-item__indicator .ids-tab-item__line':
+        { borderBottomWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-comfortable)' },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-horizontal.ids-tab-group-indicator-top': {
+        borderTopWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-horizontal.ids-tab-group-indicator-top .ids-tab-item__indicator': {
+        top: 'calc(0px - (var(--ids-comp-tab-item-active-indicator-size-width-comfortable) + var(--ids-comp-tab-item-size-border-width-comfortable)))',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-horizontal.ids-tab-group-indicator-top .ids-tab-item__indicator .ids-tab-item__line':
+        { borderTopWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-comfortable)' },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator': {
+        borderLeftWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator .ids-tab-item__line':
+        { borderLeftWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-comfortable)' },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator': {
+        borderRightWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator .ids-tab-item__line':
+        { borderRightWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-comfortable)' },
+      '.ids-tab-group.ids-tab-group-comfortable>.ids-tab-body-content': {
+        padding: 'var(--ids-comp-tab-tabpanel-size-padding-y-comfortable) var(--ids-comp-tab-tabpanel-size-padding-x-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable>.ids-tab-group__container .ids-tab-group__header': {
+        padding: 'var(--ids-comp-tab-tabgroup-size-padding-y-comfortable) var(--ids-comp-tab-tabgroup-size-padding-x-comfortable)',
+        gap: 'var(--ids-comp-tab-tabgroup-size-gap-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        padding: 'var(--ids-comp-tab-item-size-padding-y-comfortable) var(--ids-comp-tab-item-size-padding-x-comfortable)',
+        gap: 'var(--ids-comp-tab-item-size-gap-comfortable)',
+        borderRadius: 'var(--ids-comp-tab-item-size-border-radius-comfortable)',
+        borderWidth: 'var(--ids-comp-tab-item-size-border-width-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group.ids-tab-group-comfortable>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        { outlineWidth: 'var(--ids-comp-tab-item-focused-outline-size-outline-comfortable)' },
+      '.ids-tab-group.ids-tab-group-comfortable>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-tab-item__label': {
+        fontFamily: 'var(--ids-comp-tab-item-label-typography-font-family-comfortable)',
+        fontSize: 'var(--ids-comp-tab-item-label-typography-font-size-comfortable)',
+        fontWeight: 'var(--ids-comp-tab-item-label-typography-font-weight-comfortable)',
+        letterSpacing: 'var(--ids-comp-tab-item-label-typography-letter-spacing-comfortable)',
+        lineHeight: 'var(--ids-comp-tab-item-label-typography-line-height-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-comfortable>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-icon': {
+        fontSize: 'var(--ids-comp-tab-item-icon-typography-font-size-comfortable)',
+        fontWeight: 'var(--ids-comp-tab-item-icon-typography-font-weight-comfortable)',
+        lineHeight: 'var(--ids-comp-tab-item-icon-typography-line-height-comfortable)',
+        width: 'var(--ids-comp-tab-item-icon-size-width-comfortable)',
+        height: 'var(--ids-comp-tab-item-icon-size-height-comfortable)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious': {
+        padding: 'var(--ids-comp-tab-container-size-padding-y-spacious) var(--ids-comp-tab-container-size-padding-x-spacious)',
+        gap: 'var(--ids-comp-tab-container-size-gap-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-horizontal.ids-tab-group-indicator-bottom': {
+        borderBottomWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-horizontal.ids-tab-group-indicator-bottom .ids-tab-item__indicator': {
+        bottom:
+          'calc(0px - (var(--ids-comp-tab-item-active-indicator-size-width-spacious) + var(--ids-comp-tab-item-size-border-width-spacious)))',
+      },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-horizontal.ids-tab-group-indicator-bottom .ids-tab-item__indicator .ids-tab-item__line':
+        { borderBottomWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-spacious)' },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-horizontal.ids-tab-group-indicator-top': {
+        borderTopWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-horizontal.ids-tab-group-indicator-top .ids-tab-item__indicator': {
+        top: 'calc(0px - (var(--ids-comp-tab-item-active-indicator-size-width-spacious) + var(--ids-comp-tab-item-size-border-width-spacious)))',
+      },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-horizontal.ids-tab-group-indicator-top .ids-tab-item__indicator .ids-tab-item__line':
+        { borderTopWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-spacious)' },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator': {
+        borderLeftWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator .ids-tab-item__line':
+        { borderLeftWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-spacious)' },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator': {
+        borderRightWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator .ids-tab-item__line':
+        { borderRightWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-spacious)' },
+      '.ids-tab-group.ids-tab-group-spacious>.ids-tab-body-content': {
+        padding: 'var(--ids-comp-tab-tabpanel-size-padding-y-spacious) var(--ids-comp-tab-tabpanel-size-padding-x-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious>.ids-tab-group__container .ids-tab-group__header': {
+        padding: 'var(--ids-comp-tab-tabgroup-size-padding-y-spacious) var(--ids-comp-tab-tabgroup-size-padding-x-spacious)',
+        gap: 'var(--ids-comp-tab-tabgroup-size-gap-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        padding: 'var(--ids-comp-tab-item-size-padding-y-spacious) var(--ids-comp-tab-item-size-padding-x-spacious)',
+        gap: 'var(--ids-comp-tab-item-size-gap-spacious)',
+        borderRadius: 'var(--ids-comp-tab-item-size-border-radius-spacious)',
+        borderWidth: 'var(--ids-comp-tab-item-size-border-width-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group.ids-tab-group-spacious>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        { outlineWidth: 'var(--ids-comp-tab-item-focused-outline-size-outline-spacious)' },
+      '.ids-tab-group.ids-tab-group-spacious>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-tab-item__label': {
+        fontFamily: 'var(--ids-comp-tab-item-label-typography-font-family-spacious)',
+        fontSize: 'var(--ids-comp-tab-item-label-typography-font-size-spacious)',
+        fontWeight: 'var(--ids-comp-tab-item-label-typography-font-weight-spacious)',
+        letterSpacing: 'var(--ids-comp-tab-item-label-typography-letter-spacing-spacious)',
+        lineHeight: 'var(--ids-comp-tab-item-label-typography-line-height-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-spacious>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-icon': {
+        fontSize: 'var(--ids-comp-tab-item-icon-typography-font-size-spacious)',
+        fontWeight: 'var(--ids-comp-tab-item-icon-typography-font-weight-spacious)',
+        lineHeight: 'var(--ids-comp-tab-item-icon-typography-line-height-spacious)',
+        width: 'var(--ids-comp-tab-item-icon-size-width-spacious)',
+        height: 'var(--ids-comp-tab-item-icon-size-height-spacious)',
+      },
+      '.ids-tab-group.ids-tab-group-dense': {
+        padding: 'var(--ids-comp-tab-container-size-padding-y-dense) var(--ids-comp-tab-container-size-padding-x-dense)',
+        gap: 'var(--ids-comp-tab-container-size-gap-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-horizontal.ids-tab-group-indicator-bottom': {
+        borderBottomWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-horizontal.ids-tab-group-indicator-bottom .ids-tab-item__indicator': {
+        bottom:
+          'calc(0px - (var(--ids-comp-tab-item-active-indicator-size-width-dense) + var(--ids-comp-tab-item-size-border-width-dense)))',
+      },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-horizontal.ids-tab-group-indicator-bottom .ids-tab-item__indicator .ids-tab-item__line':
+        { borderBottomWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-dense)' },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-horizontal.ids-tab-group-indicator-top': {
+        borderTopWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-horizontal.ids-tab-group-indicator-top .ids-tab-item__indicator': {
+        top: 'calc(0px - (var(--ids-comp-tab-item-active-indicator-size-width-dense) + var(--ids-comp-tab-item-size-border-width-dense)))',
+      },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-horizontal.ids-tab-group-indicator-top .ids-tab-item__indicator .ids-tab-item__line':
+        { borderTopWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-dense)' },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator': {
+        borderLeftWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-vertical.ids-tab-group-indicator-left .ids-tab-item__indicator .ids-tab-item__line':
+        { borderLeftWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-dense)' },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator': {
+        borderRightWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-dense.ids-tab-group-vertical.ids-tab-group-indicator-right .ids-tab-item__indicator .ids-tab-item__line':
+        { borderRightWidth: 'var(--ids-comp-tab-item-active-indicator-size-width-dense)' },
+      '.ids-tab-group.ids-tab-group-dense>.ids-tab-body-content': {
+        padding: 'var(--ids-comp-tab-tabpanel-size-padding-y-dense) var(--ids-comp-tab-tabpanel-size-padding-x-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-dense>.ids-tab-group__container .ids-tab-group__header': {
+        padding: 'var(--ids-comp-tab-tabgroup-size-padding-y-dense) var(--ids-comp-tab-tabgroup-size-padding-x-dense)',
+        gap: 'var(--ids-comp-tab-tabgroup-size-gap-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-dense>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        padding: 'var(--ids-comp-tab-item-size-padding-y-dense) var(--ids-comp-tab-item-size-padding-x-dense)',
+        gap: 'var(--ids-comp-tab-item-size-gap-dense)',
+        borderRadius: 'var(--ids-comp-tab-item-size-border-radius-dense)',
+        borderWidth: 'var(--ids-comp-tab-item-size-border-width-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-dense>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group.ids-tab-group-dense>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        { outlineWidth: 'var(--ids-comp-tab-item-focused-outline-size-outline-dense)' },
+      '.ids-tab-group.ids-tab-group-dense>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-tab-item__label': {
+        fontFamily: 'var(--ids-comp-tab-item-label-typography-font-family-dense)',
+        fontSize: 'var(--ids-comp-tab-item-label-typography-font-size-dense)',
+        fontWeight: 'var(--ids-comp-tab-item-label-typography-font-weight-dense)',
+        letterSpacing: 'var(--ids-comp-tab-item-label-typography-letter-spacing-dense)',
+        lineHeight: 'var(--ids-comp-tab-item-label-typography-line-height-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-dense>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-icon': {
+        fontSize: 'var(--ids-comp-tab-item-icon-typography-font-size-dense)',
+        fontWeight: 'var(--ids-comp-tab-item-icon-typography-font-weight-dense)',
+        lineHeight: 'var(--ids-comp-tab-item-icon-typography-line-height-dense)',
+        width: 'var(--ids-comp-tab-item-icon-size-width-dense)',
+        height: 'var(--ids-comp-tab-item-icon-size-height-dense)',
+      },
+      '.ids-tab-group.ids-tab-group-surface': { backgroundColor: 'var(--ids-comp-tab-container-color-bg-default)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header': {
+        backgroundColor: 'var(--ids-comp-tab-tabgroup-color-bg-default)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-surface-default)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-surface-default)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-surface-default)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-surface-default)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-tab-item__indicator': {
+        color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-default)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:hover': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-surface-hovered)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-surface-hovered)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-surface-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:hover>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-surface-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:hover>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-hovered)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        {
+          backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-surface-focused)',
+          borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-surface-focused)',
+          color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-surface-focused)',
+          outlineColor: 'var(--ids-comp-tab-item-standard-focused-outline-color-dark-default)',
+        },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus>.ids-icon,.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-surface-focused)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus>.ids-tab-item__indicator,.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-focused)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:active': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-surface-pressed)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-surface-pressed)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-surface-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:active>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-surface-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:active>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-pressed)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-surface-disabled)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-surface-disabled)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-surface-disabled)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-surface-disabled)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-disabled)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-surface-default)',
+        borderColor: 'var(--ids-comp-tab-item-standard-selected-border-surface-default)',
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-label-surface-default)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-surface-default)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-default)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:hover': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-surface-hovered)',
+        borderColor: 'var(--ids-comp-tab-item-standard-selected-border-surface-hovered)',
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-label-surface-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:hover>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-surface-hovered)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:hover>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-hovered)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus,.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus-visible':
+        {
+          backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-surface-focused)',
+          borderColor: 'var(--ids-comp-tab-item-standard-selected-border-surface-focused)',
+          color: 'var(--ids-comp-tab-item-standard-selected-fg-label-surface-focused)',
+        },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus>.ids-icon,.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus-visible>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-surface-focused)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus>.ids-tab-item__indicator,.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus-visible>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-focused)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:active': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-surface-pressed)',
+        borderColor: 'var(--ids-comp-tab-item-standard-selected-border-surface-pressed)',
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-label-surface-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:active>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-surface-pressed)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:active>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-pressed)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active.ids-tab-item-disabled':
+        {
+          backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-surface-disabled)',
+          borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-surface-disabled)',
+          color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-surface-disabled)',
+        },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active.ids-tab-item-disabled>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-surface-disabled)' },
+      '.ids-tab-group.ids-tab-group-surface>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active.ids-tab-item-disabled>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-surface-disabled)' },
+      '.ids-tab-group.ids-tab-group-light': { backgroundColor: 'var(--ids-comp-tab-container-color-bg-default)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header': {
+        backgroundColor: 'var(--ids-comp-tab-tabgroup-color-bg-default)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-light-default)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-light-default)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-light-default)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-light-default)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-tab-item__indicator': {
+        color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-default)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:hover': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-light-hovered)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-light-hovered)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-light-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:hover>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-light-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:hover>.ids-tab-item__indicator': {
+        color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        {
+          backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-light-focused)',
+          borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-light-focused)',
+          color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-light-focused)',
+          outlineColor: 'var(--ids-comp-tab-item-standard-focused-outline-color-dark-default)',
+        },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus>.ids-icon,.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-light-focused)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus>.ids-tab-item__indicator,.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-focused)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:active': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-light-pressed)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-light-pressed)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-light-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:active>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-light-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:active>.ids-tab-item__indicator': {
+        color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-light-disabled)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-light-disabled)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-light-disabled)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-light-disabled)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-disabled)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-light-default)',
+        borderColor: 'var(--ids-comp-tab-item-standard-selected-border-light-default)',
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-label-light-default)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-light-default)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-default)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:hover': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-light-hovered)',
+        borderColor: 'var(--ids-comp-tab-item-standard-selected-border-light-hovered)',
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-label-light-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:hover>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-light-hovered)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:hover>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-hovered)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus,.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus-visible':
+        {
+          backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-light-focused)',
+          borderColor: 'var(--ids-comp-tab-item-standard-selected-border-light-focused)',
+          color: 'var(--ids-comp-tab-item-standard-selected-fg-label-light-focused)',
+        },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus>.ids-icon,.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus-visible>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-light-focused)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus>.ids-tab-item__indicator,.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus-visible>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-focused)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:active': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-light-pressed)',
+        borderColor: 'var(--ids-comp-tab-item-standard-selected-border-light-pressed)',
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-label-light-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:active>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-light-pressed)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:active>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-pressed)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active.ids-tab-item-disabled':
+        {
+          backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-light-disabled)',
+          borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-light-disabled)',
+          color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-light-disabled)',
+        },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active.ids-tab-item-disabled>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-light-disabled)' },
+      '.ids-tab-group.ids-tab-group-light>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active.ids-tab-item-disabled>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-light-disabled)' },
+      '.ids-tab-group.ids-tab-group-primary': { backgroundColor: 'var(--ids-comp-tab-container-color-bg-default)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header': {
+        backgroundColor: 'var(--ids-comp-tab-tabgroup-color-bg-default)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-primary-default)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-primary-default)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-primary-default)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-primary-default)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item>.ids-tab-item__indicator': {
+        color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-default)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:hover': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-primary-hovered)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-primary-hovered)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-primary-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:hover>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-primary-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:hover>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-hovered)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus,.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible':
+        {
+          backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-primary-focused)',
+          borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-primary-focused)',
+          color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-primary-focused)',
+          outlineColor: 'var(--ids-comp-tab-item-standard-focused-outline-color-dark-default)',
+        },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus>.ids-icon,.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-primary-focused)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus>.ids-tab-item__indicator,.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:focus-visible>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-focused)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:active': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-primary-pressed)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-primary-pressed)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-primary-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:active>.ids-icon': {
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-primary-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item:active>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-pressed)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-primary-disabled)',
+        borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-primary-disabled)',
+        color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-primary-disabled)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-primary-disabled)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item-disabled>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-disabled)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-primary-default)',
+        borderColor: 'var(--ids-comp-tab-item-standard-selected-border-primary-default)',
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-label-primary-default)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-primary-default)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-default)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:hover': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-primary-hovered)',
+        borderColor: 'var(--ids-comp-tab-item-standard-selected-border-primary-hovered)',
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-label-primary-hovered)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:hover>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-primary-hovered)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:hover>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-hovered)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus,.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus-visible':
+        {
+          backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-primary-focused)',
+          borderColor: 'var(--ids-comp-tab-item-standard-selected-border-primary-focused)',
+          color: 'var(--ids-comp-tab-item-standard-selected-fg-label-primary-focused)',
+        },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus>.ids-icon,.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus-visible>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-primary-focused)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus>.ids-tab-item__indicator,.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:focus-visible>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-focused)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:active': {
+        backgroundColor: 'var(--ids-comp-tab-item-standard-selected-bg-primary-pressed)',
+        borderColor: 'var(--ids-comp-tab-item-standard-selected-border-primary-pressed)',
+        color: 'var(--ids-comp-tab-item-standard-selected-fg-label-primary-pressed)',
+      },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:active>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-selected-fg-icon-primary-pressed)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active:active>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-pressed)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active.ids-tab-item-disabled':
+        {
+          backgroundColor: 'var(--ids-comp-tab-item-standard-unselected-bg-primary-disabled)',
+          borderColor: 'var(--ids-comp-tab-item-standard-unselected-border-primary-disabled)',
+          color: 'var(--ids-comp-tab-item-standard-unselected-fg-label-primary-disabled)',
+        },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active.ids-tab-item-disabled>.ids-icon':
+        { color: 'var(--ids-comp-tab-item-standard-unselected-fg-icon-primary-disabled)' },
+      '.ids-tab-group.ids-tab-group-primary>.ids-tab-group__container .ids-tab-group__header .ids-tab-item.ids-tab-item--active.ids-tab-item-disabled>.ids-tab-item__indicator':
+        { color: 'var(--ids-comp-tab-item-standard-active-indicator-bg-primary-disabled)' },
       '.ids-tag': { display: 'inline-flex', alignItems: 'center', justifyContent: 'center', borderStyle: 'solid', boxSizing: 'border-box' },
       '.ids-tag:focus,.ids-tag:focus-visible': { outlineOffset: '2px', outlineStyle: 'solid' },
       '.ids-tag:active': { outline: 'none' },