:root {
    /* ===== Sidebar Theming ===== */
    --rz-panel-menu-hover-color: var(--vera-yellow);
    --rz-panel-menu-item-active-color: var(--vera-yellow);
    --rz-panel-menu-item-active-indicator: var(--vera-yellow);
    --rz-panel-menu-font-weight: 500;
    --rz-panel-menu-item-background-color: rgb(33 37 41 / 30%);
    --rz-panel-menu-item-2nd-level-hover-color: var(--vera-yellow);
    --rz-panel-menu-item-2nd-level-active-color: var(--vera-yellow);
    --rz-panel-menu-icon-font-size: 1.5rem;

    /* ===== Accordion Theming ===== */
    --rz-accordion-shadow: 0px 1px 2px rgba(69, 73, 79, 0.3), 0px 1px 3px 1px rgba(69, 73, 79, 0.15);

    /* ===== Dialog Theming ===== */
    --rz-dialog-z-index: 1002;
}

/* ===== Layout & Containers ===== */
.rz-dialog-content {
    height: 100%;
}

.rz-dialog-wrapper {
    z-index: var(--rz-dialog-z-index);
}

.rz-header {
    grid-area: rz-header;
    z-index: 2;
    background-color: var(--rz-header-background-color);
    min-height: var(--rz-header-min-height);
    border-bottom: var(--rz-header-border);
    color: var(--rz-header-color);
    box-shadow: var(--rz-header-shadow);
}

.rz-sidebar-expanded {
    width: 210px;
    opacity: 1;
}

/* ===== Components ===== */

/* --- Sidebar --- */
.rz-sidebar-collapsed {
    width: var(--rz-sidebar-icon-width) !important;
    --rz-panel-menu-icon-margin: 0; /* Removes excess width to achieve Icon Only Width*/
    --rz-panel-menu-item-2nd-level-padding: var(--spacing-2) var(--spacing-0); /* Removes excess width to achieve Icon Only Width*/
    opacity: 1;
}

/* Hide the text elements when in Icon Only Mode */
.rz-sidebar-collapsed :is(.rz-navigation-item-text, .rz-navigation-item-icon-children) {
    width: var(--spacing-0);
    opacity: 0;
}

/* Keep the Item Height uniform between the two modes */
.rz-sidebar-collapsed :is(.rz-navigation-item-link) {
    max-height: 44px;
}

.rz-sidebar-expanded :is(.rz-navigation-item-link) {
    max-height: 44px;
}

/* Show the text elements on hover */
.rz-sidebar-collapsed:hover :is(.rz-navigation-item-text, .rz-navigation-item-icon-children) {
    width: unset;
    opacity: unset;
    --rz-panel-menu-icon-margin: var(--spacing-0) var(--spacing-2) var(--spacing-0) var(--spacing-0);
    transition: opacity 0.35s ease-in;
}

.rz-sidebar-collapsed:hover :is(.rz-navigation-item-link) {
    width: 209px;
}

/* Expand the sidebar on hover */
.rz-sidebar-collapsed:hover {
    --rz-panel-menu-icon-margin: var(--spacing-0) var(--spacing-2) var(--spacing-0) var(--spacing-0); /* On Hover, increase space between Icon and text*/
}

/* Limit max width to force truncate for too long texts */
.rz-sidebar .rz-navigation-item-link .rz-navigation-item-text {
    max-width: 150px;
}

/* White PeopleX Version */
.rz-panel-menu {
    height: calc(100vh - var(--rz-header-min-height) - 3px - var(--sidebar-footer-height)); /* (-3px = missing from --rz-header-min-height) && (-40px = height of footer box) */
}

/* Hide/Display Bottom PeopleX Text*/
.rz-sidebar-collapsed :is(.ampol-version-footer-text) {
    display: none;
}

.rz-sidebar-collapsed:hover :is(.ampol-version-footer-text) {
    display: unset;
}

/* --- Tabs --- */
.rz-tabview-nav li a {
    justify-content: center;
    padding: var(--spacing-1) var(--spacing-1);
    min-width: 75px;
    color: var(--rz-primary-darker);
}

.rz-tabview-panel {
    padding: var(--rz-tabs-padding);
    height: 100%;
}

/* --- Accordion --- */
.rz-accordion-header a[role='tab'] {
    padding: var(--rz-accordion-item-padding);
    color: var(--rz-accordion-item-color);
    line-height: var(--rz-accordion-item-line-height);
    text-decoration: none;
    display: flex;
    align-items: center;
    /*font-size: 1.05rem;*/
    font-weight: bold;
}

.rz-accordion-content {
    padding-left: var(--spacing-8);
    padding-right: var(--spacing-8);
}

.rz-accordion-header {
    padding: var(--spacing-2);
}

.rz-accordion-header:not(:first-child) {
    border-top: 1px solid var(--rz-base-200) !important;
}

.rz-accordion-toggle-icon.rzi-chevron-right:before {
    content: "keyboard_arrow_right";
}

.rz-accordion-toggle-icon.rzi-chevron-down:before {
    content: "keyboard_arrow_down";
}

