@i-cell/ids-styles 0.0.14 → 0.0.15-beta.1

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.
@@ -1912,6 +1912,423 @@ module.exports = function ComponentsPlugin() {
1912
1912
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-pressed)' },
1913
1913
  '.ids-checkbox.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon':
1914
1914
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-focused)' },
1915
+ '.ids-pseudo-checkbox': { display: 'inline-flex', alignSelf: 'stretch' },
1916
+ '.ids-pseudo-checkbox .ids-pseudo-checkbox__input-wrapper': {
1917
+ position: 'relative',
1918
+ display: 'flex',
1919
+ alignItems: 'center',
1920
+ justifyContent: 'center',
1921
+ },
1922
+ '.ids-pseudo-checkbox .ids-pseudo-checkbox__input-wrapper input[type=checkbox]': {
1923
+ appearance: 'none',
1924
+ WebkitAppearance: 'none',
1925
+ flexShrink: 0,
1926
+ borderStyle: 'solid',
1927
+ margin: '0',
1928
+ },
1929
+ '.ids-pseudo-checkbox .ids-pseudo-checkbox__input-wrapper input[type=checkbox]+.ids-pseudo-checkbox__icon': { position: 'absolute' },
1930
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-compact': {
1931
+ padding: 'var(--ids-comp-checkbox-container-size-padding-y-compact) var(--ids-comp-checkbox-container-size-padding-x-compact)',
1932
+ gap: 'var(--ids-comp-checkbox-container-size-gap-compact)',
1933
+ },
1934
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-compact .ids-pseudo-checkbox__input-wrapper input[type=checkbox]': {
1935
+ width: 'var(--ids-comp-checkbox-input-size-width-compact)',
1936
+ height: 'var(--ids-comp-checkbox-input-size-height-compact)',
1937
+ borderRadius: 'var(--ids-comp-checkbox-input-size-border-radius-compact)',
1938
+ borderWidth: 'var(--ids-comp-checkbox-input-size-border-width-compact)',
1939
+ },
1940
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-compact .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:focus': {
1941
+ outlineWidth: 'var(--ids-comp-checkbox-focused-outline-outline-compact)',
1942
+ },
1943
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-compact .ids-pseudo-checkbox__input-wrapper .ids-pseudo-checkbox__icon': {
1944
+ height: 'var(--ids-comp-checkbox-input-size-icon-compact)',
1945
+ width: 'var(--ids-comp-checkbox-input-size-icon-compact)',
1946
+ lineHeight: 'var(--ids-comp-checkbox-input-size-icon-compact)',
1947
+ },
1948
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-comfortable': {
1949
+ padding:
1950
+ 'var(--ids-comp-checkbox-container-size-padding-y-comfortable) var(--ids-comp-checkbox-container-size-padding-x-comfortable)',
1951
+ gap: 'var(--ids-comp-checkbox-container-size-gap-comfortable)',
1952
+ },
1953
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-comfortable .ids-pseudo-checkbox__input-wrapper input[type=checkbox]': {
1954
+ width: 'var(--ids-comp-checkbox-input-size-width-comfortable)',
1955
+ height: 'var(--ids-comp-checkbox-input-size-height-comfortable)',
1956
+ borderRadius: 'var(--ids-comp-checkbox-input-size-border-radius-comfortable)',
1957
+ borderWidth: 'var(--ids-comp-checkbox-input-size-border-width-comfortable)',
1958
+ },
1959
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-comfortable .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:focus': {
1960
+ outlineWidth: 'var(--ids-comp-checkbox-focused-outline-outline-comfortable)',
1961
+ },
1962
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-comfortable .ids-pseudo-checkbox__input-wrapper .ids-pseudo-checkbox__icon': {
1963
+ height: 'var(--ids-comp-checkbox-input-size-icon-comfortable)',
1964
+ width: 'var(--ids-comp-checkbox-input-size-icon-comfortable)',
1965
+ lineHeight: 'var(--ids-comp-checkbox-input-size-icon-comfortable)',
1966
+ },
1967
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-spacious': {
1968
+ padding: 'var(--ids-comp-checkbox-container-size-padding-y-spacious) var(--ids-comp-checkbox-container-size-padding-x-spacious)',
1969
+ gap: 'var(--ids-comp-checkbox-container-size-gap-spacious)',
1970
+ },
1971
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-spacious .ids-pseudo-checkbox__input-wrapper input[type=checkbox]': {
1972
+ width: 'var(--ids-comp-checkbox-input-size-width-spacious)',
1973
+ height: 'var(--ids-comp-checkbox-input-size-height-spacious)',
1974
+ borderRadius: 'var(--ids-comp-checkbox-input-size-border-radius-spacious)',
1975
+ borderWidth: 'var(--ids-comp-checkbox-input-size-border-width-spacious)',
1976
+ },
1977
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-spacious .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:focus': {
1978
+ outlineWidth: 'var(--ids-comp-checkbox-focused-outline-outline-spacious)',
1979
+ },
1980
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-spacious .ids-pseudo-checkbox__input-wrapper .ids-pseudo-checkbox__icon': {
1981
+ height: 'var(--ids-comp-checkbox-input-size-icon-spacious)',
1982
+ width: 'var(--ids-comp-checkbox-input-size-icon-spacious)',
1983
+ lineHeight: 'var(--ids-comp-checkbox-input-size-icon-spacious)',
1984
+ },
1985
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dense': {
1986
+ padding: 'var(--ids-comp-checkbox-container-size-padding-y-dense) var(--ids-comp-checkbox-container-size-padding-x-dense)',
1987
+ gap: 'var(--ids-comp-checkbox-container-size-gap-dense)',
1988
+ },
1989
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dense .ids-pseudo-checkbox__input-wrapper input[type=checkbox]': {
1990
+ width: 'var(--ids-comp-checkbox-input-size-width-dense)',
1991
+ height: 'var(--ids-comp-checkbox-input-size-height-dense)',
1992
+ borderRadius: 'var(--ids-comp-checkbox-input-size-border-radius-dense)',
1993
+ borderWidth: 'var(--ids-comp-checkbox-input-size-border-width-dense)',
1994
+ },
1995
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dense .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:focus': {
1996
+ outlineWidth: 'var(--ids-comp-checkbox-focused-outline-outline-dense)',
1997
+ },
1998
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dense .ids-pseudo-checkbox__input-wrapper .ids-pseudo-checkbox__icon': {
1999
+ height: 'var(--ids-comp-checkbox-input-size-icon-dense)',
2000
+ width: 'var(--ids-comp-checkbox-input-size-icon-dense)',
2001
+ lineHeight: 'var(--ids-comp-checkbox-input-size-icon-dense)',
2002
+ },
2003
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled)': {
2004
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-default)',
2005
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-default)',
2006
+ },
2007
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover': {
2008
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-hovered)',
2009
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-hovered)',
2010
+ },
2011
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active': {
2012
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-pressed)',
2013
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-pressed)',
2014
+ },
2015
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus': {
2016
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-focused)',
2017
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-focused)',
2018
+ outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-light-focused)',
2019
+ },
2020
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:disabled': {
2021
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-disabled)',
2022
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-disabled)',
2023
+ },
2024
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
2025
+ {
2026
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-default)',
2027
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-default)',
2028
+ },
2029
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
2030
+ {
2031
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-hovered)',
2032
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-hovered)',
2033
+ },
2034
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
2035
+ {
2036
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-pressed)',
2037
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-pressed)',
2038
+ },
2039
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus':
2040
+ {
2041
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-focused)',
2042
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-focused)',
2043
+ outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-light-focused)',
2044
+ },
2045
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:disabled,.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled':
2046
+ {
2047
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-disabled)',
2048
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-disabled)',
2049
+ color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-disabled)',
2050
+ },
2051
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-pseudo-checkbox__icon':
2052
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-default)' },
2053
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-pseudo-checkbox__icon':
2054
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-hovered)' },
2055
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-pseudo-checkbox__icon':
2056
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-pressed)' },
2057
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-pseudo-checkbox__icon':
2058
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-focused)' },
2059
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled)': {
2060
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-default)',
2061
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-default)',
2062
+ },
2063
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover': {
2064
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-hovered)',
2065
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-hovered)',
2066
+ },
2067
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active': {
2068
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-pressed)',
2069
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-pressed)',
2070
+ },
2071
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus': {
2072
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-focused)',
2073
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-focused)',
2074
+ outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-dark-focused)',
2075
+ },
2076
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:disabled': {
2077
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-disabled)',
2078
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-disabled)',
2079
+ },
2080
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
2081
+ {
2082
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-default)',
2083
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-default)',
2084
+ },
2085
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
2086
+ {
2087
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-hovered)',
2088
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-hovered)',
2089
+ },
2090
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
2091
+ {
2092
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-pressed)',
2093
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-pressed)',
2094
+ },
2095
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus':
2096
+ {
2097
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-focused)',
2098
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-focused)',
2099
+ outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-dark-focused)',
2100
+ },
2101
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:disabled,.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled':
2102
+ {
2103
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-disabled)',
2104
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-disabled)',
2105
+ color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-disabled)',
2106
+ },
2107
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-pseudo-checkbox__icon':
2108
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-default)' },
2109
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-pseudo-checkbox__icon':
2110
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-hovered)' },
2111
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-pseudo-checkbox__icon':
2112
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-pressed)' },
2113
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-pseudo-checkbox__icon':
2114
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-focused)' },
2115
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled)': {
2116
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-default)',
2117
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-default)',
2118
+ },
2119
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover': {
2120
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-hovered)',
2121
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-hovered)',
2122
+ },
2123
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active': {
2124
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-pressed)',
2125
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-pressed)',
2126
+ },
2127
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus': {
2128
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-focused)',
2129
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-focused)',
2130
+ outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-surface-focused)',
2131
+ },
2132
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:disabled': {
2133
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-disabled)',
2134
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-disabled)',
2135
+ },
2136
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
2137
+ {
2138
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-default)',
2139
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-default)',
2140
+ },
2141
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
2142
+ {
2143
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-hovered)',
2144
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-hovered)',
2145
+ },
2146
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
2147
+ {
2148
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-pressed)',
2149
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-pressed)',
2150
+ },
2151
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus':
2152
+ {
2153
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-focused)',
2154
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-focused)',
2155
+ outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-surface-focused)',
2156
+ },
2157
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:disabled,.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled':
2158
+ {
2159
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-disabled)',
2160
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-disabled)',
2161
+ color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-disabled)',
2162
+ },
2163
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-pseudo-checkbox__icon':
2164
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-default)' },
2165
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-pseudo-checkbox__icon':
2166
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-hovered)' },
2167
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-pseudo-checkbox__icon':
2168
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-pressed)' },
2169
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-pseudo-checkbox__icon':
2170
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-focused)' },
2171
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-disabled': { opacity: 'var(--ids-comp-checkbox-disabled)' },
2172
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-disabled .ids-pseudo-checkbox__input-wrapper .ids-pseudo-checkbox__touch-target': {
2173
+ cursor: 'not-allowed',
2174
+ },
2175
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-disabled .ids-pseudo-checkbox__input-wrapper input[type=checkbox]': {
2176
+ cursor: 'not-allowed',
2177
+ },
2178
+ '.ids-pseudo-checkbox.ids-pseudo-checkbox-disabled .ids-pseudo-checkbox__input-wrapper input[type=checkbox]+.ids-pseudo-checkbox__icon':
2179
+ { cursor: 'not-allowed' },
2180
+ '.ids-pseudo-checkbox:not(.ids-pseudo-checkbox-disabled) .ids-pseudo-checkbox__input-wrapper .ids-pseudo-checkbox__touch-target': {
2181
+ cursor: 'pointer',
2182
+ },
2183
+ '.ids-pseudo-checkbox:not(.ids-pseudo-checkbox-disabled) .ids-pseudo-checkbox__input-wrapper input[type=checkbox]': {
2184
+ cursor: 'pointer',
2185
+ },
2186
+ '.ids-pseudo-checkbox:not(.ids-pseudo-checkbox-disabled) .ids-pseudo-checkbox__input-wrapper input[type=checkbox]+.ids-pseudo-checkbox__icon':
2187
+ { cursor: 'pointer' },
2188
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled)':
2189
+ {
2190
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-error-default)',
2191
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-default)',
2192
+ },
2193
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover':
2194
+ {
2195
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-error-hovered)',
2196
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-hovered)',
2197
+ },
2198
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active':
2199
+ {
2200
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-error-pressed)',
2201
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-pressed)',
2202
+ },
2203
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus':
2204
+ {
2205
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-error-focused)',
2206
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-focused)',
2207
+ },
2208
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
2209
+ {
2210
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-error-default)',
2211
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-default)',
2212
+ },
2213
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
2214
+ {
2215
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-error-hovered)',
2216
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-hovered)',
2217
+ },
2218
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
2219
+ {
2220
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-error-pressed)',
2221
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-pressed)',
2222
+ },
2223
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus':
2224
+ {
2225
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-error-focused)',
2226
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-focused)',
2227
+ },
2228
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-pseudo-checkbox__icon':
2229
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-error-default)' },
2230
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-pseudo-checkbox__icon':
2231
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-error-hovered)' },
2232
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-pseudo-checkbox__icon':
2233
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-error-pressed)' },
2234
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-light .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-pseudo-checkbox__icon':
2235
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-error-focused)' },
2236
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled)':
2237
+ {
2238
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-error-default)',
2239
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-default)',
2240
+ },
2241
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover':
2242
+ {
2243
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-error-hovered)',
2244
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-hovered)',
2245
+ },
2246
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active':
2247
+ {
2248
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-error-pressed)',
2249
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-pressed)',
2250
+ },
2251
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus':
2252
+ {
2253
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-error-focused)',
2254
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-focused)',
2255
+ },
2256
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
2257
+ {
2258
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-error-default)',
2259
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-default)',
2260
+ },
2261
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
2262
+ {
2263
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-error-hovered)',
2264
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-hovered)',
2265
+ },
2266
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
2267
+ {
2268
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-error-pressed)',
2269
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-pressed)',
2270
+ },
2271
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus':
2272
+ {
2273
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-error-focused)',
2274
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-focused)',
2275
+ },
2276
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-pseudo-checkbox__icon':
2277
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-error-default)' },
2278
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-pseudo-checkbox__icon':
2279
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-error-hovered)' },
2280
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-pseudo-checkbox__icon':
2281
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-error-pressed)' },
2282
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-dark .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-pseudo-checkbox__icon':
2283
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-error-focused)' },
2284
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled)':
2285
+ {
2286
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-error-default)',
2287
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-default)',
2288
+ },
2289
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover':
2290
+ {
2291
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-error-hovered)',
2292
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-hovered)',
2293
+ },
2294
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active':
2295
+ {
2296
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-error-pressed)',
2297
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-pressed)',
2298
+ },
2299
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus':
2300
+ {
2301
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-error-focused)',
2302
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-focused)',
2303
+ },
2304
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
2305
+ {
2306
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-error-default)',
2307
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-default)',
2308
+ },
2309
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
2310
+ {
2311
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-error-hovered)',
2312
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-hovered)',
2313
+ },
2314
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
2315
+ {
2316
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-error-pressed)',
2317
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-pressed)',
2318
+ },
2319
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus':
2320
+ {
2321
+ borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-error-focused)',
2322
+ backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-focused)',
2323
+ },
2324
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-pseudo-checkbox__icon':
2325
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-default)' },
2326
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-pseudo-checkbox__icon':
2327
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-hovered)' },
2328
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-pseudo-checkbox__icon':
2329
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-pressed)' },
2330
+ '.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ng-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-pseudo-checkbox__icon,.ids-pseudo-checkbox.ids-pseudo-checkbox-invalid.ids-pseudo-checkbox-surface .ids-pseudo-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-pseudo-checkbox__icon':
2331
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-focused)' },
1915
2332
  '.ids-card': { display: 'flex', borderStyle: 'solid', boxSizing: 'border-box' },
