/* #region Algemeen */
.mb-5plus {
    margin-bottom: 4rem !important;
}

@media (min-width: 1200px) {
    .mb-xl-6 {
        margin-bottom: 6rem !important;
    }
}

.mw-0 {
    min-width: 0 !important;
}

.mh-0 {
    min-height: 0 !important;
}

.text-ellipsis {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.text-ellipsis-clip {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow-x: clip;
}

@media (min-width: 992px) {
    .text-ellipsis-lg {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
}

.text-pre-line {
    white-space: pre-line;
}

.scrollbar-thin {
    scrollbar-width: thin;
}

/* Versie van input-group-text zonder background en border*/
.input-text-normal {
    display: flex;
    align-items: center;
    font-weight: 400;
    line-height: 1.5;
    color: var(--input-text-normal-text-color);
    text-align: center;
    white-space: nowrap;
}

.hidden {
    display: none !important;
}

.trans50 {
    opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */
}

@media (min-width: 992px) {
    .profilepicpos {
        position: absolute;
        top: calc(50% - 32.5px); /*zoom1=calc(50% - 40px)*/
    }
}

.sharkstrike {
    text-decoration: line-through !important;
}

.cursor-pointer {
    cursor: pointer !important;
}

.cursor-denied {
    cursor: not-allowed !important;
}

.form-control[readonly],
.readonly,
.form-control[readonly] .k-input-inner,
.form-control[readonly] input,
.form-control[readonly] .k-input-solid,
.form-control[readonly] .k-input-solid input,
.readonly .k-input-solid,
.readonly .k-input-inner,
.k-input-solid:has(input[aria-disabled="true"]),
.k-input-solid:has(input[aria-disabled="true"]) input,
.k-input-inner:has(input[aria-disabled="true"]),
.k-input-inner:has(input[aria-disabled="true"]) input {
    background-color: var(--input-readonly-bkg-color) !important;
    opacity: 1;
}

.mirrored {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

button[aria-expanded="false"] .fa-chevron-up {
    display: none;
}

button[aria-expanded="true"] .fa-chevron-down {
    display: none;
}

.k-tabstrip {
    font-family: inherit;
    font-size: 14px;
    line-height: inherit;
    display: grid; /* Nodig om tabs bovenin niet te laten overflowen, waardoor deel van scherm afknipt indien niet alle tabs op scherm passen */
    grid-template-rows: min-content;
}

    .k-tabstrip > .k-tabstrip-content {
        color: var(--body-text-color);
    }

@media (min-width: 1400px) {
    .k-tabstrip {
        font-size: 14px; /*zoom1=15px*/
    }
}

.k-textbox:focus,
.k-textbox:focus-within {
    box-shadow: none !important;
}

.fixedSize {
    width: 55px !important;
}

.sharkDropdown {
    display: flex;
    align-items: center;
    height: 100%;
}

.fieldContainer > .field > .sharkDropdown {
    border: 0;
}

.dynamicDropdown {
    -webkit-appearance: searchfield;
    color: var(--body-text-color);
    font-size: calc(var(--zoom)*15px);
    display: flex;
    align-items: center;
    background-color: var(--tlk-input-inner-bkg-color);
}

.form-control-input {
    width: 100%;
}

#Settings li.k-tabstrip-item.k-active {
    font-weight: 700;
    border-color: var(--settings-tab-active-border-color) !important;
    background-color: var(--settings-tab-active-bkg-color);
}

#Settings .k-tabstrip-top > .k-tabstrip-items {
    border: none;
}

#tabbar #Settings .k-tabstrip-items {
    padding-left: 0;
}

#Settings li.k-tabstrip-item {
    display: block;
    --padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    color: var(--settings-tab-text-color) !important;
    border: none;
    border-top: 2px solid var(--settings-tab-boxshadow-color);
    border-bottom: none;
    text-decoration: none;
    margin-right: 0;
    margin-bottom: 0 !important;
    padding: 0.5rem;
    box-shadow: var(--settings-tab-boxshadow-color) 2px 0px;
    background-color: var(--settings-tab-bkg-color);
}

    #Settings li.k-tabstrip-item span.k-link:not(.removetab)::after {
        display: block;
        content: attr(data-content);
        background-color: var(--gray-light-color);
        height: 0;
        overflow: hidden;
        visibility: hidden;
        color: white;
        font-weight: bold;
    }

    #Settings li.k-tabstrip-item:last-child {
        margin-right: 0;
    }

    #Settings li.k-tabstrip-item:hover {
        border-color: var(--settings-tab-active-border-color) !important;
    }

    #Settings li.k-tabstrip-item span {
        padding: 0;
        display: inline-block;
    }

.fs-14 {
    font-size: calc(var(--zoom)*14px) !important;
}

.fs-15 {
    font-size: calc(var(--zoom)*15px) !important;
}

.fs-16 {
    font-size: calc(var(--zoom)*16px) !important;
}

