@transferwise/components 0.0.0-experimental-3cfaec8 → 0.0.0-experimental-f0d8cf1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/build/main.css +558 -503
  2. package/build/sentimentSurface/SentimentSurface.js +2 -9
  3. package/build/sentimentSurface/SentimentSurface.js.map +1 -1
  4. package/build/sentimentSurface/SentimentSurface.mjs +2 -9
  5. package/build/sentimentSurface/SentimentSurface.mjs.map +1 -1
  6. package/build/styles/css/neptune.css +11 -11
  7. package/build/styles/less/legacy-variables.less +1 -1
  8. package/build/styles/less/neptune-tokens.less +2 -2
  9. package/build/styles/main.css +558 -503
  10. package/build/styles/props/custom-media.css +1 -1
  11. package/build/styles/props/neptune-tokens.css +1 -1
  12. package/build/styles/sentimentSurface/SentimentSurface.css +337 -325
  13. package/build/styles/styles/less/neptune.css +11 -11
  14. package/build/types/sentimentSurface/SentimentSurface.d.ts.map +1 -1
  15. package/package.json +2 -2
  16. package/src/criticalBanner/CriticalCommsBanner.test.tsx +1 -1
  17. package/src/main.css +558 -503
  18. package/src/sentimentSurface/SentimentSurface.css +337 -325
  19. package/src/sentimentSurface/SentimentSurface.docs.mdx +0 -2
  20. package/src/sentimentSurface/SentimentSurface.less +322 -2
  21. package/src/sentimentSurface/SentimentSurface.story.tsx +0 -4
  22. package/src/sentimentSurface/SentimentSurface.test.story.tsx +5 -1
  23. package/src/sentimentSurface/SentimentSurface.test.tsx +3 -84
  24. package/src/sentimentSurface/SentimentSurface.tsx +2 -10
  25. package/src/styles/less/neptune.css +11 -11
package/build/main.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly, this file was auto-generated.
3
- * Generated on Fri, 22 May 2026 17:00:35 GMT
3
+ * Generated on Thu, 14 May 2026 16:11:43 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -144,7 +144,7 @@
144
144
 
145
145
  /**
146
146
  * Do not edit directly, this file was auto-generated.
147
- * Generated on Fri, 22 May 2026 17:00:36 GMT
147
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
148
148
  */
149
149
 