1916
2333
  '.ids-card.ids-card-clickable': { pointerEvents: 'auto', cursor: 'pointer' },
1917
2334
  '.ids-card.ids-card-clickable:focus': {
@@ -2953,6 +3370,7 @@ module.exports = function ComponentsPlugin() {
2953
3370
  display: 'flex',
2954
3371
  alignItems: 'center',
2955
3372
  flex: '1 0 0',
3373
+ overflowX: 'hidden',
2956
3374
  },
2957
3375
  '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon,.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__duffix,.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon':
2958
3376
  { display: 'flex', alignItems: 'center' },
@@ -2960,6 +3378,7 @@ module.exports = function ComponentsPlugin() {
2960
3378
  display: 'flex',
2961
3379
  alignItems: 'center',
2962
3380
  flex: '1 0 0',
3381
+ overflowX: 'hidden',
2963
3382
  },
2964
3383
  '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
2965
3384
  { appearance: 'none', border: 'none', backgroundColor: 'rgba(0,0,0,0)', flex: '1 0 0', padding: '0' },
@@ -3013,16 +3432,15 @@ module.exports = function ComponentsPlugin() {
3013
3432
  lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-line-height-compact)',
3014
3433
  },
3015
3434
  '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3016
- { padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-compact) 0' },
3017
- '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3018
3435
  {
3436
+ padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-compact) 0',
3019
3437
  fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-family-compact)',
