cronapp-framework-mobile-js 2.9.6-SP.5 → 2.9.6-SP.50

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 (24) hide show
  1. package/components/crn-dynamic-file.components.json +5 -7
  2. package/components/crn-dynamic-image.components.json +2 -8
  3. package/css/app_2.9.css +21 -0
  4. package/css/themes/custom/krypton/custom-krypton.css +839 -224
  5. package/css/themes/custom/material-round/custom-material-round.css +1765 -0
  6. package/css/themes/material-round.min.css +5 -0
  7. package/dist/css/app_2.9.css +1 -1
  8. package/dist/css/themes/custom/krypton/custom-krypton.css +1 -1
  9. package/dist/css/themes/custom/material-round/custom-material-round.css +1 -0
  10. package/dist/css/themes/material-round.min.css +1 -0
  11. package/dist/i18n/locale_en_us.json +3 -1
  12. package/dist/i18n/locale_pt_br.json +3 -1
  13. package/dist/js/app.authentication.js +1 -1
  14. package/dist/js/app.js +1 -1
  15. package/dist/js/controllers.authentication.js +1 -1
  16. package/dist/js/upload.service.js +1 -1
  17. package/i18n/locale_en_us.json +3 -1
  18. package/i18n/locale_pt_br.json +3 -1
  19. package/js/app.authentication.js +8 -4
  20. package/js/app.js +4 -2
  21. package/js/controllers.authentication.js +7 -1
  22. package/js/upload.service.js +7 -4
  23. package/package.json +9 -4
  24. package/postupdate.json +8 -0
package/css/themes/custom/krypton/custom-krypton.css CHANGED
@@ -12,16 +12,17 @@
12
12
  --textSmallSize: 10px;
13
13
  --textNormalSize: 12px;
14
14
  --textMediumSize: 16px;
15
- --textBigSize: 22px;
15
+ --textSmallTitle: 18px;
16
+ --textBigSize: 24px;
16
17
  --textExtraBigSize: 28px;
17
- --textFullSize: 34px;
18
+ --textFullSize: 36px;
18
19
 
19
20
  --textColor10: #fbfbfb;
20
21
  --textColor20: #f7f7f7;
21
22
  --textColor30: #f4f4f4;
22
23
  --textColor40: #f0f0f0;
23
24
  --textColor50: #d2d2d2;
24
- --textColor60: #5F5F5F;
25
+ --textColor60: #5f5f5f;
25
26
  --textColor70: #434343;
26
27
 
27
28
  /* Icon Size */
@@ -39,11 +40,11 @@
39
40
  --menuItemIconWidth: 25px;
40
41
 
41
42
  /* Background */
42
- --backgroundColor10: #CED0D2;
43
+ --backgroundColor10: #ced0d2;
43
44
  --backgroundColor20: #a3a3a3;
44
45
  --backgroundColor30: #546270;
45
46
  --backgroundColor40: #090f13;
46
- --backgroundColor50: #080d11;
47
+ --backgroundColor50: #3a434b;
47
48
  --backgroundColor60: #070b0e;
48
49
  --backgroundColor70: #05080a;
49
50
 
@@ -81,7 +82,7 @@
81
82
  --colorDefault20: #b0b1b1;
82
83
  --colorDefault30: #434343;
83
84
  --colorDefault40: #262c32;
84
- --colorDefault50: #252E36;
85
+ --colorDefault50: #252e36;
85
86
  --colorDefault60: #1c2025;
86
87
  --colorDefault70: #15181b;
87
88
  --textColorDefault10: #434343;
@@ -99,7 +100,7 @@
99
100
  --colorPrimary40: #197fdd;
100
101
  --colorPrimary50: #166fc2;
101
102
  --colorPrimary60: #125da2;
102
- --colorPrimary70: #09467F;
103
+ --colorPrimary70: #09467f;
103
104
  --textColorPrimary10: #838383;
104
105
  --textColorPrimary20: #b0b0b0;
105
106
  --textColorPrimary30: #d2d2d2;
@@ -115,7 +116,7 @@
115
116
  --colorSuccess40: #2ffc2b;
116
117
  --colorSuccess50: #29dd26;
117
118
  --colorSuccess60: #22b920;
118
- --colorSuccess70: #108D0D;
119
+ --colorSuccess70: #108d0d;
119
120
  --textColorSuccess10: #838383;
120
121
  --textColorSuccess20: #b0b0b0;
121
122
  --textColorSuccess30: #d2d2d2;
@@ -130,7 +131,7 @@
130
131
  --colorWarning30: #f7ae7c;
131
132
  --colorWarning40: #f58d11;
132
133
  --colorWarning50: #d77b0f;
133
- --colorWarning60: #B46406;
134
+ --colorWarning60: #b46406;
134
135
  --colorWarning70: #864d09;
135
136
  --textColorWarning10: #838383;
136
137
  --textColorWarning20: #b0b0b0;
@@ -146,7 +147,7 @@
146
147
  --colorDanger30: #f48585;
147
148
  --colorDanger40: #f03a3a;
148
149
  --colorDanger50: #d23333;
149
- --colorDanger60: #7E2121;
150
+ --colorDanger60: #7e2121;
150
151
  --colorDanger70: #832020;
151
152
  --textColorDanger10: #838383;
152
153
  --textColorDanger20: #b0b0b0;
@@ -159,11 +160,11 @@
159
160
  /* Color - Royal (mobile) */
160
161
  --colorRoyal10: #d5d7dc;
161
162
  --colorRoyal20: #5487bd;
162
- --colorRoyal30: #394C5E;
163
+ --colorRoyal30: #394c5e;
163
164
  --colorRoyal40: #0e3760;
164
165
  --colorRoyal50: #0c3054;
165
166
  --colorRoyal60: #0a2846;
166
- --colorRoyal70: #1A2E43;
167
+ --colorRoyal70: #1a2e43;
167
168
  --textColorRoyal10: #838383;
168
169
  --textColorRoyal20: #b0b0b0;
169
170
  --textColorRoyal30: #d2d2d2;
@@ -177,8 +178,8 @@
177
178
  --colorCalm20: #68f8f1;
178
179
  --colorCalm30: #4eebe3;
179
180
  --colorCalm40: #44e1d8;
180
- --colorCalm50: #00ABC2;
181
- --colorCalm60: #169F97;
181
+ --colorCalm50: #00abc2;
182
+ --colorCalm60: #169f97;
182
183
  --colorCalm70: #077988;
183
184
  --textColorCalm10: #838383;
184
185
  --textColorCalm20: #b0b0b0;
@@ -194,7 +195,7 @@
194
195
  --colorLight30: #aebbc7;
195
196
  --colorLight40: #8da0b2;
196
197
  --colorLight50: #7b8c9c;
197
- --colorLight60: #303B46;
198
+ --colorLight60: #303b46;
198
199
  --colorLight70: #4d5861;
199
200
  --textColorLight10: #838383;
200
201
  --textColorLight20: #677582;
@@ -203,12 +204,13 @@
203
204
  --textColorLight50: #f4f4f4;
204
205
  --textColorLight60: #f7f7f7;
