@font-face {
    font-family: "Roboto-Light";
    /* Not used */
    src: url("./assets/fonts/Roboto/Roboto-Light.ttf");
}

@font-face {
    font-family: "Roboto-Regular";
    /* Most used */
    src: url("./assets/fonts/Roboto/Roboto-Regular.ttf");
}

@font-face {
    font-family: "Roboto-Medium";
    /* Less used */
    src: url("./assets/fonts/Roboto/Roboto-Medium.ttf");
}

@font-face {
    font-family: "Roboto-Bold";
    /* Used to highlight as well as indicate selected text */
    src: url("./assets/fonts/Roboto/Roboto-Bold.ttf");
}

@font-face {
    font-family: "Roboto-Black";
    /* Not used */
    src: url("./assets/fonts/Roboto/Roboto-Black.ttf");
}

// Common colors
$zs-main-color: #ed8b00;
$zs-main-color-light: #FFFAF3;
$zs-logo-clr: #41889F;
$nav-itemHoverClr: #ed8b00;
$nav-dropdownActiveBgClr: #ED8B0026;
$nav-dropdownHoverBgClr: #FFFFFF33;
$nav-itembgClr: #e5eaef;
$activeClr: #ffffff;
$main-headerBgClr: #6e2b62;
$main-footerBgClr: #6e2b62;
$webkit-scrollbar-trackBgClr: #ebe8e8;
$webkit-scrollbar-thumbBgClr: rgb(196,
191,
191);
$webkit-scrollbar-thumbHoverBgClr: #555;
$node-drop-slotBgClr: #ddffee;
$node-drop-slotBrderClr: #888;
$node-content-wrapper-activeBgClr: #bbbbbb;
$node-content-wrapper-focusedBgClr: #eeeeee;
$node-content-wrapperHoverBgClr: #f7f7f7;
$node-content-wrapperHoverBoxShadow: #999;
$is-dragging-overBg: #dddddd;
$expand-treeBorder-leftClr: #23527c;
$nav-linkClr: rgb(255 255 255);
$action-goodClr: #24a148;
$action-dangerClr: #da1e28;
$color-white: #FFF;
$light-grey: #D0DDE6;
$grey: #888888;
$nav-itemBorderClr: #d0dde6;
$container-borderClr: #dee2e6;
$bg-gray: #E5E5E5;
$placeholder-clr: #98A4AE;
$hover-Bg-clr: #e9ecef;
$pagination-bg-clr: #B2BFC8;
$null_value_color: #A1DAD0;
$distinct_value_color: #50AF9E;
$non_distinct_value_color: #36756A;
// Data catalog - Tree colors
$tree-gray: #CCC;
$box-shadow: #b0c1d9;
$menu-bg-gray: #FAFAFA;
$tree-bg: #F2F2F2;

/*variables for buttons*/

// $btn-primary-border-color:#327F97;
// $btn-primary-background-color:#498493;
// $btn-primary-text-color:#FFFFFF;
// $btn-primary-hover-border-color:#0099C9;
// $btn-primary-hover-background-color:#499BBC;
// $btn-primary-hover-text-color:#FFFFFF;
// $btn-secondary-border-color:#327F97;
// $btn-secondary-background-color:transparent;
// $btn-secondary-text-color:#327F97;
// $btn-secondary-hover-border-color:#0099c9;
// $btn-secondary-hover-text-color:#138DBF;
:root {
    --primaryBtnBgColor: #498493;
    --primaryBtnTextColor: #ffffff;
    --primaryBtnBorderColor: #498493;
    --primaryBtnHoverBgColor: #499bbc;
    --primaryBtnHoverTextColor: #ffffff;
    --primaryBtnHoverBorderColor: #0099c9;
    --secondaryBtnBgColor: #ffffff;
    --secondaryBtnTextColor: #498493;
    --secondaryBtnBorderColor: #498493;
    --secondaryBtnHoverBgColor: #498493;
    --secondaryBtnHoverTextColor: #ffffff;
    --secondaryBtnHoverBorderColor: #498493;
    --fontFamilyBase: "Roboto-Regular";
    --fontFamilyMedium: "Roboto-Medium";
    --fontSizeBase: 0.84rem;
    --textColorBase: #53565A;
    --textColorDark: #74797D;
    --clickableElementClr: #327F97;
    --tableHeaderBgClr: #E5EAEF;
    --typeAheadSearchLeft: 0px;
    --typeAheadSearchMaxWidth: 500px;
}

$btn-primary-background-color: var(--primaryBtnBgColor);
$btn-primary-text-color: var(--primaryBtnTextColor);
$btn-primary-border-color: var(--primaryBtnBorderColor);
$btn-primary-hover-background-color: var(--primaryBtnHoverBgColor);
$btn-primary-hover-text-color: var(--primaryBtnHoverTextColor);
$btn-primary-hover-border-color: var(--primaryBtnHoverBorderColor);
$btn-secondary-background-color: var(--secondaryBtnBgColor);
$btn-secondary-text-color: var(--secondaryBtnTextColor);
$btn-secondary-border-color: var(--secondaryBtnBorderColor);
$btn-secondary-hover-background-color: var(--secondaryBtnHoverBgColor);
$btn-secondary-hover-text-color: var(--secondaryBtnHoverTextColor);
$btn-secondary-hover-border-color: var(--secondaryBtnHoverBorderColor);
$fontFamilyBase: var(--fontFamilyBase);
$fontFamilyMedium: var(--fontFamilyMedium);
$fontSizeBase: var(--fontSizeBase);
$text-color-base: var(--textColorBase);
$text-color-dark: var(--textColorDark);
$clickable-element-clr: var(--clickableElementClr);
$table-header-bg-clr: var(--tableHeaderBgClr);
$typeahead-search-position-left: var(--typeAheadSearchLeft);
$typeahead-search-max-width: var(--typeAheadSearchMaxWidth);