/* The selected ClienOS SVG family uses two colors, so it must not be masked.
   Unmatched semantic icons retain the licensed Lucide implementation. */
.icon-users-round {
  --clienos-icon: url("/assets/clienos/icons/duotone/customers.svg");
  --clienos-inverse-icon: url("/assets/clienos/icons/inverse/customers.svg");
}
.icon-store {
  --clienos-icon: url("/assets/clienos/icons/duotone/store.svg");
  --clienos-inverse-icon: url("/assets/clienos/icons/inverse/store.svg");
}
.icon-gift {
  --clienos-icon: url("/assets/clienos/icons/duotone/benefits.svg");
  --clienos-inverse-icon: url("/assets/clienos/icons/inverse/benefits.svg");
}
.icon-settings {
  --clienos-icon: url("/assets/clienos/icons/duotone/settings.svg");
  --clienos-inverse-icon: url("/assets/clienos/icons/inverse/settings.svg");
}
.icon-search {
  --clienos-icon: url("/assets/clienos/icons/duotone/search.svg");
  --clienos-inverse-icon: url("/assets/clienos/icons/inverse/search.svg");
}
.icon-check {
  --clienos-icon: url("/assets/clienos/icons/duotone/check.svg");
  --clienos-inverse-icon: url("/assets/clienos/icons/inverse/check.svg");
}
.icon-circle-alert {
  --clienos-icon: url("/assets/clienos/icons/duotone/alert-circle.svg");
  --clienos-inverse-icon: url("/assets/clienos/icons/inverse/alert-circle.svg");
}
.icon-qr-code {
  --clienos-icon: url("/assets/clienos/icons/duotone/qr-code.svg");
  --clienos-inverse-icon: url("/assets/clienos/icons/inverse/qr-code.svg");
}
/* Overview has a grid icon. Results keeps its chart because its meaning differs. */
.sidebar .nav a[href*="view=overview"] .icon-chart-no-axes-combined {
  --clienos-icon: url("/assets/clienos/icons/duotone/overview.svg");
  --clienos-inverse-icon: url("/assets/clienos/icons/inverse/overview.svg");
}
.ui-icon:is(.icon-users-round, .icon-store, .icon-gift, .icon-settings,
  .icon-search, .icon-check, .icon-circle-alert, .icon-qr-code):not(.customer-brand-scope *),
.sidebar .nav a[href*="view=overview"] .ui-icon.icon-chart-no-axes-combined {
  background-color: transparent;
  background-image: var(--clienos-icon);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  -webkit-mask: none;
  mask: none;
}
.shell .topbar .ui-icon:is(.icon-users-round, .icon-store, .icon-gift, .icon-settings,
  .icon-search, .icon-check, .icon-circle-alert, .icon-qr-code) {
  background-image: var(--clienos-inverse-icon);
}
/* High contrast mode follows the user's palette instead of fixed SVG colors. */
@media (forced-colors: active) {
  .ui-icon:is(.icon-users-round, .icon-store, .icon-gift, .icon-settings,
    .icon-search, .icon-check, .icon-circle-alert, .icon-qr-code):not(.customer-brand-scope *),
  .sidebar .nav a[href*="view=overview"] .ui-icon.icon-chart-no-axes-combined {
    background-image: none;
    background-color: CanvasText;
    -webkit-mask: var(--ui-icon) center / contain no-repeat;
    mask: var(--ui-icon) center / contain no-repeat;
  }
}