205
206
  --textColorLight70: #fbfbfb;
207
+
206
208
  /* Color - Stable (mobile) */
207
209
  --colorStable10: #e1e1e1;
208
210
  --colorStable20: #c6c6c6;
209
211
  --colorStable30: #a7a7a7;
210
212
  --colorStable40: #818181;
211
- --colorStable50: #4D4D4D;
213
+ --colorStable50: #4d4d4d;
212
214
  --colorStable60: #5f5f5f;
213
215
  --colorStable70: #3e4042;
214
216
  --textColorStable10: #838383;
@@ -224,9 +226,9 @@
224
226
  --colorDark20: #999999;
225
227
  --colorDark30: #5e5e5e;
226
228
  --colorDark40: #000000;
227
- --colorDark50: #0A141E;
229
+ --colorDark50: #0a141e;
228
230
  --colorDark60: #000000;
229
- --colorDark70: #000000;
231
+ --colorDark70: #0f1e2e;
230
232
  --textColorDark10: #838383;
231
233
  --textColorDark20: #b0b0b0;
232
234
  --textColorDark30: #d2d2d2;
@@ -236,26 +238,26 @@
236
238
  --textColorDark70: #fbfbfb;
237
239
 
238
240
  /* Color - Neutral (web e mobile) */
239
- --colorNeutral00: #FFFFFF;
240
- --colorNeutral10: #F1F1F1;
241
- --colorNeutral20: #E3E3E3;
242
- --colorNeutral30: #D5D5D5;
243
- --colorNeutral40: #C7C7C7;
244
- --colorNeutral50: #B9B9B9;
245
- --colorNeutral60: #ACACAC;
246
- --colorNeutral70: #9E9E9E;
241
+ --colorNeutral00: #ffffff;
242
+ --colorNeutral10: #f1f1f1;
243
+ --colorNeutral20: #e3e3e3;
244
+ --colorNeutral30: #d5d5d5;
245
+ --colorNeutral40: #c7c7c7;
246
+ --colorNeutral50: #b9b9b9;
247
+ --colorNeutral60: #acacac;
248
+ --colorNeutral70: #9e9e9e;
247
249
  --colorNeutral80: #909090;
248
250
  --colorNeutral90: #828282;
249
251
  --colorNeutral100: #747474;
250
252
  --colorNeutral110: #666666;
251
- --colorNeutral120: #5D5D5D;
253
+ --colorNeutral120: #5d5d5d;
252
254
  --colorNeutral130: #535353;
253
- --colorNeutral140: #4A4A4A;
255
+ --colorNeutral140: #4a4a4a;
254
256
  --colorNeutral150: #414141;
255
257
  --colorNeutral160: #383838;
256
- --colorNeutral170: #2E2E2E;
258
+ --colorNeutral170: #2e2e2e;
257
259
  --colorNeutral180: #252525;
258
- --colorNeutral190: #1C1C1C;
260
+ --colorNeutral190: #1c1c1c;
259
261
  --colorNeutral200: #131313;
260
262
  --colorNeutral210: #090909;
261
263
  --colorNeutral220: #000000;
@@ -263,17 +265,17 @@
263
265
  /* === Variables used exclusively in the color palette property === */
264
266
 
265
267
  /* Components - Button */
