@charset "UTF-8";

/*
 * J&H Telerik Theme Overrides for Telerik UI for Blazor 13+
 *
 * This file intentionally contains only CSS custom-property overrides.
 * Load the current Telerik Bootstrap theme BEFORE this file:
 *   _content/Telerik.UI.for.Blazor/css/kendo-theme-bootstrap/all.css
 *
 * The previous jhtheme.css was a full generated Telerik/Kendo theme copy.
 * Keeping old component selectors such as .k-button, .k-button-solid-base,
 * .k-input, .k-grid, etc. after the new Telerik theme can override the new
 * 13.x rendering and produce wrong colors/styles.
 */

:root {
    --kendo-color-app-surface: var(--color-surface);
    --kendo-color-on-app-surface: var(--color-on-surface);
    --kendo-color-subtle: #757575;
    --kendo-color-surface: var(--color-surface-subtle);
    --kendo-color-surface-alt: var(--color-surface);
    --kendo-color-border: rgba(0, 0, 0, 0.12);
    --kendo-color-border-alt: rgba(0, 0, 0, 0.15);
    --kendo-color-base-subtle: var(--color-base-subtle);
    --kendo-color-base-subtle-hover: hsl(from var(--color-base-subtle) h s calc(l - var(--color-hover-offset)));
    --kendo-color-base-subtle-active: hsl(from var(--color-base-subtle) h s calc(l - var(--color-active-offset)));
    --kendo-color-base: var(--color-base);
    --kendo-color-base-hover: hsl(from var(--color-base) h s calc(l - var(--color-hover-offset)));
    --kendo-color-base-active: hsl(from var(--color-base) h s calc(l - var(--color-active-offset)));
    --kendo-color-base-emphasis: #adadad;
    --kendo-color-base-on-subtle: #212121;
    --kendo-color-on-base: var(--color-on-base);
    --kendo-color-base-on-surface: #212121;
    --kendo-color-primary-subtle: #d1d5ee;
    --kendo-color-primary-subtle-hover: #c5cae8;
    --kendo-color-primary-subtle-active: #b5bde3;
    --kendo-color-primary: var(--color-primary);
    --kendo-color-primary-hover: hsl(from var(--color-primary) h s calc(l - var(--color-hover-offset)));
    --kendo-color-primary-active: hsl(from var(--color-primary) h s calc(l - var(--color-active-offset)));
    --kendo-color-primary-emphasis: #97a0d7;
    --kendo-color-primary-on-subtle: #161c3f;
    --kendo-color-on-primary: var(--color-on-primary);
    --kendo-color-primary-on-surface: var(--color-primary);
    --kendo-color-secondary-subtle: #fbcdd9;
    --kendo-color-secondary-subtle-hover: #f9afc3;
    --kendo-color-secondary-subtle-active: #f79bb3;
    --kendo-color-secondary: var(--color-secondary);
    --kendo-color-secondary-hover: hsl(from var(--color-secondary) h s calc(l - var(--color-hover-offset)));
    --kendo-color-secondary-active: hsl(from var(--color-secondary) h s calc(l - var(--color-active-offset)));
    --kendo-color-secondary-emphasis: #f58da9;
    --kendo-color-secondary-on-subtle: #500c22;
    --kendo-color-on-secondary: var(--color-on-secondary);
    --kendo-color-secondary-on-surface: #ae1549;
    --kendo-color-tertiary-subtle: #c9dbd8;
    --kendo-color-tertiary-subtle-hover: #a9c6c1;
    --kendo-color-tertiary-subtle-active: #92b8b1;
    --kendo-color-tertiary: var(--color-tertiary);
    --kendo-color-tertiary-hover: hsl(from var(--color-tertiary) h s calc(l - var(--color-hover-offset)));
    --kendo-color-tertiary-active: hsl(from var(--color-tertiary) h s calc(l - var(--color-active-offset)));
    --kendo-color-tertiary-emphasis: #84aea7;
    --kendo-color-tertiary-on-subtle: #002520;
    --kendo-color-on-tertiary: var(--color-on-tertiary);
    --kendo-color-tertiary-on-surface: #054f46;
    --kendo-color-info-subtle: #c8d7fb;
    --kendo-color-info-subtle-hover: #a7c0f7;
    --kendo-color-info-subtle-active: #8fb0f6;
    --kendo-color-info: #0058e9;
    --kendo-color-info-hover: #0251d6;
    --kendo-color-info-active: #034ac3;
    --kendo-color-info-emphasis: #80a5f4;
    --kendo-color-info-on-subtle: #071f51;
    --kendo-color-on-info: #ffffff;
    --kendo-color-info-on-surface: #0443b0;
    --kendo-color-success-subtle: #d7f0cc;
    --kendo-color-success-subtle-hover: #bae2ad;
    --kendo-color-success-subtle-active: #a7db97;
    --kendo-color-success: #37b400;
    --kendo-color-success-hover: #33a600;
    --kendo-color-success-active: #2e9704;
    --kendo-color-success-emphasis: #93d775;
    --kendo-color-success-on-subtle: #163f09;
    --kendo-color-on-success: #ffffff;
    --kendo-color-success-on-surface: #2b8906;
    --kendo-color-warning-subtle: #fff0ce;
    --kendo-color-warning-subtle-hover: #ffe7b0;
    --kendo-color-warning-subtle-active: #ffe19c;
    --kendo-color-warning: #ffc000;
    --kendo-color-warning-hover: #ebb201;
    --kendo-color-warning-active: #d6a202;
    --kendo-color-warning-emphasis: #ffdd8f;
    --kendo-color-warning-on-subtle: #59430a;
    --kendo-color-on-warning: #000000;
    --kendo-color-warning-on-surface: #ffc000;
    --kendo-color-error-subtle: #fcc7c2;
    --kendo-color-error-subtle-hover: #feafa8;
    --kendo-color-error-subtle-active: #fe9a91;
    --kendo-color-error: #f31700;
    --kendo-color-error-hover: #e01701;
    --kendo-color-error-active: #cc1505;
    --kendo-color-error-emphasis: #fc8d83;
    --kendo-color-error-on-subtle: #550c07;
    --kendo-color-on-error: #ffffff;
    --kendo-color-error-on-surface: #b91406;
    --kendo-color-light-subtle: #fafafa;
    --kendo-color-light-subtle-hover: #f5f5f5;
    --kendo-color-light-subtle-active: #eeeeee;
    --kendo-color-light: #f5f5f5;
    --kendo-color-light-hover: #ebebeb;
    --kendo-color-light-active: #d6d6d6;
    --kendo-color-light-emphasis: #e0e0e0;
    --kendo-color-light-on-subtle: #212121;
    --kendo-color-on-light: #000000;
    --kendo-color-light-on-surface: #ebebeb;
    --kendo-color-dark-subtle: #c7c7c7;
    --kendo-color-dark-subtle-hover: #c2c2c2;
    --kendo-color-dark-subtle-active: #bdbdbd;
    --kendo-color-dark: #424242;
    --kendo-color-dark-hover: #212121;
    --kendo-color-dark-active: #000000;
    --kendo-color-dark-emphasis: #9e9e9e;
    --kendo-color-dark-on-subtle: #212121;
    --kendo-color-on-dark: #ffffff;
    --kendo-color-dark-on-surface: #616161;
    --kendo-color-inverse-subtle: #c7c7c7;
    --kendo-color-inverse-subtle-hover: #c2c2c2;
    --kendo-color-inverse-subtle-active: #bdbdbd;
    --kendo-color-inverse: #424242;
    --kendo-color-inverse-hover: #212121;
    --kendo-color-inverse-active: #000000;
    --kendo-color-inverse-emphasis: #9e9e9e;
    --kendo-color-inverse-on-subtle: #212121;
    --kendo-color-on-inverse: #ffffff;
    --kendo-color-inverse-on-surface: #616161;
    --kendo-color-series-a: #9c27b0;
    --kendo-color-series-a-bold: #751d84;
    --kendo-color-series-a-bolder: #4e1458;
    --kendo-color-series-a-subtle: #b55dc4;
    --kendo-color-series-a-subtler: #cd93d7;
    --kendo-color-series-b: #2196f3;
    --kendo-color-series-b-bold: #1971b6;
    --kendo-color-series-b-bolder: #114b7a;
    --kendo-color-series-b-subtle: #59b0f6;
    --kendo-color-series-b-subtler: #90cbf9;
    --kendo-color-series-c: #009688;
    --kendo-color-series-c-bold: #007166;
    --kendo-color-series-c-bolder: #004b44;
    --kendo-color-series-c-subtle: #40b0a6;
    --kendo-color-series-c-subtler: #80cbc4;
    --kendo-color-series-d: #ffeb3b;
    --kendo-color-series-d-bold: #bfb02c;
    --kendo-color-series-d-bolder: #80761e;
    --kendo-color-series-d-subtle: #fff06c;
    --kendo-color-series-d-subtler: #fff59d;
    --kendo-color-series-e: #f44336;
    --kendo-color-series-e-bold: #b73229;
    --kendo-color-series-e-bolder: #7a221b;
    --kendo-color-series-e-subtle: #f77268;
    --kendo-color-series-e-subtler: #faa19b;
    --kendo-color-series-f: #4caf50;
    --kendo-color-series-f-bold: #39833c;
    --kendo-color-series-f-bolder: #265828;
    --kendo-color-series-f-subtle: #79c37c;
    --kendo-color-series-f-subtler: #a6d7a8;
}

