Add CSS custom properties for the Client's graphic (all themes)

Signed-off-by: RD WebDesign <github@rdwebdesign.com.br>

style/themes/default-dark.css

@@ -10,6 +10,28 @@
 
 :root {
   --datatable-bgcolor: rgba(64, 76, 88, 0.8);
+
+  /* Client graph colors */
+  --graph-color1: #ee5038;
+  --graph-color2: #00a9ff;
+  --graph-color3: #00a65a;
+  --graph-color4: #90d0ff;
+  --graph-color5: #ffbb06;
+  --graph-color6: #0068c8;
+  --graph-color7: #0030ee;
+  --graph-color8: #00c8c0;
+  --graph-color9: #205849;
+  --graph-color10: #b01260;
+  --graph-color11: #ff854b;
+  --graph-color12: #01ff70;
+  --graph-color13: #f012be;
+  --graph-color14: #7812bb;
+  --graph-color15: #000810;
+  --graph-color16: #c0c6cc;
+  --graph-color17: #9c5020;
+  --graph-color18: #e6c694;
+  --graph-color19: #c080ee;
+  --graph-color20: #c800ff;
 }
 
 /* fix #2554: browser not detecting dark mode */

style/themes/default-darker.css

@@ -109,6 +109,28 @@ select:-webkit-autofill {
   --darkreader-selection-background: #004daa;
   --darkreader-selection-text: #e8e6e3;
   --datatable-bgcolor: rgb(35, 47, 52);
+
+  /* Client graph colors */
+  --graph-color1: #ee5038;
+  --graph-color2: #00a9ff;
+  --graph-color3: #00a65a;
+  --graph-color4: #90d0ff;
+  --graph-color5: #ffbb06;
+  --graph-color6: #0068c8;
+  --graph-color7: #0030ee;
+  --graph-color8: #00c8c0;
+  --graph-color9: #205849;
+  --graph-color10: #b01260;
+  --graph-color11: #ff854b;
+  --graph-color12: #01ff70;
+  --graph-color13: #f012be;
+  --graph-color14: #7812bb;
+  --graph-color15: #444854;
+  --graph-color16: #c0c6cc;
+  --graph-color17: #9c5020;
+  --graph-color18: #e6c694;
+  --graph-color19: #c080ee;
+  --graph-color20: #c800ff;
 }
 
 /* Modified CSS */

style/themes/default-light.css

@@ -5,6 +5,30 @@
 *  This file is copyright under the latest version of the EUPL.
 *  Please see LICENSE file for your rights under this license. */
 
+:root {
+  /* Client graph colors */
+  --graph-color1: #ee5038;
+  --graph-color2: #3c8dbc;
+  --graph-color3: #00a65a;
+  --graph-color4: #00c0ef;
+  --graph-color5: #ffbb06;
+  --graph-color6: #0058e0;
+  --graph-color7: #0024a0;
+  --graph-color8: #08d8d0;
+  --graph-color9: #205849;
+  --graph-color10: #b01260;
+  --graph-color11: #ff854b;
+  --graph-color12: #01ff70;
+  --graph-color13: #f012be;
+  --graph-color14: #7812bb;
+  --graph-color15: #182233;
+  --graph-color16: #c0c6cc;
+  --graph-color17: #9c5020;
+  --graph-color18: #e6c694;
+  --graph-color19: #c080ee;
+  --graph-color20: #c800ff;
+}
+
 .main-header .navbar {
   background-color: #3c8dbc;
 }

style/themes/high-contrast-dark.css

@@ -29,6 +29,28 @@
   --blocked-color: var(--danger-color);
 
   --datatable-bgcolor: rgba(18, 44, 68, 0.3);
+
+  /* Client graph colors */
+  --graph-color1: #ee5038;
+  --graph-color2: #00a9ff;
+  --graph-color3: #00a65a;
+  --graph-color4: #90d0ff;
+  --graph-color5: #ffbb06;
+  --graph-color6: #0068c8;
+  --graph-color7: #0030ee;
+  --graph-color8: #00c8c0;
+  --graph-color9: #205849;
+  --graph-color10: #b01260;
+  --graph-color11: #ff854b;
+  --graph-color12: #01ff70;
+  --graph-color13: #f012be;
+  --graph-color14: #7812bb;
+  --graph-color15: #444854;
+  --graph-color16: #c0c6cc;
+  --graph-color17: #9c5020;
+  --graph-color18: #e6c694;
+  --graph-color19: #c080ee;
+  --graph-color20: #c800ff;
 }
 
 /* removing transition for every element, to avoid unnecessary movement */

style/themes/high-contrast.css

@@ -25,6 +25,28 @@
 
   --allowed-color: #3c7;
   --blocked-color: var(--danger-color);
+
+  /* Client graph colors */
+  --graph-color1: #ee5038;
+  --graph-color2: #3c8dbc;
+  --graph-color3: #00a65a;
+  --graph-color4: #00c0ef;
+  --graph-color5: #ffbb06;
+  --graph-color6: #0058e0;
+  --graph-color7: #0024a0;
+  --graph-color8: #08d8d0;
+  --graph-color9: #205849;
+  --graph-color10: #b01260;
+  --graph-color11: #ff854b;
+  --graph-color12: #01ff70;
+  --graph-color13: #f012be;
+  --graph-color14: #7812bb;
+  --graph-color15: #182233;
+  --graph-color16: #c0c6cc;
+  --graph-color17: #9c5020;
+  --graph-color18: #e6c694;
+  --graph-color19: #c080ee;
+  --graph-color20: #c800ff;
 }
 
 /* removing transition for every element, to avoid unnecessary movement */

style/themes/lcars.css

@@ -11,6 +11,28 @@
   --net-old-color: #125;
   --net-older-color: #1c2228;
   --datatable-bgcolor: var(--net-old-color);
+
+  /* Client graph colors */
+  --graph-color1: #d43;
+  --graph-color2: #fc0;
+  --graph-color3: #095;
+  --graph-color4: #9cf;
+  --graph-color5: #48f;
+  --graph-color6: #04f;
+  --graph-color7: #029;
+  --graph-color8: #ebf;
+  --graph-color9: #b6d;
+  --graph-color10: #70b;
+  --graph-color11: #fc9;
+  --graph-color12: #e97;
+  --graph-color13: #6fc;
+  --graph-color14: #043;
+  --graph-color15: #345;
+  --graph-color16: #fff;
+  --graph-color17: #f58;
+  --graph-color18: #a08;
+  --graph-color19: #603;
+  --graph-color20: #740;
 }
 
 .sidebar-collapse {