:root {
    /* ============ HAUPTFARBEN ============ */
    /* Prim�rfarben (Blau) */
    --rz-primary: #1d6fa3;
    --rz-primary-light: #4a8dc2;
    --rz-primary-dark: #12486b;
    --rz-primary-lighter: #74aeda;
    --rz-primary-darker: #0b304a;
    --rz-primary-subtle: #e8f2fa;
    /* Sekund�rfarben (Orange) */
    --rz-secondary: #f39c12;
    --rz-secondary-light: #f8b84e;
    --rz-secondary-dark: #c87f0a;
    --rz-secondary-lighter: #fbd38a;
    --rz-secondary-darker: #8a5404;
    --rz-secondary-subtle: #fff4e0;
    /* Akzentfarben (T�rkis) */
    --rz-success: #2bb7a4;
    --rz-success-light: #58d2c2;
    --rz-success-dark: #1a8074;
    --rz-success-lighter: #85e6d8;
    --rz-success-darker: #0f5c54;
    --rz-success-subtle: #e6faf8;
    /* Info-Farben (zweites Blau) */
    --rz-info: #1d6fa3;
    --rz-info-light: #4a8dc2;
    --rz-info-dark: #12486b;
    --rz-info-lighter: #74aeda;
    --rz-info-darker: #0b304a;
    --rz-info-subtle: #e8f2fa;
    /* Warning (angepasst Orange-Gelb) */
    --rz-warning: #ffb347;
    --rz-warning-light: #ffd27f;
    --rz-warning-dark: #e68a00;
    --rz-warning-lighter: #ffe1a8;
    --rz-warning-darker: #b35a00;
    --rz-warning-subtle: #fff8ec;
    /* Danger (leicht r�tlicher Kontrast, optional aus CI) */
    --rz-danger: #e74c3c;
    --rz-danger-light: #ef6e64;
    --rz-danger-dark: #c0392b;
    --rz-danger-lighter: #f29c92;
    --rz-danger-darker: #8e2e22;
    --rz-danger-subtle: #fdecea;
    /* ============ GRUNDFARBEN ============ */
    --rz-white: #ffffff;
    --rz-black: #000000;
    --rz-base: #eeeeee;
    --rz-base-50: #fafafa;
    --rz-base-100: #f5f5f5;
    --rz-base-200: #eeeeee;
    --rz-base-300: #e0e0e0;
    --rz-base-400: #bdbdbd;
    --rz-base-500: #9e9e9e;
    --rz-base-600: #757575;
    --rz-base-700: #616161;
    --rz-base-800: #424242;
    --rz-base-900: #212121;
    --rz-base-light: #f5f5f5;
    --rz-base-lighter: #ffffff;
    --rz-base-dark: #757575;
    --rz-base-darker: #212121;
    /* ============ TEXT UND HINTERGRUND ============ */
    --rz-text-color: #1d6fa3;
    --rz-text-secondary: #6c757d;
    --rz-text-light: #ffffff;
    --rz-text-muted: #8a8a8a;
    --rz-background-color: #ffffff;
    --rz-surface-color: #f8f9fa;
    --rz-surface-hover: #e9ecef;
    --rz-border-color: #e0e0e0;
    --rz-border-light: #f0f0f0;
    /* ============ SERIES / CHART COLORS ============ */
    --rz-series-1: #1d6fa3; /* Prim�r Blau */
    --rz-series-2: #f39c12; /* Sekund�r Orange */
    --rz-series-3: #2bb7a4; /* Akzent T�rkis */
    --rz-series-4: #4a8dc2; /* Blau hell */
    --rz-series-5: #f8b84e; /* Orange hell */
    --rz-series-6: #58d2c2; /* T�rkis hell */
    --rz-series-7: #12486b; /* Blau dunkel */
    --rz-series-8: #c87f0a; /* Orange dunkel */
    --rz-series-9: #1a8074; /* T�rkis dunkel */
    --rz-series-10: #74aeda; /* Blau heller */
}

/* ============ 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;
    }