:root {
    --geo-primary-green: #50b448;
    --kendo-color-base: #ddf;
    --kendo-color-base-hover: #eef;
    --kendo-color-base-active: #ccf;
    --kendo-color-on-base: #00c;
    --kendo-color-primary: #50b448 !important;
    --kendo-color-primary-hover: #68BE63 !important;
    --kendo-color-primary-active: #21901A !important;
    --kendo-color-primary-on-surface: #48a842 !important;
    --kendo-color-on-primary: #fee;
    --navbar-height: 48px;
    --footer-height: 24px;
    --content-height: calc(100vh - 72px);
}

main {
    height: 100%;
}

body {
    background-color: #f8f8f8;
    font-size: 16px;
    font-weight: 300;
    text-rendering: optimizeLegibility;
    padding: 0;
    margin: 0;
    height: 100vh;
    font-family: Metropolis, OpenSans, Arial;
}

#navbar {
    width: 100%;
    color: white;
    height: var(--navbar-height);
    background-color: var(--geo-primary-green);
    align-content: flex-start;
}

#footer {
    width: 100%;
    color: white;
    height: var(--footer-height);
    background-color: var(--geo-primary-green);
    align-content: flex-start;
}

.horizontal {
    display: flex;
    flex-direction: row;
}

.title-row {
    height: 40px;
    font-size: 18px;
}

.page-title {
    font-weight: bold;
    margin-right: 12px;
}

.button-primary {
    color: white !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    background-color: rgb(72, 168, 66) !important;
    background-image: none !important;
    padding: 8px 12px !important;
    height: 30px !important;
    margin: 0px !important;
}

    .button-primary:hover {
        background-image: none !important;
        opacity: 0.8;
    }

    .button-primary:active {
        background-color: forestgreen !important;
        box-shadow: 2px 2px 6px 1px grey !important;
    }

.k-button {
    width: fit-content;
}




th.k-header {
    background-color: #4D4C4C !important;
    color: white !important;
}

.k-grid-filter .k-icon {
    color: #D5DDE5 !important;
}

.k-grid th.k-header {
    border-color: #D5DDE5;
    border-style: solid;
}

.k-grid th {
    border-width: 0px 1px 1px 0px;
}

.k-grid-header th.k-grid-header-sticky {
    border-right-color: #D5DDE5 !important;
}

#container {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    min-height: var(--content-height) !important;
    max-height: var(--content-height) !important;
    display: flex;
    flex-direction: column;
}

.page-container {
    min-height: 100vh !important;
    max-height: 100vh !important;
}

.page-container-with-navbar {
    min-height: var(--content-height) !important;
    max-height: var(--content-height) !important;
}

.home-splitter-pane {
    min-height: calc(100vh - 2px) !important;
    max-height: calc(100vh - 2px) !important;
}

.home-splitter-pane-with-navbar {
    min-height: calc(var(--content-height) - 2px) !important;
    max-height: calc(var(--content-height) - 2px) !important;
}

.two-row-page {
    display: grid;
    grid-template-rows: auto 1fr;
}

.horizontal {
    display: flex;
    flex-direction: row;
}

.button-secondary {
    border-radius: 4px !important;
    font-size: 14px !important;
    background-image: none !important;
    padding: 8px 12px !important;
    height: 30px !important;
    margin: 0px;
}

.icon-button {
    padding: 4px !important;
    margin: -8px;
}

    .icon-button span img {
        width: 25px;
        height: 25px;
    }

.space-between {
    display: flex;
    justify-content: space-between;
}

.white-image {
    filter: invert(1)
}

.multi-select {
    max-height: 82px; /* Adjust this value to control the height */
    overflow-y: auto; /* Enable vertical scrolling */
}

    .multi-select .k-input {
        height: auto; /* Adjust input height */
        max-height: 82px; /* Set a maximum height for the input area */
        overflow-y: auto; /* Enable scrolling inside the input area */
    }

    .multi-select .k-multiselect-wrap {
        height: auto;
        max-height: 82px; /* Control the height for multiple selected items */
        overflow-y: auto; /* Scroll if there are too many selected items */
    }


.validation-errors {
    color: red !important;
}

.k-grid .k-grid-filter, .k-grid .k-header-column-menu, .k-grid .k-grid-header-menu, .k-grid .k-hierarchy-cell .k-icon {
    color: #D8D8D8 !important;
}

.k-grid-header .k-grid-filter.k-active, .k-grid-header .k-header-column-menu.k-active, .k-grid-header .k-grid-header-menu.k-active, .k-grid-header .k-hierarchy-cell .k-icon.k-active {
    color: #50b448 !important;
    background-color: transparent !important;
}

.k-grid-header .k-grid-filter:hover, .k-grid-header .k-header-column-menu:hover, .k-grid-header .k-grid-header-menu:hover, .k-grid-header .k-hierarchy-cell .k-icon:hover {
    background-color: transparent !important;
}

.k-grid .k-grid-filter, .k-grid .k-header-column-menu, .k-grid .k-grid-header-menu {
    color: #D8D8D8 !important;
}

.k-grid .k-hierarchy-cell .k-icon {
    color: #4D4C4C !important;
}

.k-grid-header .k-hierarchy-cell .k-icon.k-active {
    color: #4D4C4C !important;
    background-color: transparent !important;
}

.k-grid-header .k-hierarchy-cell .k-icon:hover {
    background-color: transparent !important;
}

.k-input-spinner .k-spinner-increase, .k-input-spinner .k-spinner-decrease {
    width: calc(var(--kendo-line-height, normal)* 1em + var(--kendo-spacing-1, 0.25rem)* 2);
}

.k-input.k-disabled {
    opacity: 1 !important;
    background-color: transparent !important;
}

    .k-input.k-disabled button, .k-input.k-disabled .k-clear-value {
        display: none;
    }

.k-disabled .k-form-field-wrap, .telerik-blazor .k-combobox .k-disabled {
    opacity: var(--kendo-disabled-opacity, unset) !important;
}

.k-form-field {
    width: 100% !important;
}

.k-form-horizontal .k-form-field-wrap {
    max-width: none !important;
}

.k-form-field.k-disabled {
    opacity: 1 !important;
}

.k-form-field.hidden-formitem {
    opacity: 0 !important;
}

.k-form-field.k-disabled .k-form-field-wrap {
    opacity: var(--kendo-disabled-opacity, unset);
}

.k-form-horizontal .k-form-field-wrap {
    max-width: none;
}

.k-form .k-form-fieldset {
    margin: 0 !important;
}

    .k-form .k-form-fieldset:not(:first-child) {
        margin-top: 28px !important;
    }

.k-form-field .k-label {
    width: 174px !important;
    min-width: 174px !important;
}

.k-form .k-label-value {
    align-items: flex-start !important;
}

.k-form .k-form-legend {
    margin-left: 16px !important;
    margin-right: 16px !important;
    width: calc(100% - 32px) !important;
}

.k-form, .k-form-inline {
    display: grid;
}