.fs-17 {
    font-size: calc(var(--zoom)*17px) !important;
}

.lh-0 {
    line-height: 0;
}

.labelFieldContainer {
    height: calc(1 * var(--rowSize));
    display: inline-block;
}

.labelFieldContainerShort {
    height: calc(0.8 * var(--rowSize));
    display: inline-block;
}

.inputFieldContainer {
    width: calc(2 * var(--colSize));
    height: calc(1 * var(--rowSize));
    display: inline-block;
}

.inputVariableWidth {
    flex: 2 2 calc(1 * var(--colSize));
    max-width: calc(2 * var(--colSize));
}

.labelVariableWidth {
    flex: 1 1 calc(0.8 * var(--colSize));
    max-width: calc(2 * var(--colSize));
}

.importTableInput {
    height: calc(0.8 * var(--rowSize));
    display: flex;
    align-items: center;
}

    .importTableInput .k-input.form-control {
        padding: 0px 12px !important;
    }

.lightBorder {
    border: 1px solid var(--border-gray-light);
}

.importstep {
    background-color: var(--bkg-white);
    padding: 1.5rem;
    border-radius: 0.25rem;
}

.noBorderRadius {
    border-radius: 0 !important;
}

.noLeftBorderRadius {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.noRightBorderRadius {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.noTopBorderRadius {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

.noBottomBorderRadius {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.margin-left-1px {
    margin-left: -1px;
}

.errorHighlight,
.errorHighlight > td {
    background-color: var(--error-hightlight-bkg-color);
    --bs-table-bg-type: var(--error-hightlight-bkg-color) !important;
}

.errorField .field:not(.lookup) {
    background-color: var(--bkg-white) !important;
}

    .errorField .field:not(.lookup) .k-input-solid,
    .errorField .field:not(.lookup) .k-input-inner,
    .errorField .field.lookup .editfield {
        background-color: var(--error-hightlight-lighter-bkg-color) !important;
    }

.overflow-x-auto {
    overflow-x: auto !important;
}

.overflow-y-auto {
    overflow-y: auto !important;
}

.overflow-y-scroll {
    overflow-y: scroll;
}

.overflow-x-clip {
    overflow-x: clip !important;
}

.overflow-y-visible {
    overflow-y: visible !important;
}

.k-widget.k-window {
    border: 0;
}

.k-window-titlebar {
    padding: 0.5rem 1rem;
    background-color: var(--tlk-win-titlebar-bkg-color);
    font-weight: 700;
    border-bottom: 2px solid var(--tlk-win-titlebar-bkg-color);
    color: var(--tlk-win-titlebar-text-color);
}

.k-window .k-window-content {
    background-color: var(--tlk-win-content-bkg-color);
}

.telerikPopupWindow {
    position: fixed !important;
}

.telerikPopupWindow .k-window-content {
    overflow: hidden !important;
    padding-block: 0;
    padding-inline: 0;
    display: flex;
}

    .telerikPopupWindow .k-window-content .telerikWindowContent {
        overflow: auto;
        padding-block: 16px;
        padding-inline: 16px;
        flex-grow: 1;
    }

        .telerikPopupWindow .k-window-content .telerikWindowContent:has(#feedbackPanel) {
            padding-bottom: 0;
        }

.bg-shark-extralightgray {
    background-color: var(--bkg-extralightgray);
}

.bg-shark-lightergray,
.bg-shark-lightergray-window-content .k-window-content {
    background-color: var(--bkg-lightergray);
}

.bg-shark-lightgray {
    background-color: var(--bkg-lightgray);
}

.table-small > :not(caption) > * > * {
    padding: 0.35rem 0.55rem;
}

#dialog {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.contextMenuZ-Index {
    z-index: 999999;
}

.context-menu-hidden,
.context-menu-hidden * {
    display: none !important;
}

.gridTaskIcon {
    width: 20px;
    height: 20px;
}

img[src=''] {
    visibility: hidden;
}

.gridDataOverflow {
    overflow: hidden !important;
    max-height: 40px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.k-grid tr.shark-group-row > td {
    font-weight: 600;
    cursor: pointer;
}

.k-grid tr.shark-group-row > td:first-child::before {
    content: "\25BE";
    display: inline-block;
    width: 1em;
    font-size: 2.6em;
    line-height: 0;
    vertical-align: middle;
}

.k-grid tr.shark-group-row-collapsed > td:first-child::before {
    content: "\25B8";
}

.k-grid tr.shark-total-row > td {
    font-weight: 700;
    border-top: 2px solid #01336D;
    cursor: default;
}

.customGridFooter {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.6em;
    margin-right: 1em;
    font-size: calc(var(--zoom)*15px);
}

/* Borders rondom label en textboxes mooi maken */
.input-group > .fieldContainer .field.input-group-text,
.input-group > .labelFieldContainer .field.input-group-text {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.input-group > .fieldContainer .field:not(.input-group-text) .k-rounded-md,
.input-group > .fieldContainer .field:not(.input-group-text),
.input-group > .inputFieldContainer .field {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.input-group .fieldContainer:has(.field.input-text-normal) + .fieldContainer .field {
    border-top-left-radius: 0.25rem !important;
    border-bottom-left-radius: 0.25rem !important;
    margin-left: 0 !important;
}

    .input-group .fieldContainer:has(.field.input-text-normal) + .fieldContainer .field.lookup button {
        margin-left: 0;
        border-top-left-radius: 0.25rem;
        border-bottom-left-radius: 0.25rem;
    }

.importTableInput.windowRow .lookupcontainer .input-group,
.importTableInput.windowRow .lookupcontainer .input-group button.input-group-text {
    border-top-left-radius: 0.25rem !important;
    border-bottom-left-radius: 0.25rem !important;
}

.minWidth3rem {
    min-width: 3rem;
}

.fixed-to-viewport {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99000;
}

.noScroll {
    position: fixed;
    overflow-y: scroll;
    width: 100%;
}

.shark-primary {
    color: var(--primary-color); /* Donkerblauw */
}

.shark-secondary {
    color: var(--secondary-color); /* Lichtblauw */
}

.shark-tertiary {
    color: var(--tertiary-color); /* Tussen primary en secondary in */
}

.shark-bg-primary {
    background-color: var(--bkg-primary); /* Donkerblauw */
}

.shark-bg-secondary {
    background-color: var(--bkg-secondary); /* Lichtblauw */
}

.shark-bg-tertiary {
    background-color: var(--bkg-tertiary); /* Tussen primary en secondary in */
}

.inlineFormWindow {
    background-color: var(--win-inline-bkg-color);
    padding-left: 1rem;
    padding-right: 1rem;
}

.accordion-button.accordion-button-flipped.collapsed::after {
    transform: rotate(-180deg) !important;
}

.accordion-button.accordion-button-flipped:not(.collapsed)::after {
    transform: none !important;
}

.accordion-button::after {
    filter: var(--bts-accordion-btn-icon-filter);
}

.propertyBlock .windowRow:has(.input-group:empty) {
    display: none !important;
}

.ribbonCollapsed {
    visibility: collapse;
    height: 0;
}

.sharkCopyright {
    height: fit-content;
    margin-top: auto;
}

.left-0 {
    left: 0;
}

.right-0 {
    right: 0;
}

.margin-auto {
    margin: auto;
}

.box-shadow-none {
    box-shadow: none !important;
}

.close-button {
    cursor: pointer;
    transition: color linear 0.2s;
    color: var(--close-button-color);
}

    .close-button:hover {
        color: var(--close-button-hover-color) !important;
    }

.aspect-ratio-1 {
    aspect-ratio: 1;
}

/* #region table via css*/
/* <tr> */
.d-table-tr {
    display: table-row;
}

    .d-table-tr:nth-of-type(odd) {
        background-color: color-mix(in srgb, var(--table-primary-row-odd-bkg-color) 5%, transparent);
    }

/* <thead> */
.d-table-thead {
    display: table-header-group;
    font-weight: bold;
    background-color: var(--table-primary-bkg-color);
    color: var(--table-primary-th-text-color);
}

/* <tbody> */
.d-table-tbody {
    display: table-row-group;
}

/* <tfoot> */
.d-table-tfoot {
    display: table-footer-group;
}

/* <col> */
.d-table-col {
    display: table-column;
}

/* <colgroup> */
.d-table-colgroup {
    display: table-column-group;
}

/* <td>, <th> */
.d-table-th,
.d-table-td {
    display: table-cell;
    padding: 0.5rem;
    text-align: justify;
    border-color: var(--table-primary-cell-border-color);
    border-style: solid;
    border-width: 0 0 1px 1px;
}

    .d-table-th:last-child,
    .d-table-td:last-child {
        border-width: 0 1px 1px 1px;
    }



/* <caption> */
.d-table-caption {
    display: table-caption;
}

/* #endregion */

/* #endregion */

/* #region Scrollbalk laten verdwijnen bij specifieke cases */

@media (max-width: 991px) {
    html:has(body .sidebar.active),
    html:has(body .profile-menu-mobile.active) {
        overflow: hidden;
    }
}

/* #endregion Scrollbalk laten verdwijnen bij specifieke cases */

/* #region profile menu mobiel en header (gewone weergave) */
.profile-menu-mobile {
    position: absolute;
    right: 0;
    z-index: 10002;
    top: 74px;
    bottom: 0;
    left: 0;
    pointer-events: none;
}

    .profile-menu-mobile.active {
        pointer-events: auto;
    }

.profile-menu-mobile-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--profile-menu-mobile-bkg-color);
    opacity: 0;
    transition: opacity 0.2s;
}

.profile-menu-mobile.active .profile-menu-mobile-background {
    opacity: 1;
}

@media (min-width: 992px) {
    .profile-menu-mobile {
        display: none;
    }
}

.profile-menu-mobile-content {
    position: fixed;
    right: -480px;
    width: 300px;
    top: 74px;
    bottom: 0;
    background: var(--profile-menu-mobile-content-bkg-color);
    font-size: calc(var(--zoom) * 18px);
    transition: right 0.2s;
    user-select: none;
}

.profile-menu-mobile.active .profile-menu-mobile-content {
    right: 0;
}

.profile-menu-mobile-content .profile-menu-titlebar {
    padding: 0.5rem 1rem;
    border-bottom: 1px solid var(--profile-menu-mobile-border-color);
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--profile-menu-mobile-titlebar-text-color);
}

.profile-menu-mobile-content ul,
.profile-menu-mobile-content li {
    list-style: none;
    padding: 0 !important;
}

    .profile-menu-mobile-content li > a,
    .profile-menu-mobile-content li > span,
    .header-profile li > a,
    .header-profile li > span {
        padding: 0.5rem 1rem;
        border-bottom: 1px solid var(--profile-menu-mobile-border-color);
        cursor: pointer;
    }

    .profile-menu-mobile-content li > .item-level-0,
    .header-profile li > .item-level-0 {
        font-weight: bold;
        color: var(--profile-menu-level-0-text-color);
    }

    .profile-menu-mobile-content li:not(.dropdown-submenu) > span,
    .header-profile li:not(.dropdown-submenu) > span {
        cursor: default;
    }

    .profile-menu-mobile-content li > span:not(.item-level-0):hover,
    .profile-menu-mobile-content li > span:not(.item-level-0):active,
    .header-profile li > span:not(.item-level-0):hover,
    .header-profile li > span:not(.item-level-0):active {
        background-color: inherit;
        color: var(--profile-menu-hover-text-color);
    }

.profile-menu-mobile-content a:active,
.header-profile a:active {
    background-color: var(--profile-menu-active-bkg-color);
    color: var(--profile-menu-active-text-color);
}

    .profile-menu-mobile-content a:active img,
    .header-profile a:active img {
        filter: var(--profile-menu-img-filter);
    }

.profile-menu-mobile-content li img,
.header-profile li img {
    width: 22px;
    height: auto;
}

.header-profile .dropdown-menu {
    user-select: none;
}

    .header-profile .dropdown-menu img,
    .profile-menu-mobile .dropdown-item img {
        filter: var(--dropdown-img-filter);
    }

/* #endregion*/

/* #region svg kleuren */
.svg-white {
    filter: var(--image-filter-white);
}

.svg-black {
    filter: var(--image-filter-black);
}

/* Donkerblauw */
.svg-primary {
    filter: var(--image-filter-primary);
}

/* Lichtblauw */
.svg-secondary {
    filter: var(--image-filter-secondary);
}

/* Tussen donker- en lichtblauw in */
.svg-tertiary {
    filter: var(--image-filter-tertiary);
}
/* #endregion */

/* #region Toewijzigingen filter kleuren op imgages */

table.editTable img {
    filter: var(--table-primary-img-filter);
}
/* #endregion */

/* #region Sidebar toggle */
@media (min-width: 992px) {
    .sidebar.collapsed .toggle-sidebar-split {
        padding: 0;
        text-align: center;
        justify-content: center;
    }
}

    .toggle-sidebar-split {
        display: flex;
        justify-content: space-between;
        color: var(--sidebar-toggle-split-text-color);
        font-size: 14px;
        text-decoration: none;
        padding: 0 20px;
    }

        .toggle-sidebar-split div {
            display: flex;
            align-items: center;
            height: 58px;
        }

            .toggle-sidebar-split div a {
                text-decoration: none;
            }

            .toggle-sidebar-split div:hover {
                cursor: pointer;
                color: var(--sidebar-toggle-split-text-color);
                text-decoration: underline white;
            }

    @media (min-width: 1400px) {
        .toggle-sidebar-split {
            padding: 0 26px; /*zoom1=0 46px*/
        }
    }

    /* #endregion */

/* #region sidebar activities */

.toggle-sidebar-activities img {
    filter: var(--sidebar-activities-icon-filter);
}

/* #endregion */

/* #region Klassiek menu en dashboard kendo overwrite */

.sidebar-logo-menu {
    overflow: hidden;
    flex: 1;
    display: flex;
    flex-direction: column;
}

#menudata {
    overflow-y: auto;
    flex: 1;
}

    /* width */
    #menudata::-webkit-scrollbar {
        width: calc(var(--zoom) * 12px);
    }

    /* Track */
    #menudata::-webkit-scrollbar-track {
        background: var(--menu-classic-scroll-bkg-color);
    }

    /* Handle */
    #menudata::-webkit-scrollbar-thumb {
        background: var(--menu-classic-scroll-thumb-bkg-color);
        border-radius: 1rem;
    }

        /* Handle on hover */
        #menudata::-webkit-scrollbar-thumb:hover {
            background: var(--menu-classic-scroll-thumb-hover-bkg-color);
            cursor: grab;
        }

        #menudata::-webkit-scrollbar-thumb:active {
            cursor: grabbing;
        }

    #menudata .sidebar-navigation {
        border: none;
        background-color: transparent;
        color: var(--sidebar-nav-text-color);
    }

        #menudata .sidebar-navigation ul,
        #menudata .sidebar-navigation li,
        #menudata .sidebar-navigation span {
            background-color: transparent;
            color: var(--sidebar-item-text-color);
            border: none;
            box-shadow: none;
            transition: none;
        }

            #menudata .sidebar-navigation li.k-level-2 {
                padding-left: 0.7rem;
            }

                #menudata .sidebar-navigation li.k-level-2:hover,
                #menudata .sidebar-navigation li:not(.k-level-2) span:hover {
                    cursor: pointer;
                    background-color: var(--sidebar-menu-hover-bkg-color);
                }

            #menudata .sidebar-navigation li.k-selected {
                background-color: var(--sidebar-menu-selected-bkg-color);
            }

            #menudata .sidebar-navigation li.k-level-2 span.k-selected {
                text-decoration: underline;
            }


            #menudata .sidebar-navigation li.k-state-expanded > span:first-child {
                background-color: var(--sidebar-menu-selected-bkg-color);
                font-weight: 700;
            }

        #menudata .sidebar-navigation.k-panelbar li span {
            font-size: calc(var(--zoom)*18px);
        }

        #menudata .sidebar-navigation.k-panelbar li.k-level-0 > .k-link {
            font-weight: 700;
        }

        #menudata .sidebar-navigation.k-panelbar li:not(.k-level-2) span:not(.k-svg-icon) {
            padding-left: 0.75rem;
            padding-right: 1.5rem;
        }

        #menudata .sidebar-navigation.k-panelbar li.k-level-0 > .k-link > .k-link .k-panelbar-item-text {
            padding-left: 1.3rem;
        }