:root {
    --kendo-elevation-1: 0px 1px 3px 0px rgba(0, 0, 0, 0.2), 0px 2px 1px 0px rgba(0, 0, 0, 0.12), 0px 1px 1px 0px rgba(0, 0, 0, 0.14);
    --kendo-elevation-2: 0px 1px 5px 0px rgba(0, 0, 0, 0.2), 0px 3px 1px 0px rgba(0, 0, 0, 0.12), 0px 2px 2px 0px rgba(0, 0, 0, 0.14);
    --kendo-elevation-3: 0px 1px 8px 0px rgba(0, 0, 0, 0.2), 0px 3px 3px 0px rgba(0, 0, 0, 0.12), 0px 3px 4px 0px rgba(0, 0, 0, 0.14);
    --kendo-elevation-4: 0px 2px 4px 0px rgba(0, 0, 0, 0.2), 0px 1px 10px 0px rgba(0, 0, 0, 0.12), 0px 4px 5px 0px rgba(0, 0, 0, 0.14);
    --kendo-elevation-5: 0px 3px 5px 0px rgba(0, 0, 0, 0.2), 0px 1px 18px 0px rgba(0, 0, 0, 0.12), 0px 6px 10px 0px rgba(0, 0, 0, 0.14);
    --kendo-elevation-6: 0px 5px 5px 0px rgba(0, 0, 0, 0.2), 0px 3px 14px 0px rgba(0, 0, 0, 0.12), 0px 8px 10px 0px rgba(0, 0, 0, 0.14);
    --kendo-elevation-7: 0px 7px 8px 0px rgba(0, 0, 0, 0.2), 0px 5px 22px 0px rgba(0, 0, 0, 0.12), 0px 12px 17px 0px rgba(0, 0, 0, 0.14);
    --kendo-elevation-8: 0px 8px 10px rgba(0, 0, 0, 0.2), 0px 6px 30px rgba(0, 0, 0, 0.12), 0px 16px 24px rgba(0, 0, 0, 0.14);
    --kendo-elevation-9: 0px 11px 15px rgba(0, 0, 0, 0.2), 0px 9px 46px rgba(0, 0, 0, 0.12), 0px 24px 38px rgba(0, 0, 0, 0.14);
}