266
- --btnDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
267
- --btnPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
268
- --btnSuccess: linear-gradient(180deg, #2FFC2B 0%, #0E890B 100%);
269
- --btnCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
270
- --btnWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
271
- --btnDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
272
- --btnLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
268
+ --btnDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
269
+ --btnPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
270
+ --btnSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
271
+ --btnCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
272
+ --btnWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
273
+ --btnDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
274
+ --btnLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
273
275
  --btnLink: var(--colorCalm60, #2fc2ba);
274
- --btnStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
275
- --btnRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
276
- --btnDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
276
+ --btnStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
277
+ --btnRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
278
+ --btnDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
277
279
 
278
280
  --textColorDefault: var(--textColorDefault40, #f0f0f0);
279
281
  --textColorPrimary: var(--textColorPrimary40, #f0f0f0);
@@ -299,28 +301,29 @@
299
301
  --borderBtnDark: transparent;
300
302
 
301
303
  /* Components - Text color */
302
- --colorDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
303
- --colorPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
304
- --colorSuccess: linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%);
305
- --colorCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
306
- --colorWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
307
- --colorDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
308
- --colorLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
309
- --colorStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
310
- --colorRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
311
- --colorDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
304
+ --colorDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
305
+ --colorPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
306
+ --colorSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
307
+ --colorCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
308
+ --colorWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
309
+ --colorDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
310
+ --colorLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
311
+ --colorStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
312
+ --colorRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
313
+ --colorDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
312
314
 
313
315
  /* Components - Checkbox */
314
- --checkboxDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
315
- --checkboxPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
316
- --checkboxSuccess: linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%);
317
- --checkboxCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
318
- --checkboxWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
319
- --checkboxDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
320
- --checkboxLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
321
- --checkboxStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
322
- --checkboxRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
323
- --checkboxDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
316
+
317
+ --checkboxDefault: var(--colorDefault40, #262c32);
318
+ --checkboxPrimary: var(--colorPrimary40, #197fdd);
319
+ --checkboxSuccess: var(--colorSuccess40, #2ffc2b);
320
+ --checkboxCalm: var(--colorCalm40, #44e1d8);
321
+ --checkboxWarning: var(--colorWarning40, #f58d11);
322
+ --checkboxDanger: var(--colorDanger40, #f03a3a);
323
+ --checkboxLight: var(--colorLight40, #8da0b2);
324
+ --checkboxStable: var(--colorStable40, #818181);
325
+ --checkboxRoyal: var(--colorRoyal40, #0e3760);
326
+ --checkboxDark: var(--colorDark40, #000000);
324
327
 
325
328
  --borderCheckboxDefault: transparent;
326
329
  --borderCheckboxPrimary: transparent;
@@ -334,39 +337,39 @@
334
337
  --borderCheckboxDark: transparent;
335
338
 
336
339
  /* Components - Toggle */
337
- --toggleDefault: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
338
- --togglePrimary: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
339
- --toggleSuccess: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
340
- --toggleCalm: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
341
- --toggleWarning: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
342
- --toggleDanger: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
343
- --toggleLight: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
344
- --toggleStable: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
345
- --toggleRoyal: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
346
- --toggleDark: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
347
-
348
- --borderToggleDefault: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
349
- --borderTogglePrimary: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
350
- --borderToggleSuccess: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
351
- --borderToggleCalm: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
352
- --borderToggleWarning: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
353
- --borderToggleDanger: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
354
- --borderToggleLight: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
355
- --borderToggleStable: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
356
- --borderToggleRoyal: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
357
- --borderToggleDark: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
340
+ --toggleDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
341
+ --togglePrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
342
+ --toggleSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
343
+ --toggleCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
344
+ --toggleWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
345
+ --toggleDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
346
+ --toggleLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
347
+ --toggleStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
348
+ --toggleRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
349
+ --toggleDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
350
+
351
+ --borderToggleDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
352
+ --borderTogglePrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
353
+ --borderToggleSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
354
+ --borderToggleCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
355
+ --borderToggleWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
356
+ --borderToggleDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
357
+ --borderToggleLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
358
+ --borderToggleStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
359
+ --borderToggleRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
360
+ --borderToggleDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
358
361
 
359
362
  /* Components - Tabs - crn-ion-segment */
360
- --bgDefault: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
361
- --bgPrimary: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
362
- --bgSuccess: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
363
- --bgCalm: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
364
- --bgWarning: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
365
- --bgDanger: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
366
- --bgLight: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
367
- --bgStable: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
368
- --bgRoyal: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
369
- --bgDark: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
363
+ --bgDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
364
+ --bgPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
365
+ --bgSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
366
+ --bgCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
367
+ --bgWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
368
+ --bgDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
369
+ --bgLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
370
+ --bgStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
371
+ --bgRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
372
+ --bgDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
370
373
 
371
374
  --borderActiveBackgroundDefault: transparent;
372
375
  --borderActiveBackgroundPrimary: transparent;
@@ -379,16 +382,17 @@
379
382
  --borderActiveBackgroundRoyal: transparent;
380
383
  --borderActiveBackgroundDark: transparent;
381
384
 
382
- --activeBackgroundDefault: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
383
- --activeBackgroundPrimary: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
384
- --activeBackgroundSuccess: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
385
- --activeBackgroundCalm: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
386
- --activeBackgroundWarning: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
387
- --activeBackgroundDanger: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
388
- --activeBackgroundLight: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
389
- --activeBackgroundStable: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
390
- --activeBackgroundRoyal: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
391
- --activeBackgroundDark: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
385
+ --activeBackgroundDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
386
+ --activeBackgroundPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
387
+ --activeBackgroundSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
388
+ --activeBackgroundCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
389
+ --activeBackgroundWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
390
+ --activeBackgroundDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
391
+ --activeBackgroundLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
392
+ --activeBackgroundStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
393
+ --activeBackgroundRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
394
+ --activeBackgroundDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
395
+
392
396
  --ionSegmentDefault: var(--textColorPrimary40, #f0f0f0);
393
397
  --ionSegmentPrimary: var(--textColorDefault40, #f0f0f0);
394
398
  --ionSegmentSuccess: var(--textColorSuccess40, #f0f0f0);
@@ -400,63 +404,63 @@
400
404
  --ionSegmentRoyal: var(--textColorRoyal40, #f0f0f0);
401
405
  --ionSegmentDark: var(--textColorDark40, #f0f0f0);
402
406
 
403
- --iconThemeLightDefault: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
404
- --iconThemeLightPrimary: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
405
- --iconThemeLightSuccess: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
406
- --iconThemeLightCalm: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
407
- --iconThemeLightWarning: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
408
- --iconThemeLightDanger: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
409
- --iconThemeLightLight: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
410
- --iconThemeLightStable: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
411
- --iconThemeLightRoyal: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
412
- --iconThemeLightDark: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
407
+ --iconThemeLightDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
408
+ --iconThemeLightPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
409
+ --iconThemeLightSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
410
+ --iconThemeLightCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
411
+ --iconThemeLightWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
412
+ --iconThemeLightDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
413
+ --iconThemeLightLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
414
+ --iconThemeLightStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
415
+ --iconThemeLightRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
416
+ --iconThemeLightDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
413
417
 
414
418
  /* Components - Old Tabs - pallete false */
415
- --tabsDefault: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
416
- --tabsPrimary: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
417
- --tabsSuccess: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
418
- --tabsCalm: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
419
- --tabsWarning: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
420
- --tabsDanger: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
421
- --tabsLight: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
422
- --tabsStable: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
423
- --tabsRoyal: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
424
- --tabsDark: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
419
+ --tabsDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
420
+ --tabsPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
421
+ --tabsSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
422
+ --tabsCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
423
+ --tabsWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
424
+ --tabsDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
425
+ --tabsLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
426
+ --tabsStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
427
+ --tabsRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
428
+ --tabsDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
425
429
 
426
430
  /* Components - Header */
427
- --barDefault: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
428
- --barPrimary: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
429
- --barSuccess: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
430
- --barCalm: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
431
- --barWarning: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
432
- --barDanger: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
433
- --barLight: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
434
- --barStable: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
435
- --barRoyal: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
436
- --barDark: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
431
+ --barDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
432
+ --barPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
433
+ --barSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
434
+ --barCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
435
+ --barWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
436
+ --barDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
437
+ --barLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
438
+ --barStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
439
+ --barRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
440
+ --barDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1e2e) 100%);
437
441
 
438
442
  /* Componentes - Footer with icon */
439
- --backgroundDefault: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
440
- --backgroundPrimary: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
441
- --backgroundSuccess: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
442
- --backgroundCalm: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
443
- --backgroundWarning: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
444
- --backgroundDanger: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
445
- --backgroundLight: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
446
- --backgroundStable: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
447
- --backgroundRoyal: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
448
- --backgroundDark: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
449
-
450
- --tabsIconDefault: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
451
- --tabsIconPrimary: var(--textColorDefault40, #f0f0f0);
452
- --tabsIconSuccess: var(--textColorSuccess40, #f0f0f0);
453
- --tabsIconCalm: var(--textColorCalm40, #f0f0f0);
454
- --tabsIconWarning: var(--textColorWarning40, #f0f0f0);
455
- --tabsIconDanger: var(--textColorDanger40, #f0f0f0);
456
- --tabsIconLight: var(--textColorLight40, #f0f0f0);
457
- --tabsIconStable: var(--textColorStable40, #f0f0f0);
458
- --tabsIconRoyal: var(--textColorRoyal40, #f0f0f0);
459
- --tabsIconDark: var(--textColorDark40, #f0f0f0);
443
+ --backgroundDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
444
+ --backgroundPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
445
+ --backgroundSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
446
+ --backgroundCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
447
+ --backgroundWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
448
+ --backgroundDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
449
+ --backgroundLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
450
+ --backgroundStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
451
+ --backgroundRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
452
+ --backgroundDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
453
+
454
+ --tabsIconDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
455
+ --tabsIconPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
456
+ --tabsIconSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
457
+ --tabsIconCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
458
+ --tabsIconWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
459
+ --tabsIconDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
460
+ --tabsIconLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
461
+ --tabsIconStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
462
+ --tabsIconRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
463
+ --tabsIconDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
460
464
  /* End - Variables used exclusively in the color palette property */
461
465
  }
462
466
 
@@ -473,25 +477,42 @@ h6,
473
477
  .h5,
474
478
  .h6 {
475
479
  font-family: var(--fontFamily, "Open Sans", "Arial", sans-serif);
480
+ color: var(--textColor40, #f0f0f0);
481
+ }
482
+
483
+ h1 {
484
+ font-size: var(--textFullSize, 36px);
485
+ }
486
+
487
+ .h3 {
488
+ font-size: var(--textBigSize, 24px);
489
+ }
490
+
491
+ .h5 {
492
+ font-size: var(--textSmallTitle, 18px);
493
+ }
494
+
495
+ h2 {
496
+ font-size: 18px;
476
497
  }
477
498
 
478
499
  a,
479
500
  a:focus,
480
501
  a:active,
481
502
  a:hover {
482
- color: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
503
+ color: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
483
504
  }
484
505
 
485
506
  .light,
486
507
  a.light,
487
508
  .color-light {
488
- color: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
509
+ color: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
489
510
  }
490
511
 
491
512
  .stable,
492
513
  a.stable,
493
514
  .color-stable {
494
- color: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
515
+ color: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
495
516
  }
496
517
 
497
518
  /* Login */
@@ -553,8 +574,8 @@ a.stable,
553
574
 
554
575
  /* Cabeçalho */
555
576
  .bar.bar-default {
556
- border-color: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
557
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
577
+ border-color: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
578
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
558
579
  color: var(--textColorPrimary40, #f0f0f0);
559
580
  }
560
581
 
@@ -564,8 +585,8 @@ a.stable,
564
585
  }
565
586
 
566
587
  .bar.bar-positive {
567
- border-color: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
568
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
588
+ border-color: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
589
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
569
590
  color: var(--textColorDefault40, #f0f0f0);
570
591
  }
571
592
 
@@ -576,22 +597,30 @@ a.stable,
576
597
 
577
598
  /* Menu */
578
599
  .menu-view {
579
- background: var(--colorLight60, #303B46);
600
+ background: var(--colorLight60, #303b46);
580
601
  color: var(--textColor10, #f0f0f0);
581
602
  }
582
603
 
604
+ #menu-blue .item:hover {
605
+ background: var(--backgroundColor30, #546270);
606
+ }
607
+
608
+ #menu-blue .item:active,
609
+ #menu-blue .item.actived {
610
+ background: var(--backgroundColor50, #3a434b);
611
+ }
612
+
583
613
  /* Button Positive */
584
614
  .button.button-positive {
585
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
615
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
586
616
  }
587
617
 
588
618
  .button.button-positive:active,
589
619
  .button.button-positive.activated {
590
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
620
+ background: var(--colorPrimary70, #09467f);
591
621
  }
592
622
 
593
623
  /* Light - Outline */
594
-
595
624
  .button.button-light.button-outline {
596
625
  border-color: none;
597
626
  }
@@ -622,66 +651,154 @@ a.stable,
622
651
  }
623
652
 
624
653
  /* Rodapé com ícone */
625
-
626
654
  .tabs-striped.background-default .tabs {
627
- background: var(--textColorDefault40, #f0f0f0);
655
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
656
+ }
657
+
658
+ .tabs-striped.background-positive .tabs {
659
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
660
+ }
661
+
662
+ .tabs-striped.background-balanced .tabs {
663
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
664
+ }
665
+
666
+ .tabs-striped.background-calm .tabs {
667
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
668
+ }
669
+
670
+ .tabs-striped.background-energized .tabs {
671
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
672
+ }
673
+
674
+ .tabs-striped.background-assertive .tabs {
675
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
676
+ }
677
+
678
+ .tabs-striped.background-light .tabs {
679
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
680
+ }
681
+
682
+ .tabs-striped.background-stable .tabs {
683
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
684
+ }
685
+
686
+ .tabs-striped.background-royal .tabs {
687
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
688
+ }
689
+
690
+ .tabs-striped.background-dark .tabs {
691
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
628
692
  }
629
693
 
630
694
  .tabs-striped.tabs-icon-default .tab-item {
631
695
  color: var(--textColorDefault40, #f0f0f0);
632
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
696
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
633
697
  opacity: 0.5;
634
698
  }
635
699
 
700
+ /* Rodapé com botões*/
701
+ .bar.bar-default.bar-footer,
702
+ .bar.bar-default {
703
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
704
+ }
705
+
706
+ .bar.bar-positive.bar-footer,
707
+ .bar.bar-positive {
708
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
709
+ }
710
+
711
+ .bar.bar-balanced.bar-footer,
712
+ .bar.bar-balanced {
713
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
714
+ }
715
+
716
+ .bar.bar-calm.bar-footer,
717
+ .bar.bar-calm {
718
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
719
+ }
720
+
721
+ .bar.bar-energized.bar-footer,
722
+ .bar.bar-energized {
723
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
724
+ }
725
+
726
+ .bar.bar-assertive.bar-footer,
727
+ .bar.bar-assertive {
728
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
729
+ }
730
+
731
+ .bar.bar-light.bar-footer,
732
+ .bar.bar-light {
733
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
734
+ }
735
+
736
+ .bar.bar-stable.bar-footer,
737
+ .bar.bar-stable {
738
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
739
+ }
740
+
741
+ .bar.bar-royal.bar-footer,
742
+ .bar.bar-royal {
743
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
744
+ }
745
+
746
+ .bar.bar-dark.bar-footer,
747
+ .bar.bar-dark {
748
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
749
+ }
750
+
636
751
  .item-input .icon {
637
752
  font-size: 12px;
638
753
  }
639
754
 
640
- #menu-blue .item:hover {
641
- background: var(--backgroundColor30, #f4f4f4);
755
+ .button.button-default {
756
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
642
757
  }
643
758
 
644
759
  .button.button-default:hover {
645
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
760
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
761
+ box-shadow: 0px 0px 3px 0px #3a4753;
646
762
  }
647
763
 
648
- .button.button-default:active {
649
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
764
+ .button.button-default:active,
765
+ .button.button-default.activated {
766
+ background: var(--colorDefault50, #252e36);
650
767
  }
651
768
 
652
769
  .login-mobile .button.button-light {
653
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
770
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
654
771
  color: var(--textColorWarning40, #f0f0f0);
655
772
  border-radius: 20px;
656
773
  }
657
774
 
658
775
  .login-mobile .button.button-light:hover {
659
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
776
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
660
777
  color: var(--textColorWarning40, #f0f0f0);
661
778
  }
662
779
 
663
780
  .login-mobile .button.button-light:active {
664
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
781
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
665
782
  color: var(--textColorWarning40, #f0f0f0);
666
783
  }
667
784
 
668
785
  .button#button-reset-password {
669
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
786
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
670
787
  color: var(--textColorWarning40, #ffffff);
671
788
  }
672
789
 
673
790
  .button#button-reset-password:hover {
674
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
791
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
675
792
  color: var(--textColorWarning40, #f0f0f0);
676
793
  }
677
794
 
678
795
  .button#button-reset-password:active {
679
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
796
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
680
797
  color: var(--textColorWarning40, #f0f0f0);
681
798
  }
682
799
 
683
800
  .item-radio input:checked+.radio-content .item-content {
684
- background: var(--backgroundColor40, #f2f2f2);
801
+ background: var(--backgroundColor40, #090f13);
685
802
  color: var(--textColor40, #f0f0f0);
686
803
  }
687
804
 
@@ -702,38 +819,47 @@ a.stable,
702
819
 
703
820
  input[placeholder]:not([placeholder=""])::placeholder {
704
821
  /* Chrome, Firefox, Opera, Safari 10.1+ */
705
- color: var(--textColor60, #5F5F5F);
822
+ color: var(--textColor60, #5f5f5f);
706
823
  opacity: 1;
707
824
  /* Firefox */
708
825
  }
709
826
 
710
827
  input:-ms-input-placeholder {
711
828
  /* Internet Explorer 10-11 */
712
- color: var(--textColor60, #5F5F5F);
829
+ color: var(--textColor60, #5f5f5f);
713
830
  }
714
831
 
715
832
  input::-ms-input-placeholder {
716
833
  /* Microsoft Edge */
717
- color: var(--textColor60, #5F5F5F);
834
+ color: var(--textColor60, #5f5f5f);
718
835
  margin-left: 10px;
719
836
  }
720
837
 
721
838
  .list-inset .item.item-input input {
722
- background: var(--backgroundColor10, #CED0D2);
839
+ background: var(--backgroundColor10, #ced0d2);
723
840
  color: var(--textColor70, #434343);
724
841
  border-radius: 20px;
842
+ border-bottom: 0;
725
843
  }
726
844
 
727
845
  .modal .item {
728
846
  border-width: 1px;
729
847
  border-color: none;
730
- background: var(--backgroundColor10, #CED0D2);
848
+ background: var(--backgroundColor10, #ced0d2);
731
849
  color: var(--textColor40, #f0f0f0);
732
850
  }
733
851
 
852
+ .k-widget.k-window .k-window-titlebar .k-window-title {
853
+ color: var(--textColor40, #f0f0f0);
854
+ margin-top: 23px;
855
+ }
856
+
857
+ .k-widget.k-window {
858
+ border-radius: 20px;
859
+ }
734
860
 
735
861
  .item-input-wrapper {
736
- background: var(--backgroundColor40, #f2f2f2);
862
+ background: var(--backgroundColor40, #090f13);
737
863
  }
738
864
 
739
865
  .ion-search:before {
@@ -759,6 +885,10 @@ input[type="password"] {
759
885
  letter-spacing: 0px;
760
886
  }
761
887
 
888
+ .button.button {
889
+ border-radius: 20px;
890
+ }
891
+
762
892
  button#crn-button-signup {
763
893
  letter-spacing: 0px;
764
894
  border-radius: 0px;
@@ -789,7 +919,7 @@ button#crn-button-signup:hover {
789
919
 
790
920
  /*Default*/
791
921
  .button.button-default.button-outline {
792
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
922
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
793
923
  border-color: transparent;
794
924
  color: var(--textColor40, #f0f0f0);
795
925
  }
@@ -799,27 +929,32 @@ button#crn-button-signup:hover {
799
929
  }
800
930
 
801
931
  .button.button-default.button-outline:active {
802
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
932
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
803
933
  }
804
934
 
805
935
  .button.button-default.button-outline i {
806
936
  color: var(--textColor40, #f0f0f0);
807
937
  }
808
938
 
809
- .button.button-default {
810
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
811
- border-radius: 20px;
812
- }
813
-
814
939
  /*Secundary*/
815
940
  .button.button-positive {
816
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
941
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
942
+ }
943
+
944
+ .button.button-positive:hover {
945
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
946
+ box-shadow: 0px 0px 3px 0px #187ad4;
947
+ }
948
+
949
+ .button.button-positive:active {
950
+ background: var(--colorPrimary70, #09467f);
817
951
  }
818
952
 
819
953
  .button.button-positive.button-outline {
820
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
954
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
821
955
  border-color: transparent;
822
956
  color: var(--textColorDefault40, #f0f0f0);
957
+ border-bottom: 0;
823
958
  }
824
959
 
825
960
  .button.button-positive.button-outline span {
@@ -827,7 +962,8 @@ button#crn-button-signup:hover {
827
962
  }
828
963
 
829
964
  .button.button-positive.button-outline:active {
830
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
965
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
966
+ border-bottom: 0;
831
967
  }
832
968
 
833
969
  .button.button-positive.button-outline i {
@@ -836,13 +972,23 @@ button#crn-button-signup:hover {
836
972
 
837
973
  /*Success*/
838
974
  .button.button-balanced {
839
- background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
975
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
976
+ }
977
+
978
+ .button.button-balanced:hover {
979
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
980
+ box-shadow: 0px 0px 3px 0px #2ffc2b;
981
+ }
982
+
983
+ .button.button-balanced:active {
984
+ background: var(--colorSuccess70, #108d0d);
840
985
  }
841
986
 
842
987
  .button.button-balanced.button-outline {
843
- background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
988
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
844
989
  border-color: transparent;
845
990
  color: var(--textColorDefault40, #f0f0f0);
991
+ border-bottom: 0;
846
992
  }
847
993
 
848
994
  .button.button-balanced.button-outline span {
@@ -850,7 +996,7 @@ button#crn-button-signup:hover {
850
996
  }
851
997
 
852
998
  .button.button-balanced.button-outline:active {
853
- background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
999
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
854
1000
  }
855
1001
 
856
1002
  .button.button-balanced.button-outline i {
@@ -859,13 +1005,23 @@ button#crn-button-signup:hover {
859
1005
 
860
1006
  /*Calm*/
861
1007
  .button.button-calm {
862
- background: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
1008
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
1009
+ }
1010
+
1011
+ .button.button-calm:hover {
1012
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
1013
+ box-shadow: 0px 0px 3px 0px #42dcd3;
1014
+ }
1015
+
1016
+ .button.button-calm:active {
1017
+ background: var(--colorCalm60, #169f97);
863
1018
  }
864
1019
 
865
1020
  .button.button-calm.button-outline {
866
- background: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
1021
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
867
1022
  border-color: transparent;
868
1023
  color: var(--textColorDefault40, #f0f0f0);
1024
+ border-bottom: 0;
869
1025
  }
870
1026
 
871
1027
  .button.button-calm.button-outline span {
@@ -873,7 +1029,7 @@ button#crn-button-signup:hover {
873
1029
  }
874
1030
 
875
1031
  .button.button-calm.button-outline:active {
876
- background: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
1032
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
877
1033
  }
878
1034
 
879
1035
  .button.button-calm.button-outline i {
@@ -882,13 +1038,23 @@ button#crn-button-signup:hover {
882
1038
 
883
1039
  /*Warning*/
884
1040
  .button.button-energized {
885
- background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
1041
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
1042
+ }
1043
+
1044
+ .button.button-energized:hover {
1045
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
1046
+ box-shadow: 0px 0px 3px 0px #f58d11;
1047
+ }
1048
+
1049
+ .button.button-energized:active {
1050
+ background: var(--colorWarning60, #b46406);
886
1051
  }
887
1052
 
888
1053
  .button.button-energized.button-outline {
889
- background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
1054
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
890
1055
  border-color: transparent;
891
1056
  color: var(--textColorDefault40, #f0f0f0);
1057
+ border-bottom: 0;
892
1058
  }
893
1059
 
894
1060
  .button.button-energized.button-outline span {
@@ -896,7 +1062,7 @@ button#crn-button-signup:hover {
896
1062
  }
897
1063
 
898
1064
  .button.button-energized.button-outline:active {
899
- background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
1065
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
900
1066
  }
901
1067
 
902
1068
  .button.button-energized.button-outline i {
@@ -905,11 +1071,21 @@ button#crn-button-signup:hover {
905
1071
 
906
1072
  /*Danger*/
907
1073
  .button.button-assertive {
908
- background: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
1074
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
1075
+ border-bottom: 0;
1076
+ }
1077
+
1078
+ .button.button-assertive:hover {
1079
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
1080
+ box-shadow: 0px 0px 3px 0px #dE3636;
1081
+ }
1082
+
1083
+ .button.button-assertive:active {
1084
+ background: var(--colorDanger60, #7e2121);
909
1085
  }
910
1086
 
911
1087
  .button.button-assertive.button-outline {
912
- background: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
1088
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
913
1089
  border-color: transparent;
914
1090
  color: var(--textColorDanger40, #f0f0f0);
915
1091
  }
@@ -919,7 +1095,7 @@ button#crn-button-signup:hover {
919
1095
  }
920
1096
 
921
1097
  .button.button-assertive.button-outline:active {
922
- background: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
1098
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
923
1099
  }
924
1100
 
925
1101
  .button.button-assertive.button-outline i {
@@ -928,11 +1104,21 @@ button#crn-button-signup:hover {
928
1104
 
929
1105
  /*Light*/
930
1106
  .button.button-light {
931
- background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
1107
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
1108
+ border-bottom: 0;
1109
+ }
1110
+
1111
+ .button.button-light:hover {
1112
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
1113
+ box-shadow: 0px 0px 3px 0px #8da0b2;
1114
+ }
1115
+
1116
+ .button.button-light:active {
1117
+ background: var(--colorLight60, #303b46);
932
1118
  }
933
1119
 
934
1120
  .button.button-light.button-outline {
935
- background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
1121
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
936
1122
  border-color: transparent;
937
1123
  color: var(--textColorLight40, #f0f0f0);
938
1124
  }
@@ -942,7 +1128,7 @@ button#crn-button-signup:hover {
942
1128
  }
943
1129
 
944
1130
  .button.button-light.button-outline:active {
945
- background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
1131
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
946
1132
  }
947
1133
 
948
1134
  .button.button-light.button-outline i {
@@ -951,11 +1137,22 @@ button#crn-button-signup:hover {
951
1137
 
952
1138
  /*Stable*/
953
1139
  .button.button-stable {
954
- background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
1140
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
1141
+ border-bottom: 0;
1142
+ }
1143
+
1144
+ .button.button-stable:hover {
1145
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
1146
+ box-shadow: 0px 0px 3px 0px #7b7b7b;
1147
+ }
1148
+
1149
+ .button.button-stable:active,
1150
+ .button.button-stable.activated {
1151
+ background: var(--colorStable50, #4d4d4d);
955
1152
  }
956
1153
 
957
1154
  .button.button-stable.button-outline {
958
- background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
1155
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
959
1156
  border-color: transparent;
960
1157
  color: var(--textColorStable40, #434343);
961
1158
  }
@@ -965,7 +1162,7 @@ button#crn-button-signup:hover {
965
1162
  }
966
1163
 
967
1164
  .button.button-stable.button-outline:active {
968
- background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
1165
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
969
1166
  }
970
1167
 
971
1168
  .button.button-stable.button-outline i {
@@ -974,11 +1171,22 @@ button#crn-button-signup:hover {
974
1171
 
975
1172
  /*Royal*/
976
1173
  .button.button-royal {
977
- background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
1174
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
1175
+ border-bottom: 0;
1176
+ }
1177
+
1178
+ .button.button-royal:hover {
1179
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
1180
+ box-shadow: 0px 0px 3px 0px #11375d;
1181
+ }
1182
+
1183
+ .button.button-royal:active,
1184
+ .button.button-royal.activated {
1185
+ background: var(--colorRoyal70, #1a2e43);
978
1186
  }
979
1187
 
980
1188
  .button.button-royal.button-outline {
981
- background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
1189
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
982
1190
  border-color: transparent;
983
1191
  color: var(--textColorRoyal40, #f0f0f0);
984
1192
  }
@@ -988,7 +1196,7 @@ button#crn-button-signup:hover {
988
1196
  }
989
1197
 
990
1198
  .button.button-royal.button-outline:active {
991
- background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
1199
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
992
1200
  }
993
1201
 
994
1202
  .button.button-royal.button-outline i {
@@ -998,14 +1206,27 @@ button#crn-button-signup:hover {
998
1206
  /*Dark*/
999
1207
 
1000
1208
  .button.button-dark {
1001
- background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
1209
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
1210
+ }
1211
+
1212
+ .button.button-dark:hover {
1213
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
1214
+ box-shadow: 0px 0px 3px 0px #132639;
1215
+ }
1002
1216
 
1217
+ .button.button-dark:active,
1218
+ .button.button-dark.activated {
1219
+ background: var(--colorDark50, #0a141e);
1220
+ border-bottom: 0;
1221
+ border-top: 0;
1003
1222
  }
1004
1223
 
1005
1224
  .button.button-dark.button-outline {
1006
- background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
1225
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
1007
1226
  border-color: transparent;
1008
1227
  color: var(--textColorDark40, #f0f0f0);
1228
+ border-bottom: 0;
1229
+ border-top: 0;
1009
1230
  }
1010
1231
 
1011
1232
  .button.button-dark.button-outline span {
@@ -1013,7 +1234,7 @@ button#crn-button-signup:hover {
1013
1234
  }
1014
1235
 
1015
1236
  .button.button-dark.button-outline:active {
1016
- background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
1237
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
1017
1238
  }
1018
1239
 
1019
1240
  .button.button-dark.button-outline i {
@@ -1036,7 +1257,7 @@ button#crn-button-signup:hover {
1036
1257
  }
1037
1258
 
1038
1259
  .button#button-reset-password {
1039
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
1260
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
1040
1261
  color: var(--textColorWarning40, #ffffff);
1041
1262
  border-radius: 20px;
1042
1263
  }
@@ -1052,7 +1273,7 @@ button#crn-button-signup {
1052
1273
  justify-content: center;
1053
1274
  align-items: center;
1054
1275
  display: flex;
1055
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
1276
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
1056
1277
  }
1057
1278
 
1058
1279
  .crn-ion-segment-light ul li a,
@@ -1064,12 +1285,406 @@ button#crn-button-signup {
1064
1285
  }
1065
1286
 
1066
1287
  .item h3:last-child,
1067
- .item h3,
1068
- .item h2 {
1288
+ .item h3 {
1069
1289
  color: var(--textColorDark40, #f0f0f0);
1070
1290
  }
1071
1291
 
1072
- .item-icon-left .icon:before,
1073
- .item-complex .item-content {
1292
+ /*Abas*/
1293
+ .crn-ion-segment-classic ul li a {
1294
+ border-radius: 20px;
1295
+ }
1296
+
1297
+ .crn-ion-segment-classic ul.active-background-default li.active a {
1298
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
1299
+ color: var(--textColor40, #f0f0f0);
1300
+ }
1301
+
1302
+ .crn-ion-segment-classic ul.active-background-positive li.active a {
1303
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
1304
+ color: var(--textColor40, #f0f0f0);
1305
+ }
1306
+
1307
+ .crn-ion-segment-classic ul.active-background-balanced li.active a {
1308
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
1309
+ color: var(--textColor40, #f0f0f0);
1310
+ }
1311
+
1312
+ .crn-ion-segment-classic ul.active-background-calm li.active a {
1313
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
1314
+ color: var(--textColor40, #f0f0f0);
1315
+ }
1316
+
1317
+ .crn-ion-segment-classic ul.active-background-energized li.active a {
1318
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
1319
+ color: var(--textColor40, #f0f0f0);
1320
+ }
1321
+
1322
+ .crn-ion-segment-classic ul.active-background-assertive li.active a {
1323
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
1324
+ color: var(--textColor40, #f0f0f0);
1325
+ }
1326
+
1327
+ .crn-ion-segment-classic ul.active-background-light li.active a {
1328
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
1329
+ color: var(--textColor40, #f0f0f0);
1330
+ }
1331
+
1332
+ .crn-ion-segment-classic ul.active-background-stable li.active a {
1333
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
1334
+ color: var(--textColor40, #f0f0f0);
1335
+ }
1336
+
1337
+ .crn-ion-segment-classic ul.active-background-royal li.active a {
1338
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
1339
+ color: var(--textColor40, #f0f0f0);
1340
+ }
1341
+
1342
+ .crn-ion-segment-classic ul.active-background-dark li.active a {
1343
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
1344
+ color: var(--textColor40, #f0f0f0);
1345
+ }
1346
+
1347
+ canvas {
1348
+ background: var(--backgroundColor10, #ced0d2);
1349
+ }
1350
+
1351
+ /* Cores icones*/
1352
+ .default {
1353
+ color: var(--colorDefault40, #262C32);
1354
+ }
1355
+
1356
+ .positive {
1357
+ color: var(--colorPrimary40, #197fdd);
1358
+ }
1359
+
1360
+ .balanced {
1361
+ color: var(--colorSuccess40, #2ffc2b);
1362
+ }
1363
+
1364
+ .calm {
1365
+ color: var(--colorCalm40, #44e1d8);
1366
+ }
1367
+
1368
+ .energized {
1369
+ color: var(--colorWarning40, #f58d11);
1370
+ }
1371
+
1372
+ .assertive {
1373
+ color: var(--colorDanger40, #f03a3a);
1374
+ }
1375
+
1376
+ .light {
1377
+ color: var(--colorLight40, #8da0b2);
1378
+ }
1379
+
1380
+ .stable {
1381
+ color: var(--colorStable40, #818181);
1382
+ }
1383
+
1384
+ .royal {
1385
+ color: var(--colorRoyal40, #0e3760);
1386
+ }
1387
+
1388
+ .dark {
1389
+ color: var(--colorDark40, #000000);
1390
+ }
1391
+
1392
+ /* Cores Links*/
1393
+ .color-default {
1394
+ color: var(--colorDefault40, #262C32);
1395
+ }
1396
+
1397
+ .color-positive {
1398
+ color: var(--colorPrimary40, #197fdd);
1399
+ }
1400
+
1401
+ .color-balanced {
1402
+ color: var(--colorSuccess40, #2ffc2b);
1403
+ }
1404
+
1405
+ .color-calm {
1406
+ color: var(--colorCalm40, #44e1d8);
1407
+ }
1408
+
1409
+ .color-energized {
1410
+ color: var(--colorWarning40, #f58d11);
1411
+ }
1412
+
1413
+ .color-assertive {
1414
+ color: var(--colorDanger40, #f03a3a);
1415
+ }
1416
+
1417
+ .color-light {
1418
+ color: var(--colorLight40, #8da0b2);
1419
+ }
1420
+
1421
+ .color-stable {
1422
+ color: var(--colorStable40, #818181);
1423
+ }
1424
+
1425
+ .color-royal {
1426
+ color: var(--colorRoyal40, #0e3760);
1427
+ }
1428
+
1429
+ .color-dark {
1430
+ color: var(--colorDark40, #000000);
1431
+ }
1432
+
1433
+
1434
+ /*Cores Checkbox*/
1435
+ .checkbox input:before {
1436
+ border-radius: 2px;
1437
+ }
1438
+
1439
+ .checkbox-default input:checked:before {
1440
+ background: var(--colorDefault40, #262c32);
1441
+ border-color: var(--colorDefault40, #262c32);
1442
+ border-radius: 2px;
1443
+ }
1444
+
1445
+ .checkbox-positive input:checked:before {
1446
+ background: var(--colorPrimary40, #197fdd);
1447
+ border-color: var(--colorPrimary40, #197fdd);
1448
+ border-radius: 2px;
1449
+ }
1450
+
1451
+ .checkbox-balanced input:checked:before {
1452
+ background: var(--colorSuccess40, #2ffc2b);
1453
+ border-color: var(--colorSuccess60, #22b920);
1454
+ border-radius: 2px;
1455
+ }
1456
+
1457
+ .checkbox-calm input:checked:before {
1458
+ background: var(--colorCalm40, #44e1d8);
1459
+ border-color: var(--colorCalm40, #44e1d8);
1460
+ border-radius: 2px;
1461
+ }
1462
+
1463
+ .checkbox-energized input:checked:before {
1464
+ background: var(--colorWarning40, #f58d11);
1465
+ border-color: var(--colorWarning40, #f58d11);
1466
+ border-radius: 2px;
1467
+ }
1468
+
1469
+ .checkbox-assertive input:checked:before {
1470
+ background: var(--colorDanger40, #f03a3a);
1471
+ border-color: var(--colorDanger40, #f03a3a);
1472
+ border-radius: 2px;
1473
+ }
1474
+
1475
+ .checkbox-light input:checked:before {
1476
+ background: var(--colorLight40, #8da0b2);
1477
+ border-color: var(--colorLight40, #8da0b2);
1478
+ border-radius: 2px;
1479
+ }
1480
+
1481
+ .checkbox-stable input:checked:before {
1482
+ background: var(--colorStable40, #818181);
1483
+ border-color: var(--colorStable40, #818181);
1484
+ border-radius: 2px;
1485
+ }
1486
+
1487
+ .checkbox-royal input:checked:before {
1488
+ background: var(--colorRoyal40, #0e3760);
1489
+ border-color: var(--colorRoyal40, #0e3760);
1490
+ border-radius: 2px;
1491
+ }
1492
+
1493
+ .checkbox-dark input:checked:before {
1494
+ background: var(--colorDark40, #000000);
1495
+ border-color: var(--colorDark40, #000000);
1496
+ border-radius: 2px;
1497
+ }
1498
+
1499
+ /*Toogle*/
1500
+ .toggle.toggle-default input:checked+.track {
1501
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
1502
+ border-color: var(--colorDefault40, #262c32);
1503
+ }
1504
+
1505
+ .toggle.toggle-positive input:checked+.track {
1506
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467f) 100%);
1507
+ }
1508
+
1509
+ .toggle.toggle-balanced input:checked+.track {
1510
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%);
1511
+ }
1512
+
1513
+ .toggle.toggle-calm input:checked+.track {
1514
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
1515
+ }
1516
+
1517
+ .toggle.toggle-energized input:checked+.track {
1518
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
1519
+ }
1520
+
1521
+ .toggle.toggle-assertive input:checked+.track {
1522
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
1523
+ }
1524
+
1525
+ .toggle.toggle-light input:checked+.track {
1526
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
1527
+ }
1528
+
1529
+ .toggle.toggle-stable input:checked+.track {
1530
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
1531
+ }
1532
+
1533
+ .toggle.toggle-royal input:checked+.track {
1534
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1a2e43) 100%);
1535
+ }
1536
+
1537
+ .toggle.toggle-dark input:checked+.track {
1538
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0f1e2e) 100%);
1539
+ }
1540
+
1541
+ .k-combobox .k-dropdown-wrap .k-input,
1542
+ .k-combobox .k-dropdown-wrap .k-select {
1543
+ background: var(--colorDark50, #0a141e);
1544
+ color: var(--textColor40, #f0f0f0);
1545
+ }
1546
+
1547
+ .tabs-striped .tabs,
1548
+ .tabs-striped.tabs-icon-default .tab-item.active,
1549
+ .tabs-striped .tabs .tab-item {
1550
+ margin-top: 0px;
1551
+ border-style: 0px;
1552
+ border-width: 0px;
1553
+ border-color: 0px;
1554
+ padding: 0px;
1555
+ }
1556
+
1557
+ .k-list .k-item {
1558
+ background: var(--colorDark50, #0a141e);
1074
1559
  color: var(--textColorDark40, #f0f0f0);
1560
+ }
1561
+
1562
+ .k-list .k-item:focus,
1563
+ .k-list .k-item:hover {
1564
+ background: var(--backgroundColor10, #ced0d2);
1565
+ color: var(--textColor70, #434343);
1566
+ }
1567
+
1568
+ .k-list .k-item.k-state-selected {
1569
+ background: var(--colorStable20, #c6c6c6);
1570
+ color: var(--textColor70, #434343);
1571
+ }
1572
+
1573
+ h5 {
1574
+ font-size: 18px;
1575
+ }
1576
+
1577
+ .k-dialog .k-dialog-titlebar:before {
1578
+ margin-right: -35px;
1579
+ }
1580
+
1581
+ .k-dialog-buttongroup {
1582
+ width: 150px;
1583
+ margin-left: 74px;
1584
+ margin-bottom: 20px;
1585
+ }
1586
+
1587
+ .k-dialog[data-dialog-type="success"] .k-dialog-titlebar,
1588
+ .k-dialog[data-dialog-type="success"] .k-dialog-title,
1589
+ .k-dialog[data-dialog-type="success"] .k-dialog-titlebar:before {
1590
+ background-color: var(--backgroundColor30, #546270);
1591
+ color: var(--colorSuccess40, #2ffc2b);
1592
+ border: none;
1593
+ margin: auto;
1594
+ margin-top: 20px;
1595
+ white-space: break-spaces;
1596
+ text-align: center;
1597
+ }
1598
+
1599
+ .k-dialog[data-dialog-type="info"] .k-dialog-titlebar,
1600
+ .k-dialog[data-dialog-type="info"] .k-dialog-title,
1601
+ .k-dialog[data-dialog-type="info"] .k-dialog-titlebar:before {
1602
+ background-color: var(--backgroundColor30, #546270);
1603
+ color: var(--colorCalm40, #44e1d8);
1604
+ border: none;
1605
+ margin: auto;
1606
+ margin-top: 20px;
1607
+ white-space: break-spaces;
1608
+ text-align: center;
1609
+ }
1610
+
1611
+ .k-dialog[data-dialog-type="error"] .k-dialog-titlebar,
1612
+ .k-dialog[data-dialog-type="error"] .k-dialog-title,
1613
+ .k-dialog[data-dialog-type="error"] .k-dialog-titlebar:before {
1614
+ background-color: var(--backgroundColor30, #546270);
1615
+ color: var(--colorDanger40, #f03a3a);
1616
+ border: none;
1617
+ margin: auto;
1618
+ margin-top: 20px;
1619
+ white-space: break-spaces;
1620
+ text-align: center;
1621
+ }
1622
+
1623
+ .k-dialog[data-dialog-type="warning"] .k-dialog-titlebar,
1624
+ .k-dialog[data-dialog-type="warning"] .k-dialog-title,
1625
+ .k-dialog[data-dialog-type="warning"] .k-dialog-titlebar:before {
1626
+ background-color: var(--backgroundColor30, #546270);
1627
+ color: var(--colorWarning40, #f58d11);
1628
+ border: none;
1629
+ margin: auto;
1630
+ margin-top: 20px;
1631
+ white-space: break-spaces;
1632
+ text-align: center;
1633
+ }
1634
+
1635
+ .k-button.k-primary:hover {
1636
+ background: var(--colorSuccess60, #22b920);
1637
+ border-radius: 30px;
1638
+ border: none;
1639
+ }
1640
+
1641
+ .k-button.k-primary:active {
1642
+ background: var(--colorSuccess70, #108d0d);
1643
+ border-radius: 30px;
1644
+ border: none;
1645
+ }
1646
+
1647
+ .k-window {
1648
+ background: var(--backgroundColor30, #546270);
1649
+ border-radius: 30px;
1650
+ border: none;
1651
+ margin-top: 20px;
1652
+ }
1653
+
1654
+ .k-window-content {
1655
+ background: var(--backgroundColor30, #546270);
1656
+ border-radius: 30px;
1657
+ border: none;
1658
+ }
1659
+
1660
+
1661
+ .k-dialog-button-layout-stretched .k-primary:not(:hover):not(.k-state-hover):not(:active):not(.k-state-active) {
1662
+ color: var(--textColorSuccess40, #f0f0f0);
1663
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%) !important;
1664
+ border-radius: 20px;
1665
+ }
1666
+
1667
+ .k-dialog-button-layout-stretched .k-button:not(:hover):not(.k-state-hover):not(:active):not(.k-state-active) {
1668
+ color: var(--textColorDanger40, #f0f0f0);
1669
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
1670
+ border-radius: 20px;
1671
+ margin: 3px;
1672
+ }
1673
+
1674
+ .k-dialog-buttongroup .k-button {
1675
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%) !important;
1676
+ }
1677
+
1678
+ .k-dialog-button-layout-stretched .k-button.k-button {
1679
+ margin: 0;
1680
+ border-left-width: 1px;
1681
+ border-radius: 20px;
1682
+ color: var(--textColorDanger40, #f0f0f0);
1683
+ box-shadow: 0px 0px 3px 0px #de3636;
1684
+ }
1685
+
1686
+ .k-dialog-button-layout-stretched .k-button.k-primary:hover {
1687
+ color: var(--textColorSuccess40, #f0f0f0);
1688
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108d0d) 100%) !important;
1689
+ box-shadow: 0px 0px 3px 0px #2ffc2b;
1075
1690
  }