@charset "UTF-8";

/* ============================================================
   Default LogoPopover – frosted glass (applies to all LogoPopovers)
   ============================================================ */
.lo-glass-popover.k-popup {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

.lo-glass-popover .k-popover-inner,
.lo-glass-popover.k-popover-inner {
    backdrop-filter: blur(14px) saturate(1.5) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.5) !important;
    background: color-mix(in srgb, var(--lo-bg-color) 84%, var(--lo-text-color-reversed) 16%) !important;
    border: 1px solid color-mix(in srgb, var(--lo-border-color-light) 78%, transparent) !important;
    border-radius: var(--lo-border-radius) !important;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.15),
        inset 0 0 0 1px color-mix(in srgb, var(--lo-border-color-light) 42%, transparent) !important;
    padding: 0 !important;
}

.lo-glass-popover .k-popover-body {
    padding: 0 !important;
}

.lo-glass-popover .k-popover-callout {
    backdrop-filter: blur(14px) saturate(1.5) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.5) !important;
    background: color-mix(in srgb, var(--lo-bg-color) 84%, var(--lo-text-color-reversed) 16%) !important;
    border-color: color-mix(in srgb, var(--lo-border-color-light) 60%, transparent) !important;
}

/* User Avatar Popup – inner content specifics */
.logo-avatar-glass-popover .lav-content {
    background: var(--lo-input-color) !important;
    border-radius: calc(var(--lo-border-radius) - 2px) !important;
    border: 1px solid var(--lo-border-color-light) !important;
    margin: 8px !important;
    padding: 8px !important;
    overflow: hidden !important;
    color: var(--lo-text-color) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14) !important;
}

.logo-avatar-glass-popover .lav-content .logo-custom-content-container {
    box-shadow: none !important;
    border: none !important;
    background-color: transparent !important;
}

/* Grid Settings Strip – outer Telerik portal wrapper: fully transparent */
.lgs-glass-popover.k-popup {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* Grid Settings Strip – the visible popup box: frosted glass */
.lgs-glass-popover .k-popover-inner,
.lgs-glass-popover.k-popover-inner {
    backdrop-filter: blur(14px) saturate(1.5) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.5) !important;
    background: color-mix(in srgb, var(--lo-bg-color) 84%, var(--lo-text-color-reversed) 16%) !important;
    border: 1px solid color-mix(in srgb, var(--lo-border-color-light) 78%, transparent) !important;
    border-radius: var(--lo-border-radius) !important;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.15),
        inset 0 0 0 1px color-mix(in srgb, var(--lo-border-color-light) 42%, transparent) !important;
    padding: 0 !important;
}

.lgs-glass-popover .k-popover-body {
    padding: 0 !important;
}

/* Arrow/callout: frosted glass to match popup */
.lgs-glass-popover .k-popover-callout {
    backdrop-filter: blur(14px) saturate(1.5) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.5) !important;
    background: color-mix(in srgb, var(--lo-bg-color) 84%, var(--lo-text-color-reversed) 16%) !important;
    border-color: color-mix(in srgb, var(--lo-border-color-light) 60%, transparent) !important;
}

/* Content area: white inner box with 10px frosted glass border */
.lgs-popover-content {
    background: var(--lo-input-color) !important;
    border-radius: var(--lo-border-radius) !important;
    border: 1px solid var(--lo-border-color-light) !important;
    margin: 10px !important;
    overflow: hidden !important;
    padding: 4px !important;
    color: var(--lo-text-color) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14) !important;
}
:root {
/*    !*Hier werden globale Custom-Css-variablen erstellt*!
    --lo-bg-color: #fafafa;*/
    /*--custom-wolf-software-background-color-gridselect: #32aae130;*/
    --custom-wolf-software-background-color-gridselect: var(--lo-selection-highlight-color);
    /*--lo-bg-color-alpha-1: #f8f8f8;
    --lo-bg-color-alpha-2: #e6e6e680;
    --lo-bg-color-alpha-3: #fafafa80;
    --lo-bg-color-alpha-4: #e6e6e610;*/
    --custom-button-focus-color: #32aae1;
    --custom-wolf-software-red: #e64b14;
    --custom-wolf-software-yellow: #fab432;
    --custom-wolf-software-green: #96c319;
    --custom-wolf-software-blue: #32aae1;

    --custom-wolf-software-border-color: #e6e6e6;
    --custom-wolf-software-darker-border-color: #b8b8b8;

    --custom-wolf-software-text-reversed-color: #3c3c3c; /*im aktuellen layout wird keine reversed color benutzt daher ist diese die normale textcolor*/
    --custom-wolf-software-header-font-family: 'Open Sans', Arial, sans-serif;
    --custom-wolf-software-header-font-weight: 800;
    --custom-wolf-software-header-font-style: italic;
    --custom-wolf-software-header-font-transform: uppercase;
    --custom-wolf-software-header-font-size-h6: 0.9rem;

}

