@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,900;1,300;1,400;1,500&display=swap');
body,
html {
  font-family: 'Roboto', sans-serif;
  background: var(--theme-app-background);
  color: #000;
}

:root {
    /* APP */
    --theme-app-background: #f5f5f5;
    /* HEADER */
    --theme-header-background: #1f2227;
    --theme-header-dropdown-menu-background: #292c32;
    --theme-header-dropdown-menu-item-text-color: #093854;
    --theme-header-dropdown-menu-item-hover-text-color: #3ba0dd;
    --theme-header-dropdown-menu-item-hover-background: #1f2227;
    --theme-top-nav-dropdown-menu-item-selected-hover-text-color: #009edd;
    --theme-top-nav-dropdown-menu-item-selected-hover-background: #1f2227;
    --theme-header-outline-button-border-color: #3ba0dd;
    --theme-header-outline-button-text-color: #fff;
    /* LOGO */
    --theme-logo-background: #cf4e95;
    --theme-logoUrl: url(/css/themes/zenegy/zenegy-logo.svg);
    --theme-logoSize: 25%;
    --theme-logo-standard-drawer-right-border-color: transparent;
    --theme-logo-right-border-color: #ddd;
    /* HEADER LEVEL 1 */
    --theme-top-nav-background: #093854;
    --theme-top-nav-border-color: linear-gradient(90deg, #cf4e95 0%, #3ba0dd 100%);
    --theme-top-nav-item-text-color: #aaa;
    --theme-top-nav-item-selected-text-color: #fff;
    --theme-top-nav-dropdown-menu-background: #093854;
    --theme-top-nav-dropdown-menu-item-text-color: #aaa;
    --theme-top-nav-dropdown-menu-item-hover-text-color: #3ba0dd;
    --theme-top-nav-dropdown-menu-item-hover-background: #1f2227;
    /* HEADER LEVEL 2 */
    --theme-action-button-background: #3ba0dd;
    --theme-action-button-text-color: #fff;
    /* HEADER LEVEL 3 */

    --theme-extended-nav-dropdown-menu-background: #093854;
    --theme-extended-nav-dropdown-menu-item-text-color: #093854;
    --theme-extended-nav-dropdown-menu-item-hover-text-color: #093854;
    --theme-extended-nav-dropdown-menu-item-hover-background: #406981;
    /* SIDENAV */
    --theme-side-nav-item-text-color: #94989c;
    --theme-side-nav-item-selected-text-color: #009edd;
    --theme-side-nav-item-hover-background: #1f2227;
    --theme-side-nav-avatar-text-color: #aaa;
    --theme-side-nav-search-box-background: #0af;
    --theme-side-nav-search-box-text-color: #fff;
    --theme-side-nav-search-box-icon-color: #fff;
    --theme-side-nav-search-box-placeholder-color: #cfcfcf;
    --theme-side-nav-panel-header-text-expanded-text-color: #fff;
    --theme-side-nav-panel-header-text-expanded-background: #1f2227;
    --theme-side-nav-item-text-color: #d8d8d8;
    --theme-side-nav-item-selected-text-color: #0af;
    --theme-side-nav-item-selected-background: #1f2227;
    --theme-side-nav-item-hover-background: #1f2227;
    --theme-side-nav-matched-text-color: #3ba0dd;
    --theme-side-nav-selected-matched-text-color: #3ba0dd;
    /* CATEGORY COLORS */
    /* STARTS CLOCKWISE FROM TOP OF COLOR WHEEL */
    --theme-category-color-1: #3ba0dd;
    --theme-category-color-1-chip-background: #3ba0dd20;
    --theme-category-color-2: #8992a0;
    --theme-category-color-2-chip-background: #8992a020;
    --theme-category-color-3: #a358d0;
    --theme-category-color-3-chip-background: #a358d020;
    --theme-category-color-4: #faa1f1;
    --theme-category-color-4-chip-background: #faa1f120;
    --theme-category-color-5: #cf4e95;
    --theme-category-color-5-chip-background: #cf4e9520;
    --theme-category-color-6: #ff642e;
    --theme-category-color-6-chip-background: #ff642e20;
    --theme-category-color-7: #e68c09;
    --theme-category-color-7-chip-background: #e68c0920;
    --theme-category-color-8: #ffcb00;
    --theme-category-color-8-chip-background: #ffcb0020;
    --theme-category-color-9: #51b03b;
    --theme-category-color-9-chip-background: #51b03b20;
    --theme-category-color-10: #037f4c;
    --theme-category-color-10-chip-background: #037f4c20;
    --theme-category-color-11: #4eccc6;
    --theme-category-color-11-chip-background: #4eccc620;
    --theme-category-color-12: #66ccff;
    --theme-category-color-12-chip-background: #66ccff20;
    --theme-category-color-unknown: #eeeff1;
    --theme-category-color-unknown-chip-background: #eeeff120;
    /* END CATEGORY */
    --theme-deep-dark: #000000;
    --theme-darkest: #1f2227;
    --theme-darker: #979797;
    --theme-dark: #aaaaaa;
    --theme-neutral: #d8d8d8;
    --theme-light: #f6f6f6;
    --theme-lighter: #f6f7f9;
    --theme-bright-light: #ffffff;
    --theme-primary: #3ba0dd;
    --theme-secondary: #cf4e95;
    --theme-primary-action: #00aaff;
    /* ONBOARDING */
    /* --theme-onboarding-modalBgPosition: -240px; */
    --theme-onboarding-modalBgUrl: url(/css/themes/zenegy/images/zenegy-onboarding-modal-bg.jpg);
    --theme-onboarding-bgImgUrlOrColor: #a2dbfe;
    --theme-onboarding-heading-font-weight: 900;
    --theme-onboarding-sub-heading-font-style: italic;
    --theme-onboarding-sub-heading-font-weight: 600;
    --theme-onboarding-logoUrl: url(/css/themes/zenegy/zenegy-logo-dark.svg);
    --theme-onboarding-header-bottom-separator-color: linear-gradient(90deg, #cf4e95 0%, #3ba0dd 100%);
    --theme-onboarding-header-logo-width: 60px;
    --theme-onboarding-logoSize: 25%;
    --theme-onboarding-language-color: #083753;
    --theme-onboarding-userDetailsHeadingAltColor: #aaa;
    --theme-onboarding-contentBoxBg: #aaa;
    --theme-onboarding-separatorColor: #707070;
    --theme-onboarding-navigation-dots-bg-color: #07aaff;
    --theme-onboarding-navigation-dots-border-color: #fff;
    /* BUTTON */
    --theme-outline-button-border-color: #3ba0dd;
    --theme-outline-button-text-color: #3ba0dd;
    --theme-action-button-hover-background: #3ba0dd;
    --theme-action-button-hover-text-color: #fff;
}

body:after {
  display: none;
  content: '#3ba0dd;#8992a0;#a358d0;#faa1f1;#cf4e95;#ff642e;#e68c09;#ffcb00;#51b03b;#037f4c;#4eccc6;#66ccff;';
}