3020
3438
  fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-size-compact)',
3021
3439
  fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-weight-compact)',
3022
3440
  letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-letter-spacing-compact)',
3023
3441
  lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-line-height-compact)',
3024
3442
  },
3025
- '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3443
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3026
3444
  {
3027
3445
  fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-compact)',
3028
3446
  fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-compact)',
@@ -3086,16 +3504,15 @@ module.exports = function ComponentsPlugin() {
3086
3504
  lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-line-height-comfortable)',
3087
3505
  },
3088
3506
  '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3089
- { padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-comfortable) 0' },
3090
- '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3091
3507
  {
3508
+ padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-comfortable) 0',
3092
3509
  fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-family-comfortable)',
3093
3510
  fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-size-comfortable)',
3094
3511
  fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-weight-comfortable)',
3095
3512
  letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-letter-spacing-comfortable)',
3096
3513
  lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-line-height-comfortable)',
3097
3514
  },
3098
- '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3515
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3099
3516
  {
3100
3517
  fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-comfortable)',
3101
3518
  fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-comfortable)',
@@ -3159,16 +3576,15 @@ module.exports = function ComponentsPlugin() {
3159
3576
  lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-line-height-spacious)',
3160
3577
  },
3161
3578
  '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3162
- { padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-spacious) 0' },
3163
- '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3164
3579
  {
3580
+ padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-spacious) 0',
3165
3581
  fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-family-spacious)',
3166
3582
  fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-size-spacious)',
3167
3583
  fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-weight-spacious)',
3168
3584
  letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-letter-spacing-spacious)',
3169
3585
  lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-line-height-spacious)',
3170
3586
  },
3171
- '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3587
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3172
3588
  {
3173
3589
  fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-spacious)',
3174
3590
  fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-spacious)',
@@ -3232,16 +3648,15 @@ module.exports = function ComponentsPlugin() {
3232
3648
  lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-line-height-dense)',
3233
3649
  },
3234
3650
  '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3235
- { padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-dense) 0' },
3236
- '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3237
3651
  {
3652
+ padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-dense) 0',
3238
3653
  fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-family-dense)',
3239
3654
  fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-size-dense)',
3240
3655
  fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-weight-dense)',
3241
3656
  letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-letter-spacing-dense)',
3242
3657
  lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-line-height-dense)',
3243
3658
  },
3244
- '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3659
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3245
3660
  {
3246
3661
  fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-dense)',
3247
3662
  fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-dense)',
@@ -3277,9 +3692,9 @@ module.exports = function ComponentsPlugin() {
3277
3692
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-default)' },
3278
3693
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3279
3694
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-default)' },
3280
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3695
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3281
3696
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-default)' },
3282
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3697
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3283
3698
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-default)' },
3284
3699
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3285
3700
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-default)' },
@@ -3304,9 +3719,9 @@ module.exports = function ComponentsPlugin() {
3304
3719
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-hovered)' },
3305
3720
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3306
3721
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-hovered)' },
3307
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3722
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3308
3723
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-hovered)' },
3309
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3724
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3310
3725
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-hovered)' },
3311
3726
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3312
3727
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-hovered)' },
@@ -3323,9 +3738,9 @@ module.exports = function ComponentsPlugin() {
3323
3738
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-focused)' },
3324
3739
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3325
3740
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-focused)' },
3326
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3741
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3327
3742
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-focused)' },
3328
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3743
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3329
3744
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-focused)' },
3330
3745
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3331
3746
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-focused)' },
@@ -3347,9 +3762,9 @@ module.exports = function ComponentsPlugin() {
3347
3762
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-pressed)' },
3348
3763
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3349
3764
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-pressed)' },
3350
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3765
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3351
3766
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-pressed)' },
3352
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3767
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3353
3768
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-pressed)' },
3354
3769
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3355
3770
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-pressed)' },
@@ -3373,9 +3788,9 @@ module.exports = function ComponentsPlugin() {
3373
3788
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-default)' },
3374
3789
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3375
3790
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-default)' },
3376
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3791
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3377
3792
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-default)' },
3378
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3793
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3379
3794
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-default)' },
3380
3795
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3381
3796
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-default)' },
@@ -3400,9 +3815,9 @@ module.exports = function ComponentsPlugin() {
3400
3815
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-hovered)' },
3401
3816
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3402
3817
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-hovered)' },
3403
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3818
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3404
3819
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-hovered)' },
3405
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3820
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3406
3821
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-hovered)' },
3407
3822
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3408
3823
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-hovered)' },
@@ -3419,9 +3834,9 @@ module.exports = function ComponentsPlugin() {
3419
3834
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-focused)' },
3420
3835
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3421
3836
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-focused)' },
3422
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3837
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3423
3838
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-focused)' },
3424
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3839
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3425
3840
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-focused)' },
3426
3841
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3427
3842
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-focused)' },
@@ -3443,9 +3858,9 @@ module.exports = function ComponentsPlugin() {
3443
3858
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-pressed)' },
3444
3859
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3445
3860
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-pressed)' },
3446
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3861
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3447
3862
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-pressed)' },
3448
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3863
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3449
3864
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-pressed)' },
3450
3865
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3451
3866
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-pressed)' },
@@ -3469,9 +3884,9 @@ module.exports = function ComponentsPlugin() {
3469
3884
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-default)' },
3470
3885
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3471
3886
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-default)' },
3472
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3887
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3473
3888
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-default)' },
3474
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3889
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3475
3890
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-default)' },
3476
3891
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3477
3892
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-default)' },
@@ -3496,9 +3911,9 @@ module.exports = function ComponentsPlugin() {
3496
3911
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-hovered)' },
3497
3912
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3498
3913
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-hovered)' },
3499
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3914
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3500
3915
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-hovered)' },
3501
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3916
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3502
3917
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-hovered)' },
3503
3918
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3504
3919
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-hovered)' },
@@ -3515,9 +3930,9 @@ module.exports = function ComponentsPlugin() {
3515
3930
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-focused)' },
3516
3931
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3517
3932
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-focused)' },
3518
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3933
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3519
3934
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-focused)' },
3520
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3935
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3521
3936
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-focused)' },
3522
3937
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3523
3938
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-focused)' },
@@ -3539,9 +3954,9 @@ module.exports = function ComponentsPlugin() {
3539
3954
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-pressed)' },
3540
3955
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3541
3956
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-pressed)' },
3542
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3957
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3543
3958
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-pressed)' },
3544
- '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3959
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3545
3960
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-pressed)' },
3546
3961
  '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3547
3962
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-pressed)' },
@@ -3565,9 +3980,9 @@ module.exports = function ComponentsPlugin() {
3565
3980
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-disabled)' },
3566
3981
  '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3567