.custom-wolf-software-h6-header{
    color: rgb(60 60 60);
    font-family: var(--custom-wolf-software-header-font-family), serif;
    font-weight: var(--custom-wolf-software-header-font-weight);
    font-size: var(--custom-wolf-software-header-font-size-h6);
    font-style: var(--custom-wolf-software-header-font-style);
    text-transform: var(--custom-wolf-software-header-font-transform);
}
h2{
    color: rgb(60 60 60);
    font-family: 'Open Sans',Arial,sans-serif;
    font-weight: 800;
    font-style: italic;
    text-transform: uppercase;
}
h3{
    color: rgb(60 60 60);
    font-family: 'Open Sans',Arial,sans-serif;
    font-weight: 800;
    font-style: italic;
    text-transform: uppercase;
}
h4{
    color: rgb(60 60 60);
    font-family: 'Open Sans',Arial,sans-serif;
    font-weight: 800;
    font-style: italic;
    font-size: 1.2rem;
    text-transform: uppercase;
}
h5{
    color: rgb(60 60 60);
    font-family: 'Open Sans',Arial,sans-serif;
    font-weight: 800;
    font-style: italic;

    text-transform: uppercase;
}
h6{
    color: rgb(60 60 60);
    font-family: 'Open Sans',Arial,sans-serif;
    font-weight: 800;
    font-size: 0.9rem;
    font-style: italic;
    text-transform: uppercase;
    margin: 0;
    padding-left: 2px;
}
label:empty::before {
    content: "\200B";           /* Zero-Width Space → erzeugt eine Zeile */
}

/* ================================================================
   Burger Sidebar — Telerik Vertical Menu Overrides
   ================================================================ */

/* Horizontales Main-Menü: eigener, template-steuerbarer Hintergrund */
.custom-menu,
.custom-menu.k-menu,
.custom-menu .k-menu,
.custom-menu.k-menu-horizontal,
.custom-menu .k-menu.k-menu-horizontal,
.cmb-wrapper .k-menu.k-menu-horizontal {
    background-color: var(--lo-mainmenu-bg-color) !important;
}

/* Base: full-width menu — Farbe des Browser-Tabs (nicht der Tab-Leiste) */
.cmb-sidebar .k-menu.k-menu-vertical {
    width: 100%;
    color-scheme: light dark;
    background-color: var(--lo-mainmenu-bg-color) !important;
}

