:root {
    --primary-color: #7873DE;
    --primary-dark-color: #4C4184;
    --primary-light-color: #9E9EF2;
    --primary-lighter-color: #B8B8F5;
    --primary-lightest-color: #E0E0FA;
    --primary-border-color: #9DA0EC;

    --secondary-color: #71CC98;
    --secondary-light-color: #9CDBB8;
    --secondary-lighter-color: #B8E5CC;
    --secondary-lightest-color: #DBF2E5;

    --white-color: #FFFFFF;
    --black-color: #333842;
    --dark-color: #3C3C3C;
    --primary-black-color: #1E1E1E;
    --black-dark: #090909;
    --darkest-color: #000000;

    --negative: #E97777;
    --warning: #ECC983;
    --mandatory: #C72727;

    --orange-color: #F06800;

    --green-color: #31B94E;
    --blue-color: #2196F3;
    --turquoise-color: #00C7BE;

    --brown-light: #AD6801;
    --brown: #B34D00;
    --yellow-color: #F5EE9C;
    --yellow-light-color: #FEF4C0;
    --red-light-color: #F7E1E1;
    --gray-darker-color: #6D6F70;
    --gray-dark-color: #606060;
    --gray-color: #ADB5BD;
    --gray-light-color: #E1E1E1;
    --gray-lighter-color: #F3F3F3;
    --gray-description-color: #A5A5A5;
    --gray-text-button-color: #737373;
    --gray-light-description-color: #BCBCBC;
    --disabled-gray-color: #5D6472;
    --disabled-lighter-gray-color: #DBDCE0;
    
    --border-darker-gray-color: #D1D5DB;
    --border-gray-color: #E4E4E4;
    --border-light-gray-color: #EDEDED;

    --button-gray-color: #F1F1F1;
    
    --divider-gray-color: #D9D9D9;

    --bg-gray-color: #F6F7F9;
    --bg-gray-dark-color: #EDEFF3;
    --bg-gray-light-color: #FBFBFB;
    --bg-primary-light-color: #EFF0FF;
    --bg-primary-lighter-color: #F5F5FF;
    --bg-divider-gray: #CDCDCD;
    --bg-red-light: #F5ECEE;
}