@property --kendo-color-base {
  syntax: "<color>";
  inherits: true;
  initial-value: #f3f5f7;
}
/*$c-menu-ai: red;

$c-menu-ai-text: yellow;

$c-menu-ai-hover: pink;
$c-menu-ai-text-hover: white;*/
.k-drawer-container.c-k-drawer .k-drawer {
  background-color: var(--kendo-color-base);
}
.k-drawer-container.c-k-drawer .c-menu-footer {
  background-color: var(--kendo-color-base);
  border-top-color: color-mix(in srgb, var(--kendo-color-base-on-subtle) 13.5%, var(--kendo-color-base)) !important;
}

.c-menu-expand-icon {
  background-color: var(--kendo-color-base-emphasis);
}

.c-menu-favs {
  color: color-mix(in srgb, var(--kendo-color-base-on-subtle) 32%, var(--kendo-color-base));
}
.c-menu-favs hr {
  border-top-color: color-mix(in srgb, var(--kendo-color-base-on-subtle) 32%, var(--kendo-color-base));
}
.c-menu-favs .c-menu-favs-title .k-icon, .c-menu-favs .c-menu-favs-title .c-menu-favs-title-text {
  background-color: var(--kendo-color-base);
}

.c-menu-top:hover {
  scrollbar-color: var(--kendo-color-base-emphasis) var(--kendo-color-base);
}

.c-menu-item:link, .c-menu-item:visited {
  color: #1976D2;
}
.c-menu-item:hover {
  background-color: var(--kendo-color-base-emphasis) !important;
  color: #1c68b3;
}
.c-menu-item:hover .menu-link-extra {
  visibility: visible;
}

.k-drawer-item:hover {
  background-color: var(--kendo-color-base-emphasis);
  color: var(--kendo-color-base-on-subtle);
}

.k-drawer-item.c-menu-item-ai {
  background-color: var(--kendo-color-base-on-surface);
  color: yellow;
}
.k-drawer-item.c-menu-item-ai:hover {
  background-color: var(--kendo-color-on-app-surface);
  color: white;
}

.c-menu-pop-out-title {
  border-bottom-color: color-mix(in srgb, var(--kendo-color-base-on-subtle) 32%, var(--kendo-color-base));
}

.k-appbar.k-appbar-light {
  background-color: #468fcc;
}

.c-appbar-button {
  background-color: #468fcc;
  border-color: #468fcc;
  color: #ffffff;
}
.c-appbar-button:hover {
  background-color: #2874ba;
  border-color: #2874ba;
}

.k-button.c-logo, .k-button.k-button-solid.c-logo {
  background-color: #3374ba;
  color: #ffffff;
}
.k-button.c-logo svg #blue, .k-button.k-button-solid.c-logo svg #blue {
  fill: #ffffff;
}
.k-button.c-logo svg #green, .k-button.k-button-solid.c-logo svg #green {
  fill: #ffffff;
}
.k-button.c-logo svg #red, .k-button.k-button-solid.c-logo svg #red {
  fill: #ffffff;
}
.k-button.c-logo:hover, .k-button.k-button-solid.c-logo:hover {
  background-color: #263238;
}
.k-button.c-logo:hover svg #blue, .k-button.k-button-solid.c-logo:hover svg #blue {
  fill: #3374ba;
}
.k-button.c-logo:hover svg #green, .k-button.k-button-solid.c-logo:hover svg #green {
  fill: #50a253;
}
.k-button.c-logo:hover svg #red, .k-button.k-button-solid.c-logo:hover svg #red {
  fill: #d81b61;
}

a {
  /*
  &:hover > span.c-login-logo.c-icon-logo-full {
      color: $c-logo-bar-foreground-hover;

      svg #blue {
          fill: $c-logo-stripe1;
      }

      svg #green {
          fill: $c-logo-stripe2;
      }

      svg #red {
          fill: $c-logo-stripe3;
      }
  }*/
}
a span.c-login-logo.c-icon-logo-full, a span.c-login-logo.c-icon-logo-cmms {
  color: fuscha;
}
a span.c-login-logo.c-icon-logo-full svg #blue, a span.c-login-logo.c-icon-logo-cmms svg #blue {
  fill: #3374ba;
}
a span.c-login-logo.c-icon-logo-full svg #green, a span.c-login-logo.c-icon-logo-cmms svg #green {
  fill: #50a253;
}
a span.c-login-logo.c-icon-logo-full svg #red, a span.c-login-logo.c-icon-logo-cmms svg #red {
  fill: #d81b61;
}

.c-icon-sparkles-alt svg #blue {
  fill: #3374ba;
}
.c-icon-sparkles-alt svg #green {
  fill: #50a253;
}
.c-icon-sparkles-alt svg #red {
  fill: #d81b61;
}