/* Sidebar settings — entfernt App-Theme-Hintergrund von inneren Buttons */
.cmb-sidebar .lo-bg {
    background-color: transparent !important;
}
.cmb-sidebar .lo-bg-control {
    background-color: transparent !important;
}
.cmb-sidebar .lo-text {
    color: light-dark(#3c3c3c, #e8eaed) !important;
}

/* Sidebar Telerik Menü — Schrift- und Iconfarbe folgt Browser-Modus */
.cmb-sidebar .k-link,
.cmb-sidebar .k-menu-link,
.cmb-sidebar .k-menu-link-text {
    color: light-dark(#3c3c3c, #e8eaed) !important;
}
.cmb-sidebar .k-svg-icon svg {
    fill: light-dark(#3c3c3c, #e8eaed) !important;
}
.cmb-sidebar .k-menu-expand-arrow svg,
.cmb-sidebar .k-menu-expand-arrow .k-svg-icon svg {
    fill: light-dark(#3c3c3c, #e8eaed) !important;
}

.cmb-sidebar-menu .k-menu-item {
    width: 100%;
}

/* Collapsed: constrain menu and items to sidebar width */
.cmb-sidebar--collapsed .k-menu.k-menu-vertical {
    min-width: 0 !important;
    width: 44px !important;
}

.cmb-sidebar--collapsed .k-menu-item,
.cmb-sidebar--collapsed .k-item {
    min-width: 0 !important;
    width: 44px !important;
}

/* Collapsed: center-align the icon inside each link */
.cmb-sidebar--collapsed .k-link,
.cmb-sidebar--collapsed .k-menu-link {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
    width: 44px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* Collapsed: hide link text completely */
.cmb-sidebar--collapsed .k-menu-link-text {
    display: none !important;
}

/* Collapsed: hide expand arrow */
.cmb-sidebar--collapsed .k-menu-expand-arrow {
    display: none !important;
}

/* Collapsed: keep icons visible and properly sized */
.cmb-sidebar--collapsed .k-icon,
.cmb-sidebar--collapsed .k-svg-icon {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex-shrink: 0 !important;
    pointer-events: none;
}

/* Expanded: show link text normally */
.cmb-sidebar--expanded .k-menu-link-text {
    display: flex !important;
    opacity: 1;
}

/* Active / hovered / focused menu items — primary color background, white text */
.cmb-sidebar .k-menu-item.k-hover > .k-link,
.cmb-sidebar .k-menu-item.k-hover > .k-menu-link,
.cmb-sidebar .k-menu-item.k-focus > .k-link,
.cmb-sidebar .k-menu-item.k-focus > .k-menu-link,
.cmb-sidebar .k-menu-item.k-selected > .k-link,
.cmb-sidebar .k-menu-item.k-selected > .k-menu-link {
    color: white !important;
    background-color: var(--lo-primary-color) !important;
}
.cmb-sidebar .k-menu-item.k-hover > .k-link .k-svg-icon svg,
.cmb-sidebar .k-menu-item.k-hover > .k-menu-link .k-svg-icon svg,
.cmb-sidebar .k-menu-item.k-focus > .k-link .k-svg-icon svg,
.cmb-sidebar .k-menu-item.k-focus > .k-menu-link .k-svg-icon svg,
.cmb-sidebar .k-menu-item.k-selected > .k-link .k-svg-icon svg,
.cmb-sidebar .k-menu-item.k-selected > .k-menu-link .k-svg-icon svg {
    fill: white !important;
}

/* Submenü-Popups — gleiche Farben wie das Main-Menü (var(--lo-mainmenu-bg-color)).
   Telerik rendert diese als .k-popup → .k-menu-group direkt am <body>,
   daher können sie nicht via .cmb-sidebar-Scope gestylt werden. */
.k-popup.k-menu-popup {
    background-color: var(--lo-mainmenu-bg-color) !important;
    border-color: var(--lo-border-color) !important;
}
.k-popup > .k-menu-group {
    background-color: var(--lo-mainmenu-bg-color) !important;
}
.k-popup > .k-menu-group .k-link,
.k-popup > .k-menu-group .k-menu-link,
.k-popup > .k-menu-group .k-menu-link-text {
    color: var(--lo-text-color) !important;
}
.k-popup > .k-menu-group .k-svg-icon svg {
    fill: var(--lo-text-color) !important;
}
/* Aktive / gehover-te Einträge im Submenu */
.k-popup > .k-menu-group .k-menu-item.k-hover > .k-link,
.k-popup > .k-menu-group .k-menu-item.k-hover > .k-menu-link,
.k-popup > .k-menu-group .k-menu-item.k-focus > .k-link,
.k-popup > .k-menu-group .k-menu-item.k-focus > .k-menu-link,
.k-popup > .k-menu-group .k-menu-item.k-selected > .k-link,
.k-popup > .k-menu-group .k-menu-item.k-selected > .k-menu-link {
    color: white !important;
    background-color: var(--lo-primary-color) !important;
}
.k-popup > .k-menu-group .k-menu-item.k-hover > .k-link .k-svg-icon svg,
.k-popup > .k-menu-group .k-menu-item.k-hover > .k-menu-link .k-svg-icon svg,
.k-popup > .k-menu-group .k-menu-item.k-focus > .k-link .k-svg-icon svg,
.k-popup > .k-menu-group .k-menu-item.k-selected > .k-link .k-svg-icon svg {
    fill: white !important;
}
/* Expand-Arrow (Pfeil für weitere Unterebenen) */
.k-popup > .k-menu-group .k-menu-expand-arrow svg {
    fill: var(--lo-text-color) !important;
}
.k-popup > .k-menu-group .k-menu-item.k-hover > .k-link .k-menu-expand-arrow svg,
.k-popup > .k-menu-group .k-menu-item.k-selected > .k-link .k-menu-expand-arrow svg {
    fill: white !important;
}

/* Keep dropdown popups above native windows/popovers when explicitly opted in. */
.k-animation-container.lo-native-layer-dropdown-popup,
.k-child-animation-container.lo-native-layer-dropdown-popup {
    z-index: 1000011 !important;
}

.k-animation-container.lo-native-layer-dropdown-popup:popover-open,
.k-child-animation-container.lo-native-layer-dropdown-popup:popover-open {
    margin: 0 !important;
    border: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

/*Hier sind zwei klassen für die custom validierung*/ 
/*Error*/
.input-invalid {
    border-color: var(--custom-wolf-software-red) !important;
    box-shadow: 0 0 3px var(--custom-wolf-software-red);
}
/*Warning*/
.input-warning {
    border-color: var(--custom-wolf-software-yellow) !important;
    box-shadow: 0 0 3px var(--custom-wolf-software-yellow);
}
/*Valid*/
.input-valid {
    border-color: var(--custom-wolf-software-green) !important;
    box-shadow: 0 0 3px var(--custom-wolf-software-green);
}
/*Hier werden bestimmte Telerik-Selectoren überschrieben*/
.k-grid tr th:last-child{
    border-inline-end-width: 1px;
}

.k-grid .k-table-th, .k-grid td, .k-grid .k-table-td{
    border-inline-end-width: 1px;
}
.k-table-tbody .k-table-row.k-selected>.k-table-td, .k-table-list .k-table-row.k-selected{
    background-color: var(--lo-selection-highlight-color) !important;
}

.k-menu-group .k-item>.k-link:active{
    background-color: var(--lo-mainmenu-bg-color)!important;
}

.logo-form-item-container .k-input-solid,
.logo-form-item-container .k-picker-solid,
.logo-form-item-container .k-textbox,
.logo-form-item-container .k-dropdownlist,
.logo-form-item-container .k-combobox,
.logo-form-item-container .k-multiselect,
.logo-form-item-container .k-input-solid .k-input-inner,
.logo-form-item-container .k-picker-solid .k-input-inner,
.logo-form-item-container .k-picker-solid .k-input-value-text,
.logo-form-item-container .k-dropdownlist .k-input-inner,
.logo-form-item-container .k-combobox .k-input-inner,
.logo-form-item-container .k-multiselect .k-input-inner,
.logo-form-item-container .k-dropdownlist .k-input-value-text,
.logo-form-item-container .k-combobox .k-input-value-text,
.k-button-solid-base {
    background-color: var(--lo-input-color) !important;
}

.k-input-solid,
.k-picker-solid,
.k-textbox,
.k-dropdownlist,
.k-combobox,
.k-multiselect,
.k-colorpicker {
    border-color: var(--lo-input-border-color) !important;
    border-width: var(--lo-input-border-size) !important;
}

.k-input-solid:focus,
.k-input-solid.k-focus,
.k-input-solid:focus-within,
.k-picker-solid:focus,
.k-picker-solid.k-focus,
.k-picker-solid:focus-within,
.k-textbox:focus,
.k-textbox.k-focus,
.k-dropdownlist:focus,
.k-dropdownlist.k-focus,
.k-dropdownlist:focus-within,
.k-combobox:focus,
.k-combobox.k-focus,
.k-combobox:focus-within,
.k-multiselect:focus,
.k-multiselect.k-focus,
.k-multiselect:focus-within,
.k-colorpicker:focus,
.k-colorpicker.k-focus,
.k-colorpicker:focus-within {
    border-color: var(--lo-input-focus-border-color) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--lo-input-focus-border-color) 25%, transparent) !important;
}

.k-button {
    border-color: var(--lo-button-border-color) !important;
    border-width: var(--lo-button-border-size) !important;
}

.k-button-group:focus-within {
    border-radius: var(--lo-border-radius);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--lo-input-focus-border-color) 25%, transparent) !important;
}

.k-button-group > .k-button:focus,
.k-button-group > .k-button:focus-visible,
.k-button-group > .k-button.k-focus {
    border-color: var(--lo-input-focus-border-color) !important;
}

.k-button-group > .k-button.k-selected,
.k-button-group > .k-button.k-active {
    background-color: var(--lo-button-focus-color) !important;
    border-color: var(--lo-button-focus-color) !important;
}

.logo-form-item-container .k-input-solid,
.logo-form-item-container .k-picker-solid,
.logo-form-item-container .k-textbox,
.logo-form-item-container .k-dropdownlist,
.logo-form-item-container .k-combobox,
.logo-form-item-container .k-multiselect,
.logo-form-item-container .k-input-solid .k-input-inner,
.logo-form-item-container .k-picker-solid .k-input-inner,
.logo-form-item-container .k-picker-solid .k-input-value-text,
.logo-form-item-container .k-dropdownlist .k-input-inner,
.logo-form-item-container .k-combobox .k-input-inner,
.logo-form-item-container .k-multiselect .k-input-inner,
.logo-form-item-container .k-dropdownlist .k-input-value-text,
.logo-form-item-container .k-combobox .k-input-value-text,
.logo-form-item-container .k-colorpicker .k-input-inner {
    color: var(--lo-text-color) !important;
}

.logo-form-item-container .k-input-solid .k-input-inner::placeholder,
.logo-form-item-container .k-picker-solid .k-input-inner::placeholder,
.logo-form-item-container .k-textbox::placeholder,
.logo-form-item-container .k-dropdownlist .k-input-inner::placeholder,
.logo-form-item-container .k-combobox .k-input-inner::placeholder,
.logo-form-item-container .k-multiselect .k-input-inner::placeholder,
.logo-form-item-container .k-colorpicker .k-input-inner::placeholder {
    color: var(--lo-text-color) !important;
    opacity: 1;
}

.logo-form-item-container .k-input-button,
.logo-form-item-container .k-picker-solid .k-input-button,
.logo-form-item-container .k-dropdownlist .k-input-button,
.logo-form-item-container .k-combobox .k-input-button,
.logo-form-item-container .k-multiselect .k-input-button,
.logo-form-item-container .k-colorpicker .k-input-button {
    color: var(--lo-text-color) !important;
}

.logo-form-item-container .k-input-button .k-icon,
.logo-form-item-container .k-input-button .k-svg-icon {
    color: var(--lo-text-color) !important;
}

.logo-form-item-container .k-input-button .k-svg-icon svg,
.logo-form-item-container .k-picker-solid .k-svg-icon svg,
.logo-form-item-container .k-dropdownlist .k-svg-icon svg,
.logo-form-item-container .k-combobox .k-svg-icon svg,
.logo-form-item-container .k-multiselect .k-svg-icon svg,
.logo-form-item-container .k-colorpicker .k-svg-icon svg {
    fill: var(--lo-text-color) !important;
}

.k-button-solid-base:focus,
.k-button-solid-base:focus-visible,
.k-button-solid-base.k-focus {
    background-color: var(--lo-input-color) !important;
    border-color: var(--lo-input-focus-border-color) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--lo-input-focus-border-color) 25%, transparent) !important;
}