@media (min-width: 992px) {
    #menudata .sidebar-navigation.k-panelbar li span {
        font-size: calc(var(--zoom)*14px);
    }

    #menudata .sidebar-navigation.k-panelbar li:not(.k-level-2) span:not(.k-svg-icon),
    #menudata .sidebar-navigation.k-panelbar li.k-level-0 > .k-link > .k-link .k-panelbar-item-text {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}

@media (min-width: 1400px) {
    #menudata .sidebar-navigation.k-panelbar li span {
        font-size: 15px;
    }

    #menudata .sidebar-navigation.k-panelbar li:not(.menuItem) span:not(.k-svg-icon) {
        padding-left: 1em;
        padding-right: 1rem;
    }
}

/* #endregion */

/* #region lookup api */
.input-group .showApiLookupBtn {
    margin-left: -1px !important;
    border-top-left-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
    border-top-right-radius: 0.25rem !important;
    border-bottom-right-radius: 0.25rem !important;
}

.apiLookupIcon {
    width: 32px;
    height: 32px;
}

.apiLookupIconFilter {
    filter: var(--table-primary-img-filter);
}
/* #endregion */

/* #region dashboard icon */
.dashboardChildItemIcon {
    width: 42px;
    height: 42px;
}

.dashboardChildItemManagement {
    width: 32px;
    height: 32px;
    margin-right: 0.5rem;
    cursor: pointer;
}

