/* This file is only to set variables. Use the variables in "app.css" for general styling and "radzen.overwrite.css" to overwrite the radzen behaivor. */

:root {
    /*Backgrounds*/
    --myTracto-background-color: white;
    --myTracto-card-background-color: var(--myTracto-gray-100);
    --myTracto-filler-background-color: var(--myTracto-gray-200);
    --myTracto-fieldset-background-color: white;
    /*Texts*/
    --myTracto-default-text-color: var(--myTracto-gray-700);
    --myTracto-inverse-text-color: var(--myTracto-gray-100);
    --myTracto-headline-text-color: var(--myTracto-gray-800);
    --myTracto-card-text-color: var(--myTracto-gray-900);
    --myTracto-disabled-text-color: var(--myTracto-gray-550);
    --myTracto-placeholder-color: black;
    --myTracto-on-primary: black;
    --myTracto-faq-open-text: #000;
    --myTracto-dropdown-border-color: #000;
    /*Icons & Highlights*/
    --myTracto-default-icon-color: var(--myTracto-primary-color);
    --myTracto-logo-color: var(--myTracto-default-text-color);
    --myTracto-info-icon-hover-color: black;
    /*Divider*/
    --myTracto-app-divider-color: var(--myTracto-gray-300);
    /*Switch*/
    --myTracto-switch-knob-background-color: var(--myTracto-gray-300);
    /*Tables*/
    --myTracto-table-columns-background-color-darker: var(--myTracto-gray-200);
    --myTracto-table-columns--filter-background-color: var(--myTracto-gray-200);
    --myTracto-table-columns-background-color-lighter: white;
    --myTracto-table-header-border-color-bottom: black;
    --myTracto-table-filter-border-color: var(--myTracto-default-text-color);
    /*Buttons*/
    --myTracto-button-background-color: var(--myTracto-primary-color);
    --myTracto-button-text-color: var(--myTracto-gray-800);
    --myTracto-button-outline-text-color: var(--myTracto-gray-800);
    --myTracto-nav-button-background-color: var(--myTracto-gray-100);
    --myTracto-nav-button-hover-background-color: var(--myTracto-default-text-color);
    --myTracto-nav-button-hover-text: white;
    --myTracto-burger-button-hover-text: var(--myTracto-default-text-color);
    --myTracto-nav-button-text-color: var(--myTracto-default-text-color);
    --myTracto-nav-button-icon-color: var(--myTracto-primary-color);
    --myTracto-outline-button-border: var(--myTracto-primary-color);
    --myTracto-outline-button-hover-border: var(--myTracto-primary-color-lighter);
    --myTracto-outline-button-hover: var(--myTracto-primary-color-lighter);
    --myTracto-outline-button-hover-text: black;
    --myTracto-button-background-dark: var(--myTracto-gray-900);
    --myTracto-apply-filter-button-text: var(--myTracto-gray-800);
    /*Header Footer*/
    --myTracto-header-footer-divider-color: var(--myTracto-gray-300);
    --myTracto-footer-company-name: var(--myTracto-gray-550);
    /*Input*/
    --myTracto-input-border-color: black;
    --myTracto-input-border-color-disabled: var(--myTracto-gray-400);
    --myTracto-input-label-color: black;
    --myTracto-input-value-color: black;
    --myTracto-border-hover: 1px solid var(--myTracto-gray-400);
    /*Tabs*/
    --myTracto-tabs-tab-hover-background-color: var(--myTracto-gray-300);
    /* borders */
    --myTracto-badge-border: var(--myTracto-gray-500);
    /*Dialog*/
    --myTracto-dialog-mask-opacity: 0.7;
    --myTracto-dialog-border: none;
}