cronapp-framework-js 2.9.6-SP.39 → 2.9.6-SP.40

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.
@@ -11,11 +11,13 @@
11
11
  /* Font */
12
12
  --fontFamily: "Raleway", "Arial", sans-serif;
13
13
  --textColor: #f0f0f0;
14
+ --textColorTexts: #14202A;
14
15
  --backgroundColor: #090f13;
15
16
 
16
17
  --textSmallSize: 10px;
17
18
  --textNormalSize: 12px;
18
19
  --textMediumSize: 16px;
20
+ --textSmallTitle: 18px;
19
21
  --textBigSize: 22px;
20
22
  --textExtraBigSize: 28px;
21
23
  --textFullSize: 34px;
@@ -43,7 +45,7 @@
43
45
  --menuItemIconWidth: 25px;
44
46
 
45
47
  /* Background */
46
- --backgroundColor10: #CED0D2;
48
+ --backgroundColor10: #f0f0f0;
47
49
  --backgroundColor20: #a3a3a3;
48
50
  --backgroundColor30: #546270;
49
51
  --backgroundColor40: #090f13;
@@ -207,6 +209,7 @@
207
209
  --textColorLight50: #f4f4f4;
208
210
  --textColorLight60: #f7f7f7;
209
211
  --textColorLight70: #fbfbfb;
212
+
210
213
  /* Color - Stable (mobile) */
211
214
  --colorStable10: #e1e1e1;
212
215
  --colorStable20: #c6c6c6;
@@ -267,17 +270,17 @@
267
270
  /* === Variables used exclusively in the color palette property === */
268
271
 
269
272
  /* Components - Button */
270
- --btnDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
271
- --btnPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
272
- --btnSuccess: linear-gradient(180deg, #2FFC2B 0%, #0E890B 100%);
273
- --btnCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
274
- --btnWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
275
- --btnDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
276
- --btnLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
273
+ --btnDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
274
+ --btnPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
275
+ --btnSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
276
+ --btnCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
277
+ --btnWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
278
+ --btnDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
279
+ --btnLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
277
280
  --btnLink: var(--colorCalm60, #2fc2ba);
278
- --btnStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
279
- --btnRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
280
- --btnDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
281
+ --btnStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
282
+ --btnRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
283
+ --btnDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
281
284
 
282
285
  --textColorDefault: var(--textColorDefault40, #f0f0f0);
283
286
  --textColorPrimary: var(--textColorPrimary40, #f0f0f0);
@@ -303,28 +306,28 @@
303
306
  --borderBtnDark: transparent;
304
307
 
305
308
  /* Components - Text color */
306
- --colorDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
307
- --colorPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
308
- --colorSuccess: linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%);
309
- --colorCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
310
- --colorWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
311
- --colorDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
312
- --colorLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
313
- --colorStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
314
- --colorRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
315
- --colorDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
309
+ --colorDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
310
+ --colorPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
311
+ --colorSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
312
+ --colorCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
313
+ --colorWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
314
+ --colorDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
315
+ --colorLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
316
+ --colorStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
317
+ --colorRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
318
+ --colorDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
316
319
 
317
320
  /* Components - Checkbox */
318
- --checkboxDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
319
- --checkboxPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
320
- --checkboxSuccess: linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%);
321
- --checkboxCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
322
- --checkboxWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
323
- --checkboxDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
324
- --checkboxLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
325
- --checkboxStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
326
- --checkboxRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
327
- --checkboxDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
321
+ --checkboxDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
322
+ --checkboxPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
323
+ --checkboxSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
324
+ --checkboxCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
325
+ --checkboxWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
326
+ --checkboxDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
327
+ --checkboxLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
328
+ --checkboxStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
329
+ --checkboxRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
330
+ --checkboxDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
328
331
 
329
332
  --borderCheckboxDefault: transparent;
330
333
  --borderCheckboxPrimary: transparent;
@@ -338,39 +341,39 @@
338
341
  --borderCheckboxDark: transparent;
339
342
 
340
343
  /* Components - Combobox */
341
- --comboboxDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
342
- --comboboxPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
343
- --comboboxSuccess: linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%);
344
- --comboboxCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
345
- --comboboxWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
346
- --comboboxDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
347
- --comboboxLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
348
- --comboboxStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
349
- --comboboxRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
350
- --comboboxDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
351
-
352
- --borderComboboxDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
353
- --borderComboboxPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
354
- --borderComboboxSuccess: linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%);
355
- --borderComboboxCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
356
- --borderComboboxWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
357
- --borderComboboxDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
358
- --borderComboboxLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
359
- --borderComboboxStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
360
- --borderComboboxRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
361
- --borderComboboxDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
344
+ --comboboxDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
345
+ --comboboxPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
346
+ --comboboxSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
347
+ --comboboxCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
348
+ --comboboxWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
349
+ --comboboxDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
350
+ --comboboxLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
351
+ --comboboxStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
352
+ --comboboxRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
353
+ --comboboxDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
354
+
355
+ --borderComboboxDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
356
+ --borderComboboxPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
357
+ --borderComboboxSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
358
+ --borderComboboxCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
359
+ --borderComboboxWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
360
+ --borderComboboxDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
361
+ --borderComboboxLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
362
+ --borderComboboxStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
363
+ --borderComboboxRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
364
+ --borderComboboxDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
362
365
 
363
366
  /* Components - Radio input */