3982
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-disabled)' },
3568
- '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
3983
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3569
3984
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-disabled)' },
3570
- '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
3985
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3571
3986
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-disabled)' },
3572
3987
  '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3573
3988
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-disabled)' },
@@ -3591,9 +4006,9 @@ module.exports = function ComponentsPlugin() {
3591
4006
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-default)' },
3592
4007
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3593
4008
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-default)' },
3594
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4009
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3595
4010
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-default)' },
3596
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4011
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3597
4012
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-default)' },
3598
4013
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3599
4014
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-default)' },
@@ -3618,9 +4033,9 @@ module.exports = function ComponentsPlugin() {
3618
4033
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-hovered)' },
3619
4034
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3620
4035
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-hovered)' },
3621
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4036
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3622
4037
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-hovered)' },
3623
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4038
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3624
4039
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-hovered)' },
3625
4040
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3626
4041
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-hovered)' },
@@ -3637,9 +4052,9 @@ module.exports = function ComponentsPlugin() {
3637
4052
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-focused)' },
3638
4053
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3639
4054
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-focused)' },
3640
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4055
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3641
4056
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-focused)' },
3642
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4057
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3643
4058
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-focused)' },
3644
4059
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3645
4060
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-focused)' },
@@ -3661,9 +4076,9 @@ module.exports = function ComponentsPlugin() {
3661
4076
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-pressed)' },
3662
4077
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3663
4078
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-pressed)' },
3664
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4079
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3665
4080
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-pressed)' },
3666
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4081
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3667
4082
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-pressed)' },
3668
4083
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3669
4084
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-pressed)' },
@@ -3687,9 +4102,9 @@ module.exports = function ComponentsPlugin() {
3687
4102
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-default)' },
3688
4103
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3689
4104
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-default)' },
3690
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4105
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3691
4106
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-default)' },
3692
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4107
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3693
4108
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-default)' },
3694
4109
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3695
4110
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-default)' },
@@ -3714,9 +4129,9 @@ module.exports = function ComponentsPlugin() {
3714
4129
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-hovered)' },
3715
4130
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3716
4131
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-hovered)' },
3717
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4132
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3718
4133
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-hovered)' },
3719
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4134
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3720
4135
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-hovered)' },
3721
4136
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3722
4137
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-hovered)' },
@@ -3733,9 +4148,9 @@ module.exports = function ComponentsPlugin() {
3733
4148
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-focused)' },
3734
4149
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3735
4150
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-focused)' },
3736
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4151
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3737
4152
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-focused)' },
3738
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4153
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3739
4154
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-focused)' },
3740
4155
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3741
4156
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-focused)' },
@@ -3757,9 +4172,9 @@ module.exports = function ComponentsPlugin() {
3757
4172
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-pressed)' },
3758
4173
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3759
4174
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-pressed)' },
3760
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4175
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3761
4176
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-pressed)' },
3762
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4177
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3763
4178
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-pressed)' },
3764
4179
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3765
4180
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-pressed)' },
@@ -3783,9 +4198,9 @@ module.exports = function ComponentsPlugin() {
3783
4198
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-default)' },
3784
4199
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3785
4200
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-default)' },
3786
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4201
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3787
4202
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-default)' },
3788
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4203
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3789
4204
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-default)' },
3790
4205
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3791
4206
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-default)' },
@@ -3810,9 +4225,9 @@ module.exports = function ComponentsPlugin() {
3810
4225
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-hovered)' },
3811
4226
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3812
4227
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-hovered)' },
3813
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4228
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3814
4229
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-hovered)' },
3815
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4230
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3816
4231
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-hovered)' },
3817
4232
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3818
4233
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-hovered)' },
@@ -3829,9 +4244,9 @@ module.exports = function ComponentsPlugin() {
3829
4244
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-focused)' },
3830
4245
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3831
4246
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-focused)' },
3832
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4247
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3833
4248
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-focused)' },
3834
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4249
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3835
4250
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-focused)' },
3836
4251
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3837
4252
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-focused)' },
@@ -3853,9 +4268,9 @@ module.exports = function ComponentsPlugin() {
3853
4268
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-pressed)' },
3854
4269
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3855
4270
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-pressed)' },
3856
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4271
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3857
4272
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-pressed)' },
3858
- '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4273
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3859
4274
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-pressed)' },
3860
4275
  '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3861
4276
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-pressed)' },
@@ -3879,9 +4294,9 @@ module.exports = function ComponentsPlugin() {
3879
4294
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-disabled)' },
3880
4295
  '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
3881
4296
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-disabled)' },
3882
- '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
4297
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
3883
4298
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-disabled)' },
3884
- '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
4299
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix ::placeholder':
3885
4300
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-disabled)' },
3886
4301
  '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
3887
4302
  { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-disabled)' },
@@ -4660,6 +5075,249 @@ module.exports = function ComponentsPlugin() {
4660
5075
  background: 'var(--ids-comp-icon-button-standard-color-bg-surface-disabled)',
4661
5076
  color: 'var(--ids-comp-icon-button-standard-color-fg-surface-disabled)',
4662
5077
  },