@keyframes logo-btn-click-flash {
    0%   { background-color: var(--lo-primary-color); }
    100% { background-color: var(--lo-input-color); }
}

.k-button-solid-base:active, .k-button-solid-base.k-active {
    animation: logo-btn-click-flash 400ms ease-out forwards !important;
    box-shadow: none !important;
}

.k-checkbox {
    border-color: var(--lo-input-border-color) !important;
    background-color: var(--lo-input-color) !important;
}

.k-checkbox:focus,
.k-checkbox:focus-visible,
.k-checkbox.k-focus {
    border-color: var(--lo-input-focus-border-color) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--lo-input-focus-border-color) 25%, transparent) !important;
    outline: none;
}

.k-checkbox:checked,
.k-checkbox.k-checked {
    border-color: var(--lo-button-focus-color) !important;
    background-color: var(--lo-button-focus-color) !important;
}
/*TelerikGrid*/
.k-grid tr:hover {
    cursor: pointer;
}
/*Hier werden custom Telerik-Selectoren erstell welche bei bedarf auf die Telerik Elemente angewendet werden können.
/*Die erste Klasse ist dabei der selbst erstellte Selector welcher angegeben werden kann um den Style bei bedarf zu überschreiben*/
.custom-telerik-grid-small-text .k-grid-content td {
    font-size: 12px;
    padding: 1px;
}