.dashboardChildItemIcon img {
    filter: var(--dashboard-icon-img-filter);
}

.dashboardIconPicker .dashboardChildItemIcon:hover img {
    filter: var(--dashboard-icon-img-hover-filter);
}


.dashboardIconPicker .dashboardChildItemIcon:hover {
    background-color: var(--dashboard-icon-bkg-color);
}

.dashboardIconPicker .dashboardChildItemIcon.selected {
    background-color: var(--dashboard-icon-hover-bkg-color) !important;
}

.dashboardIconPicker .dashboardChildItemIcon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

    .dashboardIconPicker .dashboardChildItemIcon img {
        width: 80%;
        height: 80%;
    }

.dashboardIconPicker {
    max-height: calc(80vh - 120px);
    overflow-y: auto;
    overflow-x: hidden;
}

.dashboardBottomIcon {
filter: var(--dashboard-icon-bottom-filter);
}

#iconpickerdialog {
    width: 80vw;
    height: 80vh;
}



/* #endregion*/

/* #region Telerik overrides */
:root {
    --kendo-color-primary: var(--tlk-color-primary);
    --kendo-color-surface: var(--tlk-color-surface);
    --kendo-color-surface-alt: var(--tlk-color-surface-alt);
    --kendo-color-on-app-surface: var(--tlk-color-on-app-service);
    --kendo-color-base: var(--tlk-color-base);
    --kendo-color-on-base: var(--tlk-color-on-base);
    --kendo-color-base-hover: var(--tlk-color-base-hover);
    --kendo-color-light: var(--tlk-color-light);
    --kendo-color-border: var(--tlk-color-border);
}