5078
+ '.ids-option': { display: 'flex', alignItems: 'center', alignSelf: 'stretch', userSelect: 'none' },
5079
+ '.ids-option>.ids-option__text': { overflow: 'hidden', textOverflow: 'ellipsis', fontStyle: 'normal' },
5080
+ '.ids-option:not(.ids-option-disabled)': { cursor: 'pointer' },
5081
+ '.ids-option.ids-option-disabled': { cursor: 'not-allowed' },
5082
+ '.ids-option:not(.ids-option-multiselect)': { justifyContent: 'space-between' },
5083
+ '.ids-option.ids-option-active': { outlineStyle: 'solid' },
5084
+ '.ids-option.ids-option-compact': {
5085
+ height: 'var(--ids-comp-forms-option-item-size-min-height-compact)',
5086
+ padding: 'var(--ids-comp-forms-option-item-size-padding-y-compact) var(--ids-comp-forms-option-item-size-padding-x-compact)',
5087
+ gap: 'var(--ids-comp-forms-option-container-size-gap-compact)',
5088
+ borderRadius: 'var(--ids-comp-forms-option-item-size-border-radius-compact)',
5089
+ },
5090
+ '.ids-option.ids-option-compact>.ids-option__text': {
5091
+ fontFamily: 'var(--ids-comp-forms-option-item-typography-font-family-compact)',
5092
+ fontSize: 'var(--ids-comp-forms-option-item-typography-font-size-compact)',
5093
+ fontWeight: 'var(--ids-comp-forms-option-item-typography-font-weight-compact)',
5094
+ lineHeight: 'var(--ids-comp-forms-option-item-typography-line-height-compact)',
5095
+ letterSpacing: 'var(--ids-comp-forms-option-item-typography-letter-spacing-compact)',
5096
+ },
5097
+ '.ids-option.ids-option-compact>.ids-icon': {
5098
+ height: 'var(--ids-comp-forms-option-item-icon-size-height-compact)',
5099
+ width: 'var(--ids-comp-forms-option-item-icon-size-width-compact)',
5100
+ },
5101
+ '.ids-option.ids-option-compact.ids-option-active': {
5102
+ outlineWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-focused-outline-outline-compact)',
5103
+ },
5104
+ '.ids-option.ids-option-comfortable': {
5105
+ height: 'var(--ids-comp-forms-option-item-size-min-height-comfortable)',
5106
+ padding:
5107
+ 'var(--ids-comp-forms-option-item-size-padding-y-comfortable) var(--ids-comp-forms-option-item-size-padding-x-comfortable)',
5108
+ gap: 'var(--ids-comp-forms-option-container-size-gap-comfortable)',
5109
+ borderRadius: 'var(--ids-comp-forms-option-item-size-border-radius-comfortable)',
5110
+ },
5111
+ '.ids-option.ids-option-comfortable>.ids-option__text': {
5112
+ fontFamily: 'var(--ids-comp-forms-option-item-typography-font-family-comfortable)',
5113
+ fontSize: 'var(--ids-comp-forms-option-item-typography-font-size-comfortable)',
5114
+ fontWeight: 'var(--ids-comp-forms-option-item-typography-font-weight-comfortable)',
5115
+ lineHeight: 'var(--ids-comp-forms-option-item-typography-line-height-comfortable)',
5116
+ letterSpacing: 'var(--ids-comp-forms-option-item-typography-letter-spacing-comfortable)',
5117
+ },
5118
+ '.ids-option.ids-option-comfortable>.ids-icon': {
5119
+ height: 'var(--ids-comp-forms-option-item-icon-size-height-comfortable)',
5120
+ width: 'var(--ids-comp-forms-option-item-icon-size-width-comfortable)',
5121
+ },
5122
+ '.ids-option.ids-option-comfortable.ids-option-active': {
5123
+ outlineWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-focused-outline-outline-comfortable)',
5124
+ },
5125
+ '.ids-option.ids-option-spacious': {
5126
+ height: 'var(--ids-comp-forms-option-item-size-min-height-spacious)',
5127
+ padding: 'var(--ids-comp-forms-option-item-size-padding-y-spacious) var(--ids-comp-forms-option-item-size-padding-x-spacious)',
5128
+ gap: 'var(--ids-comp-forms-option-container-size-gap-spacious)',
5129
+ borderRadius: 'var(--ids-comp-forms-option-item-size-border-radius-spacious)',
5130
+ },
5131
+ '.ids-option.ids-option-spacious>.ids-option__text': {
5132
+ fontFamily: 'var(--ids-comp-forms-option-item-typography-font-family-spacious)',
5133
+ fontSize: 'var(--ids-comp-forms-option-item-typography-font-size-spacious)',
5134
+ fontWeight: 'var(--ids-comp-forms-option-item-typography-font-weight-spacious)',
5135
+ lineHeight: 'var(--ids-comp-forms-option-item-typography-line-height-spacious)',
5136
+ letterSpacing: 'var(--ids-comp-forms-option-item-typography-letter-spacing-spacious)',
5137
+ },
5138
+ '.ids-option.ids-option-spacious>.ids-icon': {
5139
+ height: 'var(--ids-comp-forms-option-item-icon-size-height-spacious)',
5140
+ width: 'var(--ids-comp-forms-option-item-icon-size-width-spacious)',
5141
+ },
5142
+ '.ids-option.ids-option-spacious.ids-option-active': {
5143
+ outlineWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-focused-outline-outline-spacious)',
5144
+ },
5145
+ '.ids-option.ids-option-dense': {
5146
+ height: 'var(--ids-comp-forms-option-item-size-min-height-dense)',
5147
+ padding: 'var(--ids-comp-forms-option-item-size-padding-y-dense) var(--ids-comp-forms-option-item-size-padding-x-dense)',
5148
+ gap: 'var(--ids-comp-forms-option-container-size-gap-dense)',
5149
+ borderRadius: 'var(--ids-comp-forms-option-item-size-border-radius-dense)',
5150
+ },
5151
+ '.ids-option.ids-option-dense>.ids-option__text': {
5152
+ fontFamily: 'var(--ids-comp-forms-option-item-typography-font-family-dense)',
5153
+ fontSize: 'var(--ids-comp-forms-option-item-typography-font-size-dense)',
5154
+ fontWeight: 'var(--ids-comp-forms-option-item-typography-font-weight-dense)',
5155
+ lineHeight: 'var(--ids-comp-forms-option-item-typography-line-height-dense)',
5156
+ letterSpacing: 'var(--ids-comp-forms-option-item-typography-letter-spacing-dense)',
5157
+ },
5158
+ '.ids-option.ids-option-dense>.ids-icon': {
5159
+ height: 'var(--ids-comp-forms-option-item-icon-size-height-dense)',
5160
+ width: 'var(--ids-comp-forms-option-item-icon-size-width-dense)',
5161
+ },
5162
+ '.ids-option.ids-option-dense.ids-option-active': {
5163
+ outlineWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-focused-outline-outline-dense)',
5164
+ },
5165
+ '.ids-option.ids-option-surface:not(.ids-option-disabled)': { background: 'var(--ids-comp-forms-option-color-bg-surface-default)' },
5166
+ '.ids-option.ids-option-surface:not(.ids-option-disabled)>.ids-option__text': {
5167
+ color: 'var(--ids-comp-forms-option-color-fg-text-surface-default)',
5168
+ },
5169
+ '.ids-option.ids-option-surface:not(.ids-option-disabled)>.ids-icon': {
5170
+ color: 'var(--ids-comp-forms-option-color-fg-icon-surface-default)',
5171
+ },
5172
+ '.ids-option.ids-option-surface:not(.ids-option-disabled):hover': {
5173
+ background: 'var(--ids-comp-forms-option-color-bg-surface-hovered)',
5174
+ },
5175
+ '.ids-option.ids-option-surface:not(.ids-option-disabled):hover>.ids-option__text': {
5176
+ color: 'var(--ids-comp-forms-option-color-fg-text-surface-hovered)',
5177
+ },
5178
+ '.ids-option.ids-option-surface:not(.ids-option-disabled):hover>.ids-icon': {
5179
+ color: 'var(--ids-comp-forms-option-color-fg-icon-surface-hovered)',
5180
+ },
5181
+ '.ids-option.ids-option-surface:not(.ids-option-disabled):active': {
5182
+ background: 'var(--ids-comp-forms-option-color-bg-surface-pressed)',
5183
+ },
5184
+ '.ids-option.ids-option-surface:not(.ids-option-disabled):active>.ids-option__text': {
5185
+ color: 'var(--ids-comp-forms-option-color-fg-text-surface-pressed)',
5186
+ },
5187
+ '.ids-option.ids-option-surface:not(.ids-option-disabled):active>.ids-icon': {
5188
+ color: 'var(--ids-comp-forms-option-color-fg-icon-surface-pressed)',
5189
+ },
5190
+ '.ids-option.ids-option-surface:not(.ids-option-disabled).ids-option-active': {
5191
+ background: 'var(--ids-comp-forms-option-color-bg-surface-active)',
5192
+ outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)',
5193
+ },
5194
+ '.ids-option.ids-option-surface:not(.ids-option-disabled).ids-option-active>.ids-option__text': {
5195
+ color: 'var(--ids-comp-forms-option-color-fg-text-surface-active)',
5196
+ },
5197
+ '.ids-option.ids-option-surface:not(.ids-option-disabled).ids-option-active>.ids-icon': {
5198
+ color: 'var(--ids-comp-forms-option-color-fg-icon-surface-active)',
5199
+ },
5200
+ '.ids-option.ids-option-surface.ids-option-disabled': { background: 'var(--ids-comp-forms-option-color-bg-surface-disabled)' },
5201
+ '.ids-option.ids-option-surface.ids-option-disabled>.ids-option__text': {
5202
+ color: 'var(--ids-comp-forms-option-color-fg-text-surface-disabled)',
5203
+ },
5204
+ '.ids-option.ids-option-surface.ids-option-disabled>.ids-icon': {
5205
+ color: 'var(--ids-comp-forms-option-color-fg-icon-surface-disabled)',
5206
+ },
5207
+ '.ids-option.ids-option-light:not(.ids-option-disabled)': { background: 'var(--ids-comp-forms-option-color-bg-light-default)' },
5208
+ '.ids-option.ids-option-light:not(.ids-option-disabled)>.ids-option__text': {
5209
+ color: 'var(--ids-comp-forms-option-color-fg-text-light-default)',
5210
+ },
5211
+ '.ids-option.ids-option-light:not(.ids-option-disabled)>.ids-icon': {
5212
+ color: 'var(--ids-comp-forms-option-color-fg-icon-light-default)',
5213
+ },
5214
+ '.ids-option.ids-option-light:not(.ids-option-disabled):hover': { background: 'var(--ids-comp-forms-option-color-bg-light-hovered)' },
5215
+ '.ids-option.ids-option-light:not(.ids-option-disabled):hover>.ids-option__text': {
5216
+ color: 'var(--ids-comp-forms-option-color-fg-text-light-hovered)',
5217
+ },
5218
+ '.ids-option.ids-option-light:not(.ids-option-disabled):hover>.ids-icon': {
5219
+ color: 'var(--ids-comp-forms-option-color-fg-icon-light-hovered)',
5220
+ },
5221
+ '.ids-option.ids-option-light:not(.ids-option-disabled):active': {
5222
+ background: 'var(--ids-comp-forms-option-color-bg-light-pressed)',
5223
+ },
5224
+ '.ids-option.ids-option-light:not(.ids-option-disabled):active>.ids-option__text': {
5225
+ color: 'var(--ids-comp-forms-option-color-fg-text-light-pressed)',
5226
+ },
5227
+ '.ids-option.ids-option-light:not(.ids-option-disabled):active>.ids-icon': {
5228
+ color: 'var(--ids-comp-forms-option-color-fg-icon-light-pressed)',
5229
+ },
5230
+ '.ids-option.ids-option-light:not(.ids-option-disabled).ids-option-active': {
5231
+ background: 'var(--ids-comp-forms-option-color-bg-light-active)',
5232
+ outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)',
5233
+ },
5234
+ '.ids-option.ids-option-light:not(.ids-option-disabled).ids-option-active>.ids-option__text': {
5235
+ color: 'var(--ids-comp-forms-option-color-fg-text-light-active)',
5236
+ },
5237
+ '.ids-option.ids-option-light:not(.ids-option-disabled).ids-option-active>.ids-icon': {
5238
+ color: 'var(--ids-comp-forms-option-color-fg-icon-light-active)',
5239
+ },
5240
+ '.ids-option.ids-option-light.ids-option-disabled': { background: 'var(--ids-comp-forms-option-color-bg-light-disabled)' },
5241
+ '.ids-option.ids-option-light.ids-option-disabled>.ids-option__text': {
5242
+ color: 'var(--ids-comp-forms-option-color-fg-text-light-disabled)',
5243
+ },
5244
+ '.ids-option.ids-option-light.ids-option-disabled>.ids-icon': { color: 'var(--ids-comp-forms-option-color-fg-icon-light-disabled)' },
5245
+ '.ids-option-group': { width: '100%' },
5246
+ '.ids-option-group>.ids-option-group__label': { display: 'flex', flexDirection: 'column', alignItems: 'flex-start', width: '100%' },
5247
+ '.ids-option-group>.ids-option-group__label>.ids-option-group__text': {
5248
+ display: 'flex',
5249
+ alignItems: 'center',
5250
+ alignSelf: 'stretch',
5251
+ fontStyle: 'normal',
5252
+ },
5253
+ '.ids-option-group.ids-option-group-compact>.ids-option-group__label': {
5254
+ gap: 'var(--ids-comp-forms-option-container-size-gap-compact)',
5255
+ },
5256
+ '.ids-option-group.ids-option-group-compact>.ids-option-group__label>.ids-option-group__text': {
5257
+ padding:
5258
+ 'var(--ids-comp-forms-option-group-title-size-padding-y-compact) var(--ids-comp-forms-option-group-title-size-padding-x-compact)',
5259
+ fontFamily: 'var(--ids-comp-forms-option-group-title-typography-font-family-compact)',
5260
+ fontSize: 'var(--ids-comp-forms-option-group-title-typography-font-size-compact)',
5261
+ fontWeight: 'var(--ids-comp-forms-option-group-title-typography-font-weight-compact)',
5262
+ lineHeight: 'var(--ids-comp-forms-option-group-title-typography-line-height-compact)',
5263
+ letterSpacing: 'var(--ids-comp-forms-option-group-title-typography-letter-spacing-compact)',
5264
+ },
5265
+ '.ids-option-group.ids-option-group-compact>.ids-option': {
5266
+ padding:
5267
+ 'var(--ids-comp-forms-option-item-size-padding-y-compact) var(--ids-comp-forms-option-group-item-size-padding-right-compact) var(--ids-comp-forms-option-item-size-padding-y-compact) var(--ids-comp-forms-option-group-item-size-padding-left-compact)',
5268
+ },
5269
+ '.ids-option-group.ids-option-group-comfortable>.ids-option-group__label': {
5270
+ gap: 'var(--ids-comp-forms-option-container-size-gap-comfortable)',
5271
+ },
5272
+ '.ids-option-group.ids-option-group-comfortable>.ids-option-group__label>.ids-option-group__text': {
5273
+ padding:
5274
+ 'var(--ids-comp-forms-option-group-title-size-padding-y-comfortable) var(--ids-comp-forms-option-group-title-size-padding-x-comfortable)',
5275
+ fontFamily: 'var(--ids-comp-forms-option-group-title-typography-font-family-comfortable)',
5276
+ fontSize: 'var(--ids-comp-forms-option-group-title-typography-font-size-comfortable)',
5277
+ fontWeight: 'var(--ids-comp-forms-option-group-title-typography-font-weight-comfortable)',
5278
+ lineHeight: 'var(--ids-comp-forms-option-group-title-typography-line-height-comfortable)',
5279
+ letterSpacing: 'var(--ids-comp-forms-option-group-title-typography-letter-spacing-comfortable)',
5280
+ },
5281
+ '.ids-option-group.ids-option-group-comfortable>.ids-option': {
5282
+ padding:
5283
+ 'var(--ids-comp-forms-option-item-size-padding-y-comfortable) var(--ids-comp-forms-option-group-item-size-padding-right-comfortable) var(--ids-comp-forms-option-item-size-padding-y-comfortable) var(--ids-comp-forms-option-group-item-size-padding-left-comfortable)',
5284
+ },
5285
+ '.ids-option-group.ids-option-group-spacious>.ids-option-group__label': {
5286
+ gap: 'var(--ids-comp-forms-option-container-size-gap-spacious)',
5287
+ },
5288
+ '.ids-option-group.ids-option-group-spacious>.ids-option-group__label>.ids-option-group__text': {
5289
+ padding:
5290
+ 'var(--ids-comp-forms-option-group-title-size-padding-y-spacious) var(--ids-comp-forms-option-group-title-size-padding-x-spacious)',
5291
+ fontFamily: 'var(--ids-comp-forms-option-group-title-typography-font-family-spacious)',
5292
+ fontSize: 'var(--ids-comp-forms-option-group-title-typography-font-size-spacious)',
5293
+ fontWeight: 'var(--ids-comp-forms-option-group-title-typography-font-weight-spacious)',
5294
+ lineHeight: 'var(--ids-comp-forms-option-group-title-typography-line-height-spacious)',
5295
+ letterSpacing: 'var(--ids-comp-forms-option-group-title-typography-letter-spacing-spacious)',
5296
+ },
5297
+ '.ids-option-group.ids-option-group-spacious>.ids-option': {
5298
+ padding:
5299
+ 'var(--ids-comp-forms-option-item-size-padding-y-spacious) var(--ids-comp-forms-option-group-item-size-padding-right-spacious) var(--ids-comp-forms-option-item-size-padding-y-spacious) var(--ids-comp-forms-option-group-item-size-padding-left-spacious)',
5300
+ },
5301
+ '.ids-option-group.ids-option-group-dense>.ids-option-group__label': { gap: 'var(--ids-comp-forms-option-container-size-gap-dense)' },
5302
+ '.ids-option-group.ids-option-group-dense>.ids-option-group__label>.ids-option-group__text': {
5303
+ padding:
5304
+ 'var(--ids-comp-forms-option-group-title-size-padding-y-dense) var(--ids-comp-forms-option-group-title-size-padding-x-dense)',
5305
+ fontFamily: 'var(--ids-comp-forms-option-group-title-typography-font-family-dense)',
5306
+ fontSize: 'var(--ids-comp-forms-option-group-title-typography-font-size-dense)',
5307
+ fontWeight: 'var(--ids-comp-forms-option-group-title-typography-font-weight-dense)',
5308
+ lineHeight: 'var(--ids-comp-forms-option-group-title-typography-line-height-dense)',
5309
+ letterSpacing: 'var(--ids-comp-forms-option-group-title-typography-letter-spacing-dense)',
5310
+ },
5311
+ '.ids-option-group.ids-option-group-dense>.ids-option': {
5312
+ padding:
5313
+ 'var(--ids-comp-forms-option-item-size-padding-y-dense) var(--ids-comp-forms-option-group-item-size-padding-right-dense) var(--ids-comp-forms-option-item-size-padding-y-dense) var(--ids-comp-forms-option-group-item-size-padding-left-dense)',
5314
+ },
5315
+ '.ids-option-group .ids-option-groupsurface>.ids-option-group__label>.ids-option-group__text': {
5316
+ color: 'var(--ids-comp-forms-option-color-group-title-color-fg-text-default)',
5317
+ },
5318
+ '.ids-option-group .ids-option-grouplight>.ids-option-group__label>.ids-option-group__text': {
5319
+ color: 'var(--ids-comp-forms-option-color-group-title-color-fg-text-default)',
5320
+ },
4663
5321
  '.ids-paginator': { display: 'inline-flex' },
