@c8y/style 1023.37.0 → 1023.42.1

package/styles/icons/_c8y-icons.less

@@ -1,4 +1,20 @@
 
+@import "../../variables/_dlt-c8y-icons-vars.less";
+@import "../mixins/_icon-base.less";
+
+/**
+ * C8Y Icons - Dual-tone icon font system with light and dark variants
+ *
+ * Note: Contains @font-face definitions for c8yicon-dark and c8yicon-light fonts.
+ * Uses @size-4 for border-radius.
+ *
+ * Intentionally hardcoded values:
+ * - Icon sizes (14px, 16px, 20px, 21px, 22px, 24px, 30px, 32px, 35px, 36px, 50px, 64px): Component-specific icon dimensions
+ * - Line-heights matching icon sizes: Proper icon alignment
+ * - Small spacing (1px margin, 2px padding): Fine-tuning adjustments
+ * - Border width (1px): Standard border
+ */
+
 /* Icon Font: c8yicon */
 @asset-directory: if(@use-relative-paths, '../../assets', 'assets');
 
@@ -128,124 +144,124 @@
 
 .c8y-icon-aab-icon-model {
   &:before {
-    content: @c8y-icon-dark-aab-icon-model; 
+    content: @c8y-icon-dark-aab-icon-model,
   }
   &:after {
-    content: @c8y-icon-light-aab-icon-model; 
+    content: @c8y-icon-light-aab-icon-model,
   }
 }
 .c8y-icon-aab-icon-template-model {
   &:before {
-    content: @c8y-icon-dark-aab-icon-template-model; 
+    content: @c8y-icon-dark-aab-icon-template-model,
   }
   &:after {
-    content: @c8y-icon-light-aab-icon-template-model; 
+    content: @c8y-icon-light-aab-icon-template-model,
   }
 }
 .c8y-icon-accounts {
   &:before {
-    content: @c8y-icon-dark-accounts; 
+    content: @c8y-icon-dark-accounts,
   }
   &:after {
-    content: @c8y-icon-light-accounts; 
+    content: @c8y-icon-light-accounts,
   }
 }
 .c8y-icon-add-user {
   &:before {
-    content: @c8y-icon-dark-add-user; 
+    content: @c8y-icon-dark-add-user,
   }
   &:after {
-    content: @c8y-icon-light-add-user; 
+    content: @c8y-icon-light-add-user,
   }
 }
 .c8y-icon-administration {
   &:before {
-    content: @c8y-icon-dark-administration; 
+    content: @c8y-icon-dark-administration,
   }
   &:after {
-    content: @c8y-icon-light-administration; 
+    content: @c8y-icon-light-administration,
   }
 }
 .c8y-icon-alarm {
   &:before {
-    content: @c8y-icon-dark-alarm; 
+    content: @c8y-icon-dark-alarm,
   }
   &:after {
-    content: @c8y-icon-light-alarm; 
+    content: @c8y-icon-light-alarm,
   }
 }
 .c8y-icon-alert-idle {
   &:before {
-    content: @c8y-icon-dark-alert-idle; 
+    content: @c8y-icon-dark-alert-idle,
   }
   &:after {
-    content: @c8y-icon-light-alert-idle; 
+    content: @c8y-icon-light-alert-idle,
   }
 }
 .c8y-icon-alfabet {
   &:before {
-    content: @c8y-icon-dark-alfabet; 
+    content: @c8y-icon-dark-alfabet,
   }
 }
 .c8y-icon-analytic-model {
   &:before {
-    content: @c8y-icon-dark-analytic-model; 
+    content: @c8y-icon-dark-analytic-model,
   }
   &:after {
-    content: @c8y-icon-light-analytic-model; 
+    content: @c8y-icon-light-analytic-model,
   }
 }
 .c8y-icon-analytics-builder {
   &:before {
-    content: @c8y-icon-dark-analytics-builder; 
+    content: @c8y-icon-dark-analytics-builder,
   }
   &:after {
-    content: @c8y-icon-light-analytics-builder; 
+    content: @c8y-icon-light-analytics-builder,
   }
 }
 .c8y-icon-apama-epl {
   &:before {
-    content: @c8y-icon-dark-apama-epl; 
+    content: @c8y-icon-dark-apama-epl,
   }
   &:after {
-    content: @c8y-icon-light-apama-epl; 
+    content: @c8y-icon-light-apama-epl,
   }
 }
 .c8y-icon-apama-machine-learning-workbench {
   &:before {
-    content: @c8y-icon-dark-apama-machine-learning-workbench; 
+    content: @c8y-icon-dark-apama-machine-learning-workbench,
   }
   &:after {
-    content: @c8y-icon-light-apama-machine-learning-workbench; 
+    content: @c8y-icon-light-apama-machine-learning-workbench,
   }
 }
 .c8y-icon-apama-machine-learning {
   &:before {
-    content: @c8y-icon-dark-apama-machine-learning; 
+    content: @c8y-icon-dark-apama-machine-learning,
   }
   &:after {
-    content: @c8y-icon-light-apama-machine-learning; 
+    content: @c8y-icon-light-apama-machine-learning,
   }
 }
 .c8y-icon-archive {
   &:before {
-    content: @c8y-icon-dark-archive; 
+    content: @c8y-icon-dark-archive,
   }
   &:after {
-    content: @c8y-icon-light-archive; 
+    content: @c8y-icon-light-archive,
   }
 }
 .c8y-icon-aris {
   &:before {
-    content: @c8y-icon-dark-aris; 
+    content: @c8y-icon-dark-aris,
   }
 }
 .c8y-icon-atom {
   &:before {
-    content: @c8y-icon-dark-atom; 
+    content: @c8y-icon-dark-atom,
   }
   &:after {
-    content: @c8y-icon-light-atom; 
+    content: @c8y-icon-light-atom,
   }
 }
 .c8y-icon-book {
@@ -255,678 +271,678 @@
 }
 .c8y-icon-bookmark {
   &:before {
-    content: @c8y-icon-dark-bookmark; 
+    content: @c8y-icon-dark-bookmark,
   }
 }
 .c8y-icon-bulb {
   &:before {
-    content: @c8y-icon-dark-bulb; 
+    content: @c8y-icon-dark-bulb,
   }
   &:after {
-    content: @c8y-icon-light-bulb; 
+    content: @c8y-icon-light-bulb,
   }
 }
 .c8y-icon-business-rules {
   &:before {
-    content: @c8y-icon-dark-business-rules; 
+    content: @c8y-icon-dark-business-rules,
   }
   &:after {
-    content: @c8y-icon-light-business-rules; 
+    content: @c8y-icon-light-business-rules,
   }
 }
 .c8y-icon-c8y-c {
   &:before {
-    content: @c8y-icon-dark-c8y-c; 
+    content: @c8y-icon-dark-c8y-c,
   }
 }
 .c8y-icon-c8y-data {
   &:before {
-    content: @c8y-icon-dark-c8y-data; 
+    content: @c8y-icon-dark-c8y-data,
   }
   &:after {
-    content: @c8y-icon-light-c8y-data; 
+    content: @c8y-icon-light-c8y-data,
   }
 }
 .c8y-icon-c8y-support {
   &:before {
-    content: @c8y-icon-dark-c8y-support; 
+    content: @c8y-icon-dark-c8y-support,
   }
   &:after {
-    content: @c8y-icon-light-c8y-support; 
+    content: @c8y-icon-light-c8y-support,
   }
 }
 .c8y-icon-c8y {
   &:before {
-    content: @c8y-icon-dark-c8y; 
+    content: @c8y-icon-dark-c8y,
   }
 }
 .c8y-icon-calendar {
   &:before {
-    content: @c8y-icon-dark-calendar; 
+    content: @c8y-icon-dark-calendar,
   }
   &:after {
-    content: @c8y-icon-light-calendar; 
+    content: @c8y-icon-light-calendar,
   }
 }
 .c8y-icon-chart {
   &:before {
-    content: @c8y-icon-dark-chart; 
+    content: @c8y-icon-dark-chart,
   }
   &:after {
-    content: @c8y-icon-light-chart; 
+    content: @c8y-icon-light-chart,
   }
 }
 .c8y-icon-circle-star {
   &:before {
-    content: @c8y-icon-dark-circle-star; 
+    content: @c8y-icon-dark-circle-star,
   }
   &:after {
-    content: @c8y-icon-light-circle-star; 
+    content: @c8y-icon-light-circle-star,
   }
 }
 .c8y-icon-cloud-container {
   &:before {
-    content: @c8y-icon-dark-cloud-container; 
+    content: @c8y-icon-dark-cloud-container,
   }
   &:after {
-    content: @c8y-icon-light-cloud-container; 
+    content: @c8y-icon-light-cloud-container,
   }
 }
 .c8y-icon-cockpit {
   &:before {
-    content: @c8y-icon-dark-cockpit; 
+    content: @c8y-icon-dark-cockpit,
   }
   &:after {
-    content: @c8y-icon-light-cockpit; 
+    content: @c8y-icon-light-cockpit,
   }
 }
 .c8y-icon-component {
   &:before {
-    content: @c8y-icon-dark-component; 
+    content: @c8y-icon-dark-component,
   }
   &:after {
-    content: @c8y-icon-light-component; 
+    content: @c8y-icon-light-component,
   }
 }
 .c8y-icon-connector-in {
   &:before {
-    content: @c8y-icon-dark-connector-in; 
+    content: @c8y-icon-dark-connector-in,
   }
   &:after {
-    content: @c8y-icon-light-connector-in; 
+    content: @c8y-icon-light-connector-in,
   }
 }
 .c8y-icon-connector-out {
   &:before {
-    content: @c8y-icon-dark-connector-out; 
+    content: @c8y-icon-dark-connector-out,
   }
   &:after {
-    content: @c8y-icon-light-connector-out; 
+    content: @c8y-icon-light-connector-out,
   }
 }
 .c8y-icon-css {
   &:before {
-    content: @c8y-icon-dark-css; 
+    content: @c8y-icon-dark-css,
   }
 }
 .c8y-icon-cumulocity-iot {
   &:before {
-    content: @c8y-icon-dark-cumulocity-iot; 
+    content: @c8y-icon-dark-cumulocity-iot,
   }
 }
 .c8y-icon-data-broker {
   &:before {
-    content: @c8y-icon-dark-data-broker; 
+    content: @c8y-icon-dark-data-broker,
   }
   &:after {
-    content: @c8y-icon-light-data-broker; 
+    content: @c8y-icon-light-data-broker,
   }
 }
 .c8y-icon-data-explorer {
   &:before {
-    content: @c8y-icon-dark-data-explorer; 
+    content: @c8y-icon-dark-data-explorer,
   }
   &:after {
-    content: @c8y-icon-light-data-explorer; 
+    content: @c8y-icon-light-data-explorer,
   }
 }
 .c8y-icon-data-hub {
   &:before {
-    content: @c8y-icon-dark-data-hub; 
+    content: @c8y-icon-dark-data-hub,
   }
   &:after {
-    content: @c8y-icon-light-data-hub; 
+    content: @c8y-icon-light-data-hub,
   }
 }
 .c8y-icon-data-points {
   &:before {
-    content: @c8y-icon-dark-data-points; 
+    content: @c8y-icon-dark-data-points,
   }
   &:after {
-    content: @c8y-icon-light-data-points; 
+    content: @c8y-icon-light-data-points,
   }
 }
 .c8y-icon-design {
   &:before {
-    content: @c8y-icon-dark-design; 
+    content: @c8y-icon-dark-design,
   }
   &:after {
-    content: @c8y-icon-light-design; 
+    content: @c8y-icon-light-design,
   }
 }
 .c8y-icon-device-connect {
   &:before {
-    content: @c8y-icon-dark-device-connect; 
+    content: @c8y-icon-dark-device-connect,
   }
   &:after {
-    content: @c8y-icon-light-device-connect; 
+    content: @c8y-icon-light-device-connect,
   }
 }
 .c8y-icon-device-control {
   &:before {
-    content: @c8y-icon-dark-device-control; 
+    content: @c8y-icon-dark-device-control,
   }
   &:after {
-    content: @c8y-icon-light-device-control; 
+    content: @c8y-icon-light-device-control,
   }
 }
 .c8y-icon-device-management {
   &:before {
-    content: @c8y-icon-dark-device-management; 
+    content: @c8y-icon-dark-device-management,
   }
   &:after {
-    content: @c8y-icon-light-device-management; 
+    content: @c8y-icon-light-device-management,
   }
 }
 .c8y-icon-device-profile {
   &:before {
-    content: @c8y-icon-dark-device-profile; 
+    content: @c8y-icon-dark-device-profile,
   }
   &:after {
-    content: @c8y-icon-light-device-profile; 
+    content: @c8y-icon-light-device-profile,
   }
 }
 .c8y-icon-device-protocols {
   &:before {
-    content: @c8y-icon-dark-device-protocols; 
+    content: @c8y-icon-dark-device-protocols,
   }
   &:after {
-    content: @c8y-icon-light-device-protocols; 
+    content: @c8y-icon-light-device-protocols,
   }
 }
 .c8y-icon-device {
   &:before {
-    content: @c8y-icon-dark-device; 
+    content: @c8y-icon-dark-device,
   }
   &:after {
-    content: @c8y-icon-light-device; 
+    content: @c8y-icon-light-device,
   }
 }
 .c8y-icon-dynamic-mapper {
   &:before {
-    content: @c8y-icon-dark-dynamic-mapper; 
+    content: @c8y-icon-dark-dynamic-mapper,
   }
   &:after {
-    content: @c8y-icon-light-dynamic-mapper; 
+    content: @c8y-icon-light-dynamic-mapper,
   }
 }
 .c8y-icon-e2e-monitoring {
   &:before {
-    content: @c8y-icon-dark-e2e-monitoring; 
+    content: @c8y-icon-dark-e2e-monitoring,
   }
 }
 .c8y-icon-energy {
   &:before {
-    content: @c8y-icon-dark-energy; 
+    content: @c8y-icon-dark-energy,
   }
   &:after {
-    content: @c8y-icon-light-energy; 
+    content: @c8y-icon-light-energy,
   }
 }
 .c8y-icon-enterprise {
   &:before {
-    content: @c8y-icon-dark-enterprise; 
+    content: @c8y-icon-dark-enterprise,
   }
   &:after {
-    content: @c8y-icon-light-enterprise; 
+    content: @c8y-icon-light-enterprise,
   }
 }
 .c8y-icon-event-processing {
   &:before {
-    content: @c8y-icon-dark-event-processing; 
+    content: @c8y-icon-dark-event-processing,
   }
   &:after {
-    content: @c8y-icon-light-event-processing; 
+    content: @c8y-icon-light-event-processing,
   }
 }
 .c8y-icon-events {
   &:before {
-    content: @c8y-icon-dark-events; 
+    content: @c8y-icon-dark-events,
   }
   &:after {
-    content: @c8y-icon-light-events; 
+    content: @c8y-icon-light-events,
   }
 }
 .c8y-icon-fieldbus {
   &:before {
-    content: @c8y-icon-dark-fieldbus; 
+    content: @c8y-icon-dark-fieldbus,
   }
   &:after {
-    content: @c8y-icon-light-fieldbus; 
+    content: @c8y-icon-light-fieldbus,
   }
 }
 .c8y-icon-find-map {
   &:before {
-    content: @c8y-icon-dark-find-map; 
+    content: @c8y-icon-dark-find-map,
   }
   &:after {
-    content: @c8y-icon-light-find-map; 
+    content: @c8y-icon-light-find-map,
   }
 }
 .c8y-icon-firmware {
   &:before {
-    content: @c8y-icon-dark-firmware; 
+    content: @c8y-icon-dark-firmware,
   }
   &:after {
-    content: @c8y-icon-light-firmware; 
+    content: @c8y-icon-light-firmware,
   }
 }
 .c8y-icon-grid-off {
   &:before {
-    content: @c8y-icon-dark-grid-off; 
+    content: @c8y-icon-dark-grid-off,
   }
   &:after {
-    content: @c8y-icon-light-grid-off; 
+    content: @c8y-icon-light-grid-off,
   }
 }
 .c8y-icon-grid-on {
   &:before {
-    content: @c8y-icon-dark-grid-on; 
+    content: @c8y-icon-dark-grid-on,
   }
 }
 .c8y-icon-group-add {
   &:before {
-    content: @c8y-icon-dark-group-add; 
+    content: @c8y-icon-dark-group-add,
   }
   &:after {
-    content: @c8y-icon-light-group-add; 
+    content: @c8y-icon-light-group-add,
   }
 }
 .c8y-icon-group-open {
   &:before {
-    content: @c8y-icon-dark-group-open; 
+    content: @c8y-icon-dark-group-open,
   }
   &:after {
-    content: @c8y-icon-light-group-open; 
+    content: @c8y-icon-light-group-open,
   }
 }
 .c8y-icon-group-remote-inactive {
   &:before {
-    content: @c8y-icon-dark-group-remote-inactive; 
+    content: @c8y-icon-dark-group-remote-inactive,
   }
   &:after {
-    content: @c8y-icon-light-group-remote-inactive; 
+    content: @c8y-icon-light-group-remote-inactive,
   }
 }
 .c8y-icon-group-remote-open {
   &:before {
-    content: @c8y-icon-dark-group-remote-open; 
+    content: @c8y-icon-dark-group-remote-open,
   }
   &:after {
-    content: @c8y-icon-light-group-remote-open; 
+    content: @c8y-icon-light-group-remote-open,
   }
 }
 .c8y-icon-group-remote {
   &:before {
-    content: @c8y-icon-dark-group-remote; 
+    content: @c8y-icon-dark-group-remote,
   }
   &:after {
-    content: @c8y-icon-light-group-remote; 
+    content: @c8y-icon-light-group-remote,
   }
 }
 .c8y-icon-group-smart-open {
   &:before {
-    content: @c8y-icon-dark-group-smart-open; 
+    content: @c8y-icon-dark-group-smart-open,
   }
   &:after {
-    content: @c8y-icon-light-group-smart-open; 
+    content: @c8y-icon-light-group-smart-open,
   }
 }
 .c8y-icon-group-smart {
   &:before {
-    content: @c8y-icon-dark-group-smart; 
+    content: @c8y-icon-dark-group-smart,
   }
   &:after {
-    content: @c8y-icon-light-group-smart; 
+    content: @c8y-icon-light-group-smart,
   }
 }
 .c8y-icon-group {
   &:before {
-    content: @c8y-icon-dark-group; 
+    content: @c8y-icon-dark-group,
   }
 }
 .c8y-icon-java {
   &:before {
-    content: @c8y-icon-dark-java; 
+    content: @c8y-icon-dark-java,
   }
   &:after {
-    content: @c8y-icon-light-java; 
+    content: @c8y-icon-light-java,
   }
 }
 .c8y-icon-layers {
   &:before {
-    content: @c8y-icon-dark-layers; 
+    content: @c8y-icon-dark-layers,
   }
   &:after {
-    content: @c8y-icon-light-layers; 
+    content: @c8y-icon-light-layers,
   }
 }
 .c8y-icon-layout {
   &:before {
-    content: @c8y-icon-dark-layout; 
+    content: @c8y-icon-dark-layout,
   }
 }
 .c8y-icon-location {
   &:before {
-    content: @c8y-icon-dark-location; 
+    content: @c8y-icon-dark-location,
   }
   &:after {
-    content: @c8y-icon-light-location; 
+    content: @c8y-icon-light-location,
   }
 }
 .c8y-icon-machine-portal {
   &:before {
-    content: @c8y-icon-dark-machine-portal; 
+    content: @c8y-icon-dark-machine-portal,
   }
   &:after {
-    content: @c8y-icon-light-machine-portal; 
+    content: @c8y-icon-light-machine-portal,
   }
 }
 .c8y-icon-management {
   &:before {
-    content: @c8y-icon-dark-management; 
+    content: @c8y-icon-dark-management,
   }
   &:after {
-    content: @c8y-icon-light-management; 
+    content: @c8y-icon-light-management,
   }
 }
 .c8y-icon-metering {
   &:before {
-    content: @c8y-icon-dark-metering; 
+    content: @c8y-icon-dark-metering,
   }
   &:after {
-    content: @c8y-icon-light-metering; 
+    content: @c8y-icon-light-metering,
   }
 }
 .c8y-icon-mft {
   &:before {
-    content: @c8y-icon-dark-mft; 
+    content: @c8y-icon-dark-mft,
   }
 
 }
 .c8y-icon-mobile-add {
   &:before {
-    content: @c8y-icon-dark-mobile-add; 
+    content: @c8y-icon-dark-mobile-add,
   }
   &:after {
-    content: @c8y-icon-light-mobile-add; 
+    content: @c8y-icon-light-mobile-add,
   }
 }
 .c8y-icon-mobile-config {
   &:before {
-    content: @c8y-icon-dark-mobile-config; 
+    content: @c8y-icon-dark-mobile-config,
   }
   &:after {
-    content: @c8y-icon-light-mobile-config; 
+    content: @c8y-icon-light-mobile-config,
   }
 }
 .c8y-icon-modules {
   &:before {
-    content: @c8y-icon-dark-modules; 
+    content: @c8y-icon-dark-modules,
   }
   &:after {
-    content: @c8y-icon-light-modules; 
+    content: @c8y-icon-light-modules,
   }
 }
 .c8y-icon-mycloud {
   &:before {
-    content: @c8y-icon-dark-mycloud; 
+    content: @c8y-icon-dark-mycloud,
   }
 }
 .c8y-icon-notification {
   &:before {
-    content: @c8y-icon-dark-notification; 
+    content: @c8y-icon-dark-notification,
   }
   &:after {
-    content: @c8y-icon-light-notification; 
+    content: @c8y-icon-light-notification,
   }
 }
 .c8y-icon-oee {
   &:before {
-    content: @c8y-icon-dark-oee; 
+    content: @c8y-icon-dark-oee,
   }
   &:after {
-    content: @c8y-icon-light-oee; 
+    content: @c8y-icon-light-oee,
   }
 }
 .c8y-icon-onnx {
   &:before {
-    content: @c8y-icon-dark-onnx; 
+    content: @c8y-icon-dark-onnx,
   }
 }
 .c8y-icon-overviews {
   &:before {
-    content: @c8y-icon-dark-overviews; 
+    content: @c8y-icon-dark-overviews,
   }
   &:after {
-    content: @c8y-icon-light-overviews; 
+    content: @c8y-icon-light-overviews,
   }
 }
 .c8y-icon-parameters-on {
   &:before {
-    content: @c8y-icon-dark-parameters-on; 
+    content: @c8y-icon-dark-parameters-on,
   }
   &:after {
-    content: @c8y-icon-light-parameters-on; 
+    content: @c8y-icon-light-parameters-on,
   }
 }
 .c8y-icon-parameters {
   &:before {
-    content: @c8y-icon-dark-parameters; 
+    content: @c8y-icon-dark-parameters,
   }
 }
 .c8y-icon-parking {
   &:before {
-    content: @c8y-icon-dark-parking; 
+    content: @c8y-icon-dark-parking,
   }
   &:after {
-    content: @c8y-icon-light-parking; 
+    content: @c8y-icon-light-parking,
   }
 }
 .c8y-icon-report {
   &:before {
-    content: @c8y-icon-dark-report; 
+    content: @c8y-icon-dark-report,
   }
   &:after {
-    content: @c8y-icon-light-report; 
+    content: @c8y-icon-light-report,
   }
 }
 .c8y-icon-reports {
   &:before {
-    content: @c8y-icon-dark-reports; 
+    content: @c8y-icon-dark-reports,
   }
   &:after {
-    content: @c8y-icon-light-reports; 
+    content: @c8y-icon-light-reports,
   }
 }
 .c8y-icon-rocket {
   &:before {
-    content: @c8y-icon-dark-rocket; 
+    content: @c8y-icon-dark-rocket,
   }
   &:after {
-    content: @c8y-icon-light-rocket; 
+    content: @c8y-icon-light-rocket,
   }
 }
 .c8y-icon-saas {
   &:before {
-    content: @c8y-icon-dark-saas; 
+    content: @c8y-icon-dark-saas,
   }
   &:after {
-    content: @c8y-icon-light-saas; 
+    content: @c8y-icon-light-saas,
   }
 }
 .c8y-icon-security {
   &:before {
-    content: @c8y-icon-dark-security; 
+    content: @c8y-icon-dark-security,
   }
   &:after {
-    content: @c8y-icon-light-security; 
+    content: @c8y-icon-light-security,
   }
 }
 .c8y-icon-shield {
   &:before {
-    content: @c8y-icon-dark-shield; 
+    content: @c8y-icon-dark-shield,
   }
   &:after {
-    content: @c8y-icon-light-shield; 
+    content: @c8y-icon-light-shield,
   }
 }
 .c8y-icon-simulator {
   &:before {
-    content: @c8y-icon-dark-simulator; 
+    content: @c8y-icon-dark-simulator,
   }
   &:after {
-    content: @c8y-icon-light-simulator; 
+    content: @c8y-icon-light-simulator,
   }
 }
 .c8y-icon-smart-rest {
   &:before {
-    content: @c8y-icon-dark-smart-rest; 
+    content: @c8y-icon-dark-smart-rest,
   }
   &:after {
-    content: @c8y-icon-light-smart-rest; 
+    content: @c8y-icon-light-smart-rest,
   }
 }
 .c8y-icon-smart-rules {
   &:before {
-    content: @c8y-icon-dark-smart-rules; 
+    content: @c8y-icon-dark-smart-rules,
   }
   &:after {
-    content: @c8y-icon-light-smart-rules; 
+    content: @c8y-icon-light-smart-rules,
   }
 }
 .c8y-icon-solution-accelerator {
   &:before {
-    content: @c8y-icon-dark-solution-accelerator; 
+    content: @c8y-icon-dark-solution-accelerator,
   }
   &:after {
-    content: @c8y-icon-light-solution-accelerator; 
+    content: @c8y-icon-light-solution-accelerator,
   }
 }
 .c8y-icon-streaming-analytics {
   &:before {
-    content: @c8y-icon-dark-streaming-analytics; 
+    content: @c8y-icon-dark-streaming-analytics,
   }
   &:after {
-    content: @c8y-icon-light-streaming-analytics; 
+    content: @c8y-icon-light-streaming-analytics,
   }
 }
 .c8y-icon-sub-tenants {
   &:before {
-    content: @c8y-icon-dark-sub-tenants; 
+    content: @c8y-icon-dark-sub-tenants,
   }
   &:after {
-    content: @c8y-icon-light-sub-tenants; 
+    content: @c8y-icon-light-sub-tenants,
   }
 }
 .c8y-icon-tenant-policies {
   &:before {
-    content: @c8y-icon-dark-tenant-policies; 
+    content: @c8y-icon-dark-tenant-policies,
   }
   &:after {
-    content: @c8y-icon-light-tenant-policies; 
+    content: @c8y-icon-light-tenant-policies,
   }
 }
 .c8y-icon-tools {
   &:before {
-    content: @c8y-icon-dark-tools; 
+    content: @c8y-icon-dark-tools,
   }
   &:after {
-    content: @c8y-icon-light-tools; 
+    content: @c8y-icon-light-tools,
   }
 }
 .c8y-icon-tracking {
   &:before {
-    content: @c8y-icon-dark-tracking; 
+    content: @c8y-icon-dark-tracking,
   }
   &:after {
-    content: @c8y-icon-light-tracking; 
+    content: @c8y-icon-light-tracking,
   }
 }
 .c8y-icon-usage-statistics {
   &:before {
-    content: @c8y-icon-dark-usage-statistics; 
+    content: @c8y-icon-dark-usage-statistics,
   }
   &:after {
-    content: @c8y-icon-light-usage-statistics; 
+    content: @c8y-icon-light-usage-statistics,
   }
 }
 .c8y-icon-user {
   &:before {
-    content: @c8y-icon-dark-user; 
+    content: @c8y-icon-dark-user,
   }
   &:after {
-    content: @c8y-icon-light-user; 
+    content: @c8y-icon-light-user,
   }
 }
 .c8y-icon-users {
   &:before {
-    content: @c8y-icon-dark-users; 
+    content: @c8y-icon-dark-users,
   }
   &:after {
-    content: @c8y-icon-light-users; 
+    content: @c8y-icon-light-users,
   }
 }
 .c8y-icon-waste-bin {
   &:before {
-    content: @c8y-icon-dark-waste-bin; 
+    content: @c8y-icon-dark-waste-bin,
   }
   &:after {
-    content: @c8y-icon-light-waste-bin; 
+    content: @c8y-icon-light-waste-bin,
   }
 }
 .c8y-icon-wm-api {
   &:before {
-    content: @c8y-icon-dark-wm-api; 
+    content: @c8y-icon-dark-wm-api,
   }
 
 }
 .c8y-icon-wm-b2b {
   &:before {
-    content: @c8y-icon-dark-wm-b2b; 
+    content: @c8y-icon-dark-wm-b2b,
   }
 
 }
 .c8y-icon-wm-dynamicapps {
   &:before {
-    content: @c8y-icon-dark-wm-dynamicapps; 
+    content: @c8y-icon-dark-wm-dynamicapps,
   }
 }
 .c8y-icon-wm-integration {
   &:before {
-    content: @c8y-icon-dark-wm-integration; 
+    content: @c8y-icon-dark-wm-integration,
   }
   &:after {
-    content: @c8y-icon-light-wm-integration; 
+    content: @c8y-icon-light-wm-integration,
   }
 }
 
 .c8y-icon-analytics-smart-rules {
   &:before {
-    content: @c8y-icon-dark-analytics-smart-rules; 
+    content: @c8y-icon-dark-analytics-smart-rules,
   }
   &:after {
-    content: @c8y-icon-light-analytics-smart-rules; 
+    content: @c8y-icon-light-analytics-smart-rules,
   }
 }
 
@@ -974,7 +990,7 @@
   display: inline-block;
   width: 36px;
   height: 36px;
-  border-radius: 4px;
+  border-radius: @size-4;
   background-color: var(--brand-dark, var(--c8y-brand-dark));
   color: var(--brand-light, var(--c8y-brand-light));
   overflow: hidden;
@@ -1031,16 +1047,16 @@
 
 
 .circle-icon-wrapper{
-  --c8y-icon-stroke-color: @text-color;
+  --c8y-icon-stroke-color: @{text-color};
   border-radius: 50%;
   color: white;
   width: 24px;
   aspect-ratio: 1/1;
   text-align: center;
+  padding-bottom: 2px;
   display: inline-flex;
-  align-items: flex-start;
+  align-items: center;
   justify-content: center;
-  padding: 2px;
   > i{
     font-size: 16px;
     color: @component-background-default;
@@ -1055,7 +1071,6 @@
   &--small{
     width: 16px;
     height: 16px;
-    
     > i{
       font-size: 10px;
     }