.k-list-item.k-selected, .k-selected.k-list-optionlabel {
    background-color: var(--tlk-list-item-selected-bkg-color);
}

    .k-list-item.k-selected:hover, .k-selected.k-list-optionlabel:hover,
    .k-list-item.k-selected.k-hover, .k-selected.k-list-optionlabel.k-hover {
        background-color: var(--tlk-list-item-selected-hover-bkg-color);
    }

.k-radio:checked, .k-radio.k-checked,
.k-checkbox:checked, .k-checkbox.k-checked {
    color: #fff;
    background-color: var(--tlk-rdo-checked-bkg-color);
    border-color: var(--tlk-rdo-checked-border-color);
}

    .k-radio:checked:focus, .k-radio.k-checked.k-focus,
    .k-checkbox:checked:focus, .k-checkbox.k-checked.k-focus {
        box-shadow: 0 0 0 2px var(--tlk-rdo-checked-focus-color);
    }

.k-checkbox-wrap {
    align-self: center !important;
}

.k-menu-group .k-item > .k-link:active,
.k-menu-group .k-item > .k-link.k-active,
.k-menu-group .k-item > .k-link.k-selected,
.k-context-menu .k-item > .k-link:active,
.k-context-menu .k-item > .k-link.k-active,
.k-context-menu .k-item > .k-link.k-selected,
.k-context-menu .k-item > .k-link:hover,
.k-context-menu .k-item > .k-link.k-hover {
    background-color: var(--tlk-cxtmenu-item-link-bkg-color);
    color: var(--tlk-cxtmenu-item-link-text-hover-color);
}