.k-grid .k-table-thead .k-table-th,
.k-grid thead {
    background-color: var(--lo-bg-color);
    color: var(--lo-grid-header-text-color);
}

.k-grid .k-table-thead .k-table-th .k-link {
    color: var(--lo-grid-header-text-color);
}

.k-grid .k-table-thead .k-table-th {
    border-bottom: 1px solid var(--lo-border-color-light);
}

.logo-native-grid-header-row th {
    background-color: var(--lo-grid-header-background-color);
    border-bottom: var(--lo-grid-header-horizontal-border-size) solid var(--lo-grid-border-color);
    border-right: var(--lo-grid-header-vertical-border-size) solid var(--lo-grid-border-color);
    color: var(--lo-grid-header-text-color);
}

.logo-native-grid-table tbody > tr:nth-child(odd):not(.logo-selected):not(.logo-native-detail-row) > td {
    background-color: var(--lo-grid-row-zebra-1-color);
}

.k-grid .k-table-tbody > .k-table-row:nth-child(even):not(.k-selected):not(.k-detail-row):not(.k-grouping-row) > .k-table-td {
    background-color: var(--lo-bg-color-darker);
}

.logo-native-grid-table tbody > tr:nth-child(even):not(.logo-selected):not(.logo-native-detail-row) > td {
    background-color: var(--lo-grid-row-zebra-2-color);
}

