:root {
    /* Ensure Radzen primary variables resolve to app theme primary */
    --rz-primary: var(--primary-color);
    --rz-primary-color: var(--primary-color);
}

/* Radzen sidebar overrides */

/* Ensure sidebar has the proper background color */
.rz-sidebar {
    background-color: var(--primary-color) !important;
}

/* Menu panel background */
.rz-panel-menu {
    background-color: transparent !important;
}

/* Default styles for all menu items links */
.rz-panel-menu .rz-navigation-item-link {
    background-color: var(--primary-color) !important;
    color: white !important;
    cursor: pointer;
    text-decoration: none;
}

/* Style for parent menu items */
.rz-panel-menu > .rz-navigation-item > .rz-navigation-item-wrapper > .rz-navigation-item-link {
    background-color: var(--primary-color) !important;
    color: white !important;
}

/* Style for child menu items */
.rz-panel-menu .rz-navigation-item .rz-navigation-item .rz-navigation-item-link {
    background-color: var(--primary-color) !important;
    color: white !important;
}

/* Active menu item style */
.rz-panel-menu .menu-item-active .rz-navigation-item-link {
    background-color: white !important;
    color: var(--primary-color) !important;
}

/* Hover effect for all menu items */
.rz-panel-menu .rz-navigation-item-link:hover,
.rz-panel-menu .rz-navigation-item-wrapper:hover .rz-navigation-item-link {
    background-color: white !important;
    color: var(--primary-color) !important;
}

/* Active wrapper style */
.rz-panel-menu .rz-navigation-item-wrapper-active {
    background-color: white !important;
    color: var(--primary-color) !important;
    border-radius: 5px;
    margin: 4px 16px;
}

/* Fix for active child menu items */
.rz-panel-menu .rz-navigation-item .rz-navigation-item .rz-navigation-item-wrapper-active .rz-navigation-item-link {
    color: var(--primary-color) !important;
    background-color: white !important;
}



/* Icon colors */
.icon-active {
    color: var(--primary-color) !important;
}

.icon-inactive {
    color: white !important;
}

.icon-inactive:hover {
    color: var(--primary-color) !important;
}

.rz-panel-menu a.rz-navigation-item-link {
    background: var(--primary-color);
     cursor: pointer;
    text-decoration: none;
    color: white;
}
a.rz-navigation-item-link:hover {
    background: white;
    color: var(--primary-color);
}