﻿.k-appbar-primary {
    background-color: #35333e !important;
}

.k-appbar {
    padding-block: 0 !important;
}

.k-menu:not(.k-context-menu) > .k-item {
    color: white !important;
}

.k-menu {
    color: white !important;
    font-size: 12px !important;
}

.k-checkbox:checked:focus,
.k-checkbox.k-checked.k-focus {
    box-shadow: none !important;
}

.k-checkbox:focus, .k-checkbox.k-focus {
    box-shadow: none !important;
}

/*dropdown-list*/
.telerik-blazor.k-dropdownlist.k-dropdownlist-custom {
    width: 160px;
    border: none;
    box-shadow: none;
    outline: none;
    border-radius: 0;
    border-image: none;
    height: 24px;
    font-size: 12px;
    font-weight: normal;
}

.k-popup.k-list-container.k-dropdownlist-popup {
    height: fit-content !important;
    box-shadow: unset !important;
}

    .k-popup.k-list-container.k-dropdownlist-popup .k-list-content .k-list-ul li.k-list-item {
        font-size: 14px;
        font-weight: normal;
    }

        .k-popup.k-list-container.k-dropdownlist-popup .k-list-content .k-list-ul li.k-list-item.k-selected,
        .k-popup.k-list-container.k-dropdownlist-popup .k-list-content .k-list-ul li.k-selected.k-list-optionlabel {
            color: var(--white-text);
            background-color: var(--dropdownlist-hover);
            border: unset;
            box-shadow: unset;
        }

.k-list-item:focus, .k-list-optionlabel:focus, .k-list-item.k-focus, .k-focus.k-list-optionlabel {
    box-shadow: unset;
}

/*datetime*/

.k-button-flat-primary {
    color: #0fb5c4;
}

.telerik-blazor.k-button {
    border-image: unset;
    box-shadow: unset;
    outline: unset;
    /*height: 24px;*/
}

/*k-splitter*/

.k-splitter {
    border-color: gray;
}

/* checkbox */

.k-checkbox:indeterminate, .k-checkbox.k-indeterminate {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='var%28--kendo-color-primary, %2314a7b4%29' stroke-linecap='square' stroke-linejoin='square' stroke-width='2' d='M4,8 h8'/%3e%3c/svg%3e") !important;
}

/*tabstrip*/

.k-tabstrip-items-wrapper .k-item:focus, .k-tabstrip-items-wrapper .k-item.k-focus {
    box-shadow: none;
}

/* k-sort */

.k-sort-icon .k-icon {
    color: #14A7B4 !important;
}

/* k-grid-checkbox */

.k-checkbox-wrap .k-checkbox:checked {
    background-color: #fff;
    border-color: #fff;
    background-image: url("/_content/DialedIn.Shared/Images/square.png");
    background-repeat: no-repeat;
    background-size: 10px 10px;
    background-position-x: center;
    background-position-y: center;
    border: 1px solid #e1e1e1;
    border-radius: 0;
}

/* k-overlay */

.k-overlay {
    background-color: unset !important;
}

/* k-columnmenu-item */

.k-columnmenu-item {
    display: none;
}

    .k-column-list-item:focus, .k-column-list-item.k-focus, .k-columnmenu-item:focus, .k-columnmenu-item.k-focus {
        box-shadow: none;
    }

    .k-column-list-item:hover, .k-columnmenu-item:hover {
        color: inherit;
        background-color: inherit;
    }

/* k-combobox-popup */

.k-combobox-popup .k-list-content .k-list-ul .k-list-item.k-selected {
    background: white;
    color: #3d3d3d;
}


    .k-combobox-popup .k-list-content .k-list-ul .k-list-item.k-selected:hover {
        background-color: #ebebeb;
        color: #3d3d3d;
        cursor: pointer;
    }

/* k-loader */

.k-loader-primary {
    color: #14a7b4 !important;
}

/* filter */

body {
    overflow: hidden;
}

.k-grid .k-grid-filter-menu.k-grid-header-menu {
    padding: 0;
    margin: 0;
    margin-right: 4px;
    background-color: unset;
}

.k-grid-header .k-grid-filter-menu.k-grid-header-menu span {
    width: 14px;
    height: 14px;
    color: #767676;
    background-color: unset;
}

.k-grid-header .k-grid-filter-menu.k-grid-header-menu.k-active span {
    color: #14a7b4;
    background-color: unset;
}

.k-grid-filter-popup {
    width: 216px;
    min-width: unset;
    max-width: unset;
}

.k-pager {
    overflow: auto
}

.filter-popup-container {
    font-size: 14px;
    color: black;
}

.k-columnmenu-item-content {
    width: fit-content;
    background: white;
}

.filter-popup-container .filter-text-container {
    display: flex;
    width: 200px;
    height: 25px;
}

.filter-checkbox-list {
    border: 1px solid #e1e1e1;
    width: 200px;
    max-height: 140px;
    padding: 2px;
    margin: 2px 0 4px 0;
    overflow: auto;
}

.label-filter-string-column {
    margin-top: 5px;
}