.k-context-menu .k-item > .k-link img {
    filter: var(--tlk-cxtmenu-item-link-img-filter);
}

.k-drawer .k-drawer-item img {
    filter: var(--tlk-cxtmenu-item-link-img-filter);
}

.k-menu-group .k-item > .k-link:active img,
.k-menu-group .k-item > .k-link.k-active img,
.k-menu-group .k-item > .k-link.k-selected img,
.k-context-menu .k-item > .k-link:active img,
.k-context-menu .k-item > .k-link.k-active img,
.k-context-menu .k-item > .k-link.k-selected img,
.k-context-menu .k-item > .k-link:hover img,
.k-context-menu .k-item > .k-link.k-hover img {
    filter: var(--tlk-cxtmenu-item-link-img-hover-filter);
}


/* Laad animatie bolletjes in grid */
.k-loader-primary {
    color: var(--tlk-loadicon-primary-color);
}

/* Komt o.a. voor bij grid pages knop */
.k-button-flat-primary {
    color: var(--table-pages-btn-color);
}

.k-calendar .k-calendar-td.k-selected .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected .k-link {
    background-color: var(--tlk-calendar-selected-cell-bkg-color);
}

.k-time-list .k-item:hover,
.k-time-header .k-time-now,
.k-time-selector-header .k-time-now,
.k-calendar .k-calendar-view .k-today {
    color: var(--tlk-time-item-text-color);
}

    .k-time-header .k-time-now:hover,
    .k-time-selector-header .k-time-now:hover {
        color: var(--tlk-time-item-hover-text-color);
    }

.k-calendar .k-calendar-td.k-selected:hover .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected:hover .k-link,
.k-calendar .k-calendar-td.k-selected.k-hover .k-calendar-cell-inner,
.k-calendar .k-calendar-td.k-selected.k-hover .k-link {
    background-color: var(--tlk-calendar-selected-hover-cell-bkg-color);
}

.k-button-solid-base.k-selected,
.k-button-solid-primary {
    background-color: var(--tlk-btn-selected-primary-bkg-color);
    border-color: var(--tlk-btn-selected-primary-bkg-color);
}

    .k-button-solid-primary:hover,
    .k-button-solid-primary.k-hover {
        background-color: var(--tlk-btn-selected-primary-hover-bkg-color);
        border-color: var(--tlk-btn-selected-primary-hover-bkg-color);
    }