.logo-native-grid-table tbody > tr.logo-row-zebra-1:not(.logo-selected):not(.logo-native-detail-row) > td {
    background-color: var(--lo-grid-row-zebra-1-color);
}

.logo-native-grid-table tbody > tr.logo-row-zebra-2:not(.logo-selected):not(.logo-native-detail-row) > td {
    background-color: var(--lo-grid-row-zebra-2-color);
}

.logo-native-grid-table tbody > tr.logo-native-detail-row.logo-row-zebra-1 > td {
    background-color: var(--lo-grid-row-zebra-1-color);
}

.logo-native-grid-table tbody > tr.logo-native-detail-row.logo-row-zebra-2 > td {
    background-color: var(--lo-grid-row-zebra-2-color);
}

.k-grid div.k-grid-aria-root,
.logo-native-grid-wrapper {
    border: var(--lo-grid-border-size) solid var(--lo-grid-border-color);
}

.k-grid .k-table-tbody .k-table-row > .k-table-td {
    border-bottom: 0;
    color: var(--lo-grid-content-text-color);
}

.logo-native-grid-cell {
    border-bottom: var(--lo-grid-content-horizontal-border-size) solid var(--lo-grid-border-color);
    border-right: var(--lo-grid-content-vertical-border-size) solid var(--lo-grid-border-color);
    color: var(--lo-grid-content-text-color);
}

/*Window-Close/Action Buttons*/
.k-window-titlebar-actions{ 
    color: var(--lo-text-color) !important;
}
.k-window-titlebar,
.k-window-titlebar .k-window-title,
.k-window-titlebar .k-window-title-text {
    color: var(--lo-text-color) !important;
}
.k-window-titlebar{
    background-color: var(--lo-bg-color-darker) !important;
}