4664
5322
  '.ids-paginator .ids-paginator__navigation-container': {
4665
5323
  display: 'flex',
@@ -6870,6 +7528,100 @@ module.exports = function ComponentsPlugin() {
6870
7528
  },
6871
7529
  '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:disabled .ids-icon':
6872
7530
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-disabled)' },
7531
+ '.ids-select': { width: '100%' },
7532
+ '.ids-select>.ids-select__trigger': { display: 'flex', justifyContent: 'space-between', alignItems: 'center' },
7533
+ '.ids-select>.ids-select__trigger>.ids-select__value': { flexGrow: 1, overflow: 'hidden' },
7534
+ '.ids-select>.ids-select__trigger>.ids-select__value>.ids-select__placeholder': { userSelect: 'none' },
7535
+ '.ids-select>.ids-select__trigger>.ids-select__value>.ids-select__value-text': {
7536
+ textOverflow: 'ellipsis',
7537
+ overflow: 'hidden',
7538
+ whiteSpace: 'nowrap',
7539
+ display: 'block',
7540
+ },
7541
+ '.ids-select>.ids-select__trigger>.ids-select__arrow': { flexShrink: 0 },
7542
+ '.ids-select.ids-select-compact>.ids-select__trigger': { gap: 'var(--ids-comp-forms-select-size-gap-compact)' },
7543
+ '.ids-select.ids-select-compact>.ids-select__trigger>.ids-select__value>.ids-select__placeholder': {
7544
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-compact)',
7545
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-compact)',
7546
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-weight-compact)',
7547
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-letter-spacing-compact)',
7548
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-line-height-compact)',
7549
+ },
7550
+ '.ids-select.ids-select-comfortable>.ids-select__trigger': { gap: 'var(--ids-comp-forms-select-size-gap-comfortable)' },
7551
+ '.ids-select.ids-select-comfortable>.ids-select__trigger>.ids-select__value>.ids-select__placeholder': {
7552
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-comfortable)',
7553
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-comfortable)',
7554
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-weight-comfortable)',
7555
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-letter-spacing-comfortable)',
7556
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-line-height-comfortable)',
7557
+ },
7558
+ '.ids-select.ids-select-spacious>.ids-select__trigger': { gap: 'var(--ids-comp-forms-select-size-gap-spacious)' },
7559
+ '.ids-select.ids-select-spacious>.ids-select__trigger>.ids-select__value>.ids-select__placeholder': {
7560
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-spacious)',
7561
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-spacious)',
7562
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-weight-spacious)',
7563
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-letter-spacing-spacious)',
7564
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-line-height-spacious)',
7565
+ },
7566
+ '.ids-select.ids-select-dense>.ids-select__trigger': { gap: 'var(--ids-comp-forms-select-size-gap-dense)' },
7567
+ '.ids-select.ids-select-dense>.ids-select__trigger>.ids-select__value>.ids-select__placeholder': {
7568
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-dense)',
7569
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-dense)',
7570
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-weight-dense)',
7571
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-letter-spacing-dense)',
7572
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-line-height-dense)',
7573
+ },
7574
+ '.ids-select-panel': {
7575
+ display: 'flex',
7576
+ flexDirection: 'column',
7577
+ alignItems: 'flex-start',
7578
+ flexShrink: 0,
7579
+ width: '100%',
7580
+ boxSizing: 'border-box',
7581
+ overflowY: 'auto',
7582
+ boxShadow:
7583
+ 'var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxl) var(--ids-smc-reference-container-effects-shadow-blur-xxxl) var(--ids-smc-reference-container-effects-shadow-spread-xxs) var(--ids-smc-reference-container-effects-shadow-color-dark-default)',
7584
+ },
7585
+ '.ids-select-panel.ids-select-panel-compact': {
7586
+ padding: 'var(--ids-comp-forms-select-panel-size-padding-y-compact) var(--ids-comp-forms-select-panel-size-padding-x-compact)',
7587
+ gap: 'var(--ids-comp-forms-select-panel-size-gap-compact)',
7588
+ borderRadius: 'var(--ids-comp-forms-select-panel-size-border-radius-compact)',
7589
+ },
7590
+ '.ids-select-panel.ids-select-panel-comfortable': {
7591
+ padding:
7592
+ 'var(--ids-comp-forms-select-panel-size-padding-y-comfortable) var(--ids-comp-forms-select-panel-size-padding-x-comfortable)',
7593
+ gap: 'var(--ids-comp-forms-select-panel-size-gap-comfortable)',
7594
+ borderRadius: 'var(--ids-comp-forms-select-panel-size-border-radius-comfortable)',
7595
+ },
7596
+ '.ids-select-panel.ids-select-panel-spacious': {
7597
+ padding: 'var(--ids-comp-forms-select-panel-size-padding-y-spacious) var(--ids-comp-forms-select-panel-size-padding-x-spacious)',
7598
+ gap: 'var(--ids-comp-forms-select-panel-size-gap-spacious)',
7599
+ borderRadius: 'var(--ids-comp-forms-select-panel-size-border-radius-spacious)',
7600
+ },
7601
+ '.ids-select-panel.ids-select-panel-dense': {
7602
+ padding: 'var(--ids-comp-forms-select-panel-size-padding-y-dense) var(--ids-comp-forms-select-panel-size-padding-x-dense)',
7603
+ gap: 'var(--ids-comp-forms-select-panel-size-gap-dense)',
7604
+ borderRadius: 'var(--ids-comp-forms-select-panel-size-border-radius-dense)',
7605
+ },
7606
+ '.ids-select-panel.ids-select-panel-surface': { background: 'var(--ids-comp-forms-select-panel-color-bg-surface-default)' },
7607
+ '.ids-select-panel.ids-select-panel-light': { background: 'var(--ids-comp-forms-select-panel-color-bg-light-default)' },
7608
+ '.ids-form-field>.ids-form-field__field-wrapper:has(.ids-select)': { cursor: 'pointer' },
7609
+ '.ids-form-field>.ids-form-field__field-wrapper .ids-select.ids-select-surface>.ids-select__trigger>.ids-select__value>.ids-select__placeholder':
7610
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-default)' },
7611
+ '.ids-form-field>.ids-form-field__field-wrapper:hover .ids-select.ids-select-surface>.ids-select__trigger>.ids-select__value>.ids-select__placeholder':
7612
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-hovered)' },
7613
+ '.ids-form-field>.ids-form-field__field-wrapper:focus .ids-select.ids-select-surface>.ids-select__trigger>.ids-select__value>.ids-select__placeholder,.ids-form-field>.ids-form-field__field-wrapper:focus-visible .ids-select.ids-select-surface>.ids-select__trigger>.ids-select__value>.ids-select__placeholder':
7614
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-focused)' },
7615
+ '.ids-form-field>.ids-form-field__field-wrapper:active .ids-select.ids-select-surface>.ids-select__trigger>.ids-select__value>.ids-select__placeholder':
7616
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-pressed)' },
7617
+ '.ids-form-field>.ids-form-field__field-wrapper .ids-select.ids-select-light>.ids-select__trigger>.ids-select__value>.ids-select__placeholder':
7618
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-default)' },
7619
+ '.ids-form-field>.ids-form-field__field-wrapper:hover .ids-select.ids-select-light>.ids-select__trigger>.ids-select__value>.ids-select__placeholder':
7620
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-hovered)' },
7621
+ '.ids-form-field>.ids-form-field__field-wrapper:focus .ids-select.ids-select-light>.ids-select__trigger>.ids-select__value>.ids-select__placeholder,.ids-form-field>.ids-form-field__field-wrapper:focus-visible .ids-select.ids-select-light>.ids-select__trigger>.ids-select__value>.ids-select__placeholder':
7622
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-focused)' },
7623
+ '.ids-form-field>.ids-form-field__field-wrapper:active .ids-select.ids-select-light>.ids-select__trigger>.ids-select__value>.ids-select__placeholder':
7624
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-pressed)' },
6873
7625
  '.ids-snackbar-group': { display: 'flex' },