150
150
  .np-theme-personal {
@@ -328,7 +328,7 @@
328
328
 
329
329
  /**
330
330
  * Do not edit directly, this file was auto-generated.
331
- * Generated on Fri, 22 May 2026 17:00:36 GMT
331
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
332
332
  */
333
333
 
334
334
  .np-theme-personal--forest-green {
@@ -512,7 +512,7 @@
512
512
 
513
513
  /**
514
514
  * Do not edit directly, this file was auto-generated.
515
- * Generated on Fri, 22 May 2026 17:00:36 GMT
515
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
516
516
  */
517
517
 
518
518
  .np-theme-personal--bright-green {
@@ -696,7 +696,7 @@
696
696
 
697
697
  /**
698
698
  * Do not edit directly, this file was auto-generated.
699
- * Generated on Fri, 22 May 2026 17:00:36 GMT
699
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
700
700
  */
701
701
 
702
702
  .np-theme-personal--dark {
@@ -880,7 +880,7 @@
880
880
 
881
881
  /**
882
882
  * Do not edit directly, this file was auto-generated.
883
- * Generated on Fri, 22 May 2026 17:00:36 GMT
883
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
884
884
  */
885
885
 
886
886
  .np-theme-platform {
@@ -1064,7 +1064,7 @@
1064
1064
 
1065
1065
  /**
1066
1066
  * Do not edit directly, this file was auto-generated.
1067
- * Generated on Fri, 22 May 2026 17:00:36 GMT
1067
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
1068
1068
  */
1069
1069
 
1070
1070
  .np-theme-platform--forest-green {
@@ -1248,7 +1248,7 @@
1248
1248
 
1249
1249
  /**
1250
1250
  * Do not edit directly, this file was auto-generated.
1251
- * Generated on Fri, 22 May 2026 17:00:36 GMT
1251
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
1252
1252
  */
1253
1253
 
1254
1254
  .np-theme-business {
@@ -1433,7 +1433,7 @@
1433
1433
 
1434
1434
  /**
1435
1435
  * Do not edit directly, this file was auto-generated.
1436
- * Generated on Fri, 22 May 2026 17:00:36 GMT
1436
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
1437
1437
  */
1438
1438
 
1439
1439
  .np-theme-business--dark {
@@ -1618,7 +1618,7 @@
1618
1618
 
1619
1619
  /**
1620
1620
  * Do not edit directly, this file was auto-generated.
1621
- * Generated on Fri, 22 May 2026 17:00:36 GMT
1621
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
1622
1622
  */
1623
1623
 
1624
1624
  .np-theme-business--forest-green {
@@ -1803,7 +1803,7 @@
1803
1803
 
1804
1804
  /**
1805
1805
  * Do not edit directly, this file was auto-generated.
1806
- * Generated on Fri, 22 May 2026 17:00:36 GMT
1806
+ * Generated on Thu, 14 May 2026 16:11:44 GMT
1807
1807
  */
1808
1808
 
1809
1809
  .np-theme-business--bright-green {
@@ -1988,451 +1988,6 @@
1988
1988
 
1989
1989
  /* See: https://github.com/fontsource/fontsource/blob/main/fonts/google/inter/variable.css */
1990
1990
 
1991
- /**
1992
- * Do not edit directly, this file was auto-generated.
1993
- * Generated on Fri, 22 May 2026 17:00:36 GMT
1994
- */
1995
-
1996
- .wds-sentiment-negative-light-base {
1997
- --color-sentiment-content-primary: #CB272F;
1998
- --color-sentiment-content-primary-hover: #B8232B;
1999
- --color-sentiment-content-primary-active: #A72027;
2000
- --color-sentiment-interactive-primary: #CB272F;
2001
- --color-sentiment-interactive-primary-hover: #B8232B;
2002
- --color-sentiment-interactive-primary-active: #A72027;
2003
- --color-sentiment-interactive-secondary: #FBEAEA;
2004
- --color-sentiment-interactive-secondary-hover: #F9E1E1;
2005
- --color-sentiment-interactive-secondary-active: #F8D8D8;
2006
- --color-sentiment-interactive-secondary-neutral: #F5D3D4;
2007
- --color-sentiment-interactive-secondary-neutral-hover: #F0BDBE;
2008
- --color-sentiment-interactive-secondary-neutral-active: #ECACAD;
2009
- --color-sentiment-interactive-control: #FBEAEA;
2010
- --color-sentiment-interactive-control-hover: #F9E1E1;
2011
- --color-sentiment-interactive-control-active: #F8D8D8;
2012
- --color-sentiment-background-surface: #FBEAEA;
2013
- --color-sentiment-background-surface-hover: #F9E1E1;
2014
- --color-sentiment-background-surface-active: #F8D8D8;
2015
- --color-sentiment-border-overlay: rgba(203,39,47,0.30196);
2016
- }
2017
-
2018
- .wds-sentiment-negative-light-elevated {
2019
- --color-sentiment-content-primary: #FFFFFF;
2020
- --color-sentiment-content-primary-hover: #F5CCCC;
2021
- --color-sentiment-content-primary-active: #F1B7B7;
2022
- --color-sentiment-interactive-primary: #FBEAEA;
2023
- --color-sentiment-interactive-primary-hover: #F5CCCC;
2024
- --color-sentiment-interactive-primary-active: #F1B7B7;
2025
- --color-sentiment-interactive-secondary: #CB272F;
2026
- --color-sentiment-interactive-secondary-hover: #B8232B;
2027
- --color-sentiment-interactive-secondary-active: #A72027;
2028
- --color-sentiment-interactive-secondary-neutral: #9B141B;
2029
- --color-sentiment-interactive-secondary-neutral-hover: #831116;
2030
- --color-sentiment-interactive-secondary-neutral-active: #6D0E13;
2031
- --color-sentiment-interactive-control: #CB272F;
2032
- --color-sentiment-interactive-control-hover: #B8232B;
2033
- --color-sentiment-interactive-control-active: #A72027;
2034
- --color-sentiment-background-surface: #CB272F;
2035
- --color-sentiment-background-surface-hover: #B8232B;
2036
- --color-sentiment-background-surface-active: #A72027;
2037
- --color-sentiment-border-overlay: rgba(255,255,255,0.30196);
2038
- }
2039
-
2040
- .wds-sentiment-neutral-light-base {
2041
- --color-sentiment-content-primary: #454745;
2042
- --color-sentiment-content-primary-hover: #353635;
2043
- --color-sentiment-content-primary-active: #232423;
2044
- --color-sentiment-interactive-primary: #454745;
2045
- --color-sentiment-interactive-primary-hover: #353635;
2046
- --color-sentiment-interactive-primary-active: #232423;
2047
- --color-sentiment-interactive-secondary: rgba(62,59,7,0.07059);
2048
- --color-sentiment-interactive-secondary-hover: rgba(62,59,7,0.12157);
2049
- --color-sentiment-interactive-secondary-active: rgba(62,59,7,0.16863);
2050
- --color-sentiment-interactive-secondary-neutral: rgba(62,59,7,0.07059);
2051
- --color-sentiment-interactive-secondary-neutral-hover: rgba(62,59,7,0.12157);
2052
- --color-sentiment-interactive-secondary-neutral-active: rgba(62,59,7,0.16863);
2053
- --color-sentiment-interactive-control: #F1F1ED;
2054
- --color-sentiment-interactive-control-hover: #E7E7E1;
2055
- --color-sentiment-interactive-control-active: #DFDED5;
2056
- --color-sentiment-background-surface: rgba(62,59,7,0.07059);
2057
- --color-sentiment-background-surface-hover: rgba(62,59,7,0.12157);
2058
- --color-sentiment-background-surface-active: rgba(62,59,7,0.16863);
2059
- --color-sentiment-border-overlay: rgba(69,71,69,0.30196);
2060
- }
2061
-
2062
- .wds-sentiment-neutral-light-elevated {
2063
- --color-sentiment-content-primary: #F1F1ED;
2064
- --color-sentiment-content-primary-hover: #E7E7E1;
2065
- --color-sentiment-content-primary-active: #DFDED5;
2066
- --color-sentiment-interactive-primary: #F1F1ED;
2067
- --color-sentiment-interactive-primary-hover: #E7E7E1;
2068
- --color-sentiment-interactive-primary-active: #DFDED5;
2069
- --color-sentiment-interactive-secondary: #454745;
2070
- --color-sentiment-interactive-secondary-hover: #353635;
2071
- --color-sentiment-interactive-secondary-active: #232423;
2072
- --color-sentiment-interactive-secondary-neutral: #585958;
2073
- --color-sentiment-interactive-secondary-neutral-hover: #6A6C6A;
2074
- --color-sentiment-interactive-secondary-neutral-active: #7D7E7D;
2075
- --color-sentiment-interactive-control: #454745;
2076
- --color-sentiment-interactive-control-hover: #353635;
2077
- --color-sentiment-interactive-control-active: #232423;
2078
- --color-sentiment-background-surface: #454745;
2079
- --color-sentiment-background-surface-hover: #353635;
2080
- --color-sentiment-background-surface-active: #232423;
2081
- --color-sentiment-border-overlay: rgba(241,241,237,0.30196);
2082
- }
2083
-
2084
- .wds-sentiment-proposition-light-base {
2085
- --color-sentiment-content-primary: #0E0F0C;
2086
- --color-sentiment-content-primary-hover: #0A2826;
2087
- --color-sentiment-content-primary-active: #074140;
2088
- --color-sentiment-interactive-primary: #054D4D;
2089
- --color-sentiment-interactive-primary-hover: #043A3A;
2090
- --color-sentiment-interactive-primary-active: #022626;
2091
- --color-sentiment-interactive-secondary: #E0F7F7;
2092
- --color-sentiment-interactive-secondary-hover: #CAF1F1;
2093
- --color-sentiment-interactive-secondary-active: #B6ECEC;
2094
- --color-sentiment-interactive-secondary-neutral: #B4D5D5;
2095
- --color-sentiment-interactive-secondary-neutral-hover: #A3CCCC;
2096
- --color-sentiment-interactive-secondary-neutral-active: #9AC6C6;
2097
- --color-sentiment-interactive-control: #E0F7F7;
2098
- --color-sentiment-interactive-control-hover: #CAF1F1;
2099
- --color-sentiment-interactive-control-active: #B6ECEC;
2100
- --color-sentiment-background-surface: #E0F7F7;
2101
- --color-sentiment-background-surface-hover: #CAF1F1;
2102
- --color-sentiment-background-surface-active: #B6ECEC;
2103
- --color-sentiment-border-overlay: rgba(14,15,12,0.30196);
2104
- }
2105
-
2106
- .wds-sentiment-proposition-light-elevated {
2107
- --color-sentiment-content-primary: #FFFFFF;
2108
- --color-sentiment-content-primary-hover: #EAF9F9;
2109
- --color-sentiment-content-primary-active: #D5F4F4;
2110
- --color-sentiment-interactive-primary: #E0F7F7;
2111
- --color-sentiment-interactive-primary-hover: #CAF1F1;
2112
- --color-sentiment-interactive-primary-active: #B6ECEC;
2113
- --color-sentiment-interactive-secondary: #054D4D;
2114
- --color-sentiment-interactive-secondary-hover: #043A3A;
2115
- --color-sentiment-interactive-secondary-active: #022626;
2116
- --color-sentiment-interactive-secondary-neutral: #1F6161;
2117
- --color-sentiment-interactive-secondary-neutral-hover: #247070;
2118
- --color-sentiment-interactive-secondary-neutral-active: #298080;
2119
- --color-sentiment-interactive-control: #054D4D;
2120
- --color-sentiment-interactive-control-hover: #043A3A;
2121
- --color-sentiment-interactive-control-active: #022626;
2122
- --color-sentiment-background-surface: #054D4D;
2123
- --color-sentiment-background-surface-hover: #043A3A;
2124
- --color-sentiment-background-surface-active: #022626;
2125
- --color-sentiment-border-overlay: rgba(255,255,255,0.30196);
2126
- }
2127
-
2128
- .wds-sentiment-success-light-base {
2129
- --color-sentiment-content-primary: #054D28;
2130
- --color-sentiment-content-primary-hover: #043A1E;
2131
- --color-sentiment-content-primary-active: #022614;
2132
- --color-sentiment-interactive-primary: #054D28;
2133
- --color-sentiment-interactive-primary-hover: #043A1E;
2134
- --color-sentiment-interactive-primary-active: #022614;
2135
- --color-sentiment-interactive-secondary: #E2F6D5;
2136
- --color-sentiment-interactive-secondary-hover: #D3F2C0;
2137
- --color-sentiment-interactive-secondary-active: #C5EDAB;
2138
- --color-sentiment-interactive-secondary-neutral: #BCD9B8;
2139
- --color-sentiment-interactive-secondary-neutral-hover: #AACFA5;
2140
- --color-sentiment-interactive-secondary-neutral-active: #94C38E;
2141
- --color-sentiment-interactive-control: #E2F6D5;
2142
- --color-sentiment-interactive-control-hover: #D3F2C0;
2143
- --color-sentiment-interactive-control-active: #C5EDAB;
2144
- --color-sentiment-background-surface: #E2F6D5;
2145
- --color-sentiment-background-surface-hover: #D3F2C0;
2146
- --color-sentiment-background-surface-active: #C5EDAB;
2147
- --color-sentiment-border-overlay: rgba(5,77,40,0.30196);
2148
- }
2149
-
2150
- .wds-sentiment-success-light-elevated {
2151
- --color-sentiment-content-primary: #CEF1B8;
2152
- --color-sentiment-content-primary-hover: #E0FFCC;
2153
- --color-sentiment-content-primary-active: #E1F4D4;
2154
- --color-sentiment-interactive-primary: #CEF1B8;
2155
- --color-sentiment-interactive-primary-hover: #E0FFCC;
2156
- --color-sentiment-interactive-primary-active: #E1F4D4;
2157
- --color-sentiment-interactive-secondary: #054D28;
2158
- --color-sentiment-interactive-secondary-hover: #043A1E;
2159
- --color-sentiment-interactive-secondary-active: #022614;
2160
- --color-sentiment-interactive-secondary-neutral: #256A43;
2161
- --color-sentiment-interactive-secondary-neutral-hover: #2A794C;
2162
- --color-sentiment-interactive-secondary-neutral-active: #329057;
2163
- --color-sentiment-interactive-control: #054D28;
2164
- --color-sentiment-interactive-control-hover: #043A1E;
2165
- --color-sentiment-interactive-control-active: #022614;
2166
- --color-sentiment-background-surface: #054D28;
2167
- --color-sentiment-background-surface-hover: #043A1E;
2168
- --color-sentiment-background-surface-active: #022614;
2169
- --color-sentiment-border-overlay: rgba(206,241,184,0.30196);
2170
- }
2171
-
2172
- .wds-sentiment-warning-light-base {
2173
- --color-sentiment-content-primary: #4A3B1C;
2174
- --color-sentiment-content-primary-hover: #302612;
2175
- --color-sentiment-content-primary-active: #2C2311;
2176
- --color-sentiment-interactive-primary: #FFD11A;
2177
- --color-sentiment-interactive-primary-hover: #FFBF0F;
2178
- --color-sentiment-interactive-primary-active: #FFBB00;
2179
- --color-sentiment-interactive-secondary: #FFF7D7;
2180
- --color-sentiment-interactive-secondary-hover: #FFF0B2;
2181
- --color-sentiment-interactive-secondary-active: #FFE98F;
2182
- --color-sentiment-interactive-secondary-neutral: #FFEC9E;
2183
- --color-sentiment-interactive-secondary-neutral-hover: #FFE187;
2184
- --color-sentiment-interactive-secondary-neutral-active: #FFD55F;
2185
- --color-sentiment-interactive-control: #4A3B1C;
2186
- --color-sentiment-interactive-control-hover: #302612;
2187
- --color-sentiment-interactive-control-active: #2C2311;
2188
- --color-sentiment-background-surface: #FFF7D7;
2189
- --color-sentiment-background-surface-hover: #FFF0B2;
2190
- --color-sentiment-background-surface-active: #FFE98F;
2191
- --color-sentiment-border-overlay: rgba(74,59,28,0.30196);
2192
- }
2193
-
2194
- .wds-sentiment-warning-light-elevated {
2195
- --color-sentiment-content-primary: #4A3B1C;
2196
- --color-sentiment-content-primary-hover: #302612;
2197
- --color-sentiment-content-primary-active: #2C2311;
2198
- --color-sentiment-interactive-primary: #4A3B1C;
2199
- --color-sentiment-interactive-primary-hover: #302612;
2200
- --color-sentiment-interactive-primary-active: #2C2311;
2201
- --color-sentiment-interactive-secondary: #FFD11A;
2202
- --color-sentiment-interactive-secondary-hover: #FFBF0F;
2203
- --color-sentiment-interactive-secondary-active: #FFBB00;
2204
- --color-sentiment-interactive-secondary-neutral: #FFEC9E;
2205
- --color-sentiment-interactive-secondary-neutral-hover: #FFEDB8;
2206
- --color-sentiment-interactive-secondary-neutral-active: #FFF2CC;
2207
- --color-sentiment-interactive-control: #FFD11A;
2208
- --color-sentiment-interactive-control-hover: #FFBF0F;
2209
- --color-sentiment-interactive-control-active: #FFBB00;
2210
- --color-sentiment-background-surface: #FFD11A;
2211
- --color-sentiment-background-surface-hover: #FFBF0F;
2212
- --color-sentiment-background-surface-active: #FFBB00;
2213
- --color-sentiment-border-overlay: rgba(74,59,28,0.30196);
2214
- }
2215
-
2216
- .wds-sentiment-negative-dark-base {
2217
- --color-sentiment-content-primary: #FFA8AD;
2218
- --color-sentiment-content-primary-hover: #FFBDC0;
2219
- --color-sentiment-content-primary-active: #FFD1D3;
2220
- --color-sentiment-interactive-primary: #FFA8AD;
2221
- --color-sentiment-interactive-primary-hover: #FFBDC0;
2222
- --color-sentiment-interactive-primary-active: #FFD1D3;
2223
- --color-sentiment-interactive-secondary: #410B0D;
2224
- --color-sentiment-interactive-secondary-hover: #641115;
2225
- --color-sentiment-interactive-secondary-active: #761418;
2226
- --color-sentiment-interactive-secondary-neutral: #601013;
2227
- --color-sentiment-interactive-secondary-neutral-hover: #7A1519;
2228
- --color-sentiment-interactive-secondary-neutral-active: #90181D;
2229
- --color-sentiment-interactive-control: #410B0D;
2230
- --color-sentiment-interactive-control-hover: #641115;
2231
- --color-sentiment-interactive-control-active: #761418;
2232
- --color-sentiment-background-surface: #410B0D;
2233
- --color-sentiment-background-surface-hover: #641115;
2234
- --color-sentiment-background-surface-active: #761418;
2235
- --color-sentiment-border-overlay: rgba(255,168,173,0.30196);
2236
- }
2237
-
2238
- .wds-sentiment-negative-dark-elevated {
2239
- --color-sentiment-content-primary: #410B0D;
2240
- --color-sentiment-content-primary-hover: #641115;
2241
- --color-sentiment-content-primary-active: #761418;
2242
- --color-sentiment-interactive-primary: #410B0D;
2243
- --color-sentiment-interactive-primary-hover: #641115;
2244
- --color-sentiment-interactive-primary-active: #761418;
2245
- --color-sentiment-interactive-secondary: #FFA8AD;
2246
- --color-sentiment-interactive-secondary-hover: #FFBDC0;
2247
- --color-sentiment-interactive-secondary-active: #FFD1D3;
2248
- --color-sentiment-interactive-secondary-neutral: #D9898D;
2249
- --color-sentiment-interactive-secondary-neutral-hover: #D68084;
2250
- --color-sentiment-interactive-secondary-neutral-active: #D06C71;
2251
- --color-sentiment-interactive-control: #FFA8AD;
2252
- --color-sentiment-interactive-control-hover: #FFBDC0;
2253
- --color-sentiment-interactive-control-active: #FFD1D3;
2254
- --color-sentiment-background-surface: #FFA8AD;
2255
- --color-sentiment-background-surface-hover: #FFBDC0;
2256
- --color-sentiment-background-surface-active: #FFD1D3;
2257
- --color-sentiment-border-overlay: rgba(65,11,13,0.30196);
2258
- }
2259
-
2260
- .wds-sentiment-neutral-dark-base {
2261
- --color-sentiment-content-primary: #F1F1ED;
2262
- --color-sentiment-content-primary-hover: #E7E7E1;
2263
- --color-sentiment-content-primary-active: #DFDED5;
2264
- --color-sentiment-interactive-primary: #F1F1ED;
2265
- --color-sentiment-interactive-primary-hover: #E7E7E1;
2266
- --color-sentiment-interactive-primary-active: #DFDED5;
2267
- --color-sentiment-interactive-secondary: rgba(255,255,255,0.10196);
2268
- --color-sentiment-interactive-secondary-hover: rgba(255,255,255,0.2);
2269
- --color-sentiment-interactive-secondary-active: rgba(255,255,255,0.30196);
2270
- --color-sentiment-interactive-secondary-neutral: rgba(255,255,255,0.10196);
2271
- --color-sentiment-interactive-secondary-neutral-hover: rgba(255,255,255,0.2);
2272
- --color-sentiment-interactive-secondary-neutral-active: rgba(255,255,255,0.30196);
2273
- --color-sentiment-interactive-control: #2A2C29;
2274
- --color-sentiment-interactive-control-hover: #414441;
2275
- --color-sentiment-interactive-control-active: #595B58;
2276
- --color-sentiment-background-surface: rgba(255,255,255,0.10196);
2277
- --color-sentiment-background-surface-hover: rgba(255,255,255,0.2);
2278
- --color-sentiment-background-surface-active: rgba(255,255,255,0.30196);
2279
- --color-sentiment-border-overlay: rgba(241,241,237,0.30196);
2280
- }
2281
-
2282
- .wds-sentiment-neutral-dark-elevated {
2283
- --color-sentiment-content-primary: #2A2C29;
2284
- --color-sentiment-content-primary-hover: #414441;
2285
- --color-sentiment-content-primary-active: #595B58;
2286
- --color-sentiment-interactive-primary: #2A2C29;
2287
- --color-sentiment-interactive-primary-hover: #414441;
2288
- --color-sentiment-interactive-primary-active: #595B58;
2289
- --color-sentiment-interactive-secondary: #F1F1ED;
2290
- --color-sentiment-interactive-secondary-hover: #E7E7E1;
2291
- --color-sentiment-interactive-secondary-active: #DFDED5;
2292
- --color-sentiment-interactive-secondary-neutral: #E4E4DC;
2293
- --color-sentiment-interactive-secondary-neutral-hover: #DCDCD2;
2294
- --color-sentiment-interactive-secondary-neutral-active: #D3D2C6;
2295
- --color-sentiment-interactive-control: #F1F1ED;
2296
- --color-sentiment-interactive-control-hover: #E7E7E1;
2297
- --color-sentiment-interactive-control-active: #DFDED5;
2298
- --color-sentiment-background-surface: #F1F1ED;
2299
- --color-sentiment-background-surface-hover: #E7E7E1;
2300
- --color-sentiment-background-surface-active: #DFDED5;
2301
- --color-sentiment-border-overlay: rgba(42,44,41,0.30196);
2302
- }
2303
-
2304
- .wds-sentiment-proposition-dark-base {
2305
- --color-sentiment-content-primary: #FFFFFF;
2306
- --color-sentiment-content-primary-hover: #EAF9F9;
2307
- --color-sentiment-content-primary-active: #D5F4F4;
2308
- --color-sentiment-interactive-primary: #E0F7F7;
2309
- --color-sentiment-interactive-primary-hover: #CAF1F1;
2310
- --color-sentiment-interactive-primary-active: #B6ECEC;
2311
- --color-sentiment-interactive-secondary: #054D4D;
2312
- --color-sentiment-interactive-secondary-hover: #043A3A;
2313
- --color-sentiment-interactive-secondary-active: #022626;
2314
- --color-sentiment-interactive-secondary-neutral: #1F6161;
2315
- --color-sentiment-interactive-secondary-neutral-hover: #247070;
2316
- --color-sentiment-interactive-secondary-neutral-active: #298080;
2317
- --color-sentiment-interactive-control: #054D4D;
2318
- --color-sentiment-interactive-control-hover: #043A3A;
2319
- --color-sentiment-interactive-control-active: #022626;
2320
- --color-sentiment-background-surface: #054D4D;
2321
- --color-sentiment-background-surface-hover: #043A3A;
2322
- --color-sentiment-background-surface-active: #022626;
2323
- --color-sentiment-border-overlay: rgba(255,255,255,0.30196);
2324
- }
2325
-
2326
- .wds-sentiment-proposition-dark-elevated {
2327
- --color-sentiment-content-primary: #0E0F0C;
2328
- --color-sentiment-content-primary-hover: #0A2826;
2329
- --color-sentiment-content-primary-active: #074140;
2330
- --color-sentiment-interactive-primary: #0B312F;
2331
- --color-sentiment-interactive-primary-hover: #104744;
2332
- --color-sentiment-interactive-primary-active: #16605C;
2333
- --color-sentiment-interactive-secondary: #E0F7F7;
2334
- --color-sentiment-interactive-secondary-hover: #CAF1F1;
2335
- --color-sentiment-interactive-secondary-active: #B6ECEC;
2336
- --color-sentiment-interactive-secondary-neutral: #B4D5D5;
2337
- --color-sentiment-interactive-secondary-neutral-hover: #A3CCCC;
2338
- --color-sentiment-interactive-secondary-neutral-active: #9AC6C6;
2339
- --color-sentiment-interactive-control: #E0F7F7;
2340
- --color-sentiment-interactive-control-hover: #CAF1F1;
2341
- --color-sentiment-interactive-control-active: #B6ECEC;
2342
- --color-sentiment-background-surface: #E0F7F7;
2343
- --color-sentiment-background-surface-hover: #CAF1F1;
2344
- --color-sentiment-background-surface-active: #B6ECEC;
2345
- --color-sentiment-border-overlay: rgba(14,15,12,0.30196);
2346
- }
2347
-
2348
- .wds-sentiment-success-dark-base {
2349
- --color-sentiment-content-primary: #CEF1B8;
2350
- --color-sentiment-content-primary-hover: #E0FFCC;
2351
- --color-sentiment-content-primary-active: #E1F4D4;
2352
- --color-sentiment-interactive-primary: #CEF1B8;
2353
- --color-sentiment-interactive-primary-hover: #E0FFCC;
2354
- --color-sentiment-interactive-primary-active: #E1F4D4;
2355
- --color-sentiment-interactive-secondary: #054D28;
2356
- --color-sentiment-interactive-secondary-hover: #043A1E;
2357
- --color-sentiment-interactive-secondary-active: #022614;
2358
- --color-sentiment-interactive-secondary-neutral: #256A43;
2359
- --color-sentiment-interactive-secondary-neutral-hover: #2A794C;
2360
- --color-sentiment-interactive-secondary-neutral-active: #329057;
2361
- --color-sentiment-interactive-control: #054D28;
2362
- --color-sentiment-interactive-control-hover: #043A1E;
2363
- --color-sentiment-interactive-control-active: #022614;
2364
- --color-sentiment-background-surface: #054D28;
2365
- --color-sentiment-background-surface-hover: #043A1E;
2366
- --color-sentiment-background-surface-active: #022614;
2367
- --color-sentiment-border-overlay: rgba(206,241,184,0.30196);
2368
- }
2369
-
2370
- .wds-sentiment-success-dark-elevated {
2371
- --color-sentiment-content-primary: #252C20;
2372
- --color-sentiment-content-primary-hover: #323B2B;
2373
- --color-sentiment-content-primary-active: #3E4A36;
2374
- --color-sentiment-interactive-primary: #252C20;
2375
- --color-sentiment-interactive-primary-hover: #323B2B;
2376
- --color-sentiment-interactive-primary-active: #3E4A36;
2377
- --color-sentiment-interactive-secondary: #BAE5A0;
2378
- --color-sentiment-interactive-secondary-hover: #C8EAB3;
2379
- --color-sentiment-interactive-secondary-active: #D6F0C7;
2380
- --color-sentiment-interactive-secondary-neutral: #A8CF91;
2381
- --color-sentiment-interactive-secondary-neutral-hover: #94C478;
2382
- --color-sentiment-interactive-secondary-neutral-active: #83BB63;
2383
- --color-sentiment-interactive-control: #BAE5A0;
2384
- --color-sentiment-interactive-control-hover: #C8EAB3;
2385
- --color-sentiment-interactive-control-active: #D6F0C7;
2386
- --color-sentiment-background-surface: #BAE5A0;
2387
- --color-sentiment-background-surface-hover: #C8EAB3;
2388
- --color-sentiment-background-surface-active: #D6F0C7;
2389
- --color-sentiment-border-overlay: rgba(37,44,32,0.30196);
2390
- }
2391
-
2392
- .wds-sentiment-warning-dark-base {
2393
- --color-sentiment-content-primary: #FADC65;
2394
- --color-sentiment-content-primary-hover: #F9D648;
2395
- --color-sentiment-content-primary-active: #F8CD20;
2396
- --color-sentiment-interactive-primary: #FADC65;
2397
- --color-sentiment-interactive-primary-hover: #F9D648;
2398
- --color-sentiment-interactive-primary-active: #F8CD20;
2399
- --color-sentiment-interactive-secondary: #3A3523;
2400
- --color-sentiment-interactive-secondary-hover: #504930;
2401
- --color-sentiment-interactive-secondary-active: #665D3D;
2402
- --color-sentiment-interactive-secondary-neutral: #4D462A;
2403
- --color-sentiment-interactive-secondary-neutral-hover: #5D532F;
2404
- --color-sentiment-interactive-secondary-neutral-active: #685D33;
2405
- --color-sentiment-interactive-control: #3A3523;
2406
- --color-sentiment-interactive-control-hover: #504930;
2407
- --color-sentiment-interactive-control-active: #665D3D;
2408
- --color-sentiment-background-surface: #3A3523;
2409
- --color-sentiment-background-surface-hover: #504930;
2410
- --color-sentiment-background-surface-active: #665D3D;
2411
- --color-sentiment-border-overlay: rgba(250,220,101,0.30196);
2412
- }
2413
-
2414
- .wds-sentiment-warning-dark-elevated {
2415
- --color-sentiment-content-primary: #3A3523;
2416
- --color-sentiment-content-primary-hover: #504930;
2417
- --color-sentiment-content-primary-active: #665D3D;
2418
- --color-sentiment-interactive-primary: #3A3523;
2419
- --color-sentiment-interactive-primary-hover: #504930;
2420
- --color-sentiment-interactive-primary-active: #665D3D;
2421
- --color-sentiment-interactive-secondary: #FADC65;
2422
- --color-sentiment-interactive-secondary-hover: #F9D648;
2423
- --color-sentiment-interactive-secondary-active: #F8CD20;
2424
- --color-sentiment-interactive-secondary-neutral: #E3C85D;
2425
- --color-sentiment-interactive-secondary-neutral-hover: #DFC044;
2426
- --color-sentiment-interactive-secondary-neutral-active: #D9B526;
2427
- --color-sentiment-interactive-control: #FADC65;
2428
- --color-sentiment-interactive-control-hover: #F9D648;
2429
- --color-sentiment-interactive-control-active: #F8CD20;
2430
- --color-sentiment-background-surface: #FADC65;
2431
- --color-sentiment-background-surface-hover: #F9D648;
2432
- --color-sentiment-background-surface-active: #F8CD20;
2433
- --color-sentiment-border-overlay: rgba(58,53,35,0.30196);
2434
- }
2435
-
2436
1991
  @font-face {
2437
1992
  font-family: Inter;
2438
1993
  font-style: normal;
@@ -25850,75 +25405,575 @@ a[data-toggle="tooltip"] {
25850
25405
  padding-left: 50px;
25851
25406
  }
25852
25407
 
25853
- [dir="rtl"] .btn-facebook.btn-lg,
25854
- [dir="rtl"] .btn-google.btn-lg {
25855
- padding-right: 50px;
25856
- padding-left: 0;
25857
- padding-left: initial;
25408
+ [dir="rtl"] .btn-facebook.btn-lg,
25409
+ [dir="rtl"] .btn-google.btn-lg {
25410
+ padding-right: 50px;
25411
+ padding-left: 0;
25412
+ padding-left: initial;
25413
+ }
25414
+
25415
+ .btn-facebook.btn-block,
25416
+ .btn-google.btn-block {
25417
+ padding-right: 44px;
25418
+ }
25419
+
25420
+ [dir="rtl"] .btn-facebook.btn-block,
25421
+ [dir="rtl"] .btn-google.btn-block {
25422
+ padding-left: 44px;
25423
+ padding-right: 0;
25424
+ padding-right: initial;
25425
+ }
25426
+
25427
+ .btn-facebook.btn-block.btn-lg,
25428
+ .btn-google.btn-block.btn-lg {
25429
+ padding-right: 50px;
25430
+ }
25431
+
25432
+ [dir="rtl"] .btn-facebook.btn-block.btn-lg,
25433
+ [dir="rtl"] .btn-google.btn-block.btn-lg {
25434
+ padding-left: 50px;
25435
+ padding-right: 0;
25436
+ padding-right: initial;
25437
+ }
25438
+
25439
+ [dir="rtl"] .btn-facebook,
25440
+ [dir="rtl"] .btn-google {
25441
+ background-position-x: calc(100% - 11px);
25442
+ }
25443
+
25444
+ [dir="rtl"] .btn-facebook,
25445
+ [dir="rtl"] .btn-google,
25446
+ [dir="rtl"] .btn-facebook.btn-lg,
25447
+ [dir="rtl"] .btn-google.btn-lg {
25448
+ padding-left: 24px;
25449
+ }
25450
+
25451
+ [dir="rtl"] .btn-facebook.btn-block,
25452
+ [dir="rtl"] .btn-google.btn-block {
25453
+ padding-right: 44px;
25454
+ padding-left: 44px;
25455
+ }
25456
+
25457
+ [dir="rtl"] .btn-facebook.btn-lg,
25458
+ [dir="rtl"] .btn-google.btn-lg {
25459
+ background-position-x: calc(100% - 14px);
25460
+ }
25461
+
25462
+ [dir="rtl"] .btn-facebook.btn-lg.btn-block,
25463
+ [dir="rtl"] .btn-google.btn-lg.btn-block {
25464
+ padding-right: 50px;
25465
+ padding-left: 50px;
25466
+ }
25467
+
25468
+ /* stylelint-enable */
25469
+
25470
+ .wds-sentiment-surface {
25471
+ --ring-outline-color: var(--color-sentiment-content-primary, var(--color-content-primary));
25472
+ }
25473
+
25474
+ .wds-sentiment-surface--hasBaseStyles {
25475
+ background-color: var(--color-sentiment-background-surface);
25476
+ color: var(--color-sentiment-content-primary);
25477
+ }
25478
+
25479
+ .np-theme-personal.wds-sentiment-surface-negative-base,
25480
+ .np-theme-business.wds-sentiment-surface-negative-base,
25481
+ .np-theme-platform.wds-sentiment-surface-negative-base,
25482
+ .np-theme-personal--bright-green.wds-sentiment-surface-negative-base,
25483
+ .np-theme-business--bright-green.wds-sentiment-surface-negative-base {
25484
+ --color-sentiment-content-primary: #CB272F;
25485
+ --color-sentiment-content-primary-hover: #B8232B;
25486
+ --color-sentiment-content-primary-active: #A72027;
25487
+ --color-sentiment-interactive-primary: #CB272F;
25488
+ --color-sentiment-interactive-primary-hover: #B8232B;
25489
+ --color-sentiment-interactive-primary-active: #A72027;
25490
+ --color-sentiment-interactive-secondary: #FBEAEA;
25491
+ --color-sentiment-interactive-secondary-hover: #F9E1E1;
25492
+ --color-sentiment-interactive-secondary-active: #F8D8D8;
25493
+ --color-sentiment-interactive-secondary-neutral: #F5D3D4;
25494
+ --color-sentiment-interactive-secondary-neutral-hover: #F0BDBE;
25495
+ --color-sentiment-interactive-secondary-neutral-active: #ECACAD;
25496
+ --color-sentiment-interactive-control: #FBEAEA;
25497
+ --color-sentiment-interactive-control-hover: #F9E1E1;
25498
+ --color-sentiment-interactive-control-active: #F8D8D8;
25499
+ --color-sentiment-background-surface: #FBEAEA;
25500
+ --color-sentiment-background-surface-hover: #F9E1E1;
25501
+ --color-sentiment-background-surface-active: #F8D8D8;
25502
+ }
25503
+
25504
+ .np-theme-personal.wds-sentiment-surface-negative-elevated,
25505
+ .np-theme-business.wds-sentiment-surface-negative-elevated,
25506
+ .np-theme-platform.wds-sentiment-surface-negative-elevated,
25507
+ .np-theme-personal--bright-green.wds-sentiment-surface-negative-elevated,
25508
+ .np-theme-business--bright-green.wds-sentiment-surface-negative-elevated {
25509
+ --color-sentiment-content-primary: #FFFFFF;
25510
+ --color-sentiment-content-primary-hover: #F5CCCC;
25511
+ --color-sentiment-content-primary-active: #F1B7B7;
25512
+ --color-sentiment-interactive-primary: #FBEAEA;
25513
+ --color-sentiment-interactive-primary-hover: #F5CCCC;
25514
+ --color-sentiment-interactive-primary-active: #F1B7B7;
25515
+ --color-sentiment-interactive-secondary: #CB272F;
25516
+ --color-sentiment-interactive-secondary-hover: #B8232B;
25517
+ --color-sentiment-interactive-secondary-active: #A72027;
25518
+ --color-sentiment-interactive-secondary-neutral: #9B141B;
25519
+ --color-sentiment-interactive-secondary-neutral-hover: #831116;
25520
+ --color-sentiment-interactive-secondary-neutral-active: #6D0e13;
25521
+ --color-sentiment-interactive-control: #CB272F;
25522
+ --color-sentiment-interactive-control-hover: #B8232B;
25523
+ --color-sentiment-interactive-control-active: #A72027;
25524
+ --color-sentiment-background-surface: #CB272F;
25525
+ --color-sentiment-background-surface-hover: #B8232B;
25526
+ --color-sentiment-background-surface-active: #A72027;
25527
+ }
25528
+
25529
+ .np-theme-personal--dark.wds-sentiment-surface-negative-base,
25530
+ .np-theme-business--dark.wds-sentiment-surface-negative-base,
25531
+ .np-theme-personal--forest-green.wds-sentiment-surface-negative-base,
25532
+ .np-theme-business--forest-green.wds-sentiment-surface-negative-base,
25533
+ .np-theme-platform--forest-green.wds-sentiment-surface-negative-base {
25534
+ --color-sentiment-content-primary: #FFA8AD;
25535
+ --color-sentiment-content-primary-hover: #FFBDC0;
25536
+ --color-sentiment-content-primary-active: #FFD1D3;
25537
+ --color-sentiment-interactive-primary: #FFA8AD;
25538
+ --color-sentiment-interactive-primary-hover: #FFBDC0;
25539
+ --color-sentiment-interactive-primary-active: #FFD1D3;
25540
+ --color-sentiment-interactive-secondary: #410B0D;
25541
+ --color-sentiment-interactive-secondary-hover: #641115;
25542
+ --color-sentiment-interactive-secondary-active: #761418;
25543
+ --color-sentiment-interactive-secondary-neutral: #601013;
25544
+ --color-sentiment-interactive-secondary-neutral-hover: #7A1519;
25545
+ --color-sentiment-interactive-secondary-neutral-active: #90181D;
25546
+ --color-sentiment-interactive-control: #410B0D;
25547
+ --color-sentiment-interactive-control-hover: #641115;
25548
+ --color-sentiment-interactive-control-active: #761418;
25549
+ --color-sentiment-background-surface: #410B0D;
25550
+ --color-sentiment-background-surface-hover: #641115;
25551
+ --color-sentiment-background-surface-active: #761418;
25552
+ }
25553
+
25554
+ .np-theme-personal--dark.wds-sentiment-surface-negative-elevated,
25555
+ .np-theme-business--dark.wds-sentiment-surface-negative-elevated,
25556
+ .np-theme-personal--forest-green.wds-sentiment-surface-negative-elevated,
25557
+ .np-theme-business--forest-green.wds-sentiment-surface-negative-elevated,
25558
+ .np-theme-platform--forest-green.wds-sentiment-surface-negative-elevated {
25559
+ --color-sentiment-content-primary: #410B0D;
25560
+ --color-sentiment-content-primary-hover: #641115;
25561
+ --color-sentiment-content-primary-active: #761418;
25562
+ --color-sentiment-interactive-primary: #410B0D;
25563
+ --color-sentiment-interactive-primary-hover: #641115;
25564
+ --color-sentiment-interactive-primary-active: #761418;
25565
+ --color-sentiment-interactive-secondary: #FFA8AD;
25566
+ --color-sentiment-interactive-secondary-hover: #FFBDC0;
25567
+ --color-sentiment-interactive-secondary-active: #FFD1D3;
25568
+ --color-sentiment-interactive-secondary-neutral: #D9898D;
25569
+ --color-sentiment-interactive-secondary-neutral-hover: #D68084;
25570
+ --color-sentiment-interactive-secondary-neutral-active: #D06C71;
25571
+ --color-sentiment-interactive-control: #FFA8AD;
25572
+ --color-sentiment-interactive-control-hover: #FFBDC0;
25573
+ --color-sentiment-interactive-control-active: #FFD1D3;
25574
+ --color-sentiment-background-surface: #FFA8AD;
25575
+ --color-sentiment-background-surface-hover: #FFBDC0;
25576
+ --color-sentiment-background-surface-active: #FFD1D3;
25577
+ }
25578
+
25579
+ .np-theme-personal.wds-sentiment-surface-warning-base,
25580
+ .np-theme-business.wds-sentiment-surface-warning-base,
25581
+ .np-theme-platform.wds-sentiment-surface-warning-base,
25582
+ .np-theme-personal--bright-green.wds-sentiment-surface-warning-base,
25583
+ .np-theme-business--bright-green.wds-sentiment-surface-warning-base {
25584
+ --color-sentiment-content-primary: #4A3B1C;
25585
+ --color-sentiment-content-primary-hover: #302612;
25586
+ --color-sentiment-content-primary-active: #2C2311;
25587
+ --color-sentiment-interactive-primary: #FFD11A;
25588
+ --color-sentiment-interactive-primary-hover: #FFBF0F;
25589
+ --color-sentiment-interactive-primary-active: #FFBB00;
25590
+ --color-sentiment-interactive-secondary: #FFF7D7;
25591
+ --color-sentiment-interactive-secondary-hover: #FFF0B2;
25592
+ --color-sentiment-interactive-secondary-active: #FFE98F;
25593
+ --color-sentiment-interactive-secondary-neutral: #FFEC9E;
25594
+ --color-sentiment-interactive-secondary-neutral-hover: #FFE187;
25595
+ --color-sentiment-interactive-secondary-neutral-active: #FFD55F;
25596
+ --color-sentiment-interactive-control: #4A3B1C;
25597
+ --color-sentiment-interactive-control-hover: #302612;
25598
+ --color-sentiment-interactive-control-active: #2C2311;
25599
+ --color-sentiment-background-surface: #FFF7D7;
25600
+ --color-sentiment-background-surface-hover: #FFF0B2;
25601
+ --color-sentiment-background-surface-active: #FFE98F;
25602
+ }
25603
+
25604
+ .np-theme-personal.wds-sentiment-surface-warning-elevated,
25605
+ .np-theme-business.wds-sentiment-surface-warning-elevated,
25606
+ .np-theme-platform.wds-sentiment-surface-warning-elevated,
25607
+ .np-theme-personal--bright-green.wds-sentiment-surface-warning-elevated,
25608
+ .np-theme-business--bright-green.wds-sentiment-surface-warning-elevated {
25609
+ --color-sentiment-content-primary: #4A3B1C;
25610
+ --color-sentiment-content-primary-hover: #302612;
25611
+ --color-sentiment-content-primary-active: #2C2311;
25612
+ --color-sentiment-interactive-primary: #4A3B1C;
25613
+ --color-sentiment-interactive-primary-hover: #302612;
25614
+ --color-sentiment-interactive-primary-active: #2C2311;
25615
+ --color-sentiment-interactive-secondary: #FFD11A;
25616
+ --color-sentiment-interactive-secondary-hover: #FFBF0F;
25617
+ --color-sentiment-interactive-secondary-active: #FFBB00;
25618
+ --color-sentiment-interactive-secondary-neutral: #FFEC9E;
25619
+ --color-sentiment-interactive-secondary-neutral-hover: #FFEDB8;
25620
+ --color-sentiment-interactive-secondary-neutral-active: #FFF2CC;
25621
+ --color-sentiment-interactive-control: #FFD11A;
25622
+ --color-sentiment-interactive-control-hover: #FFBF0F;
25623
+ --color-sentiment-interactive-control-active: #FFBB00;
25624
+ --color-sentiment-background-surface: #FFD11A;
25625
+ --color-sentiment-background-surface-hover: #FFBF0F;
25626
+ --color-sentiment-background-surface-active: #FFBB00;
25627
+ }
25628
+
25629
+ .np-theme-personal--dark.wds-sentiment-surface-warning-base,
25630
+ .np-theme-business--dark.wds-sentiment-surface-warning-base,
25631
+ .np-theme-personal--forest-green.wds-sentiment-surface-warning-base,
25632
+ .np-theme-business--forest-green.wds-sentiment-surface-warning-base,
25633
+ .np-theme-platform--forest-green.wds-sentiment-surface-warning-base {
25634
+ --color-sentiment-content-primary: #FADC65;
25635
+ --color-sentiment-content-primary-hover: #F9D648;
25636
+ --color-sentiment-content-primary-active: #F8CD20;
25637
+ --color-sentiment-interactive-primary: #FADC65;
25638
+ --color-sentiment-interactive-primary-hover: #F9D648;
25639
+ --color-sentiment-interactive-primary-active: #F8CD20;
25640
+ --color-sentiment-interactive-secondary: #3A3523;
25641
+ --color-sentiment-interactive-secondary-hover: #504930;
25642
+ --color-sentiment-interactive-secondary-active: #665D3D;
25643
+ --color-sentiment-interactive-secondary-neutral: #4D462A;
25644
+ --color-sentiment-interactive-secondary-neutral-hover: #5D532F;
25645
+ --color-sentiment-interactive-secondary-neutral-active: #685D33;
25646
+ --color-sentiment-interactive-control: #3A3523;
25647
+ --color-sentiment-interactive-control-hover: #504930;
25648
+ --color-sentiment-interactive-control-active: #665D3D;
25649
+ --color-sentiment-background-surface: #3A3523;
25650
+ --color-sentiment-background-surface-hover: #504930;
25651
+ --color-sentiment-background-surface-active: #665D3D;
25652
+ }
25653
+
25654
+ .np-theme-personal--dark.wds-sentiment-surface-warning-elevated,
25655
+ .np-theme-business--dark.wds-sentiment-surface-warning-elevated,
25656
+ .np-theme-personal--forest-green.wds-sentiment-surface-warning-elevated,
25657
+ .np-theme-business--forest-green.wds-sentiment-surface-warning-elevated,
25658
+ .np-theme-platform--forest-green.wds-sentiment-surface-warning-elevated {
25659
+ --color-sentiment-content-primary: #3A3523;
25660
+ --color-sentiment-content-primary-hover: #504930;
25661
+ --color-sentiment-content-primary-active: #665D3D;
25662
+ --color-sentiment-interactive-primary: #3A3523;
25663
+ --color-sentiment-interactive-primary-hover: #504930;
25664
+ --color-sentiment-interactive-primary-active: #665D3D;
25665
+ --color-sentiment-interactive-secondary: #FADC65;
25666
+ --color-sentiment-interactive-secondary-hover: #F9D648;
25667
+ --color-sentiment-interactive-secondary-active: #F8CD20;
25668
+ --color-sentiment-interactive-secondary-neutral: #E3C85D;
25669
+ --color-sentiment-interactive-secondary-neutral-hover: #DFC044;
25670
+ --color-sentiment-interactive-secondary-neutral-active: #D9B526;
25671
+ --color-sentiment-interactive-control: #FADC65;
25672
+ --color-sentiment-interactive-control-hover: #F9D648;
25673
+ --color-sentiment-interactive-control-active: #F8CD20;
25674
+ --color-sentiment-background-surface: #FADC65;
25675
+ --color-sentiment-background-surface-hover: #F9D648;
25676
+ --color-sentiment-background-surface-active: #F8CD20;
25677
+ }
25678
+
25679
+ .np-theme-personal.wds-sentiment-surface-success-base,
25680
+ .np-theme-business.wds-sentiment-surface-success-base,
25681
+ .np-theme-platform.wds-sentiment-surface-success-base,
25682
+ .np-theme-personal--bright-green.wds-sentiment-surface-success-base,
25683
+ .np-theme-business--bright-green.wds-sentiment-surface-success-base {
25684
+ --color-sentiment-content-primary: #054D28;
25685
+ --color-sentiment-content-primary-hover: #043A1E;
25686
+ --color-sentiment-content-primary-active: #022614;
25687
+ --color-sentiment-interactive-primary: #054D28;
25688
+ --color-sentiment-interactive-primary-hover: #043A1E;
25689
+ --color-sentiment-interactive-primary-active: #022614;
25690
+ --color-sentiment-interactive-secondary: #E2F6D5;
25691
+ --color-sentiment-interactive-secondary-hover: #D3F2C0;
25692
+ --color-sentiment-interactive-secondary-active: #C5EDAB;
25693
+ --color-sentiment-interactive-secondary-neutral: #BCD9B8;
25694
+ --color-sentiment-interactive-secondary-neutral-hover: #AACFA5;
25695
+ --color-sentiment-interactive-secondary-neutral-active: #94C38E;
25696
+ --color-sentiment-interactive-control: #E2F6D5;
25697
+ --color-sentiment-interactive-control-hover: #D3F2C0;
25698
+ --color-sentiment-interactive-control-active: #C5EDAB;
25699
+ --color-sentiment-background-surface: #E2F6D5;
25700
+ --color-sentiment-background-surface-hover: #D3F2C0;
25701
+ --color-sentiment-background-surface-active: #C5EDAB;
25858
25702
  }
25859
25703
 
25860
- .btn-facebook.btn-block,
25861
- .btn-google.btn-block {
25862
- padding-right: 44px;
25704
+ .np-theme-personal.wds-sentiment-surface-success-elevated,
25705
+ .np-theme-business.wds-sentiment-surface-success-elevated,
25706
+ .np-theme-platform.wds-sentiment-surface-success-elevated,
25707
+ .np-theme-personal--bright-green.wds-sentiment-surface-success-elevated,
25708
+ .np-theme-business--bright-green.wds-sentiment-surface-success-elevated {
25709
+ --color-sentiment-content-primary: #CEF1B8;
25710
+ --color-sentiment-content-primary-hover: #E0FFCC;
25711
+ --color-sentiment-content-primary-active: #E1F4D4;
25712
+ --color-sentiment-interactive-primary: #CEF1B8;
25713
+ --color-sentiment-interactive-primary-hover: #E0FFCC;
25714
+ --color-sentiment-interactive-primary-active: #E1F4D4;
25715
+ --color-sentiment-interactive-secondary: #054D28;
25716
+ --color-sentiment-interactive-secondary-hover: #043A1E;
25717
+ --color-sentiment-interactive-secondary-active: #022614;
25718
+ --color-sentiment-interactive-secondary-neutral: #256A43;
25719
+ --color-sentiment-interactive-secondary-neutral-hover: #2A794C;
25720
+ --color-sentiment-interactive-secondary-neutral-active: #329057;
25721
+ --color-sentiment-interactive-control: #054D28;
25722
+ --color-sentiment-interactive-control-hover: #043A1E;
25723
+ --color-sentiment-interactive-control-active: #022614;
25724
+ --color-sentiment-background-surface: #054D28;
25725
+ --color-sentiment-background-surface-hover: #043A1E;
25726
+ --color-sentiment-background-surface-active: #022614;
25863
25727
  }
25864
25728
 
25865
- [dir="rtl"] .btn-facebook.btn-block,
25866
- [dir="rtl"] .btn-google.btn-block {
25867
- padding-left: 44px;
25868
- padding-right: 0;
25869
- padding-right: initial;
25729
+ .np-theme-personal--dark.wds-sentiment-surface-success-base,
25730
+ .np-theme-business--dark.wds-sentiment-surface-success-base,
25731
+ .np-theme-personal--forest-green.wds-sentiment-surface-success-base,
25732
+ .np-theme-business--forest-green.wds-sentiment-surface-success-base,
25733
+ .np-theme-platform--forest-green.wds-sentiment-surface-success-base {
25734
+ --color-sentiment-content-primary: #CEF1B8;
25735
+ --color-sentiment-content-primary-hover: #E0FFCC;
25736
+ --color-sentiment-content-primary-active: #E1F4D4;
25737
+ --color-sentiment-interactive-primary: #CEF1B8;
25738
+ --color-sentiment-interactive-primary-hover: #E0FFCC;
25739
+ --color-sentiment-interactive-primary-active: #E1F4D4;
25740
+ --color-sentiment-interactive-secondary: #054D28;
25741
+ --color-sentiment-interactive-secondary-hover: #043A1E;
25742
+ --color-sentiment-interactive-secondary-active: #022614;
25743
+ --color-sentiment-interactive-secondary-neutral: #256A43;
25744
+ --color-sentiment-interactive-secondary-neutral-hover: #2A794C;
25745
+ --color-sentiment-interactive-secondary-neutral-active: #329057;
25746
+ --color-sentiment-interactive-control: #054D28;
25747
+ --color-sentiment-interactive-control-hover: #043A1E;
25748
+ --color-sentiment-interactive-control-active: #022614;
25749
+ --color-sentiment-background-surface: #054D28;
25750
+ --color-sentiment-background-surface-hover: #043A1E;
25751
+ --color-sentiment-background-surface-active: #022614;
25870
25752
  }
25871
25753
 
25872
- .btn-facebook.btn-block.btn-lg,
25873
- .btn-google.btn-block.btn-lg {
25874
- padding-right: 50px;
25754
+ .np-theme-personal--dark.wds-sentiment-surface-success-elevated,
25755
+ .np-theme-business--dark.wds-sentiment-surface-success-elevated,
25756
+ .np-theme-personal--forest-green.wds-sentiment-surface-success-elevated,
25757
+ .np-theme-business--forest-green.wds-sentiment-surface-success-elevated,
25758
+ .np-theme-platform--forest-green.wds-sentiment-surface-success-elevated {
25759
+ --color-sentiment-content-primary: #252C20;
25760
+ --color-sentiment-content-primary-hover: #323B2B;
25761
+ --color-sentiment-content-primary-active: #3E4A36;
25762
+ --color-sentiment-interactive-primary: #252C20;
25763
+ --color-sentiment-interactive-primary-hover: #323B2B;
25764
+ --color-sentiment-interactive-primary-active: #3E4A36;
25765
+ --color-sentiment-interactive-secondary: #BAE5A0;
25766
+ --color-sentiment-interactive-secondary-hover: #C8EAB3;
25767
+ --color-sentiment-interactive-secondary-active: #D6F0C7;
25768
+ --color-sentiment-interactive-secondary-neutral: #A8CF91;
25769
+ --color-sentiment-interactive-secondary-neutral-hover: #94C478;
25770
+ --color-sentiment-interactive-secondary-neutral-active: #83BB63;
25771
+ --color-sentiment-interactive-control: #BAE5A0;
25772
+ --color-sentiment-interactive-control-hover: #C8EAB3;
25773
+ --color-sentiment-interactive-control-active: #D6F0C7;
25774
+ --color-sentiment-background-surface: #BAE5A0;
25775
+ --color-sentiment-background-surface-hover: #C8EAB3;
25776
+ --color-sentiment-background-surface-active: #D6F0C7;
25875
25777
  }
25876
25778
 
25877
- [dir="rtl"] .btn-facebook.btn-block.btn-lg,
25878
- [dir="rtl"] .btn-google.btn-block.btn-lg {
25879
- padding-left: 50px;
25880
- padding-right: 0;
25881
- padding-right: initial;
25779
+ .np-theme-personal.wds-sentiment-surface-neutral-base,
25780
+ .np-theme-business.wds-sentiment-surface-neutral-base,
25781
+ .np-theme-platform.wds-sentiment-surface-neutral-base,
25782
+ .np-theme-personal--bright-green.wds-sentiment-surface-neutral-base,
25783
+ .np-theme-business--bright-green.wds-sentiment-surface-neutral-base {
25784
+ --color-sentiment-content-primary: #454745;
25785
+ --color-sentiment-content-primary-hover: #353635;
25786
+ --color-sentiment-content-primary-active: #232423;
25787
+ --color-sentiment-interactive-primary: #454745;
25788
+ --color-sentiment-interactive-primary-hover: #353635;
25789
+ --color-sentiment-interactive-primary-active: #232423;
25790
+ --color-sentiment-interactive-secondary: rgba(62, 59, 7, 0.07);
25791
+ --color-sentiment-interactive-secondary-hover: rgba(62, 59, 7, 0.12);
25792
+ --color-sentiment-interactive-secondary-active: rgba(62, 59, 7, 0.17);
25793
+ --color-sentiment-interactive-secondary-neutral: rgba(62, 59, 7, 0.07);
25794
+ --color-sentiment-interactive-secondary-neutral-hover: rgba(62, 59, 7, 0.12);
25795
+ --color-sentiment-interactive-secondary-neutral-active: rgba(62, 59, 7, 0.17);
25796
+ --color-sentiment-interactive-control: #F1F1ED;
25797
+ --color-sentiment-interactive-control-hover: #E7E7E1;
25798
+ --color-sentiment-interactive-control-active: #DFDED5;
25799
+ --color-sentiment-background-surface: rgba(62, 59, 7, 0.07);
25800
+ --color-sentiment-background-surface-hover: rgba(62, 59, 7, 0.12);
25801
+ --color-sentiment-background-surface-active: rgba(62, 59, 7, 0.17);
25882
25802
  }
25883
25803
 
25884
- [dir="rtl"] .btn-facebook,
25885
- [dir="rtl"] .btn-google {
25886
- background-position-x: calc(100% - 11px);
25804
+ .np-theme-personal.wds-sentiment-surface-neutral-elevated,
25805
+ .np-theme-business.wds-sentiment-surface-neutral-elevated,
25806
+ .np-theme-platform.wds-sentiment-surface-neutral-elevated,
25807
+ .np-theme-personal--bright-green.wds-sentiment-surface-neutral-elevated,
25808
+ .np-theme-business--bright-green.wds-sentiment-surface-neutral-elevated {
25809
+ --color-sentiment-content-primary: #F1F1ED;
25810
+ --color-sentiment-content-primary-hover: #E7E7E1;
25811
+ --color-sentiment-content-primary-active: #DFDED5;
25812
+ --color-sentiment-interactive-primary: #F1F1ED;
25813
+ --color-sentiment-interactive-primary-hover: #E7E7E1;
25814
+ --color-sentiment-interactive-primary-active: #DFDED5;
25815
+ --color-sentiment-interactive-secondary: #454745;
25816
+ --color-sentiment-interactive-secondary-hover: #353635;
25817
+ --color-sentiment-interactive-secondary-active: #232423;
25818
+ --color-sentiment-interactive-secondary-neutral: #585958;
25819
+ --color-sentiment-interactive-secondary-neutral-hover: #6A6C6A;
25820
+ --color-sentiment-interactive-secondary-neutral-active: #7D7E7D;
25821
+ --color-sentiment-interactive-control: #454745;
25822
+ --color-sentiment-interactive-control-hover: #353635;
25823
+ --color-sentiment-interactive-control-active: #232423;
25824
+ --color-sentiment-background-surface: #454745;
25825
+ --color-sentiment-background-surface-hover: #353635;
25826
+ --color-sentiment-background-surface-active: #232423;
25887
25827
  }
25888
25828
 
25889
- [dir="rtl"] .btn-facebook,
25890
- [dir="rtl"] .btn-google,
25891
- [dir="rtl"] .btn-facebook.btn-lg,
25892
- [dir="rtl"] .btn-google.btn-lg {
25893
- padding-left: 24px;
25829
+ .np-theme-personal--dark.wds-sentiment-surface-neutral-base,
25830
+ .np-theme-business--dark.wds-sentiment-surface-neutral-base,
25831
+ .np-theme-personal--forest-green.wds-sentiment-surface-neutral-base,
25832
+ .np-theme-business--forest-green.wds-sentiment-surface-neutral-base,
25833
+ .np-theme-platform--forest-green.wds-sentiment-surface-neutral-base {
25834
+ --color-sentiment-content-primary: #F1F1ED;
25835
+ --color-sentiment-content-primary-hover: #E7E7E1;
25836
+ --color-sentiment-content-primary-active: #DFDED5;
25837
+ --color-sentiment-interactive-primary: #F1F1ED;
25838
+ --color-sentiment-interactive-primary-hover: #E7E7E1;
25839
+ --color-sentiment-interactive-primary-active: #DFDED5;
25840
+ --color-sentiment-interactive-secondary: rgba(255, 255, 255, 0.1);
25841
+ --color-sentiment-interactive-secondary-hover: rgba(255, 255, 255, 0.2);
25842
+ --color-sentiment-interactive-secondary-active: rgba(255, 255, 255, 0.3);
25843
+ --color-sentiment-interactive-secondary-neutral: rgba(255, 255, 255, 0.1);
25844
+ --color-sentiment-interactive-secondary-neutral-hover: rgba(255, 255, 255, 0.2);
25845
+ --color-sentiment-interactive-secondary-neutral-active: rgba(255, 255, 255, 0.3);
25846
+ --color-sentiment-interactive-control: #2A2C29;
25847
+ --color-sentiment-interactive-control-hover: #414441;
25848
+ --color-sentiment-interactive-control-active: #595B58;
25849
+ --color-sentiment-background-surface: rgba(255, 255, 255, 0.1);
25850
+ --color-sentiment-background-surface-hover: rgba(255, 255, 255, 0.2);
25851
+ --color-sentiment-background-surface-active: rgba(255, 255, 255, 0.3);
25894
25852
  }
25895
25853
 
25896
- [dir="rtl"] .btn-facebook.btn-block,
25897
- [dir="rtl"] .btn-google.btn-block {
25898
- padding-right: 44px;
25899
- padding-left: 44px;
25854
+ .np-theme-personal--dark.wds-sentiment-surface-neutral-elevated,
25855
+ .np-theme-business--dark.wds-sentiment-surface-neutral-elevated,
25856
+ .np-theme-personal--forest-green.wds-sentiment-surface-neutral-elevated,
25857
+ .np-theme-business--forest-green.wds-sentiment-surface-neutral-elevated,
25858
+ .np-theme-platform--forest-green.wds-sentiment-surface-neutral-elevated {
25859
+ --color-sentiment-content-primary: #2A2C29;
25860
+ --color-sentiment-content-primary-hover: #414441;
25861
+ --color-sentiment-content-primary-active: #595B58;
25862
+ --color-sentiment-interactive-primary: #2A2C29;
25863
+ --color-sentiment-interactive-primary-hover: #414441;
25864
+ --color-sentiment-interactive-primary-active: #595B58;
25865
+ --color-sentiment-interactive-secondary: #F1F1ED;
25866
+ --color-sentiment-interactive-secondary-hover: #E7E7E1;
25867
+ --color-sentiment-interactive-secondary-active: #DFDED5;
25868
+ --color-sentiment-interactive-secondary-neutral: #E4E4DC;
25869
+ --color-sentiment-interactive-secondary-neutral-hover: #DCDCD2;
25870
+ --color-sentiment-interactive-secondary-neutral-active: #D3D2C6;
25871
+ --color-sentiment-interactive-control: #F1F1ED;
25872
+ --color-sentiment-interactive-control-hover: #E7E7E1;
25873
+ --color-sentiment-interactive-control-active: #DFDED5;
25874
+ --color-sentiment-background-surface: #F1F1ED;
25875
+ --color-sentiment-background-surface-hover: #E7E7E1;
25876
+ --color-sentiment-background-surface-active: #DFDED5;
25900
25877
  }
25901
25878
 
25902
- [dir="rtl"] .btn-facebook.btn-lg,
25903
- [dir="rtl"] .btn-google.btn-lg {
25904
- background-position-x: calc(100% - 14px);
25879
+ .np-theme-personal.wds-sentiment-surface-proposition-base,
25880
+ .np-theme-business.wds-sentiment-surface-proposition-base,
25881
+ .np-theme-platform.wds-sentiment-surface-proposition-base,
25882
+ .np-theme-personal--bright-green.wds-sentiment-surface-proposition-base,
25883
+ .np-theme-business--bright-green.wds-sentiment-surface-proposition-base {
25884
+ --color-sentiment-content-primary: #0E0F0C;
25885
+ --color-sentiment-content-primary-hover: #0A2826;
25886
+ --color-sentiment-content-primary-active: #074140;
25887
+ --color-sentiment-interactive-primary: #054D4D;
25888
+ --color-sentiment-interactive-primary-hover: #043A3A;
25889
+ --color-sentiment-interactive-primary-active: #022626;
25890
+ --color-sentiment-interactive-secondary: #E0F7F7;
25891
+ --color-sentiment-interactive-secondary-hover: #CAF1F1;
25892
+ --color-sentiment-interactive-secondary-active: #B6ECEC;
25893
+ --color-sentiment-interactive-secondary-neutral: #B4D5D5;
25894
+ --color-sentiment-interactive-secondary-neutral-hover: #A3CCCC;
25895
+ --color-sentiment-interactive-secondary-neutral-active: #9AC6C6;
25896
+ --color-sentiment-interactive-control: #E0F7F7;
25897
+ --color-sentiment-interactive-control-hover: #CAF1F1;
25898
+ --color-sentiment-interactive-control-active: #B6ECEC;
25899
+ --color-sentiment-background-surface: #E0F7F7;
25900
+ --color-sentiment-background-surface-hover: #CAF1F1;
25901
+ --color-sentiment-background-surface-active: #B6ECEC;
25905
25902
  }
25906
25903
 
25907
- [dir="rtl"] .btn-facebook.btn-lg.btn-block,
25908
- [dir="rtl"] .btn-google.btn-lg.btn-block {
25909
- padding-right: 50px;
25910
- padding-left: 50px;
25904
+ .np-theme-personal.wds-sentiment-surface-proposition-elevated,
25905
+ .np-theme-business.wds-sentiment-surface-proposition-elevated,
25906
+ .np-theme-platform.wds-sentiment-surface-proposition-elevated,
25907
+ .np-theme-personal--bright-green.wds-sentiment-surface-proposition-elevated,
25908
+ .np-theme-business--bright-green.wds-sentiment-surface-proposition-elevated {
25909
+ --color-sentiment-content-primary: #FFFFFF;
25910
+ --color-sentiment-content-primary-hover: #EAF9F9;
25911
+ --color-sentiment-content-primary-active: #D5F4F4;
25912
+ --color-sentiment-interactive-primary: #E0F7F7;
25913
+ --color-sentiment-interactive-primary-hover: #CAF1F1;
25914
+ --color-sentiment-interactive-primary-active: #B6ECEC;
25915
+ --color-sentiment-interactive-secondary: #054D4D;
25916
+ --color-sentiment-interactive-secondary-hover: #043A3A;
25917
+ --color-sentiment-interactive-secondary-active: #022626;
25918
+ --color-sentiment-interactive-secondary-neutral: #1F6161;
25919
+ --color-sentiment-interactive-secondary-neutral-hover: #247070;
25920
+ --color-sentiment-interactive-secondary-neutral-active: #298080;
25921
+ --color-sentiment-interactive-control: #054D4D;
25922
+ --color-sentiment-interactive-control-hover: #043A3A;
25923
+ --color-sentiment-interactive-control-active: #022626;
25924
+ --color-sentiment-background-surface: #054D4D;
25925
+ --color-sentiment-background-surface-hover: #043A3A;
25926
+ --color-sentiment-background-surface-active: #022626;
25911
25927
  }
25912
25928
 
25913
- /* stylelint-enable */
25914
-
25915
- .wds-sentiment-surface {
25916
- --ring-outline-color: var(--color-sentiment-content-primary, var(--color-content-primary));
25929
+ .np-theme-personal--dark.wds-sentiment-surface-proposition-base,
25930
+ .np-theme-business--dark.wds-sentiment-surface-proposition-base,
25931
+ .np-theme-personal--forest-green.wds-sentiment-surface-proposition-base,
25932
+ .np-theme-business--forest-green.wds-sentiment-surface-proposition-base,
25933
+ .np-theme-platform--forest-green.wds-sentiment-surface-proposition-base {
25934
+ --color-sentiment-content-primary: #FFFFFF;
25935
+ --color-sentiment-content-primary-hover: #EAF9F9;
25936
+ --color-sentiment-content-primary-active: #D5F4F4;
25937
+ --color-sentiment-interactive-primary: #E0F7F7;
25938
+ --color-sentiment-interactive-primary-hover: #CAF1F1;
25939
+ --color-sentiment-interactive-primary-active: #B6ECEC;
25940
+ --color-sentiment-interactive-secondary: #054D4D;
25941
+ --color-sentiment-interactive-secondary-hover: #043A3A;
25942
+ --color-sentiment-interactive-secondary-active: #022626;
25943
+ --color-sentiment-interactive-secondary-neutral: #1F6161;
25944
+ --color-sentiment-interactive-secondary-neutral-hover: #247070;
25945
+ --color-sentiment-interactive-secondary-neutral-active: #298080;
25946
+ --color-sentiment-interactive-control: #054D4D;
25947
+ --color-sentiment-interactive-control-hover: #043A3A;
25948
+ --color-sentiment-interactive-control-active: #022626;
25949
+ --color-sentiment-background-surface: #054D4D;
25950
+ --color-sentiment-background-surface-hover: #043A3A;
25951
+ --color-sentiment-background-surface-active: #022626;
25917
25952
  }
25918
25953
 
25919
- .wds-sentiment-surface--hasBaseStyles {
25920
- background-color: var(--color-sentiment-background-surface);
25921
- color: var(--color-sentiment-content-primary);
25954
+ .np-theme-personal--dark.wds-sentiment-surface-proposition-elevated,
25955
+ .np-theme-business--dark.wds-sentiment-surface-proposition-elevated,
25956
+ .np-theme-personal--forest-green.wds-sentiment-surface-proposition-elevated,
25957
+ .np-theme-business--forest-green.wds-sentiment-surface-proposition-elevated,
25958
+ .np-theme-platform--forest-green.wds-sentiment-surface-proposition-elevated {
25959
+ --color-sentiment-content-primary: #0E0F0C;
25960
+ --color-sentiment-content-primary-hover: #0A2826;
25961
+ --color-sentiment-content-primary-active: #074140;
25962
+ --color-sentiment-interactive-primary: #0B312F;
25963
+ --color-sentiment-interactive-primary-hover: #104744;
25964
+ --color-sentiment-interactive-primary-active: #16605C;
25965
+ --color-sentiment-interactive-secondary: #E0F7F7;
25966
+ --color-sentiment-interactive-secondary-hover: #CAF1F1;
25967
+ --color-sentiment-interactive-secondary-active: #B6ECEC;
25968
+ --color-sentiment-interactive-secondary-neutral: #B4D5D5;
25969
+ --color-sentiment-interactive-secondary-neutral-hover: #A3CCCC;
25970
+ --color-sentiment-interactive-secondary-neutral-active: #9AC6C6;
25971
+ --color-sentiment-interactive-control: #E0F7F7;
25972
+ --color-sentiment-interactive-control-hover: #CAF1F1;
25973
+ --color-sentiment-interactive-control-active: #B6ECEC;
25974
+ --color-sentiment-background-surface: #E0F7F7;
25975
+ --color-sentiment-background-surface-hover: #CAF1F1;
25976
+ --color-sentiment-background-surface-active: #B6ECEC;
25922
25977
  }
25923
25978
 
25924
25979
  .wds-container {