.k-checkbox:checked::before, 
.k-checkbox.k-checked::before {
    mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

.form-check-input:checked[type=checkbox] {
    --bs-form-check-bg-image: none;
}

.k-input-solid,
.k-input-solid:hover,
.k-input-solid.k-hover,
.k-input-inner,
.k-input-inner:hover,
.k-input-inner.k-hover,
.k-input.k-input-solid,
.k-input.k-input-solid:hover,
.k-input.k-input-solid.k-hover,
.k-input.k-input-inner,
.k-input.k-input-inner:hover,
.k-input.k-input-inner.k-hover {
    background-color: var(--tlk-input-inner-bkg-color);
    color: var(--tlk-input-inner-text-color);
    border-color: var(--tlk-input-inner-border-color);
}


span.k-input ::placeholder {
    color: var(--bts-placeholder-text-color) !important;
    opacity: 1; /* Firefox */
}

span.k-input :-ms-input-placeholder {
    color: var(--bts-placeholder-text-color) !important;
}

span.k-input ::-ms-input-placeholder {
    color: var(--bts-placeholder-text-color) !important;
}

.k-overlay {
    opacity: var(--tlk-overlay-opacity);
}

.k-tabstrip-scrollable:not(.k-tabstrip-scrollable-overlay) > .k-tabstrip-items-wrapper::after {
    display: none;
}

/* #endregion */
/* #region Bootstrap */
/* #region Overrides */
:root {
    --bs-border-radius: 0.25rem;
    --bs-border-radius-sm: .25rem;
    --bs-border-radius-lg: .3rem;
    --bs-border-radius-xl: .5rem;
    --bs-border-radius-xxl: 1rem;
    --bs-border-radius-2xl: 2rem;
    --bs-tertiary-bg: var(--bts-tertiary-bkg-color);
    --bs-border-color: var(--bts-border-color);
    --bs-accordion-btn-padding-y: 1.25rem;
    --bs-accordion-btn-padding-x: 1rem;
    --bs-btn-active-color: var(--bs-secondary-color);
    --bs-btn-active-bg: var(--bs-tertiary-bg);
    --bs-btn-active-border-color: var(--bs-dark-border-subtle);
    --bs-body-bg: var(--bts-body-bkg-color);
    --bs-body-color: var(--bts-body-text-color);
    --bs-emphasis-color: var(--bts-body-text-color);
}

.table {
    --bs-table-striped-bg: var(--bts-table-striped-bgk-color);
}

.accordion {
    --bs-accordion-bg: var(--bts-accordion-bkg-color);
}

.btn {
    --bs-btn-bg: var(--bts-btn-bkg-color);
}

.btn-secondary {
    --bs-btn-disabled-bg: var(--btn-disabled-bkg-color);
    --bs-btn-disabled-border-color: var(--btn-disabled-border-color);
    --bs-btn-disabled-color: var(--btn-disabled-text-color);
}

.dropdown-menu,
.dropdown-item:hover,
.dropdown-item:focus {
    --bs-dropdown-link-hover-bg: var(--bts-dropdown-link-hover-bkg-color);
    --bs-dropdown-bg: var(--bts-body-bkg-color);
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--bts-body-bkg-color);
}

.dropdown-item.item-level-0:hover,
.dropdown-item.item-level-0:focus {
    background-color: var(--bts-body-bkg-color);
}

.bg-white {
    background-color: var(--bts-white-bkg-color) !important;
}

.bg-light {
    background-color: var(--bts-light-bgk-color) !important;
}

.bg-light-alt {
    background-color: var(--bts-light-alt-bgk-color) !important;
}

.border-white {
    border-color: var(--bts-white-border-color) !important;
}

.border-login {
    border-color: var(--border-login) !important;
}

.text-white {
    color: var(--bts-white-text-color) !important;
}

.text-black {
    color: var(--bts-black-text-color) !important;
}

.form-control {
    background-color: var(--bts-form-control-bkg-color);
    color: var(--bts-body-text-color);
    border-color: var(--bts-form-control-border-color);
}

    .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: var(--bts-placeholder-text-color) !important;
        opacity: 1; /* Firefox */
    }

    .form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: var(--bts-placeholder-text-color) !important;
    }

    .form-control::-ms-input-placeholder { /* Microsoft Edge */
        color: var(--bts-placeholder-text-color) !important;
    }

.input-group-text {
    background-color: var(--bts-input-group-text-bkg-color) !important;
    border-color: var(--bts-input-group-text-border-color) !important;
    color: var(--bts-input-group-text-text-color) !important;
}

thead.table-primary,
thead.table-primary tr {
    background-color: var(--bs-table-bg);
}

.btn-lg, .btn-group-lg > .btn {
    --bs-btn-border-radius: var(--bs-border-radius);
}
/* #endregion Overrides*/

/* #region Nested dropdown */
.dropdown-submenu {
    position: relative;
}

    .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }

.dropdown-menu {
    display: none;
}

.dropdown-submenu:hover > .dropdown-menu {
    margin-left: 0;
    margin-right: 0;
    top: 0;
    margin-top: -1px;
}

.dropdown-submenu-left:hover > .dropdown-menu {
    left: auto;
    right: 100%;
}

.dropdown-submenu-right:hover > .dropdown-menu {
    left: 100%;
    right: auto;
}

ul.dropdown-menu > li:first-child > .dropdown-item:hover {
    border-top-left-radius: var(--bs-border-radius);
    border-top-right-radius: var(--bs-border-radius);
}

ul.dropdown-menu > li:last-child > .dropdown-item:hover {
    border-bottom-left-radius: var(--bs-border-radius);
    border-bottom-right-radius: var(--bs-border-radius);
}

/* #endregion Nested Dropdown*/

/* #endregion Bootstrap */

/* #region Achtervoegsel: databaselabel gekoppeld aan het invoerveld ervoor (bijvoorbeeld de valutacode achter een prijs) */
.input-group > .fieldContainer + .fieldContainer + .fieldContainer:has(> span.form-control.text-gray) {
    flex: 0 0 auto;
    width: auto !important;
}

