@charset "UTF-8";
: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: #B1DFF570;
    /*--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 */
}

/*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(--custom-wolf-software-background-color-gridselect) !important;
}

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

.k-button-solid-base:focus, .k-button-solid-base.k-focus{
    background-color: var(--custom-button-focus-color)!important;
}
button:focus .k-svg-icon svg path {
    fill: white;
}
button.telerik-blazor:focus .k-button-text {
    color: white;
}
/*.k-checkbox:checked, .k-checkbox.k-checked {
    border-color: var(--custom-button-focus-color)!important;
    color: #fff;
    background-color: var(--lo-text-color)!important;
}
.k-checkbox {
    border-color: var(--lo-text-color) !important;
    background-color: whitesmoke;
}*/
/*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;
}

.custom-klick-and-plan-grid thead{
    background-color: #e2e2e2;
}
.custom-klick-and-plan-grid div.k-grid-aria-root{
    border: solid var(--custom-wolf-software-border-color) 1px;
    border-radius: 2px;
}

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