:root {
    /* ============ HAUPTFARBEN ============ */
    /* Primärfarben (Logo-Blau) */
    --rz-primary: #2c7bb6;
    --rz-primary-light: #4a9bd1;
    --rz-primary-dark: #1c5a85;
    --rz-primary-lighter: #7bb8e0;
    --rz-primary-darker: #0f3c5c;
    --rz-primary-subtle: #e8f4fc;
    /* Sekundärfarben (Logo-Grün) */
    --rz-secondary: #8bc53f;
    --rz-secondary-light: #a5d35f;
    --rz-secondary-dark: #6ea030;
    --rz-secondary-lighter: #c4e68f;
    --rz-secondary-darker: #4d7020;
    --rz-secondary-subtle: #f2f9e8;
    /* Akzentfarben (Logo-Grün für Success) */
    --rz-success: #8bc53f;
    --rz-success-light: #a5d35f;
    --rz-success-dark: #6ea030;
    --rz-success-lighter: #c4e68f;
    --rz-success-darker: #4d7020;
    --rz-success-subtle: #f2f9e8;
    /* Info-Farben (Logo-Blau) */
    --rz-info: #2c7bb6;
    --rz-info-light: #4a9bd1;
    --rz-info-dark: #1c5a85;
    --rz-info-lighter: #7bb8e0;
    --rz-info-darker: #0f3c5c;
    --rz-info-subtle: #e8f4fc;
    /* Warning (Dunkles Logo-Grün für Warnung) */
    --rz-warning: #6ea030;
    --rz-warning-light: #8bc53f;
    --rz-warning-dark: #4d7020;
    --rz-warning-lighter: #a5d35f;
    --rz-warning-darker: #2f4d15;
    --rz-warning-subtle: #f2f9e8;
    /* Danger (Dunkles Logo-Blau für Gefahr) */
    --rz-danger: #1c5a85;
    --rz-danger-light: #2c7bb6;
    --rz-danger-dark: #0f3c5c;
    --rz-danger-lighter: #4a9bd1;
    --rz-danger-darker: #082238;
    --rz-danger-subtle: #e8f4fc;
    /* ============ GRUNDFARBEN ============ */
    --rz-white: #ffffff;
    --rz-black: #1a1a1a;
    --rz-base: #f5f7fa;
    --rz-base-50: #fcfdfe;
    --rz-base-100: #f5f7fa;
    --rz-base-200: #e8ecf2;
    --rz-base-300: #d4dae3;
    --rz-base-400: #a8b2c1;
    --rz-base-500: #7c8a9f;
    --rz-base-600: #5a6b7d;
    --rz-base-700: #3e4c5b;
    --rz-base-800: #2a3339;
    --rz-base-900: #1a1f23;
    --rz-base-light: #f5f7fa;
    --rz-base-lighter: #ffffff;
    --rz-base-dark: #5a6b7d;
    --rz-base-darker: #1a1f23;
    /* ============ TEXT UND HINTERGRUND ============ */
    --rz-text-color: #2a3339;
    --rz-text-secondary: #5a6b7d;
    --rz-text-light: #ffffff;
    --rz-text-muted: #7c8a9f;
    --rz-background-color: #ffffff;
    --rz-surface-color: #fcfdfe;
    --rz-surface-hover: #f5f7fa;
    --rz-border-color: #e8ecf2;
    --rz-border-light: #f5f7fa;

    /* ============ HEADER UND SIDEBAR (Gleicher Farbton) ============ */
    --rz-header-background-color: #ffffff;
    --rz-sidebar-background-color: #ffffff;
    --rz-sidebar-item-background-color: #ffffff;
    --rz-sidebar-item-hover-background-color: #f5f7fa;
    --rz-sidebar-item-text-color: #2a3339;
    --rz-body-background-color: #f5f7fa;

    /* Karten-Hintergrund (hebt sich vom Body ab) */
    --rz-panel-background-color: #ffffff;
    --rz-card-background-color: #ffffff;
    /* ============ SERIES / CHART COLORS ============ */
    --rz-series-1: #2c7bb6; /* Logo-Blau */
    --rz-series-2: #8bc53f; /* Logo-Grün */
    --rz-series-3: #1c5a85; /* Dunkles Logo-Blau */
    --rz-series-4: #4a9bd1; /* Helles Logo-Blau */
    --rz-series-5: #a5d35f; /* Helles Logo-Grün */
    --rz-series-6: #6ea030; /* Dunkles Logo-Grün */
    --rz-series-7: #0f3c5c; /* Sehr dunkles Logo-Blau */
    --rz-series-8: #4d7020; /* Sehr dunkles Logo-Grün */
    --rz-series-9: #7bb8e0; /* Sehr helles Logo-Blau */
    --rz-series-10: #c4e68f; /* Sehr helles Logo-Grün */
}