364
- --optionDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
365
- --optionPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
366
- --optionSuccess: linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%);
367
- --optionCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
368
- --optionWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
369
- --optionDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
370
- --optionLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
371
- --optionStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
372
- --optionRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
373
- --optionDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
367
+ --optionDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
368
+ --optionPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
369
+ --optionSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
370
+ --optionCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
371
+ --optionWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
372
+ --optionDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
373
+ --optionLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
374
+ --optionStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
375
+ --optionRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
376
+ --optionDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
374
377
 
375
378
  --borderOptionDefault: transparent;
376
379
  --borderOptionPrimary: transparent;
@@ -384,16 +387,16 @@
384
387
  --borderOptionDark: transparent;
385
388
 
386
389
  /* Components - Panel */
387
- --panelDefault: linear-gradient(180deg, #262C32 0%, #2D3843 100%);
388
- --panelPrimary: linear-gradient(180deg, #197FDD 0%, #08427A 100%);
389
- --panelSuccess: linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%);
390
- --panelCalm: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
391
- --panelWarning: linear-gradient(180deg, #F58D11 0%, #B36305 100%);
392
- --panelDanger: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
393
- --panelLight: linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%);
394
- --panelStable: linear-gradient(180deg, #818181 0%, #3E3E3E 100%);
395
- --panelRoyal: linear-gradient(180deg, #0E3760 0%, #2D3843 100%);
396
- --panelDark: linear-gradient(180deg, #000000 0%, #0F1E2E 100%);
390
+ --panelDefault: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
391
+ --panelPrimary: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
392
+ --panelSuccess: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
393
+ --panelCalm: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
394
+ --panelWarning: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
395
+ --panelDanger: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
396
+ --panelLight: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
397
+ --panelStable: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
398
+ --panelRoyal: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
399
+ --panelDark: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
397
400
 
398
401
  --borderPanelDefault: transparent;
399
402
  --borderPanelPrimary: transparent;
@@ -453,6 +456,38 @@ textarea.k-textbox:hover {
453
456
  margin: 0;
454
457
  }
455
458
 
459
+ h1,
460
+ h2,
461
+ h3,
462
+ h4,
463
+ h5,
464
+ h6,
465
+ .h1,
466
+ .h2,
467
+ .h3,
468
+ .h4,
469
+ .h5,
470
+ .h6 {
471
+ font-family: var(--fontFamily, "Open Sans", "Arial", sans-serif);
472
+ color: var(--textColor40, #f0f0f0);
473
+ }
474
+
475
+ .h1 {
476
+ font-size: var(--textFullSize, 36px);
477
+ }
478
+
479
+ .h3 {
480
+ font-size: var(--textMediumSize, 24px);
481
+ }
482
+
483
+ .h5 {
484
+ font-size: var(--textSmallTitle, 18px);
485
+ }
486
+
487
+ .h5 {
488
+ font-size: var(--textSmallSize, 10px);
489
+ }
490
+
456
491
  .cardinput {
457
492
  padding: 0;
458
493
  }
@@ -519,12 +554,12 @@ div[data-component^='crn-textinputicon'] .k-button {
519
554
 
520
555
  .bootstrap-datetimepicker-widget table td.active,
521
556
  .bootstrap-datetimepicker-widget table td.active:hover {
522
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
557
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
523
558
  color: var(--textColor40, #f0f0f0);
524
559
  }
525
560
 
526
561
  .table-condensed>thead>tr>th {
527
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
562
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
528
563
  color: var(--textColorDefault40, #f0f0f0);
529
564
  font-weight: 400;
530
565
  text-transform: capitalize;
@@ -586,38 +621,43 @@ input .k-textbox {
586
621
  #crn-botao-cadastre {
587
622
  color: var(--textColorDefault40, #f0f0f0);
588
623
  display: block;
624
+ min-width: 600px;
625
+ margin-bottom: 10px;
589
626
  }
590
627
 
591
- .login-view .btn-block {
592
- width: 136px;
593
- margin: auto;
594
- display: block;
595
- border-radius: 30px;
596
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
628
+ #crn-botao-cadastre:hover,
629
+ .login-view .sign-up:hover {
630
+ color: var(--colorDefault50, #252E36);
597
631
  }
598
632
 
599
- .k-button,
600
- .btn {
601
- border: none;
633
+ div[data-component="crn-button"] {
634
+ margin-bottom: 10px;
635
+ min-width: 600px;
602
636
  }
603
637
 
604
- .k-button:focus,
605
- .k-button:focus:hover,
606
- .k-button:focus,
607
- .k-button:hover {
608
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
609
- box-shadow: 0px 0px 3px #187AD4;
638
+ .center-block {
639
+ display: block;
640
+ margin-right: auto;
641
+ margin-left: auto;
642
+ min-width: 600px;
610
643
  }
611
644
 
612
645
  /* Combo Botões*/
646
+ .k-button,
647
+ .btn {
648
+ border-radius: 30px;
649
+ border-bottom: unset;
650
+ border-top: unset;
651
+ }
652
+
613
653
  .btn.btn-default {
614
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
654
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
615
655
  }
616
656
 
617
657
  .btn.btn-default:focus,
618
658
  .btn.btn-default:hover {
659
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
619
660
  box-shadow: 0px 0px 3px #3A4753;
620
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
621
661
  }
622
662
 
623
663
  .btn.btn-default:active {
@@ -626,12 +666,12 @@ input .k-textbox {
626
666
  }
627
667
 
628
668
  .btn.btn-primary {
629
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
669
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
630
670
  }
631
671
 
632
672
  .btn.btn-primary:focus,
633
673
  .btn.btn-primary:hover {
634
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
674
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
635
675
  box-shadow: 0px 0px 3px #187AD4;
636
676
  }
637
677
 
@@ -641,28 +681,30 @@ input .k-textbox {
641
681
  }
642
682
 
643
683
  .btn.btn-success {
644
- background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
684
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
645
685
  }
646
686
 
647
687
  .btn.btn-success:focus,
648
688
  .btn.btn-success:hover {
649
- background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
689
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
650
690
  box-shadow: 0px 0px 3px #2FFC2B;
651
691
  }
652
692
 
653
693
  .btn.btn-success:active {
654
694
  background: var(--colorSuccess70, #108D0D);
655
695
  box-shadow: none;
656
-
657
696
  }
658
697
 
659
698
  .btn.btn-info {
660
- background: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
699
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
700
+ border-color: var(--colorCalm50, #00ABC2);
701
+ border: 1px;
702
+ border-radius: 30px;
661
703
  }
662
704
 
663
705
  .btn.btn-info:focus,
664
706
  .btn.btn-info:hover {
665
- background: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
707
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
666
708
  box-shadow: 0px 0px 3px #42DCD3;
667
709
  }
668
710
 
@@ -672,12 +714,12 @@ input .k-textbox {
672
714
  }
673
715
 
674
716
  .btn.btn-warning {
675
- background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
717
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
676
718
  }
677
719
 
678
720
  .btn.btn-warning:focus,
679
721
  .btn.btn-warning:hover {
680
- background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
722
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
681
723
  box-shadow: 0px 0px 3px #F58D11;
682
724
  }
683
725
 
@@ -687,12 +729,12 @@ input .k-textbox {
687
729
  }
688
730
 
689
731
  .btn.btn-danger {
690
- background: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
732
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
691
733
  }
692
734
 
693
735
  .btn.btn-danger:focus,
694
736
  .btn.btn-danger:hover {
695
- background: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
737
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
696
738
  box-shadow: 0px 0px 3px #DE3636;
697
739
  }
698
740
 
@@ -702,12 +744,12 @@ input .k-textbox {
702
744
  }
703
745
 
704
746
  .btn.btn-light {
705
- background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
747
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
706
748
  }
707
749
 
708
750
  .btn.btn-light:focus,
709
751
  .btn.btn-light:hover {
710
- background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
752
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
711
753
  box-shadow: 0px 0px 3px #8DA0B2;
712
754
  border: none;
713
755
  }
@@ -717,6 +759,11 @@ input .k-textbox {
717
759
  box-shadow: none;
718
760
  }
719
761
 
762
+ .btn.btn-link {
763
+ background: transparent;
764
+ border: solid 1px var(--colorCalm50, #00ABC2);
765
+ }
766
+
720
767
  .btn.btn-link span {
721
768
  color: var(--colorCalm50, #00ABC2);
722
769
  }
@@ -730,12 +777,12 @@ input .k-textbox {
730
777
  }
731
778
 
732
779
  .btn.btn-stable {
733
- background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
780
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
734
781
  }
735
782
 
736
783
  .btn.btn-stable:focus,
737
784
  .btn.btn-stable:hover {
738
- background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
785
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
739
786
  box-shadow: 0px 0px 3px #7B7B7B;
740
787
  }
741
788
 
@@ -755,12 +802,12 @@ input .k-textbox {
755
802
  }
756
803
 
757
804
  .btn.btn-royal {
758
- background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
805
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
759
806
  }
760
807
 
761
808
  .btn.btn-royal:focus,
762
809
  .btn.btn-royal:hover {
763
- background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
810
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
764
811
  box-shadow: 0px 0px 3px #11375D;
765
812
  }
766
813
 
@@ -770,12 +817,12 @@ input .k-textbox {
770
817
  }
771
818
 
772
819
  .btn.btn-dark {
773
- background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
820
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
774
821
  }
775
822
 
776
823
  .btn.btn-dark:focus,
777
824
  .btn.btn-dark:hover {
778
- background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
825
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
779
826
  box-shadow: 0px 0px 3px #132639;
780
827
  }
781
828
 
@@ -786,11 +833,34 @@ input .k-textbox {
786
833
 
787
834
  .privacy-view .dialog-cookies button {
788
835
  color: var(--textColor40, #f0f0f0);
789
- background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
836
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
837
+ }
838
+
839
+ /*Login*/
840
+ .login-view .btn-block {
841
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
842
+ width: 136px;
843
+ margin: auto;
844
+ display: block;
845
+ border-radius: 30px;
846
+ border: unset;
847
+ }
848
+
849
+ .login-view .btn-block:hover {
850
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
851
+ box-shadow: 0px 0px 3px #187AD4;
852
+ }
853
+
854
+ .login-view .btn-block:active,
855
+ .login-view .btn-block:focus {
856
+ background: var(--colorPrimary70, #09467F);
790
857
  }
791
858
 
792
859
  .login-view .reset-password {
793
- text-align: right;
860
+ text-align: end;
861
+ width: 100%;
862
+ max-width: 600px;
863
+ right: 10px;
794
864
  }
795
865
 
796
866
  .login-view input.k-textbox {
@@ -834,23 +904,20 @@ textarea.k-textbox {
834
904
  }
835
905
 
836
906
  .crn-textinputbutton-button button .btn.btn-defaul {
837
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
838
- }
839
-
840
- .navbar-brand>img {
841
- filter: brightness(0) invert(1);
907
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
842
908
  }
843
909
 
844
910
  .dynamic-image-container {
845
911
  width: 50%;
912
+ text-align: center;
846
913
  }
847
914
 
848
915
  .dynamic-image-container .btn {
849
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
916
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
850
917
  }
851
918
 
852
919
  .dynamic-image-container .btn:hover {
853
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
920
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
854
921
  box-shadow: 0px 0px 3px #187AD4;
855
922
  }
856
923
 
@@ -860,15 +927,14 @@ textarea.k-textbox {
860
927
  }
861
928
 
862
929
  /*Combobox Buttons*/
863
-
864
930
  .k-multiselect .k-button,
865
931
  .combobox-default .k-multiselect .k-button {
866
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
932
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
867
933
  border-color: none;
868
934
  }
869
935
 
870
936
  .combobox-default .k-multiselect-wrap .k-button:hover {
871
- background: var(--colorDefault, linear-gradient(180deg, #262C32 0%, #2D3843 100%));
937
+ background: linear-gradient(180deg, var(--colorDefault40, #262c32) 0%, var(--colorDefault70, #15181b) 100%);
872
938
  box-shadow: 0px 0px 3px #3A4753;
873
939
  }
874
940
 
@@ -879,11 +945,11 @@ textarea.k-textbox {
879
945
  }
880
946
 
881
947
  .combobox-primary .k-multiselect .k-button {
882
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
948
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
883
949
  }
884
950
 
885
951
  .combobox-primary .k-multiselect-wrap .k-button:hover {
886
- background: var(--colorPrimary, linear-gradient(180deg, #197FDD 0%, #08427A 100%));
952
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
887
953
  box-shadow: 0px 0px 3px #187AD4;
888
954
  }
889
955
 
@@ -893,11 +959,11 @@ textarea.k-textbox {
893
959
  }
894
960
 
895
961
  .combobox-success .k-multiselect .k-button {
896
- background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
962
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
897
963
  }
898
964
 
899
965
  .combobox-success .k-multiselect-wrap .k-button:hover {
900
- background: var(--colorSuccess, linear-gradient(180deg, #0EDA0A 0%, #0D840A 100%));
966
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
901
967
  box-shadow: 0px 0px 3px #2FFC2B;
902
968
  }
903
969
 
@@ -908,11 +974,11 @@ textarea.k-textbox {
908
974
  }
909
975
 
910
976
  .combobox-info .k-multiselect .k-button {
911
- background: linear-gradient(180deg, #44E1D8 0%, #25968F 100%);
977
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
912
978
  }
913
979
 
914
980
  .combobox-info .k-multiselect-wrap .k-button:hover {
915
- background: var(--colorCalm, linear-gradient(180deg, #44E1D8 0%, #25968F 100%));
981
+ background: linear-gradient(180deg, var(--colorCalm40, #44e1d8) 0%, var(--colorCalm70, #077988) 100%);
916
982
  box-shadow: 0px 0px 3px #42DCD3;
917
983
  }
918
984
 
@@ -922,11 +988,11 @@ textarea.k-textbox {
922
988
  }
923
989
 
924
990
  .combobox-warning .k-multiselect .k-button {
925
- background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
991
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
926
992
  }
927
993
 
928
994
  .combobox-warning .k-multiselect-wrap .k-button:hover {
929
- background: var(--colorWarning, linear-gradient(180deg, #F58D11 0%, #B36305 100%));
995
+ background: linear-gradient(180deg, var(--colorWarning40, #f58d11) 0%, var(--colorWarning70, #864d09) 100%);
930
996
  box-shadow: 0px 0px 3px #F58D11;
931
997
  }
932
998
 
@@ -936,11 +1002,11 @@ textarea.k-textbox {
936
1002
  }
937
1003
 
938
1004
  .combobox-danger .k-multiselect .k-button {
939
- background: linear-gradient(180deg, #F03A3A 0%, #7E2121 100%);
1005
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
940
1006
  }
941
1007
 
942
1008
  .combobox-danger .k-multiselect-wrap .k-button:hover {
943
- background: var(--colorDanger, linear-gradient(180deg, #F03A3A 0%, #7E2121 100%));
1009
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
944
1010
  box-shadow: 0px 0px 3px #DE3636;
945
1011
  }
946
1012
 
@@ -950,11 +1016,11 @@ textarea.k-textbox {
950
1016
  }
951
1017
 
952
1018
  .combobox-light .k-multiselect .k-button {
953
- background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
1019
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
954
1020
  }
955
1021
 
956
1022
  .combobox-light .k-multiselect-wrap .k-button:hover {
957
- background: var(--colorLight, linear-gradient(180deg, #8DA0B3 0%, #2D3843 100%));
1023
+ background: linear-gradient(180deg, var(--colorLight40, #8da0b2) 0%, var(--colorLight70, #4d5861) 100%);
958
1024
  box-shadow: 0px 0px 3px #8DA0B2;
959
1025
  }
960
1026
 
@@ -964,11 +1030,11 @@ textarea.k-textbox {
964
1030
  }
965
1031
 
966
1032
  .combobox-stable .k-multiselect .k-button {
967
- background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
1033
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
968
1034
  }
969
1035
 
970
1036
  .combobox-stable .k-multiselect-wrap .k-button:hover {
971
- background: var(--colorStable, linear-gradient(180deg, #818181 0%, #3E3E3E 100%));
1037
+ background: linear-gradient(180deg, var(--colorStable40, #818181) 0%, var(--colorStable70, #3e4042) 100%);
972
1038
  box-shadow: 0px 0px 3px #7B7B7B;
973
1039
  }
974
1040
 
@@ -978,11 +1044,11 @@ textarea.k-textbox {
978
1044
  }
979
1045
 
980
1046
  .combobox-royal .k-multiselect .k-button {
981
- background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
1047
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
982
1048
  }
983
1049
 
984
1050
  .combobox-royal .k-multiselect-wrap .k-button:hover {
985
- background: var(--colorRoyal, linear-gradient(180deg, #0E3760 0%, #2D3843 100%));
1051
+ background: linear-gradient(180deg, var(--colorRoyal40, #0e3760) 0%, var(--colorRoyal70, #1A2E43) 100%);
986
1052
  box-shadow: 0px 0px 3px #11375D;
987
1053
  }
988
1054
 
@@ -991,11 +1057,11 @@ textarea.k-textbox {
991
1057
  }
992
1058
 
993
1059
  .combobox-dark .k-multiselect .k-button {
994
- background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
1060
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
995
1061
  }
996
1062
 
997
1063
  .combobox-dark .k-multiselect-wrap .k-button:hover {
998
- background: var(--colorDark, linear-gradient(180deg, #000000 0%, #0F1E2E 100%));
1064
+ background: linear-gradient(180deg, var(--colorDark40, #000000) 0%, var(--colorDark70, #0F1E2E) 100%);
999
1065
  box-shadow: 0px 0px 3px #132639;
1000
1066
  }
1001
1067
 
@@ -1025,9 +1091,8 @@ textarea.k-textbox {
1025
1091
 
1026
1092
 
1027
1093
  /* Colors*/
1028
-
1029
1094
  .color-default {
1030
- color: var(--textColor40, #f0f0f0);
1095
+ color: var(--colorDefault40, #262c32);
1031
1096
  }
1032
1097
 
1033
1098
  .color-default:focus,
@@ -1099,7 +1164,7 @@ textarea.k-textbox {
1099
1164
  }
1100
1165
 
1101
1166
  .color-royal {
1102
- color: var(--colorRoyal20, #5487bd);
1167
+ color: var(--colorRoyal40, #0e3760);
1103
1168
  }
1104
1169
 
1105
1170
  .color-royal:focus,
@@ -1108,7 +1173,7 @@ textarea.k-textbox {
1108
1173
  }
1109
1174
 
1110
1175
  .color-dark {
1111
- color: var(--colorDark20, #999999);
1176
+ color: var(--colorDark40, #000000);
1112
1177
  }
1113
1178
 
1114
1179
  .color-dark:focus,
@@ -1121,8 +1186,7 @@ table:hover {
1121
1186
  color: var(--textColor70, #838383);
1122
1187
  }
1123
1188
 
1124
- .ctn-tab .nav-tabs li.active a,
1125
- {
1189
+ .ctn-tab .nav-tabs li.active a {
1126
1190
  color: var(--colorDefault30, #808183);
1127
1191
  }
1128
1192
 
@@ -1134,4 +1198,461 @@ table:hover {
1134
1198
 
1135
1199
  .option-dark .k-radio:checked+.k-radio-label:before {
1136
1200
  border-color: var(--colorStable70, #3e4042);
1201
+ }
1202
+
1203
+ .k-radio-label:before {
1204
+ content: "";
1205
+ position: absolute;
1206
+ top: 0;
1207
+ left: 0;
1208
+ width: 14px;
1209
+ height: 14px;
1210
+ border: 0.3px solid;
1211
+ }
1212
+
1213
+ .k-radio:checked+.k-radio-label:after {
1214
+ content: "";
1215
+ position: absolute;
1216
+ top: 2px;
1217
+ left: 2px;
1218
+ }
1219
+
1220
+ /*Button form*/
1221
+ button.btn.k-button.btn-block.btn-default.btn-fab {
1222
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1223
+ color: var(--textColorPrimary40, #f0f0f0);
1224
+ }
1225
+
1226
+ btn k-button btn-block btn-default btn-fab {
1227
+ background: linear-gradient(180deg, var(--colorSuccess40, #2ffc2b) 0%, var(--colorSuccess70, #108D0D) 100%);
1228
+ }
1229
+
1230
+ /*Checkbox*/
1231
+ /*Default*/
1232
+ .checkbox-default .k-checkbox:checked+.k-checkbox-label:before {
1233
+ background: var(--colorDefault40, #262c32);
1234
+ color: var(--textColorDefault40, #f0f0f0);
1235
+ }
1236
+
1237
+ /*Primary*/
1238
+ .checkbox-primary .k-checkbox:checked+.k-checkbox-label:before {
1239
+ background: var(--colorPrimary40, #197fdd);
1240
+ color: var(--textColorPrimary40, #f0f0f0);
1241
+ }
1242
+
1243
+ /*Success*/
1244
+ .checkbox-success .k-checkbox:checked+.k-checkbox-label:before {
1245
+ background: var(--colorSuccess40, #2ffc2b);
1246
+ color: var(--textColorSuccess40, #f0f0f0);
1247
+ }
1248
+
1249
+ /*Info*/
1250
+ .checkbox-info .k-checkbox:checked+.k-checkbox-label:before {
1251
+ background: var(--colorCalm40, #44e1d8);
1252
+ color: var(--textColorCalm40, #f0f0f0);
1253
+ }
1254
+
1255
+ /*Warning*/
1256
+ .checkbox-warning .k-checkbox:checked+.k-checkbox-label:before {
1257
+ background: var(--colorWarning40, #f58d11);
1258
+ color: var(--textColorWarning40, #f0f0f0);
1259
+ }
1260
+
1261
+ /*Danger*/
1262
+ .checkbox-danger .k-checkbox:checked+.k-checkbox-label:before {
1263
+ background: var(--colorDanger40, #f03a3a);
1264
+ color: var(--textColorDanger40, #f0f0f0);
1265
+ }
1266
+
1267
+ /*Light*/
1268
+ .checkbox-light .k-checkbox:checked+.k-checkbox-label:before {
1269
+ background: var(--colorLight40, #8da0b2);
1270
+ color: var(--textColorLight40, #f0f0f0);
1271
+ }
1272
+
1273
+ /*Stable*/
1274
+ .checkbox-stable .k-checkbox:checked+.k-checkbox-label:before {
1275
+ background: var(--colorStable40, #818181);
1276
+ color: var(--textColorStable40, #f0f0f0);
1277
+ }
1278
+
1279
+ /*Royal*/
1280
+ .checkbox-royal .k-checkbox:checked+.k-checkbox-label:before {
1281
+ background: var(--colorRoyal40, #0e3760);
1282
+ color: var(--textColorRoyal40, #ffffff);
1283
+ }
1284
+
1285
+ /*Dark*/
1286
+ .checkbox-dark .k-checkbox:checked+.k-checkbox-label:before {
1287
+ background: var(--colorDark40, #000000);
1288
+ color: var(--textColorDark40, #f0f0f0);
1289
+ }
1290
+ /* ---End variables checkbox--- */
1291
+
1292
+ /*Agendador*/
1293
+ .k-scheduler>.k-scheduler-toolbar:first-child {
1294
+ border-radius: 20px;
1295
+ background: var(--backgroundColor30, #546270);
1296
+ margin-top: 20px;
1297
+ margin-left: 20px;
1298
+ margin-right: 20px;
1299
+ }
1300
+
1301
+ .k-scheduler-navigation .k-nav-prev .k-link {
1302
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1303
+ color: var(--textColorPrimary40, #f0f0f0);
1304
+ }
1305
+
1306
+ .k-header {
1307
+ border: unset;
1308
+ }
1309
+
1310
+ .k-reset.k-header,
1311
+ .k-header.k-scheduler-footer {
1312
+ background: var(--backgroundColor30, #546270);
1313
+ }
1314
+
1315
+ .k-scheduler div.k-scheduler-footer .k-link {
1316
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1317
+ color: var(--textColorPrimary40, #f0f0f0);
1318
+ border-radius: 20px;
1319
+ border-color: transparent;
1320
+ border: unset;
1321
+ margin-top: 10px;
1322
+ margin-bottom: 10px;
1323
+ margin-left: 20px;
1324
+ }
1325
+
1326
+ .k-scheduler div.k-scheduler-footer .k-link:hover {
1327
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1328
+ box-shadow: 0px 0px 3px 0px #187AD4;
1329
+ }
1330
+
1331
+ .k-scheduler div.k-scheduler-footer .k-link:active {
1332
+ background: var(--colorPrimary70, #09467F);
1333
+ }
1334
+
1335
+ .k-scheduler div.k-scheduler-footer ul li {
1336
+ background: transparent;
1337
+ border: unset;
1338
+ }
1339
+
1340
+ .k-scheduler div.k-scheduler-footer ul li:hover {
1341
+ background: transparent;
1342
+ border: unset;
1343
+ }
1344
+
1345
+ .k-scheduler-table td {
1346
+ background: var(--backgroundColor10, #f0f0f0);
1347
+ color: var(--textColorTexts, #14202A);
1348
+ border-color: var(--backgroundColor30, #546270);
1349
+ }
1350
+
1351
+ .k-widget {
1352
+ background: var(--backgroundColor30, #546270);
1353
+ color: var(--textColorTexts, #14202A);
1354
+ border-color: unset;
1355
+ padding: 30px;
1356
+ }
1357
+
1358
+ .k-scheduler-toolbar .k-link,
1359
+ cron-scheduler a.k-link,
1360
+ cron-scheduler .k-link:link {
1361
+ background: var(--backgroundColor10, #f0f0f0);
1362
+ color: var(--textColorTexts, #14202A);
1363
+ display: inline-block;
1364
+ padding: 0.16666em 1.1em;
1365
+ border: unset;
1366
+ }
1367
+
1368
+ .k-scheduler-footer>ul>li,
1369
+ .k-scheduler-toolbar>ul>li {
1370
+ display: inline-block;
1371
+ border-style: solid;
1372
+ border-color: var(--backgroundColor30, #546270);
1373
+ border-width: 1px 1px 1px 0;
1374
+ }
1375
+
1376
+ .k-scheduler .k-state-selected>.k-link {
1377
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1378
+ color: var(--textColorPrimary40, #f0f0f0);
1379
+ border-color: unset !important;
1380
+ border: unset;
1381
+ }
1382
+
1383
+ .k-scheduler-times th {
1384
+ color: var(--textColorTexts, #14202A) !important;
1385
+ background: var(--backgroundColor10, #f0f0f0);
1386
+ }
1387
+
1388
+ k-scheduler-table td:first-child {
1389
+ background: var(--backgroundColor10, #f0f0f0);
1390
+ }
1391
+
1392
+ .k-scheduler-toolbar .k-nav-current .k-lg-date-format,
1393
+ .k-scheduler-toolbar .k-nav-current .k-link {
1394
+ display: inline-block;
1395
+ background: var(--backgroundColor30, #546270);
1396
+ color: var(--textColorDefault40, #f0f0f0);
1397
+ }
1398
+
1399
+ .k-scheduler .k-scheduler-header th,
1400
+ .k-scheduler-header {
1401
+ background: var(--backgroundColor10, #f0f0f0);
1402
+ color: var(--textColorTexts, #14202A);
1403
+ }
1404
+
1405
+ .k-scheduler-navigation .k-nav-prev .k-link:hover {
1406
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1407
+ color: var(--textColorPrimary40, #f0f0f0);
1408
+ box-shadow: 0px 0px 3px 0px #187AD4;
1409
+ }
1410
+
1411
+ /*Agendar Evento*/
1412
+ .k-window .k-window-titlebar.k-header {
1413
+ background: var(--backgroundColor30, #546270);
1414
+ color: var(--textColorDefault40, #f0f0f0);
1415
+ justify-content: center;
1416
+ border-bottom: 1px solid #f0f0f0;
1417
+ font-weight: 700;
1418
+ }
1419
+
1420
+ .k-window-titlebar {
1421
+ padding: 25px 16px;
1422
+ text-align: center;
1423
+ }
1424
+
1425
+ .k-window-titlebar .k-window-action {
1426
+ opacity: 1;
1427
+ position: initial;
1428
+ margin-top: 10px;
1429
+ margin-right: 10px;
1430
+ }
1431
+
1432
+ div.k-window-content {
1433
+ color: var(--textColorDefault40, #f0f0f0);
1434
+ }
1435
+
1436
+ .k-scheduler-edit-form .k-textbox[name=title],
1437
+ .k-scheduler-edit-form .k-textbox[name=title]:focus:hover {
1438
+ width: 100%;
1439
+ background: transparent;
1440
+ color: var(--textColorDefault40, #f0f0f0);
1441
+ border-bottom: 1px solid #f0f0f0;
1442
+ border-radius: 0;
1443
+ border-top: transparent;
1444
+ border-right: transparent;
1445
+ border-left: transparent;
1446
+ }
1447
+
1448
+ .k-scheduler-edit-form textarea.k-textbox {
1449
+ min-height: 4em;
1450
+ resize: vertical;
1451
+ border-bottom: 1px solid #f0f0f0;
1452
+ background: transparent;
1453
+ border-radius: 0px;
1454
+ }
1455
+
1456
+ textarea.k-textbox,
1457
+ textarea.k-textbox:hover {
1458
+ border: 0;
1459
+ border-bottom: none;
1460
+ border-radius: 20px;
1461
+ color: var(--textColorDefault40, #f0f0f0);
1462
+ background: var(--backgroundColor30, #546270);
1463
+ margin: 0;
1464
+ }
1465
+
1466
+ .k-edit-form-container .k-edit-buttons {
1467
+ background: var(--backgroundColor30, #546270);
1468
+ }
1469
+
1470
+ .k-scheduler-toolbar>ul>li {
1471
+ background: transparent;
1472
+ }
1473
+
1474
+ body .k-datetimepicker .k-select,
1475
+ .k-picker-wrap.k-state-default .k-input {
1476
+ border-radius: 0;
1477
+ background: var(--backgroundColor30, #546270);
1478
+ color: var(--textColorDefault40, #f0f0f0);
1479
+ box-shadow: unset;
1480
+ }
1481
+
1482
+ .k-picker-wrap.k-state-default .k-input:focus:hover {
1483
+ border-radius: 0;
1484
+ background: var(--backgroundColor30, #546270);
1485
+ color: var(--textColorDefault40, #f0f0f0);
1486
+ border-bottom: 1px solid #f0f0f0;
1487
+ box-shadow: unset;
1488
+ }
1489
+
1490
+ .k-dropdown-wrap .k-input,
1491
+ .k-dropdown-wrap .k-input:focus:hover {
1492
+ background: var(--backgroundColor30, #546270);
1493
+ color: var(--texColorPrimary40, #f0f0f0);
1494
+ border-radius: 0px;
1495
+ }
1496
+
1497
+ .k-state-default>.k-select {
1498
+ display: flex;
1499
+ align-items: center;
1500
+ justify-content: center;
1501
+ background: var(--backgroundColor30, #546270);
1502
+ color: var(--texColorPrimary40, #f0f0f0);
1503
+ border-radius: 0px;
1504
+ }
1505
+
1506
+ /*Button fuso evento*/
1507
+ .k-scheduler-edit-form .k-edit-field .k-button {
1508
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1509
+ color: var(--textColorPrimay40, #f0f0f0);
1510
+ border-radius: 20px;
1511
+ border: unset;
1512
+ }
1513
+
1514
+ .k-scheduler-edit-form .k-edit-field .k-button:hover {
1515
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1516
+ box-shadow: 0px 0px 3px 0px #187AD4;
1517
+ color: var(--textColorPrimay40, #f0f0f0);
1518
+ }
1519
+
1520
+ .k-scheduler-edit-form .k-edit-field .k-button:active {
1521
+ background: var(--colorPrimary70, #09467F);
1522
+ box-shadow: 0px 0px 3px 0px #187AD4;
1523
+ color: var(--textColorPrimay40, #f0f0f0);
1524
+ }
1525
+ /* ---- End Button ----*/
1526
+
1527
+ .k-i-arrow-60-down:before {
1528
+ color: var(--textColorPrimary40, #f0f0f0);
1529
+ }
1530
+
1531
+ .k-dropdown .k-state-hover .k-input {
1532
+ color: var(--textColorPrimary40, #f0f0f0);
1533
+ }
1534
+
1535
+ /* Botão salvar evento*/
1536
+ .k-edit-form-container .k-edit-buttons .k-primary {
1537
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1538
+ color: var(--textColorPrimay40, #f0f0f0);
1539
+ border-radius: 20px;
1540
+ border: unset;
1541
+ }
1542
+
1543
+ .k-edit-form-container .k-edit-buttons .k-primary:focus,
1544
+ .k-edit-form-container .k-edit-buttons .k-primary:hover {
1545
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1546
+ box-shadow: 0px 0px 3px 0px #187AD4;
1547
+ color: var(--textColorPrimay40, #f0f0f0);
1548
+ }
1549
+
1550
+ .k-edit-form-container .k-edit-buttons .k-primary:active,
1551
+ .k-edit-form-container .k-edit-buttons .k-primary:selected {
1552
+ background: var(--colorPrimary70, #09467F);
1553
+ }
1554
+
1555
+ /*Button Cancelar/Excluir Evento*/
1556
+ .k-scheduler-edit-form .k-edit-buttons .k-scheduler-delete,
1557
+ .k-edit-form-container .k-edit-buttons .k-scheduler-cancel {
1558
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
1559
+ color: var(--textColorDanger, #f0f0f0);
1560
+ border-radius: 20px;
1561
+ border: unset;
1562
+ }
1563
+
1564
+ .k-scheduler-edit-form .k-edit-buttons .k-scheduler-delete:hover,
1565
+ .k-edit-form-container .k-edit-buttons .k-scheduler-cancel:hover {
1566
+ background: linear-gradient(180deg, var(--colorDanger40, #f03a3a) 0%, var(--colorDanger70, #832020) 100%);
1567
+ box-shadow: 0px 0px 3px 0px #DE3636;
1568
+ }
1569
+
1570
+ .k-scheduler-edit-form .k-edit-buttons .k-scheduler-delete:active,
1571
+ .k-edit-form-container .k-edit-buttons .k-scheduler-cancel:active {
1572
+ background: var(--colorDanger60, #7E2121);
1573
+ }
1574
+ /* -----*/
1575
+
1576
+ .k-event {
1577
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1578
+ }
1579
+
1580
+ .k-event .k-event-actions .k-event-delete {
1581
+ background: transparent;
1582
+ }
1583
+
1584
+ /*Calendario Agendador*/
1585
+ .k-scheduler-navigation .k-i-arrow-60-right {
1586
+ color: var(--textColorTexts, #14202A);
1587
+ }
1588
+
1589
+ .k-calendar .k-link.k-nav-fast {
1590
+ background: var(--backgroundColor30, #546270);
1591
+ color: var(--textColorDefault40, #f0f0f0);
1592
+ font-weight: 700;
1593
+ }
1594
+
1595
+ .k-calendar .k-link.k-nav-fast:hover {
1596
+ margin-bottom: transparent;
1597
+ border: transparent;
1598
+ border-radius: 0px;
1599
+ }
1600
+
1601
+ .k-calendar th {
1602
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1603
+ color: var(--textColorPrimary40, #f0f0f0);
1604
+ border-bottom: transparent;
1605
+ border-radius: 4px;
1606
+ margin: 1px;
1607
+ }
1608
+
1609
+ .k-calendar .k-header {
1610
+ background: var(--backgroundColor30, #546270);
1611
+ position: relative;
1612
+ text-align: center;
1613
+ zoom: 1;
1614
+ }
1615
+
1616
+ .k-calendar .k-content th {
1617
+ text-align: right;
1618
+ border: solid 1px #546270;
1619
+ text-align: center;
1620
+ }
1621
+
1622
+ .k-calendar .k-content .k-link {
1623
+ background: var(--backgroundColor10, #f0f0f0);
1624
+ color: var(--textColorTexts, #14202A);
1625
+ display: block;
1626
+ overflow: hidden;
1627
+ min-height: 1.8333em;
1628
+ line-height: 1.8333em;
1629
+ padding: 0 0.45em 0 0.1em;
1630
+ box-shadow: unset;
1631
+ }
1632
+
1633
+ .k-calendar .k-content .k-link:hover {
1634
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1635
+ color: var(--textColorPrimary40, #f0f0f0);
1636
+ box-shadow: 0px 0px 3px 0px #187AD4;
1637
+ }
1638
+
1639
+ td.k-state-focused.k-state-selected .k-link {
1640
+ background: linear-gradient(180deg, var(--colorPrimary40, #197fdd) 0%, var(--colorPrimary70, #09467F) 100%);
1641
+ color: var(--textColorPrimary40, #f0f0f0);
1642
+ box-shadow: unset;
1643
+ }
1644
+
1645
+ .k-calendar .k-footer .k-link {
1646
+ background: var(--backgroundColor30, #546270);
1647
+ color: var(--textColorDefault40, #f0f0f0);
1648
+ border-radius: 0;
1649
+ }
1650
+
1651
+ .k-calendar .k-footer .k-link:hover {
1652
+ background: var(--backgroundColor30, #546270);
1653
+ color: var(--textColorDefault40, #f0f0f0);
1654
+ }
1655
+
1656
+ .k-widget.k-multiselect.cronMultiSelect.k-multiselect-clearable {
1657
+ background: transparent;
1137
1658
  }