6874
7626
  '.ids-snackbar-group.ids-snackbar-group-position-top-left,.ids-snackbar-group.ids-snackbar-group-position-top-center,.ids-snackbar-group.ids-snackbar-group-position-top-right':
6875
7627
  { flexDirection: 'column-reverse' },
@@ -7194,9 +7946,8 @@ module.exports = function ComponentsPlugin() {
7194
7946
  top: 'auto',
7195
7947
  bottom: 'auto',
7196
7948
  },
7197
- '.ids-switch>.ids-switch__button>.ids-switch__track>.ids-switch__track-icon>.ids-icon': { position: 'absolute' },
7198
7949
  '.ids-switch>.ids-switch__button>.ids-switch__track>.ids-switch__handle': {
7199
- position: 'absolute',
7950
+ position: 'relative',
7200
7951
  display: 'flex',
7201
7952
  justifyContent: 'center',
7202
7953
  alignItems: 'center',
@@ -7247,11 +7998,9 @@ module.exports = function ComponentsPlugin() {
7247
7998
  lineHeight: 'var(--ids-comp-switch-label-typography-line-height-compact)',
7248
7999
  letterSpacing: 'var(--ids-comp-switch-label-typography-letter-spacing-compact)',
7249
8000
  },
7250
- '.ids-switch.ids-switch-compact:not(.ids-switch-on)>.ids-switch__button>.ids-switch__track>.ids-switch__handle': {
7251
- left: 'var(--ids-comp-switch-track-size-padding-x-compact)',
7252
- },
8001
+ '.ids-switch.ids-switch-compact:not(.ids-switch-on)>.ids-switch__button>.ids-switch__track>.ids-switch__handle': { left: '0' },
7253
8002
  '.ids-switch.ids-switch-compact.ids-switch-on>.ids-switch__button>.ids-switch__track>.ids-switch__handle': {
7254
- left: 'calc(100% - var(--ids-comp-switch-track-size-padding-x-compact) - var(--ids-comp-switch-handle-size-width-compact))',
8003
+ left: 'calc(var(--ids-comp-switch-track-size-width-compact) - var(--ids-comp-switch-handle-size-width-compact))',
7255
8004
  },
7256
8005
  '.ids-switch.ids-switch-comfortable': { gap: 'var(--ids-comp-switch-container-size-gap-comfortable)' },
7257
8006
  '.ids-switch.ids-switch-comfortable>.ids-switch__button': {
@@ -7298,11 +8047,9 @@ module.exports = function ComponentsPlugin() {
7298
8047
  lineHeight: 'var(--ids-comp-switch-label-typography-line-height-comfortable)',
7299
8048
  letterSpacing: 'var(--ids-comp-switch-label-typography-letter-spacing-comfortable)',
7300
8049
  },
7301
- '.ids-switch.ids-switch-comfortable:not(.ids-switch-on)>.ids-switch__button>.ids-switch__track>.ids-switch__handle': {
7302
- left: 'var(--ids-comp-switch-track-size-padding-x-comfortable)',
7303
- },
8050
+ '.ids-switch.ids-switch-comfortable:not(.ids-switch-on)>.ids-switch__button>.ids-switch__track>.ids-switch__handle': { left: '0' },
7304
8051
  '.ids-switch.ids-switch-comfortable.ids-switch-on>.ids-switch__button>.ids-switch__track>.ids-switch__handle': {
7305
- left: 'calc(100% - var(--ids-comp-switch-track-size-padding-x-comfortable) - var(--ids-comp-switch-handle-size-width-comfortable))',
8052
+ left: 'calc(var(--ids-comp-switch-track-size-width-comfortable) - var(--ids-comp-switch-handle-size-width-comfortable))',
7306
8053
  },
7307
8054
  '.ids-switch.ids-switch-spacious': { gap: 'var(--ids-comp-switch-container-size-gap-spacious)' },
7308
8055
  '.ids-switch.ids-switch-spacious>.ids-switch__button': { borderRadius: 'var(--ids-comp-switch-handle-size-border-radius-spacious)' },
@@ -7347,11 +8094,9 @@ module.exports = function ComponentsPlugin() {
7347
8094
  lineHeight: 'var(--ids-comp-switch-label-typography-line-height-spacious)',
7348
8095
  letterSpacing: 'var(--ids-comp-switch-label-typography-letter-spacing-spacious)',
7349
8096
  },
7350
- '.ids-switch.ids-switch-spacious:not(.ids-switch-on)>.ids-switch__button>.ids-switch__track>.ids-switch__handle': {
7351
- left: 'var(--ids-comp-switch-track-size-padding-x-spacious)',
7352
- },
8097
+ '.ids-switch.ids-switch-spacious:not(.ids-switch-on)>.ids-switch__button>.ids-switch__track>.ids-switch__handle': { left: '0' },
7353
8098
  '.ids-switch.ids-switch-spacious.ids-switch-on>.ids-switch__button>.ids-switch__track>.ids-switch__handle': {
7354
- left: 'calc(100% - var(--ids-comp-switch-track-size-padding-x-spacious) - var(--ids-comp-switch-handle-size-width-spacious))',
8099
+ left: 'calc(var(--ids-comp-switch-track-size-width-spacious) - var(--ids-comp-switch-handle-size-width-spacious))',
7355
8100
  },
7356
8101
  '.ids-switch.ids-switch-dense': { gap: 'var(--ids-comp-switch-container-size-gap-dense)' },
7357
8102
  '.ids-switch.ids-switch-dense>.ids-switch__button': { borderRadius: 'var(--ids-comp-switch-handle-size-border-radius-dense)' },
@@ -7396,11 +8141,9 @@ module.exports = function ComponentsPlugin() {
7396
8141
  lineHeight: 'var(--ids-comp-switch-label-typography-line-height-dense)',
7397
8142
  letterSpacing: 'var(--ids-comp-switch-label-typography-letter-spacing-dense)',
7398
8143
  },
7399
- '.ids-switch.ids-switch-dense:not(.ids-switch-on)>.ids-switch__button>.ids-switch__track>.ids-switch__handle': {
7400
- left: 'var(--ids-comp-switch-track-size-padding-x-dense)',
7401
- },
8144
+ '.ids-switch.ids-switch-dense:not(.ids-switch-on)>.ids-switch__button>.ids-switch__track>.ids-switch__handle': { left: '0' },
7402
8145
  '.ids-switch.ids-switch-dense.ids-switch-on>.ids-switch__button>.ids-switch__track>.ids-switch__handle': {
7403
- left: 'calc(100% - var(--ids-comp-switch-track-size-padding-x-dense) - var(--ids-comp-switch-handle-size-width-dense))',
8146
+ left: 'calc(var(--ids-comp-switch-track-size-width-dense) - var(--ids-comp-switch-handle-size-width-dense))',
7404
8147
  },
7405
8148
  '.ids-switch.ids-switch-surface:not(.ids-switch-disabled)>.ids-switch__button>.ids-switch__track': {
7406
8149
  backgroundColor: 'var(--ids-comp-switch-track-off-color-bg-surface-default)',