/* theme color properties from 13.10 on-wards css variables*/
:root {
  --top-header-bg: {1};
  --top-header-boder: {2};
  --top-menu-link-color: {3}!important;
  --top-menu-link-active-color: {4}!important;

  --top-sub-menu-bg: {27};
  --top-sub-menu-link-active-bg:{28};
  --top-sub-menu-text-color:{29};
  --top-sub-menu-text-active-color:{30};
  --top-sub-menu-border: {31};

  --ucmsidebar-bg:{5};
  --ucmsidebar-menu-bg:{6};
  --ucmsidebar-menu-text:{7};

  --ucmsidebar-menu-hover-text:{8};
  --ucmsidebar-menu-hover-bg:{9};

  --ucmsidebar-menu-active-text:{10};
  --ucmsidebar-menu-active-bg:{11};
  --ucmsidebar-menu-icon-bg:{12};

  --ucmsidebar-submenu-bg:{13};
  --ucmsidebar-submenu-childitem-border:{14};
  --ucmsidebar-submenu-childitem-text:{26};

  --ucmsidebar-submenu-childitem-hover-text:{16};
  --ucmsidebar-submenu-childitem-hover-background:{15};

  --ucmsidebar-submenu-childitem-active-text:{25};
  --ucmsidebar-submenu-childitem-active-border:{24};
  --ucmsidebar-submenu-childitem-active-background:{23};

  --ucmfooter-bg:{17};
  --ucmfooter-border:{18};
  --ucmfooter-text:{19};
  --ucmfooter-link:{20};
  --ucmfooter-link-active:{21};

  --ucmfreport-count:{22};

}
/*Header*/
.cheader {
  background :var(--top-header-bg);
  border-bottom: 1px solid var(--top-header-boder);
}
.cheader__navlink {
  color: var(--top-menu-link-color);
} 
.cheader__navlink--active {
    color: var(--top-menu-link-active-color) !important;
}
.cheader__childnavlists{
  background-color: var(--top-sub-menu-bg);
}
.cheader__childnavlink {
    color: var(--top-sub-menu-text-color);
}
.cheader__childnavlists::before {
  --top-menu-link-active-color:var(--top-sub-menu-border);
}
.cheader__childnavlink--active {
    color: var(--top-sub-menu-text-active-color) !important;
    background: var(--top-sub-menu-link-active-bg);
}

/*Left Sidebar*/

.main-sidebar {
  background: var(--ucmsidebar-bg)
}
.sidebar-menu > li {
  background: var(--ucmsidebar-menu-bg);
  border: 0px none !important;
}
.sidebar-menu > li > a > span {
  color: var(--ucmsidebar-menu-text)
}
.sidebar-menu > li > a:hover, 
.sidebar-menu > li > a:focus {
  color: var(--ucmsidebar-menu-hover-text);
  background: var(--ucmsidebar-menu-hover-bg);
  border: 0px none !important;
}
.sidebar-menu > li > a:hover > span,
.sidebar-menu > li > a:focus > span {
    color: var(--ucmsidebar-menu-hover-text) !important;
}
.sidebar-menu > li.active a.parenttree {
  color: var(--ucmsidebar-menu-active-text);
  background: var(--ucmsidebar-menu-active-bg);
  border: 0px none !important;
} 
.sidebar-menu > li.active a.parenttree .displayname {
  color: var(--ucmsidebar-menu-active-text) !important
}
.sidebar-menu>li.treeview.active .ucmleftiwrap {
  background: var(--ucmsidebar-menu-icon-bg)
}
.treeview-menu.sub-menu-open {
  background: var(--ucmsidebar-submenu-bg)
}

/* submenu */
.sidebar-menu .treeview-menu li {
  border-left: 4px solid var(--ucmsidebar-submenu-childitem-border)
}
.sidebar-menu .treeview-menu li a {
  color: var(--ucmsidebar-submenu-childitem-text) !important
}

/* submenu hover */
.sidebar-menu .treeview-menu li a:hover,
.sidebar-menu .treeview-menu li a:focus {
  background: var(--ucmsidebar-submenu-childitem-hover-background);
  color: var(--ucmsidebar-submenu-childitem-hover-text) !important
} 
.sidebar-menu .treeview-menu li:hover,
.sidebar-menu .treeview-menu li:focus {
  border-left: 4px solid var(--ucmsidebar-submenu-childitem-active-border);
}

/* submenu active */
.sidebar-menu .treeview-menu li.active {
  border-left: 4px solid var(--ucmsidebar-submenu-childitem-active-border);
}
.sidebar-menu .treeview-menu li.active a {
  background: var(--ucmsidebar-submenu-childitem-active-background) !important;
  color: var(--ucmsidebar-submenu-childitem-active-text) !important
}

/* Footer*/
.ucm-bl-footer,
.main-footer {
  background: var(--ucmfooter-bg);
  border-top:1px solid var(--ucmfooter-border)
}

 .main-footer *,
.ucm-bl-footer * {
  color:var(--ucmfooter-text)
}

.ucm-bl-footer a,
.main-footer a {
  color: var(--ucmfooter-link)
}
 
.ucm-bl-footer a:hover,
.ucm-bl-footer a:focus,
.ucm-bl-footer a:visited,
.main-footer a:hover,
.main-footer a:focus,
.main-footer a:visited {
  color: var(--ucmfooter-link-active);
} 

  /* Report part*/
.statuslistloop figure,
.summerycount span,
.summarymetrics .sumtotal,
.pipelinesumloop .summerycount, 
.totalpipetitle span.sumtotal,
.engvalue,.engloop__count,
.funnelchart .summerycount {
  color: var(--ucmfreport-count)
}