:root {
    --kendo-font-family: var(--font-family);
    --kendo-font-size: 0.875rem;
    --kendo-line-height: 2;
    --kendo-font-weight: 400;
    --kendo-letter-spacing:;
    --kendo-font-size-xs: 0.625rem;
    --kendo-font-size-sm: 0.75rem;
    --kendo-font-size-md: 0.875rem;
    --kendo-font-size-lg: 1rem;
    --kendo-font-size-xl: 1.25rem;
    --kendo-line-height-xs: 1;
    --kendo-line-height-sm: 1.2;
    --kendo-line-height-md: 2;
    --kendo-line-height-lg: 1.5;
    --kendo-font-weight-thin: 100;
    --kendo-font-weight-extra-light: 200;
    --kendo-font-weight-light: 300;
    --kendo-font-weight-normal: 400;
    --kendo-font-weight-medium: 500;
    --kendo-font-weight-semibold: 600;
    --kendo-font-weight-bold: 700;
    --kendo-letter-spacing-tightest: -2.5px;
    --kendo-letter-spacing-tighter: -1.5px;
    --kendo-letter-spacing-tight: -0.5px;
    --kendo-letter-spacing-normal: 0px;
    --kendo-letter-spacing-wide: 0.15px;
    --kendo-letter-spacing-wider: 0.25px;
    --kendo-letter-spacing-widest: 0.35px;
    --kendo-font-family-sans-serif: Roboto, Helvetica Neue, sans-serif;
    --kendo-font-family-monospace: Consolas, Ubuntu Mono, Lucida Console, Courier New, monospace;
}

