:root {
    --background: #FFF;
    --background-secondary: #F7F7FB;
    --background-secondary-td: #e9e9f0;
    --hover: #E5E6F6;
    --border-color: #E5E6F6;
    --border-radius: 1rem;
    --box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.07);
    --font-color: #022873;
    --accent-color: #022873;
    --accent-color-secondary: #34538F;
    --accent-font-color: #FFF;
    --accent-font-color-secondary: #BF0404;
    --disabled-color: #EEE;
    --disabled-color-darker: #CCC;
    --green-color: #0C7A00;
    --icon-family: "fontAwesome";
    --light: 300;
    --regular: 400;
    --medium: 500;
    --semibold: 600;
    --bold: 700;
    --box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.07);
    --box-shadow-sticky: 0 2px 20px 0 rgba(0, 0, 0, 0.13);
    --box-shadow-large: 0 2px 10px 5px rgba(0, 0, 0, 0.13);
    --button-primary-color: var(--accent-font-color);
    --button-primary-background: var(--accent-color);
    --button-secondary-color: var(--accent-color);
    --button-secondary-background: var(--accent-color);
    --button-info-color: #FFF;
    --button-info-background: #4169e1;
    --button-danger-color: #FFF;
    --button-danger-background: #DC143C;
    --menu-font-color: #FFF;
    --menu-hovor-background: #34538F;
    --menu-font-color-secondary: #BF0404;
    --anchor-info-color: #4169e1;
    --anchor-danger-color: #DC143C;
    --gray-color: rgb(219, 223, 236);
    --scrollbar-color: #34538F;
    --scrollbar-background-color: #DBDFEC;
    --loader-button-color: #FFF;
    --loader-button-background: var(--green-color);
    /* for testing just overwrite existing last set value is used */
}



.ui-widget-header {
    color: var(--accent-font-color);
    background-color: var(--accent-color);
}

.ui-datepicker-calendar {
    width: 100%;
}

    .ui-datepicker-calendar th {
        text-align: center;
        color: var(--accent-color);
        text-transform: lowercase;
    }

    .ui-datepicker-calendar td a {
        text-align: center;
        color: var(--accent-color);
    }

        .ui-datepicker-calendar td a:hover {
            color: var(--accent-color-secondary);
        }

.ui-datepicker-header > .ui-icon {
    color: var(--accent-font-color);
}

.ui-state-active {
    background-color: var(--accent-color) !important;
    color: var(--accent-font-color) !important;
}