*{
    box-sizing: border-box;
}

:root{
    --my-primary-color: var(--my-blue);
    --my-secondary-color: var(--my-orange);
    --my-bg-color: var(--my-white);
    --my-text-black: #0b0b0b;
    --my-text-white: #fff;
    --my-blue: #1B4965;
    --my-orange: #EB2F1D;
    --my-white: #F4F5F9;
    --my-grey: #DDDFE6;
    --my-grey2: #e3e6f0;
}

.my-color-bg{
    background-color: var(--my-bg-color);
}

.my-white-color-bg{
    background-color: var(--my-grey2);
    /* background-color: #e1f2ff; */
    /* background-color: #ddefff; */
    /* background-color: #f9fdfe; */
    /* background-color: #f5fcff; */
    /* background-color: #eef2f3; */
}

.my-primary-color-bg{
    background-color: var(--my-primary-color);
    color: var(--my-white);
}

.my-secondary-color-bg{
    background-color: var(--my-secondary-color);
    color: var(--my-text-black);
}

.my-drawer .nav .nav-item .nav-link{
    text-decoration: none;
    color: var(--my-text-black) !important;
}
.my-drawer .nav .nav-item .nav-link:hover{
    background-color: var(--my-grey);
}

.my-drawer .nav .nav-item .nav-link.active{
    background-color: var(--my-primary-color);
    color: var(--my-white) !important;
    transition: all 0.2s linear;
}
.my-drawer .nav .nav-item .nav-link.active:hover{
    filter: saturate(0.8) contrast(150%);
    transition: all 0.1s linear;
}

.ui-datepicker {
    z-index: 10000 !important;
}

/* .my-drawer .collapse .nav .nav-item:has(.nav-link.active) { 
    background: red !important;
} */