@media (min-width: 576px) {
    .input-group > .fieldContainer + .fieldContainer:has(+ .fieldContainer > span.form-control.text-gray) {
        flex: 0 0 18rem !important;
        max-width: 18rem;
    }

    /* In een kopscherm even breed als het invoerveld van een keuzelijst (2/3 invoer, 1/3 omschrijving) */
    .k-tabstrip-content > .window .input-group:not(.inlineFormWindow *) > .fieldContainer + .fieldContainer:has(+ .fieldContainer > span.form-control.text-gray) {
        flex: 2 1 0 !important;
        width: auto !important;
        max-width: none;
        min-width: 0;
    }

    .k-tabstrip-content > .window .input-group:not(.inlineFormWindow *) > .fieldContainer + .fieldContainer + .fieldContainer:has(> span.form-control.text-gray) {
        flex: 1 1 0;
        min-width: 0;
        padding-left: .5rem;
    }

    .k-tabstrip-content > .window .input-group:not(.inlineFormWindow *) > .fieldContainer + .fieldContainer + .fieldContainer > span.form-control.text-gray {
        width: fit-content;
        max-width: 100%;
    }
}

@media (max-width: 575px) {
    .input-group:has(> .fieldContainer + .fieldContainer + .fieldContainer > span.form-control.text-gray) {
        display: flex;
        flex-wrap: wrap !important;
    }

    .input-group:has(> .fieldContainer + .fieldContainer + .fieldContainer > span.form-control.text-gray) > .fieldContainer {
        flex: 1 1 0;
        min-width: 50%;
    }

    .input-group:has(> .fieldContainer + .fieldContainer + .fieldContainer > span.form-control.text-gray) > .fieldContainer:not(.fieldContainer + .fieldContainer) {
        flex: 0 0 100%;
    }

    .input-group > .fieldContainer + .fieldContainer + .fieldContainer:has(> span.form-control.text-gray) {
        flex: 0 0 auto !important;
        min-width: 0 !important;
    }
}
/* #endregion */

/* #region Mobiele weergave labels boven invoervelden */
@media (max-width: 575px) {
    .form-control {
        border-radius: .25rem;
    }

    input[type=text], input[type=password] {
        border-radius: .25rem;
    }

    .input-group:not(.header-search) {
        display: block;
    }

    .w-200px {
        width: 100%;
    }

    .fieldContainer {
        display: block;
    }

    .input-group-text {
        padding: 0;
        border-radius: 0;
        border: none;
        background: none !important;
        font-weight: 700;
    }

    .input-group-icon {
        padding: 0.375rem 0.75rem;
        border: 1px solid var(--lookup-border-color);
        border-top-left-radius: .25rem !important;
        border-bottom-left-radius: .25rem !important;
    }

    .input-group > .fieldContainer .field:not(.input-group-text) .k-rounded-md,
    .input-group > .fieldContainer .field:not(.input-group-text) {
        border-top-left-radius: .25rem !important;
        border-bottom-left-radius: .25rem !important;
    }

    .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback):not(.multiColDropdownBtn):not(.showTranslatorBtn),
    .input-group > .multiColDropdown {
        margin-left: 0;
    }

    .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) > .field.lookup .input-group .form-control:not(.multiColDropdown):not([readonly]) {
        margin-left: -1px;
    }

    .input-group .fieldContainer:has(.field) + .fieldContainer .field.lookup button:has(.fa-plus) {
        margin-left: -1px !important;
        border-top-left-radius: 0rem !important;
        border-bottom-left-radius: 0rem !important;
        border-top-right-radius: 0.25rem !important;
        border-bottom-right-radius: 0.25rem !important;
    }

    .input-group .showTranslatorBtn {
        margin-left: -1px !important;
        border-top-left-radius: 0rem !important;
        border-bottom-left-radius: 0rem !important;
        border-top-right-radius: 0.25rem !important;
        border-bottom-right-radius: 0.25rem !important;
    }

    .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) > .field.lookup .multiColDropdown {
        border-top-left-radius: .25rem !important;
        border-bottom-left-radius: .25rem !important;
    }

    .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) > .field.lookup .multiColDropdownBtn {
        border-top-left-radius: 0rem !important;
        border-bottom-left-radius: 0rem !important;
        border-top-right-radius: 0.25rem !important;
        border-bottom-right-radius: 0.25rem !important;
    }

    .input-group > .fieldContainer.overflow-hidden {
        overflow: initial !important;
    }
}
/* #endregion */

/*#region Tips */

.moduleTip.moduleTipBgAlt .moduleTipHeader,
.moduleTip.moduleTipBgAlt .moduleTipBody {
    background-color: var(--moduletip-alt-bkg-color) !important;
}

.moduleTip.moduleTipBgAlt {
    box-shadow: 0 3px 4px var(--moduletip-alt-boxshadow-color);
}

/* #endregion Tips */