@font-face { 
    font-family: 'Poppins';
    src: url('../fonts/poppins.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto-Flex';
    src: url('../fonts/roboto-flex.ttf') format('truetype');
}

:root {
    --shadow-05: 0px 1px 1px rgba(0, 0, 0, 0.07), 0px 2px 1px rgba(0, 0, 0, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.07);
    --shadow-1: 0px 1px 1px rgba(0, 0, 0, 0.14), 0px 2px 1px rgba(0, 0, 0, 0.12), 0px 1px 3px rgba(0, 0, 0, 0.14);
    --shadow-2: 0px 2px 2px rgba(0, 0, 0, 0.14), 0px 3px 1px rgba(0, 0, 0, 0.12), 0px 1px 5px rgba(0, 0, 0, 0.14);
    --shadow-3: 0px 3px 4px rgba(0, 0, 0, 0.14), 0px 3px 3px rgba(0, 0, 0, 0.12), 0px 1px 8px rgba(0, 0, 0, 0.14);
    --shadow-4: 0px 4px 5px rgba(0, 0, 0, 0.14), 0px 1px 10px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14);
    --shadow-5: 0px 6px 10px rgba(0, 0, 0, 0.14), 0px 1px 18px rgba(0, 0, 0, 0.12), 0px 3px 5px rgba(0, 0, 0, 0.14);
    --shadow-6: 0px 8px 10px rgba(0, 0, 0, 0.14), 0px 3px 14px rgba(0, 0, 0, 0.12), 0px 5px 5px rgba(0, 0, 0, 0.14);
    --shadow-7: 0px 9px 12px rgba(0, 0, 0, 0.14), 0px 3px 16px rgba(0, 0, 0, 0.12), 0px 5px 6px rgba(0, 0, 0, 0.14);
    --shadow-8: 0px 12px 17px rgba(0, 0, 0, 0.14), 0px 5px 22px rgba(0, 0, 0, 0.12), 0px 7px 8px rgba(0, 0, 0, 0.14);
    --shadow-9: 0px 16px 24px rgba(0, 0, 0, 0.14), 0px 6px 30px rgba(0, 0, 0, 0.12), 0px 8px 10px rgba(0, 0, 0, 0.14);
    --shadow-10: 0px 24px 38px rgba(0, 0, 0, 0.14), 0px 9px 46px rgba(0, 0, 0, 0.12), 0px 11px 15px rgba(0, 0, 0, 0.14);
    --shadow-8-r: 0px 0px 16px rgba(0, 0, 0, 0.14), 0px 0px 10px rgba(0, 0, 0, 0.12), 0px 14px 10px rgba(0, 0, 0, 0.14);
    --blue: #007bff;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #28a745;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --success: #4caf50;
    --info: #2196f3;
    --warning: #ffef41;
    --danger: #f44336;
    --light: #eeeeee;
    --dark: #343a40;
    --scrollbar-background-color: transparent;
    --scrollbar-color: rgba(0, 0, 0, 0.14);
    --scrollbar-border-radius: 10px;
    --scrollbar-size: 14px;
    --main-font: 'Roboto-Flex';
    --logo-font: 'Poppins';
    --button-font: 'Poppins';
    --grid-cell-font: 'Roboto-Flex';
    --grid-header-font: 'Roboto-Flex';
    --opacity-transition: opacity 0.2s cubic-bezier(1,0,0,1);
    --top-row-height: 38px;
    --top-row-padding: 6px;
    --top-row-button-height: 26px;
    --top-row-font-size: 14px;
    --sidebar-width: 220px;
    --sidebar-hidden-width: 180px;
    --menu-font-size: 14px;
    /* inputs */
    --input-font: 'Roboto-Flex';
    --input-font-size: 9pt;
    --input-font-weight: 400;
    --input-label-font-weight: 400;
    --input-label-font-style: normal;
    --input-text-rendering: auto;
    --input-font-stretch: condensed;
    --input-optical-sizing: auto;
    --input-font-smoothing: subpixel-antialiased;
    --input-height: 22px;
    --input-hover-shadow: none;
    --input-focus-outline: none;
    --input-focus-outline-offset: 0px;
    --input-border: 1px solid lightgray;
    --input-background: none;
    --input-label-color: black;
    --input-label-background: none;
    --input-arrow-transform: rotateZ(180deg);
    
}