/* --- Forms & Inputs --- */
.rz-cell-filter-content {
    min-height: var(--spacing-10) !important;
}

.rz-selectbutton {
    outline: none !important;
}

.rz-autocomplete:not(:disabled):not(.rz-state-disabled):focus .rz-autocomplete-input:not(:disabled):not(.rz-state-disabled):focus .rz-radiobutton-box:not(:disabled):not(.rz-state-disabled):focus, .rz-chkbox-box:not(:disabled):not(.rz-state-disabled):focus .rz-colorpicker:not(:disabled):not(.rz-state-disabled):focus, .rz-lookup-search input:not(:disabled):not(.rz-state-disabled):focus, .rz-spinner:not(:disabled):not(.rz-state-disabled):focus, .rz-calendar .rz-inputtext:not(:disabled):not(.rz-state-disabled):focus, .rz-multiselect:not(:disabled):not(.rz-state-disabled):focus, .rz-dropdown:not(:disabled):not(.rz-state-disabled):focus, .mask:not(:disabled):not(.rz-state-disabled):focus, .rz-textarea:not(:disabled):not(.rz-state-disabled):focus, .rz-textbox:not(:disabled):not(.rz-state-disabled):focus {
    box-shadow: var(--rz-input-hover-shadow);
    border: 1px solid var(--color-border-focus);
}

.rz-autocomplete-input:focus {
    box-shadow: var(--rz-input-hover-shadow);
    border: 1px solid var(--color-border-focus);
}

.rz-autocomplete-input:hover:not(.rz-state-disabled), .rz-radiobutton-box:hover:not(.rz-state-disabled), .rz-chkbox-box:hover:not(.rz-state-disabled), .rz-colorpicker:not(:disabled):not(.rz-state-disabled):hover, .rz-lookup-search input:not(:disabled):not(.rz-state-disabled):hover, .rz-spinner:not(:disabled):not(.rz-state-disabled):hover, .rz-calendar .rz-inputtext:not(:disabled):not(.rz-state-disabled):hover, .rz-multiselect:not(:disabled):not(.rz-state-disabled):hover, .rz-dropdown:not(:disabled):not(.rz-state-disabled):hover, .mask:not(:disabled):not(.rz-state-disabled):hover, .rz-textarea:not(:disabled):not(.rz-state-disabled):hover, .rz-textbox:not(:disabled):not(.rz-state-disabled):hover {
    box-shadow: var(--rz-input-hover-shadow);
    border: 1px solid var(--color-border-focus);
}

.rz-multiselect, .rz-dropdown {
    display: inline-block;
}

.rz-dropdown-panel {
    width: auto !important;
}

.rz-multiselect-panel {
    width: auto !important;
}

.rz-checkbox-list-vertical > .rz-checkbox > .rz-chkbox-label {
    overflow-wrap: anywhere;
}

.projectFilter > .rz-checkbox > .rz-chkbox > .rz-chkbox-box > .rz-chkbox-icon {
    margin: var(--spacing-0);
}

/*.rz-textbox {
    background: url("search-icon-png-21.png") no-repeat var(--color-text-inverse);
    background-size: 15px;
    background-position: right center;
}
*/

/* --- Data Grid & Tables --- */
.rz-selectable tr {
    cursor: pointer;
}

/* --- Badges --- */
.RadzenBadge.datagrid-status-ongoing {
    color: var(--color-text-inverse);
    background-color: var(--color-status-ongoing);
}

.RadzenBadge.datagrid-status-cancelled {
    color: var(--color-text);
    background-color: var(--color-status-cancelled);
}

.RadzenBadge.datagrid-status-closed {
    color: var(--color-text);
    background-color: var(--color-status-closed);
}

.RadzenBadge.datagrid-status-inactive {
    color: var(--color-text);
    background-color: var(--color-status-inactive);
}

.RadzenBadge.datagrid-status-aftercare {
    color: var(--color-text);
    background-color: var(--color-status-aftercare);
}

.RadzenBadge.datagrid-status-refrain {
    color: var(--color-text);
    background-color: var(--color-status-refrain);
}

.RadzenBadge.datagrid-status-intermission {
    color: var(--color-text);
    background-color: var(--color-status-intermission);
}

.RadzenBadge.datagrid-status-no-state {
    color: var(--color-text-inverse);
    background-color: var(--color-status-neutral);
}

.RadzenBadge.datagrid-status-not-set {
    color: var(--color-text);
    background-color: var(--color-status-neutral);
}

.RadzenBadge.datagrid-status-booked {
    color: var(--color-text);
    background-color: var(--color-status-booked);
}

/* --- Misc --- */
.rz-card-roles {
    padding: var(--spacing-2) !important;
    box-shadow: none !important;
    background-color: var(--color-surface-alt) !important;
    border: none !important;
}

.rz-text-body1 {
    font-size: var(--font-size-base) !important;
}

.rz-color-on-primary-light {
    color: var(--rz-text-color) !important;
}

.rz-splitbutton-menu {
    max-height: 300px;
    overflow-x: scroll;
}