.k-dialog-titlebar-actions {
    color: var(--lo-text-color) !important;
}

.k-dialog-titlebar,
.k-dialog-titlebar .k-dialog-title,
.k-dialog-titlebar .k-dialog-title-text {
    color: var(--lo-text-color) !important;
}

.ksa-kunde-bearbeiten-button,
.ksa-kunde-bearbeiten-button .k-button-text,
.ksa-kunde-bearbeiten-button .k-icon,
.ksa-kunde-bearbeiten-button .k-svg-icon,
.ksa-kunde-bearbeiten-button .k-svg-icon svg {
    color: var(--lo-text-color) !important;
    fill: var(--lo-text-color) !important;
}

.availability-check-button,
.availability-check-button.k-button,
.availability-check-button .k-button-text,
.availability-check-button .k-icon,
.availability-check-button .k-button-icon,
.availability-check-button .k-svg-icon,
.availability-check-button .k-svg-icon svg,
.availability-check-button .k-svg-icon path {
    color: var(--lo-text-color) !important;
    fill: var(--lo-text-color) !important;
}

/* Verhindert Textzeilenumbrüche in Grid-Zellen – Ellipsis bei Overflow */
/* .k-grid.no-stretch hat Spezifizität (0,3,0) und überschreibt Teleriks .k-grid .k-table-td (0,2,0) */
.k-grid.no-stretch .k-grid-table {
    table-layout: fixed;
}
.k-grid.no-stretch .k-table-td {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 0;
}
.k-grid.no-stretch .k-table-th .k-cell-inner,
.k-grid.no-stretch .k-table-th .k-link {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Hide scrollbar while keeping scroll functionality */
.logo-no-scrollbar .k-grid-content,
.logo-no-scrollbar .k-table-scroller,
.logo-no-scrollbar .k-virtual-scroller {
    scrollbar-width: none !important; /* Firefox — !important needed to override Logo-Utility.css */
    -ms-overflow-style: none;         /* IE / Edge (legacy) */
}
.logo-no-scrollbar .k-grid-content::-webkit-scrollbar,
.logo-no-scrollbar .k-table-scroller::-webkit-scrollbar,
.logo-no-scrollbar .k-virtual-scroller::-webkit-scrollbar {
    display: none;                /* Chrome / Safari / Edge (Chromium) */
}

/* Hide horizontal scrollbar only — scroll still works */
.logo-no-scrollbar-x .k-grid-content,
.logo-no-scrollbar-x .k-table-scroller,
.logo-no-scrollbar-x .k-virtual-scroller {
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none;         /* IE / Edge (legacy) */
}
.logo-no-scrollbar-x .k-grid-content::-webkit-scrollbar,
.logo-no-scrollbar-x .k-table-scroller::-webkit-scrollbar,
.logo-no-scrollbar-x .k-virtual-scroller::-webkit-scrollbar {
    height: 0; /* Chrome/Safari/Edge — height:0 hides only horizontal track */
}

/* Hide vertical scrollbar only — scroll still works */
.logo-no-scrollbar-y .k-grid-content,
.logo-no-scrollbar-y .k-table-scroller,
.logo-no-scrollbar-y .k-virtual-scroller {
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none;         /* IE / Edge (legacy) */
}
.logo-no-scrollbar-y .k-grid-content::-webkit-scrollbar,
.logo-no-scrollbar-y .k-table-scroller::-webkit-scrollbar,
.logo-no-scrollbar-y .k-virtual-scroller::-webkit-scrollbar {
    width: 0; /* Chrome/Safari/Edge — width:0 hides only vertical track */
}
/* Remove the header scrollbar placeholder — Telerik adds padding-right to .k-grid-header
   to reserve space for the vertical scrollbar track. Since the scrollbar is hidden and
   takes no actual space, this padding creates a visible gap. Removing it keeps headers
   perfectly aligned with content columns. */
.logo-no-scrollbar-y .k-grid-header {
    padding-right: 0 !important;
}