.filter-operator-combobox, .filter-text-container {
    margin: 2px 0px;
    font-size: 12px;
    border-radius: 0px;
    box-shadow: none;
    height: 25px;
}

    .filter-operator-combobox .k-list-container {
        border: 1px solid #e1e1e1;
        box-shadow: none;
    }

        .filter-operator-combobox .k-list-container .k-list-content {
            font-size: 12px;
        }

    .filter-operator-combobox .k-list-content .k-list-item.k-selected {
        color: var(--kendo-color-on-app-surface, #3d3d3d);
        background-color: var(--kendo-color-base-hover, #ebebeb);
    }

    .filter-date .k-input-solid:focus-within, .filter-date .k-input-solid.k-focus,
    .filter-text-container .k-input-solid:focus-within, filter-text-container .k-input-solid.k-focus,
    .filter-operator-combobox.k-input-solid:focus-within, .filter-operator-combobox.k-input-solid.k-focus {
        box-shadow: unset;
    }

    .filter-operator-combobox .telerik-blazor.k-button {
        background-color: transparent;
        border: none;
        width: 16px;
        opacity: 0.6;
    }

    .filter-text-container span.k-textbox {
        border-radius: 0;
        font-size: 12px;
        height: 25px;
    }

    .filter-text-container .k-picker-solid:focus-within {
        border-radius: 0;
        font-size: 12px;
        background: transparent;
        padding: 3px;
    }

    .filter-text-container button.k-button-solid {
        border-radius: 0;
        font-size: 12px;
        background: transparent;
        padding: 3px;
    }

        .filter-text-container button.k-button-solid:hover, .filter-actions .filter-button:hover {
            background-color: #ededed;
        }

        .filter-text-container button.k-button-solid:active, .filter-actions .filter-button:active {
            background-color: #e1e1e1;
        }

.filter-actions {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 5px;
}

    .filter-actions .filter-button {
        width: auto;
        flex: 1;
        border-radius: 0;
        height: 25px;
        font-size: 12px;
        background: transparent;
    }

.filter-popup-container .filter-date {
    height: 25px;
    font-size: 12px;
    box-shadow: unset;
    border-radius: 0;
}

    .filter-popup-container .filter-date button {
        background-color: transparent;
        border: none;
        opacity: 0.8;
    }


.filter-popup-container .k-checkbox-wrap .k-checkbox {
    border-radius: 0;
}

.k-grid .highlight-text {
    color: var(--border-red-danger);
    font-weight: 700;
}

.k-table-td:has(div.highlight-cell) {
    background-color: var(--light-warm-background);
}

.k-state-invalid.filter-text {
    border-color: rgba(213,25,35,.5);
}

.filter-checkbox-item {
    white-space: nowrap;
}

.filter-operator-combobox.k-picker-solid:focus-within {
    background-color: unset;
}

.filter-operator-combobox.k-picker-solid {
    background-color: unset;
    box-shadow: unset;
}

.backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9998;
}

/*k-window*/

.telerik-blazor.k-window.k-window-custom {
    background-color: #35333e;
    border-color: #256975;
    border-width: 1px;
    border-radius: 0px;
    border-style: solid;
    margin: 0;
    padding: 0;
}

    .telerik-blazor.k-window.k-window-custom .k-window-titlebar {
        background-color: #35333e;
        color: white;
        font-size: 15px;
        padding: 6px 8px;
        border: none;
    }

        .telerik-blazor.k-window.k-window-custom .k-window-titlebar .k-window-title {
            pointer-events: none;
            font-size: 15px;
            font-weight: 600;
            vertical-align: middle;
            padding: 0;
        }

            .telerik-blazor.k-window.k-window-custom
            .k-window-titlebar
            .k-window-title > span.s-window-title {
                display: flex;
                flex-direction: row;
                align-items: center;
            }

                .telerik-blazor.k-window.k-window-custom
                .k-window-titlebar
                .k-window-title > span.s-window-title > span {
                    margin-inline: 8px;
                }

    .telerik-blazor.k-window.k-window-custom .k-window-titlebar-actions > button,
    .telerik-blazor.k-window.k-window-custom .k-window-titlebar-actions > button:focus,
    .telerik-blazor.k-window.k-window-custom .k-window-titlebar-actions > button:active {
        border: none;
        border-width: 0;
        border-image-width: 0;
        border-image: none;
        box-shadow: none;
        outline: none;
    }

    .telerik-blazor.k-window.k-window-custom .k-window-content {
        padding: 0 8px;
        padding-block: unset;
        padding-inline: unset;
        background: var(--table-odd-background);
    }

    .telerik-blazor.k-window.k-window-custom .k-window-actions {
        border: none;
        background: var(--table-odd-background);
    }


.filter-text-container.disable-text-box {
    pointer-events: none;
    opacity: 0.6;
}

.filter-text-container.disable-text-box span.k-textbox input{
    cursor: not-allowed;
}

#components-reconnect-modal {
    z-index: 1000000 !important;
}

.k-grid-search.k-textbox.k-input {
    border-radius: 0;
    height: 22px;
    padding: 0px;
}

.k-grid-search.k-textbox.k-input > span > .k-input-inner {
    padding: 0 5px;
    font-size: 14px;
    color: var(--black-text);
}