﻿:root {
    /* design tokens for header */
    --color-background-header: var(--blue-60);
    --color-background-header-search: var(--opacity-40);
    --color-text-header-search: var(--neutrals-5);
    --color-icon-header: var(--neutrals-5);
    --color-border-header: var(--neutrals-5);
    --env-logo: --LOGO--;

    /* design tokens for main content */
    --color-background-main: var(--ngrey-40);
    --color-background-main-overlay: var(--opacity-overlay);

    /* design tokens for left menu */
    --color-background-leftmenu: var(--blue-60);
    --color-border-leftmenu: var(--neutrals-5);

    --color-background-leftmenu-item: var(--blue-60);
    --color-background-leftmenu-item-active: var(--blue-80);
    --color-background-leftmenu-item-hover: var(--blue-40);
    --color-leftmenu-item: var(--neutrals-5);
    --color-leftmenu-item-active: var(--neutrals-5);
    --color-leftmenu-item-hover: var(--neutrals-5);
    --color-icon-leftmenu-item-lock: var(--blue-20);
    --color-icon-leftmenu-item-plusfeature: #F9C200;

    --color-explorer-back-button: var(--neutrals-5);
    --color-background-explorer-section-header: var(--blue-80);
    --color-explorer-section-header: var(--neutrals-5);
    --color-background-explorer-section-body-item-active: var(--blue-90);
    --color-background-explorer-section-body-item-hover: var(--blue-70);
    --color-text-explorer-section-body-item: var(--neutrals-5);
    --color-text-explorer-section-body-item-active: var(--neutrals-5);
    --color-text-explorer-section-body-item-hover: var(--neutrals-5);
    --color-background-explorer-section-body-input: var(--blue-80);
    --color-explorer-section-body-input: var(--neutrals-5);
    --color-background-explorer-scrollbar-track: #0B4F7D;
    --color-background-explorer-scrollbar-thumb: var(--blue-60);
    --color-background-explorer-section-body-loader-primary: var(--blue-50);
    --color-background-explorer-section-body-loader-secondary: var(--blue-80);

    --color-background-sidepanel: var(--blue-80);
    --color-background-sidepanel-overlay: var(--opacity-40);

    /* design tokens for buttons */
    --color-background-button-primary: var(--green-70);
    --color-button-primary: var(--neutrals-5);
    --color-background-button-secondary: var(--blue-60);
    --color-button-secondary: var(--neutrals-5);
    --color-background-button-terciary: var(--neutrals-5);
    --color-button-terciary: var(--blue-60);
    --color-border-button-ghost: var(--blue-60);
    --color-button-ghost: var(--blue-60);
    --color-background-button-text: var(--neutrals-5);
    --color-border-button-text: var(--neutrals-5);
    --color-focus-border-button-text: var(--blue-60);
    --color-button-text: var(--blue-60);
    --color-background-button-disabled: var(--ngrey-50);
    --color-border-button-disabled: var(--ngrey-50);
    --color-button-disabled: var(--ngrey-70);

    /* design tokens for dashlets */
    --color-background-dashlet: var(--neutrals-5);
    --color-background-dashlet-hover: var(--neutrals-10);
    --color-border-dashlet: var(--neutrals-5);
    --color-border-dashlet-header: var(--grey-50);
    --color-text-dashlet-header: var(--grey-90);

    /* design tokens for typography */
    --color-text-main-primary: var(--ngrey-90);
    --color-text-main-secondary: var(--ngrey-80);
    --color-text-main-tertiary: var(--ngrey-70);
    --color-text-main-quaternary: var(--ngrey-60);

    /* design tokens for icons */
    --color-icon-info: var(--blue-60);
    --color-background-icon: var(--blue-10);
    --color-icon-action: var(--ngrey-70);
    --color-background-icon-counter: var(--red-80);

    /* design tokens for tabs */
    --color-tab: var(--color-text-main-primary);
    --color-border-tab: var(--blue-60);
    --color-background-hover-tab: var(--blue-10);
    --color-background-active-tab: var(--blue-60);
    --color-focus-tab: var(--blue-60);
    --color-active-tab: var(--neutrals-5);

    /* design tokens for wizard */
    --color-border-wizard: var(--ngrey-60);
    --color-background-wizard: var(--ngrey-60);
    --color-wizard: var(--neutrals-5);
    --color-wizard-label: var(--ngrey-60);
    --color-border-wizard-active: var(--blue-60);
    --color-background-wizard-active: var(--blue-60);
    --color-wizard-active: var(--neutrals-5);
    --color-wizard-active-label: var(--blue-60);

    /* design tokens for filter buttons */
    --color-filter-button: var(--color-text-main-primary);
    --color-border-filter-button: var(--blue-60);
    --color-border-hover-filter-button: var(--blue-50);
    --color-background-hover-filter-button: var(--blue-10);
    --color-background-active-filter-button: var(--blue-60);
    --color-border-focus-filter-button: var(--blue-50);
    --color-focus-filter-button: var(--blue-60);
    --color-active-filter-button: var(--neutrals-5);
}