/* ============ BLAZOR WASM LOADING ANIMATION ============ */
.loading-progress {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: clamp(6rem, 10vw, 12rem);
    height: clamp(6rem, 10vw, 12rem);
    z-index: 9999;
}

.loading-progress svg {
    width: 100%;
    height: 100%;
}

.loading-progress defs {
    width: 0;
    height: 0;
}

.loading-progress + .loading-progress-text {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, calc(-50% + clamp(4rem, 6vw, 8rem)));
    z-index: 9999;
}

.loading-progress circle {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: clamp(0.4rem, 1vw, 0.8rem);
    transform-origin: 50% 50%;
    transform: rotate(-90deg);
}

.loading-progress circle:last-child {
    stroke: url(#loading-gradient);
    stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
    transition: stroke-dasharray 0.05s ease-in-out;
}

.loading-progress-text {
    text-align: center;
    font-weight: bold;
    color: var(--rz-primary);
    white-space: nowrap;
    font-size: clamp(0.875rem, 2vw, 1.25rem);
}

.loading-progress-text:after {
    content: var(--blazor-load-percentage-text, "Lade...");
}

/* Styling für das Blazor Error UI */
#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* ============ SIDEBAR UND PANELMENU ANPASSUNGEN (Light Mode) ============ */
/* Sidebar-Items konsistent mit Header/Sidebar Background */
.rz-sidebar .rz-navigation-item,
.rz-sidebar .rz-panelmenu-item,
.panel-menu .rz-navigation-item,
.navigation-menu .rz-navigation-item {
    background-color: #ffffff;
    color: #2a3339;
}

/* Hover-Effekt für Sidebar-Items */
.rz-sidebar .rz-navigation-item:hover,
.rz-sidebar .rz-panelmenu-item:hover,
.panel-menu .rz-navigation-item:hover,
.navigation-menu .rz-navigation-item:hover {
    background-color: #f5f7fa;
}

/* Aktiver Menüpunkt */
.rz-sidebar .rz-navigation-item.rz-state-active,
.rz-sidebar .rz-panelmenu-item.rz-state-active,
.panel-menu .rz-navigation-item.rz-state-active,
.navigation-menu .rz-navigation-item.rz-state-active {
    background-color: #f5f7fa;
    border-left: 3px solid var(--rz-primary);
}

/* Icons in der Sidebar */
.rz-sidebar .rz-navigation-item-icon,
.rz-sidebar .rz-panelmenu-item-icon,
.panel-menu .rz-navigation-item-icon,
.navigation-menu .rz-navigation-item-icon {
    color: #5a6b7d;
}

/* Text in der Sidebar */
.rz-sidebar .rz-navigation-item-text,
.rz-sidebar .rz-panelmenu-item-text,
.panel-menu .rz-navigation-item-text,
.navigation-menu .rz-navigation-item-text {
    color: #2a3339;
}

/* Einstellungen-Button am Ende der Sidebar */
.rz-sidebar .rz-button,
.rz-sidebar button {
    background-color: #ffffff;
    color: #2a3339 !important;
    border-color: #e8ecf2;
}

.rz-sidebar .rz-button:hover,
.rz-sidebar button:hover {
    background-color: #f5f7fa;
}

/* Theme-Toggle-Button im Header */
.rz-header .rz-button {
    color: #2a3339 !important;
}

.rz-header .rz-button .rz-button-icon-left {
    color: #2a3339 !important;
}

/* PanelMenu Header */
.rz-panelmenu-header {
    background-color: #ffffff;
    color: #2a3339;
}

.rz-panelmenu-header:hover {
    background-color: #f5f7fa;
}

/* PanelMenu Content */
.rz-panelmenu-content {
    background-color: #ffffff;
}

/* Trenner/Border in der Sidebar */
.rz-sidebar {
    border-color: #e8ecf2;
}