:root {
    --kendo-spacing-0: 0px;
    --kendo-spacing-1px: 1px;
    --kendo-spacing-0\.5: 0.125rem;
    --kendo-spacing-1: 0.25rem;
    --kendo-spacing-1\.5: 0.375rem;
    --kendo-spacing-2: 0.5rem;
    --kendo-spacing-2\.5: 0.625rem;
    --kendo-spacing-3: 0.75rem;
    --kendo-spacing-3\.5: 0.875rem;
    --kendo-spacing-4: 1rem;
    --kendo-spacing-4\.5: 1.125rem;
    --kendo-spacing-5: 1.25rem;
    --kendo-spacing-5\.5: 1.375rem;
    --kendo-spacing-6: 1.5rem;
    --kendo-spacing-6\.5: 1.625rem;
    --kendo-spacing-7: 1.75rem;
    --kendo-spacing-7\.5: 1.875rem;
    --kendo-spacing-8: 2rem;
    --kendo-spacing-9: 2.25rem;
    --kendo-spacing-10: 2.5rem;
    --kendo-spacing-11: 2.75rem;
    --kendo-spacing-12: 3rem;
    --kendo-spacing-13: 3.25rem;
    --kendo-spacing-14: 3.5rem;
    --kendo-spacing-15: 3.75rem;
    --kendo-spacing-16: 4rem;
    --kendo-spacing-17: 4.25rem;
    --kendo-spacing-18: 4.5rem;
    --kendo-spacing-19: 4.75rem;
    --kendo-spacing-20: 5rem;
    --kendo-spacing-21: 5.25rem;
    --kendo-spacing-22: 5.5rem;
    --kendo-spacing-23: 5.75rem;
    --kendo-spacing-24: 6rem;
    --kendo-spacing-25: 7rem;
    --kendo-spacing-26: 8rem;
    --kendo-spacing-27: 9rem;
    --kendo-spacing-28: 10rem;
    --kendo-spacing-29: 11rem;
    --kendo-spacing-30: 12rem;
}

:root {
    --kendo-border-radius-none: 0px;
    --kendo-border-radius-xs: 1px;
    --kendo-border-radius-sm: calc(var(--border-radius) / 2);
    --kendo-border-radius-md: var(--border-radius);
    --kendo-border-radius-lg: calc(var(--border-radius) * 2);
    --kendo-border-radius-xl: calc(var(--border-radius) * 3);
    --kendo-border-radius-xxl: calc(var(--border-radius) * 4);
    --kendo-border-radius-xxxl: calc(var(--border-radius) * 5);
    --kendo-border-radius-full: 9999px;
}

/*
 * Optional J&H/Telerik custom rules should be added below this line only as
 * small, explicit overrides. Avoid broad component resets like:
 *   .k-button { background: none; color: inherit; }
 *   .k-input { ... }
 *   .k-grid { ... }
 * because Telerik 13+ relies on the main component classes for default styling.
 */

/* J&H Default Telerik Button / ThemeColor.Base */
:root {
    --jh-button-base-bg: #ffffff;
    --jh-button-base-bg-hover: #f8f9fb;
    --jh-button-base-bg-active: #eef1f5;
    --jh-button-base-border: #d0d5dd;
    --jh-button-base-border-hover: #b8c0cc;
    --jh-button-base-border-active: #98a2b3;
    --jh-button-base-text: #344054;
    --jh-button-base-text-hover: #1d2939;
    --jh-button-base-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
    --jh-button-base-focus-shadow: 0 0 0 0.2rem rgba(52, 64, 84, 0.14);
}

/* Alle Telerik Buttons */
.k-button,
.k-button-solid-primary,
.k-button-flat-primary,
.k-button-outline-primary {
    text-transform: uppercase;
    font-weight: 500;
}

/* Expliziter Base-Button */
.k-button.k-button-solid-base,
.k-button.k-button-base {
    color: var(--jh-button-base-text);
    background-color: var(--jh-button-base-bg);
    border-color: var(--jh-button-base-border);
    box-shadow: var(--jh-button-base-shadow);
}

    /* Hover */
    .k-button.k-button-solid-base:hover,
    .k-button.k-button-base:hover {
        color: var(--jh-button-base-text-hover);
        background-color: var(--jh-button-base-bg-hover);
        border-color: var(--jh-button-base-border-hover);
    }

    /* Active / gedrückt */
    .k-button.k-button-solid-base:active,
    .k-button.k-button-base:active,
    .k-button.k-button-solid-base.k-active,
    .k-button.k-button-base.k-active {
        color: var(--jh-button-base-text-hover);
        background-color: var(--jh-button-base-bg-active);
        border-color: var(--jh-button-base-border-active);
    }

    /* Fokus per Tastatur */
    .k-button.k-button-solid-base:focus-visible,
    .k-button.k-button-base:focus-visible {
        box-shadow: var(--jh-button-base-focus-shadow);
    }

/* Nur falls Standardbuttons ohne ThemeColor keine k-button-base-Klasse bekommen */
.k-button:not(.k-button-solid-primary):not(.k-button-primary):not(.k-button-solid-secondary):not(.k-button-secondary):not(.k-button-solid-success):not(.k-button-success):not(.k-button-solid-warning):not(.k-button-warning):not(.k-button-solid-error):not(.k-button-error):not(.k-button-solid-info):not(.k-button-info) {
    color: var(--jh-button-base-text);
    background-color: var(--jh-button-base-bg);
    border-color: var(--jh-button-base-border);
    box-shadow: var(--jh-button-base-shadow);
    text-transform: uppercase;
    font-weight: 500;
}

/* Anpassung der Validierungsnachrichten */
.k-validation-message,
.validation-message,
.k-form-error {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    color: #b42318;
}