:root {
    --kendo-secondary-100: #F4C430;
    --kendo-grid-cell-padding-y-md: 0.5rem;
    --kendo-card-title-font-weight: 600;
    /*    --kendo-tile-layout-bg: #ececed;*/
    /* ROUNDED */
    /*--kendo-card-border-radius: 0rem;*/
    --kendo-border-radius-sm: 0 !important;
    --kendo-border-radius-md: 0 !important;
    --kendo-border-radius-lg: 0 !important;
    /*--kendo-border-radius-sm: 0.2rem !important;*/
    /*--kendo-border-radius-md: 0.3rem !important;*/
    /*--kendo-border-radius-lg: 0.3rem !important;*/
    --kendo-card-border-radius: var(--kendo-border-radius-lg);
    /* END ROUNDED */
    /* BUTTON STYLING */
    --kendo-button-solid-primary-bg: var(--kendo-primary-130);
    --kendo-button-solid-primary-hover-bg: var(--kendo-primary-120);
    --kendo-button-solid-primary-border: transparent;
    --kendo-button-solid-base-border: var(--kendo-primary-120);
    --kendo-button-solid-base-selected-bg: var(--kendo-primary-20);
    --kendo-button-solid-base-selected-hover-bg: var(--kendo-primary-30);
    /*--kendo-button-solid-primary-bg: linear-gradient(0deg, var(--kendo-neutral-20, inherit) 0%, var(--kendo-neutral-10, inherit) 100%);*/
    /*    --kendo-button-solid-primary-bg: hsl(206, 50%, 42%);*/
    /*    --kendo-button-solid-primary-border: hsl(206, 50%, 62%);*/
    --kendo-button-solid-primary-selected-bg: var(--kendo-primary-100);
    --kendo-button-border-width: 1px;
    --kendo-input-border-width: 1px;
    --kendo-input-solid-border: var(--kendo-neutral-40);
    --kendo-picker-solid-border: var(--kendo-neutral-40);
    /* END BUTTON STYLING */
    --kendo-splitter-border-width: 0; /* Prevents outline on dashboards */
    --kendo-listview-header-padding-x: 0; /* Stops default padding from messing up Chat Contacts section */
    --kendo-listview-header-padding-y: 0; /* Stops default padding from messing up Chat Contacts section */
    --kendo-notification-font-size: 18px;
    --kendo-scrollview-pagebutton-bg: lightgray; /* Used to color the carousel bottom nav items (weather widget) */
    --kendo-scrollview-navigation-color: lightgray; /* Used to color the carousel next/prev nav items (weather widget) */
    --page-content-padding: 1.25rem; /* Used to correct schedule page padding */
    --kendo-component-border: var(--kendo-primary-20) !important;
    --kendo-pager-dropdown-width: 5rem; /* Ensures the dropdown selection number on Grids does not cutoff 3 digit numbers */
    --kendo-grid-focus-shadow: inset 0 0 0 2px var(--kendo-primary-60); /* This is to prevent outlines on selected grid columns */
    --kendo-toolbar-md-padding-x: 1rem; /* Used for ProvenGrid toolbar spacing */
    /*--kendo-font-size: 0.85rem !important;*/ /* To prevent a pixel value from being used */
    --kendo-drawer-border-width: 0;
    --kendo-grid-border-width: 0;
    --kendo-grid-toolbar-border-width: 0;
    --kendo-empty-space-bg: var(--kendo-primary-10); /* Empty space color */
    --kendo-component-bg: var(--kendo-primary-20); /* Component color */
    --kendo-card-bg: white; /* Card background */
    --kendo-card-shadow: 2px 4px 15px 0px #243d4e15;
    --kendo-scheduler-border-width: 0; /* Hides border on schedule */
    --kendo-toolbar-border-width: 0;
    --kendo-toolbar-bg: var(--kendo-primary-30, inherit);
    --kendo-toolbar-text: var(--kendo-primary-130, inherit);
    --kendo-inverse-toolbar-text: var(--kendo-body-bg);
    /* Toolbar default text color */
    --kendo-toolbar-bg-2: var(--tab-color-active);
    --kendo-toolbar-bg-1: hsl(206, 50%, 42%);
    /*--kendo-toolbar-bg-2: var(--tab-color-active);*/
    /*--kendo-toolbar-bg-1: var(--kendo-primary-30);*/

    --kendo-toolbar-primary-border: var(--kendo-primary-140);
    --kendo-pager-bg: var(--kendo-primary-10);
    --kendo-drawer-bg: hsl(206, 50%, 42%);
    --kendo-drawer-item-bg: transparent;
    --kendo-drawer-item-text: var(--kendo-primary-20);
    --kendo-drawer-item-border: var(--kendo-primary-50);
    --kendo-drawer-item-selected-text: var(--kendo-primary-100);
    --kendo-drawer-item-selected-bg: var(--kendo-primary-10);
    --kendo-drawer-item-focus-shadow: none;
    --kendo-drawer-item-hover-text: var(--kendo-primary-20);
    --kendo-drawer-item-hover-bg: var(--kendo-primary-100);
    --kendo-drawer-item-selected-hover-text: var(--kendo-primary-200);
    --kendo-drawer-item-selected-hover-bg: var(--kendo-primary-60);
    --kendo-input-clear-value-text: white;
    --kendo-drawer-scrollbar-color: var(--kendo-primary-60);
    --kendo-drawer-scrollbar-bg: var(--kendo-primary-20);
    --kendo-drawer-item-ripple-border-width: 0;
    --form-element-box-shadow: 1px 1px 8px rgb(2 37 63 / 10%);
    --kendo-actions-bg: var(--kendo-toolbar-bg);
    --kendo-dropzone-padding-x: 0; /* Used to remove padding on drop zone in ProvenImageUploader */
    --kendo-dropzone-padding-y: 0; /* Used to remove padding on drop zone in ProvenImageUploader */
}

:root {
    --kendo-grid-header-padding-y-md: 0.5rem;
}

:root {
    --kendo-treeview-md-item-padding-y: 0.2rem;
}


.k-button {
    /*max-width: 270px;*/
}
.k-button::after {
    /* this is the last selected button, change default of ugly dark inner border */
    /* ;*/
    outline: none !important;
    backdrop-filter: brightness(0.9);
    border-color: transparent;
    border-width: var(--kendo-button-focus-outline-width, 1px);
    border-style: var(--kendo-button-focus-outline-style, solid);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
}

.k-button:focus::after, .k-button.k-focus::after {
    outline-color: none !important;
    border-color: var(--kendo-button-focus-outline, initial);
}








/* remove some built-in styles */
.special-checkbox.k-checkbox,
.special-checkbox.k-checkbox:focus,
.special-checkbox.k-checkbox:checked,
.special-checkbox.k-checkbox:checked:focus {
    border: none;
    background: none;
    --kendo-checkbox-bg: transparent;
    --kendo-checkbox-hover-checked-bg: transparent;
    --kendo-checkbox-hover-bg: transparent;
    background-image: none !important;
    box-shadow: none;
}

.special-checkbox.k-checkbox:hover {
}

.special-checkbox.k-checkbox::before,
.special-checkbox.k-checkbox:checked::before,
.special-checkbox.k-checkbox:indeterminate::before {
    transform: none;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    font-size: 1.5em;
    /*padding: 1px;
    font-size: 20px;*/ /* used for dimensions, see the next section */
}

/* set desired dimensions */
.special-checkbox.k-checkbox {
}

/* change the font icon glyph to a different one - in this case - a heart icon from the Telerik font
    we also change the colors here to denote states, you can alter this further - like using your own fonts or colors
    */
.special-checkbox.k-checkbox:checked::before {
    font-weight: 900;
    content: "\f2f7";
    color: #43cb48;
}

.special-checkbox.k-checkbox:indeterminate::before {
    content: "\e24c";
    color: #ff6358;
    background: none;
}

.special-checkbox.k-checkbox::before {
    font-weight: 900;
    font-family: "Font Awesome 6 Pro";
    content: "\e24c";
    color: red;
}





.proven-multiselect .k-input-inner {
    /*height: 2.5rem !important;*/
}
.proven-multiselect .k-input-values {
    align-items: baseline;
    padding: calc(var(--INTERNAL--kendo-input-padding-y, 0)/2);
    /*padding-left: 5px;*/
    /*margin-top: 1rem;*/  /* Prevent overlap up into label area when items wrap on to two lines */
}
.proven-multiselect {
    --kendo-chip-solid-base-border: var(--kendo-neutral-50, inherit);
}

.input-group-append .k-button, .input-group-append .k-colorpicker {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    height: 100%;
}

.input-group-append .k-picker {
    height: 100%;
}


.k-form-field .k-searchbox .k-input-inner {
    padding-block-start: var(--INTERNAL--kendo-input-padding-y, 0.375rem) !important;
}
.k-form-field .input-group-append .k-input-inner {
    padding-block-start: 0 !important;
}

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

.input-group {
    flex-wrap: nowrap;
    width: auto; !important;
}

.k-input, .input-group {
    /*    max-width: 270px;*/
}

.k-menu-group .k-item:focus, .k-menu.k-context-menu .k-item:focus {
    box-shadow: none;
}

.k-menu-group .k-item:focus::before,
.k-menu-group .k-item.k-state-focused::before,
.k-menu.k-context-menu .k-item:focus::before,
.k-menu.k-context-menu .k-item.k-state-focused::before {
    pointer-events: none;
    position: absolute;
    left: 0;
    right: 0;
    content: " ";
    z-index: 1;
    bottom: 0;
    box-shadow: 0 0px 7px 0px rgb(0 0 0 / 22%);
    top: 0;
}

/*
.k-menu-vertical > .k-menu-item {
    border: 1px solid transparent;
}

.k-menu-vertical > .k-menu-item:not(:last-child) {
    border-bottom: 2px solid transparent;
}
*/



.k-popup.k-reset {
    /*        transition: none !important;*/
    /* to make animations faster use the following line INSTEAD */
    transition-duration: 200ms !important;
}


.k-button-group > .k-button {
    flex: 1 1 0;
}
.k-form-label ~ .k-button-group {
    margin-top: 1rem;

}
.k-check-list {
    background-color: var(--kendo-input-bg, initial);
    border: 1px solid var( --kendo-input-solid-border, var(--kendo-neutral-130, inherit) );
    display: flex;
    padding-inline: var(--INTERNAL--kendo-input-padding-x, 0.5rem) !important;
    padding-block-start: calc(var(--INTERNAL--kendo-input-padding-y, 0.375rem)) !important;
    padding-block-end: var(--INTERNAL--kendo-input-padding-y, 0.375rem) !important;
    margin: 0;
    padding: 0;
    display: flex;
    flex-flow: column nowrap;
    gap: 0;
    list-style: none;
}

.k-check-list-item {
    display: flex;
    padding-inline: var(--kendo-radio-list-item-padding-x, 0px);
    padding-block: var(--kendo-radio-list-item-padding-y, 0.5rem);
    gap: var(--kendo-radio-list-item-gap, 0.5rem);
    padding-block-end: 2px !important; /* Gap + padding is too much */
}

.k-radio-item .k-item-name, .k-check-list-item .k-item-name {
    line-height: var(--INTERNAL--kendo-radio-height, 1.25em);
    font-weight: 600;
}

.k-check-list-input {
    display: flex;
}
.k-radio-list {
    background-color: var(--kendo-input-bg, initial);
    border: 1px solid var( --kendo-input-solid-border, var(--kendo-neutral-130, inherit) );
    display: flex;
    padding-inline: var(--INTERNAL--kendo-input-padding-x, 0.5rem) !important;
    padding-block-start: calc(var(--INTERNAL--kendo-input-padding-y, 0.375rem)) !important;
    padding-block-end: var(--INTERNAL--kendo-input-padding-y, 0.375rem) !important;

}

.k-radio-item, .k-radio-list-item {
    padding-block-end: 2px !important; /* Gap + padding is too much */
    /*    max-height: 3rem;*/
}
.k-radio-list li {
    display: flex;
    align-items: flex-start;
}

.k-radio {
    margin-top: 0.2rem;
}

.k-radio-item {

}

@media screen and (prefers-reduced-motion: reduce) {
    .k-popup.k-reset {
        transition: none !important;
    }
}

.k-icon-button.k-button-sm > .k-button-icon {
    min-width: 1em;
    min-height: 1em;
}


.k-dialog-content + .k-dialog-actions {
    padding-block-start: 0.75rem !important;
    padding-block-end: 0.75rem;
}

.k-card-actions {
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.k-card-actions.proven-order-first {
    border-top: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}


.k-dropzone {
    flex-direction: column;
    align-items: center;
}

.k-form-field-wrap {
    flex: 1 0 0;
    display: flex;
    /*overflow: hidden;*/
    /*    flex-direction: column;*/
}
.k-form-fieldset:first-child {
    margin-top: 0 !important;
}

.k-form-layout k-d-grid > .k-form-fieldset {
    --kendo-form-fieldset-margin: 0;
}

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

.k-form-fieldset.no-legend > .k-form-legend {
    display: none;
}

.k-form-fieldset.no-legend > .k-form-field:first-of-type {
    margin-block-start: 0;
}

.k-form-layout > .k-form-fieldset {
    margin-top: 0 !important;

}

.k-form-error:empty {
    margin: 0 !important;
}
.k-form-fieldset {
    display: flex;
    gap: 8px;
    flex-direction: column;
}

.k-form-field.proven-form-field  {
    display: flex;  /* !important  <= this was causing d-none/hiding not to work, see if any consequence*/
    flex: 1 1 auto;
    flex-direction: column;
    /* padding: 0.3rem; */
}

.k-form-field-wrap.proven-form-field-wrap{
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.k-form-field-wrap.proven-form-field-wrap span.k-dropdownlist {
    flex-grow: !important;
    display: flex !important;
    align-items: center !important;
    position: relative !important;
}

.k-form-field-wrap.proven-form-field-wrap span.k-colorpicker {
    width: 100%;
}

.k-form-field-wrap.proven-form-field-wrap .k-dropdownlist .k-input-inner {
    /*        overflow: hidden !important;
            white-space: nowrap !important;
            text-overflow: ellipsis !important;*/
    flex-grow: 1 !important;
    margin-right: 1.75rem !important;
}

.k-form-field-wrap.proven-form-field-wrap .k-dropdownlist button {
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    height: 100% !important;
}

/*.proven-form-field-wrap, .proven-form-field-wrap > div {*/
/*    display: flex !important;*/
/*    width: 100%;*/
/*}*/

/*    
.k-form-field.d-none, .k-form .k-form-field-wrap.d-none {
        display: none !important;
}*/

.k-form-field {
    /*    flex: 1 1 auto;*/
    /*    margin-block-end: 0.25rem;*/
}

.k-form-label {
    margin-block-end: 0.25rem;
}


.k-searchbox {

    min-width: 270px;
}

.k-icon k-i-none {
    user-select: none;
}

.k-edit-cell-spacer {
    height: 26px;
}

.no-headers-grid > div > div.k-grid-header {
    display: none;
}

.k-grid-header th {
    background-color: var(--kendo-primary-10);
}

.k-dialog-content {
    white-space: pre-line; /* this allows multiple lines in a telerik dialog by using \n */
    /*    max-width: 18rem;*/
    white-space: normal;
    padding-block: revert !important;
    padding-block-end: 1.5rem !important;
    padding-block-start: 0rem !important;
}


/* FORM FIELD OVERRIDES START */

.k-form-field {
    position: relative;
    /*--kendo-border-radius-md: 0.225rem !important;*/
}

.k-form-field > .k-form-field {
    --kendo-form-rows-spacing-md: 0 !important;
}

/* Old styling */
/*.k-form-field > .k-form-label {*/
/*    line-height: 1;*/
/*    font-size: 0.6rem;*/
/*    position: absolute;*/
/*    z-index: 3;*/
/*    padding-inline-start: var(--INTERNAL--kendo-input-padding-x, 0.5rem);*/
/*    top: 0.25rem;*/
/*    !*color: var(--kendo-neutral-120, inherit)*!*/
/*}*/

/* New styling */
.k-form-field:not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) > .k-form-label {
    line-height: 1;
    font-size: 0.6rem;
    z-index: 3;
    padding-inline-start: var(--INTERNAL--kendo-input-padding-x, 0.5rem);
    width: 100%;
}

.proven-form-field.k-form-field:has(.k-switch) {
    display: flex !important;
    flex-direction: row;
    align-items: center !important;
}

/* Move the label after the switch visually */
.proven-form-field.k-form-field:has(.k-switch) .k-label {
    order: 2;
    font-size: 0.8rem;
    margin-left: 0.5em;
    margin-bottom: 0;
    /*white-space: nowrap;*/ /* Prevent wrapping */
    /*overflow: hidden;*/ /* Optional: hide overflowing text */
    /*text-overflow: ellipsis;*/ /* Optional: show ellipsis for overflow */
}

/* Move input-group (switch) before label visually */
.proven-form-field.k-form-field:has(.k-switch) .input-group {
    order: 1;
}



.k-form-field:not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) > .k-form-label {
    align-items: center;
    background: var(--kendo-primary-10);
    border: 1px solid var(--kendo-component-border);
    border-bottom: none;
    margin-block-end: 0 !important;
    padding-block-end: var(--kendo-form-label-margin-bottom, 0.3rem);
    padding-block-start: var(--kendo-form-label-margin-top, 0.3rem);
    /*padding-inline-start: 0.3rem;
    padding-inline-end: 0.3rem;*/
    border-top-right-radius: var(--kendo-border-radius-md, 0.125rem);
    border-top-left-radius: var(--kendo-border-radius-md, 0.125rem);
    max-width: 400px;
}
.k-disabled .k-form-field:not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) > .k-form-label {
    background: var(--kendo-primary-20);
}

.k-form-field.proven-form-field:not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) > .k-form-label {
    max-width: unset !important;
}

.k-form-field:has(> .k-form-label):not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) .k-input.k-rounded-md,
.k-form-field:has(> .k-form-label):not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) .k-picker.k-rounded-md,
.k-form-field:has(> .k-form-label):not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) .k-input-button .k-rounded-md,
.k-form-field:has(> .k-form-label):not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) .k-slider-wrapper.k-rounded-md,
.k-form-field:has(> .k-form-label):not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) .input-group > .k-button.k-rounded-md

{
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}

.k-form-field > .k-form-label.relative {
    position: relative !important;
    padding: 5px;
}



.k-form-field .k-text-area {
    height: 100%;
}
.k-form-field .k-input-inner {
    /*padding-block-start: calc(var(--INTERNAL--kendo-input-padding-y, 0.375rem) + 0.45rem) !important;*/
}

.k-form-field .k-slider-wrapper {
    padding-block-start: calc(var(--INTERNAL--kendo-input-padding-y, 0.375rem) + 0.5rem) !important;
    padding-inline: 1rem;
    padding-block-end: 1rem;
    border: 1px solid var( --kendo-input-solid-border, var(--kendo-neutral-130, inherit) );
}
/*.k-slider-wrapper*/
.k-input, .k-picker {
    width: 100%;
    max-width: 400px;
    box-shadow: var(--form-element-box-shadow) !important;
}

.proven-form-field .k-input, .proven-form-field .k-picker {
    max-width: unset !important;
}

.k-switch.proven-quick-edit-override {
    --kendo-switch-sm-width: 1.75rem;
    margin-right: 0.25rem;
}
.k-input-value-text {
    display: inline-flex;
}

.k-form-layout > .k-form-field {
    margin: 0 !important;
}

.k-form-layout {
    column-gap: 0.5rem;
    row-gap: 0.5rem;
}


.k-form-label.required::after {
    content: "(required)";
    font-size: 0.5rem;
    color: red;
    margin-left: 0.25rem;
}


/*#region Read Only styling */
.k-readonly, .k-input.k-readonly, .k-picker.k-readonly {
    --form-element-box-shadow: none !important;
    --kendo-input-solid-border: var(--kendo-primary-20); !important;
    --kendo-picker-solid-border: var(--kendo-primary-20); !important;
    --kendo-input-solid-bg: var(--kendo-primary-10);
    --kendo-picker-solid-bg: var(--kendo-primary-10);
}

.k-readonly .k-chip {

    --kendo-chip-border: var(--kendo-primary-30) !important;
    --kendo-chip-bg: var(--kendo-primary-20)  !important;
}
.k-readonly .k-disabled, .k-readonly .k-input,
.k-readonly .k-picker, .k-readonly .k-input-values,
.k-input.k-readonly, .k-picker.k-readonly {
    --kendo-input-disabled-text: var(--bs-body-color);
    --kendo-input-disabled-bg: var(--kendo-primary-10);
    --kendo-picker-disabled-text: var(--bs-body-color);
    --kendo-picker-disabled-bg: var(--kendo-primary-10);
    --kendo-input-disabled-border: var(--kendo-primary-20);
    --kendo-picker-disabled-border: var(--kendo-primary-20);

    /*        --kendo-picker-disabled-text: var(--bs-body-color);
            --kendo-input-disabled-bg: transparent !important;
            --kendo-picker-disabled-bg: transparent !important;
            --kendo-input-disabled-border: transparent;
            --kendo-picker-disabled-border: transparent;*/
    pointer-events: none;
    user-select: text;
}

/* TODO: Select All When Read Only */
/*.k-readonly .k-input .k-input-inner, .k-readonly .k-picker .k-input-inner, .k-input.k-readonly .k-input-inner, .k-picker.k-readonly .k-input-inner {*/
/*    -webkit-user-select: all !important;  !* Chrome all / Safari all *!*/
/*    -moz-user-select: all !important;     !* Firefox all *!*/
/*    -ms-user-select: all !important;      !* IE 10+ *!*/
/*    user-select: all !important;          !* Likely future *!*/
/*    pointer-events: all !important;*/
/*}*/

.k-form.k-readonly .k-input > input.k-input-inner,
.k-form.k-readonly .k-picker > input.k-input-inner,
.k-input.k-readonly > input.k-input-inner,
.k-picker.k-readonly > input.k-input-inner {
    pointer-events: all;
    user-select: text;
}

.k-form.k-readonly .k-input-button,
.k-input.k-readonly .k-input-button,
.k-input.k-readonly .k-icon-button,
.k-readonly .k-input .k-input-button,
.k-readonly .k-input .k-icon-button,
.k-readonly .input-group .k-icon-button,
.k-readonly .input-group .k-input-button {
    display: none;
}


/* #endregion */

.k-form-layout {
    /* This centers headers inside of a form layout, unsure if needed */
    /*margin: auto;*/
}
/* FORM FIELD OVERRIDES END */


.proven-dropdown-button > .k-button:first-of-type {
    pointer-events: none;
    visibility: hidden;
    z-index: 3;
}
.proven-dropdown-button .k-button:first-of-type .proven-dropdown-button-content {
    visibility: visible;
    min-width: 20px;
}


.proven-dropdown-button > .k-split-button-arrow {
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-start-start-radius: var(--kendo-border-radius-md, 0.125rem) !important;
    border-end-start-radius: var(--kendo-border-radius-md, 0.125rem) !important;
    border-inline-start-width: var(--kendo-button-border-width, 1px) !important;
    margin-inline-start: 0 !important;
}

.proven-dropdown-button > .k-split-button-arrow > * {
    display: none !important;
}

.proven-dropdown-button.proven-dropdown-icon-button > .k-button:first-of-type {
    --INTERNAL--kendo-button-padding-x: var(--kendo-icon-button-md-padding-y, 0.375rem );
    --INTERNAL--kendo-button-padding-y: var(--kendo-icon-button-md-padding-y, 0.375rem );
}

.k-form-legend {
    display: flex;
    align-items: baseline;
}


.k-form-label ~ .k-form-field-wrap:has(> .k-slider) {
    padding-top: 1rem !important;
}

/* fyi below was putting too much white space above the plus sign in the dyn form multiple choice editor */

/*.k-form-field-wrap > .k-grid .k-toolbar {
    padding-top: 1.25rem;
}*/

.k-form-field-wrap > .proven-form-control-missing {
    padding-inline: var(--INTERNAL--kendo-input-padding-x, 0.5rem);
    padding-block: var(--INTERNAL--kendo-input-padding-y, 0.375rem);
    padding-block-start: 1rem;
    color: red;
}

.k-form-field:has( .k-form-field-wrap > div > input[type="checkbox"]),
.k-form-field:has( .k-form-field-wrap > span > input[type="checkbox"]),
.k-form-field:has( .k-form-field-wrap > .k-checkbox),
.k-form-field:has( .k-form-field-wrap > .k-slider) {
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center;
}

.k-form-field:has( .k-form-field-wrap > div > input[type="checkbox"]) > .k-form-label,
.k-form-field:has( .k-form-field-wrap > span > input[type="checkbox"]) > .k-form-label,
.k-form-field:has( .k-form-field-wrap > .k-checkbox) > .k-form-label,
.k-form-field:has( .k-form-field-wrap > .k-slider)  > .k-form-label {
    position: relative;
    align-items: center;
    padding-inline-start: 0;
    font-size: 0.8rem;
    margin-inline-start: 0.25rem;
    margin-block-end: 0 !important;
    flex-grow: 1;
    top: 0 !important;
}

.k-form-field:has( .k-form-field-wrap > div > input[type="checkbox"]) > .k-form-label > .proven-quick-edit-override ,
.k-form-field:has( .k-form-field-wrap > span > input[type="checkbox"]) > .k-form-label > .proven-quick-edit-override,
.k-form-field:has( .k-form-field-wrap > .k-checkbox) > .k-form-label > .proven-quick-edit-override,
.k-form-field:has( .k-form-field-wrap > .k-slider)  > .k-form-label > .proven-quick-edit-override {
    position: absolute;
    left: -3.5rem;
}

.k-form-field:has( .k-form-field-wrap > div > input[type="checkbox"]):has( .proven-quick-edit-override)  .k-form-field-wrap ,
.k-form-field:has( .k-form-field-wrap > span > input[type="checkbox"]):has( .proven-quick-edit-override)  .k-form-field-wrap,
.k-form-field:has( .k-form-field-wrap > .k-checkbox):has( .proven-quick-edit-override)  .k-form-field-wrap,
.k-form-field:has( .k-form-field-wrap > .k-slider):has( .proven-quick-edit-override)  .k-form-field-wrap {
    margin-left: 2rem;
}

.k-form-field:has( .k-form-field-wrap > div > input[type="checkbox"]) > .k-form-field-wrap,
.k-form-field:has( .k-form-field-wrap > span > input[type="checkbox"]) > .k-form-field-wrap {
    flex-grow: 0 !important;
    flex: 0 1 0 !important;
}

.k-form-field:has(> .k-form-label ~ input[type="checkbox"]) {
    display: flex !important;
    flex-direction: row;
    align-items: center !important;
}
.k-form-field:has(> .k-form-label ~ input[type="checkbox"]) > .k-form-label {
    order: 2;
    position: relative;
    padding-inline-start: 0;
    padding-bottom: 0;
    font-size: 0.6rem !important;
    margin-inline-start: 0.25rem;
    margin-block-end: 0 !important;
    top: 0 !important;
}


.k-form-label ~ .k-form-field-wrap:has(> div > input[type="checkbox"]) {

}
.no-now-button .k-time-now {
    display: none;
}

/* Vertically centers the weather widget carousel next and previous buttons */
.k-scrollview-next, .k-scrollview-prev {
    height: 25% !important;
    top: 40% !important;
}

.k-chip {
    margin:  0 !important;
}

/* hide the circle-x remove icon when form control disabled */
.k-disabled .k-chip-action
{
    display: none;
}

.k-form-field:has(.k-input:disabled, .k-input[disabled], .k-input.k-disabled) > .k-form-label,
.k-form-field:has(.k-picker:disabled, .k-picker[disabled], .k-picker.k-disabled) > .k-form-label {
    color: var(--kendo-neutral-120, inherit);
}

.k-input:disabled, .k-input[disabled], .k-input.k-disabled {
    color: var(--kendo-neutral-140);
}
.k-picker:disabled, .k-picker[disabled], .k-picker.k-disabled {
    color: var(--kendo-neutral-140);
}

/* These modifications on the two classes are to center time select title when no 'now' button is present (ie. schedule appointment time select) */
.k-time-header {
    display: flex;
}
.k-time-header .k-title {
    margin: 0 auto;
}


.k-drawer-item-list {
}

.k-drawer-item-wrapper {
}

.k-drawer {
    background: var(--kendo-drawer-bg, var(--kendo-component-bg, initial));
}

.k-drawer-item {
    font-weight: 500 !important;
    /*    border-top: 1px solid var(--kendo-drawer-item-border);*/
    /*    text-shadow: 1px 1px 3px var(--kendo-primary-140);*/
}
/*.k-drawer-item.k-selected {
    font-weight: 800 !important;
}*/

.k-tree-drawer-item {
    display: flex !important;
    padding: 0 !important;
}

.k-tree-drawer-item > .k-item-text {
    flex: 1 1 0;
    padding-inline: var(--kendo-drawer-item-padding-x, 1rem);
    padding-block: var(--kendo-drawer-item-padding-y, var(--kendo-padding-x, 0.5rem));
}

.k-drawer-item-expander {
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    /*    padding-inline-end: var(--kendo-drawer-item-padding-x, 1rem) !important;*/
}

.k-drawer-item-expander:hover {
    color: var(--kendo-primary-130);
}

.k-drawer-item-list:not(.k-expanded) {
    display: none;
}

.k-drawer-item-wrapper > ul.k-drawer-item-list > li {
    padding-inline-start: 1rem !important;
}

.k-drawer-item-wrapper > ul.k-drawer-item-list > li > .k-drawer-item.k-tree-drawer-item > .k-item-text {
    /*padding-inline-start: var(--kendo-drawer-item-padding-x, 1rem) !important;*/
}

.k-drawer-item.k-tree-drawer-item.is-invalid > .k-item-icon,  .k-drawer-item.k-tree-drawer-item.is-invalid > .k-item-text {
    color: var(--kendo-error-100);
}
.k-drawer-item.k-tree-drawer-item > .k-item-icon {
    padding-inline-start: var(--kendo-drawer-item-padding-x, 1rem);
}

.k-drawer-item.k-tree-drawer-item > .k-item-icon ~ .k-item-text {
    padding-inline-start: 0 !important;
}


.k-slider-wrapper {
    width: 100%;
}

.k-slider {
    --kendo-slider-size: 100%;

}
.k-toolbar .k-slider {
    --kendo-slider-track-bg: white;
}
.k-toolbar .k-slider .k-tick {
    background: white;
}
/* This is to alter the color of the ProvenGrid FilterMenu when filters are active */
.k-grid-filter-menu.k-grid-header-menu.k-active {
    background-color: var(--kendo-primary-30) !important;
}
}

.form-properties .k-grid {
    max-height: 300px !important;
}

/* Grid is a form element */
.k-form-field-wrap > .k-grid {
    max-height: 500px;
}


/* This media query captures accessibility settings, see 
   https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#user_preferences
 */
@media screen and (prefers-reduced-motion: reduce) {
    .k-popup.k-reset {
        transition: none !important;
        /* to make animations faster use the following line INSTEAD */
        /* transition-duration: 100ms !important; */
    }
}

/* New row styling */
.k-grid tr.is-new {
    background-color: var(--kendo-warning-50);/*
    color: var(--kendo-warning-200);*/
    font-weight: 800;
}

.is-new-icon {
    color: var(--kendo-warning-100);
}

.k-grid tr.is-new .is-new-indiciator {
    margin-right: 0.5rem;
    background-image: linear-gradient( -225deg, #231557 0%, #44107a 29%, #ff1361 67%, #231557 100% );
    background-size: auto auto;
    background-clip: border-box;
    background-size: 200% auto;
    color: #fff;
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: textclip 4s linear infinite;

}

@keyframes textclip {
    to {
        background-position: 200% center;
    }
}

/* Removes ugly css on icon buttons with flat style */
.k-button-flat.k-icon-button {
    box-shadow: none !important;
}


/* Make buttons and inputs pop toolbar */
.proven-toolbar-neutral .k-input, .k-toolbar .k-input, .proven-toolbar-neutral .k-picker, .k-toolbar .k-picker,
.proven-toolbar-inverse .k-input, .proven-grid-full .k-grid-toolbar .k-input {
    text-shadow: none;
    box-shadow: inset 1px 1px 3px rgba(255,255,255,0.3), 1px 1px 12px rgba(0,0,0,0.15);
}

/* Removes ugly css on toolbar searchbox */
.proven-toolbar-neutral .k-searchbox,
.k-toolbar .k-searchbox,
.proven-grid-toolbar-search {
    box-shadow: none !important;
    border-radius: 0 !important;
    border: none !important;
    border-bottom: 2px solid var(--kendo-primary-120) !important;
    background-color: transparent !important;
    /*color: var(--kendo-toolbar-text) !important;*/
}

.k-toolbar .k-toolbar-item .proven-grid-toolbar-search .k-input-inner::placeholder,
.k-toolbar .k-toolbar-item .proven-grid-toolbar-search .k-input-inner {
    color: var(--kendo-toolbar-text);
}
.k-toolbar .k-toolbar-item .proven-grid-toolbar-search .k-svg-icon svg {
    fill: var(--kendo-toolbar-text);
}


.p-grid-toolbar-maximized > .k-toolbar .k-toolbar-item .proven-grid-toolbar-search .k-input-inner::placeholder,
.p-grid-toolbar-maximized > .k-toolbar .k-toolbar-item .proven-grid-toolbar-search .k-input-inner {
    color: white !important;
}
.p-grid-toolbar-maximized > .k-toolbar .k-toolbar-item .proven-grid-toolbar-search .k-svg-icon svg {
    fill: white !important;
}

/*.p-grid-toolbar-maximized .proven-grid-toolbar-search.k-searchbox.k-input::after,
.p-grid-toolbar-maximized .proven-grid-toolbar-search .k-input-inner::after,
.p-grid-toolbar-maximized .proven-grid-toolbar-search .k-input-inner {
    color: white !important;
}*/

/* Scheduler takes entire view, hide border radius */
.k-scheduler {
    border-radius: 0 !important;
}
/* This is to prevent a shadow from being behind the schedule data button */
.k-scheduler-toolbar .k-nav-current {
    box-shadow: none !important;
}

/* Causes flexbox to break by specifying height: auto */
.k-splitter.k-splitter-flex {
    min-height: 0;
}

/* This to hide the defauly upload buttons on the Telerik Uploader component */
.k-upload.k-upload-async.telerik-blazor .k-actions.k-actions-end.k-actions-horizontal {
    display: none !important;
}


.k-form-buttons {
    /* We shouldn't use k-form-buttons, DO NOT RE-ENABLE  */
    display: none !important;
}

.k-window.align-actions-right  .k-window-actions.k-actions-stretched > * {
    flex-grow: 0;
}
.k-window-actions {
    padding: 0.5rem !important;
    background-color: var(--kendo-toolbar-bg, var(--kendo-neutral-10, inherit)) !important;
}

/* if showing a special color banner in window command bar, move the padding from the action container to the banner container */
.k-window-actions:has(.proven-banner) {
    padding: 0.0rem !important;
}
.k-window-actions .proven-banner {
    padding: 2rem !important;
}

.k-window.no-gutters .k-window-content,
.k-window-content:has(>.k-form>.proven-form-drawer) {
    padding: 0;
}

.k-window-content:has(>.k-form>.proven-form-drawer) {
    display: flex;
    flex-direction: column;
}
.k-window-content > .k-form {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.proven-form-drawer {
    flex-grow: 1;
}

/*#region ProvenGrid */
/* This is to prevent the CommandList dropdown button from showing ugly border */
.telerik-blazor.k-button.k-menu-button.proven-grid-column-action-list-button.k-button-flat.k-rounded-md.k-button-md {
    border: none !important;
}

.k-grid .k-detail-row .k-detail-cell {
    text-wrap: wrap;
}

.proven-drop-image .k-external-dropzone
{
    height: unset !important;
}

.proven-drop-image .uploader-div {
    position: absolute;
    bottom: 0;
    right: 0;
}

.proven-drop-image .k-upload {
    /* remove component border */
    border-width: 0;
    /* prevent expansion to 100% */
    display: inline-block;
    padding: 0px !important;
    margin: 0px !important;
    background-color: transparent !important;
}

.proven-drop-image .k-upload .k-upload-button {
    /* WAS: min-width: 7em; */
    height: 2rem;
    min-width: unset;
    width: 1rem;
}

.proven-drop-image .k-upload .k-dropzone {
    /* remove space around button */
    padding: 0;
    /* remove background around button */
    /* use if Upload status below is NOT hidden */
    background-color: transparent;
}

/* hide selected files */
.proven-drop-image .k-upload .k-upload-files,
    /* hide Upload status */
.proven-drop-image .k-upload .k-upload-status,
    /* hide drop hint */
.proven-drop-image .k-upload .k-dropzone-hint {
    display: none;
}

/*#endregion*/


/* Icon is embeded in button (Placed on right) */
.k-button-text:has(> .k-button-icon) {
    display: inline-flex;
}
.k-button-text > .k-button-icon {
    margin-left: var(--kendo-button-spacing, 0.5rem);
}

.proven-form-answer {
    font-weight: 800;
    color: var(--kendo-primary-100);
}

.k-tabstrip-content {
    padding-inline: 0rem !important;
    padding-block: 0rem !important;
}


.proven-form-wizard-container {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    width: 100%;
}

.proven-toolbar {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.5rem 0.5rem 1rem;
    border-bottom: 1px solid var(--kendo-component-border);
}



.proven-form-field-wrap:has(textarea) .corner-button {
    position: absolute;
    top: 0.5em; /* adjust as needed */
    right: 0.5em;
    border: none;
    color: var(--kendo-primary-100);
    background-color: var(--kendo-primary-10);
    padding: 0.25em 0.25em;
    border-radius: 15px;
    cursor: pointer;
    z-index: 1;
}

.proven-form-field-wrap:has(textarea) .corner-button:focus {
    outline: 2px dashed #005A9E;
    outline-offset: 2px;
}





.form-grid {
    gap: 8px;
    --max-columns: 3;
    --columns: 1;
    --column-width: 320px;
    width: calc(var(--column-width) * var(--columns) + ((var(--columns) - 1) * 8px));
    /*min-width: calc(var(--column-width) * var(--max-columns) + ((var(--max-columns) - 1) * 8px));*/
    /*max-width: calc(960px + ((var(--max-columns) - 1) * 8px));*/
}

.proven-patient-form {
    /*padding: 1rem;*/
}


.dynform-box {
    position: relative;
    border: none;
}

.dynform-box.is-selected {
    background-color: var(--kendo-bg-primary, var(--kendo-primary-100, inherit));
}

.dynform-box.is-disabled {
    background-color: lightgray;
    opacity: 0.4;
}

.dynform-box-check {
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 1em;
}

.dynform-box-check:not(.is-selected) {
    display: none;
}

.dynform-box-check.is-selected {
    display: block;
}

@media (max-width: 768px) {
    .form-grid {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
    }

    .form-grid > * {
        width: 100% !important;
        /* Reset any grid positioning properties */
        grid-column: unset !important;
        grid-row: unset !important;
        grid-area: unset !important;
    }
}
















































.portal-form-element {
    margin-bottom: 1.5rem;
    transition: all 0.3s ease;
}

.portal-container {
    background: #ffffff;
}

.portal-container-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.portal-field {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.portal-label {
    font-family: 'Roboto', sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    color: #2c3e50;
    transition: color 0.2s ease;
}

.portal-required {
    color: #e74c3c;
    margin-left: 0.25rem;
    font-weight: bold;
}

.portal-required-conditional {
    color: #f39c12;
    margin-left: 0.25rem;
    font-style: italic;
}

.portal-input-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.portal-field-wrap {
    position: relative;
}

.portal-field-wrap input,
.portal-field-wrap select,
.portal-field-wrap textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    font-size: 1rem;
    transition: all 0.2s ease;
    background: #f8fafc;
}

.portal-field-wrap input:focus,
.portal-field-wrap select:focus,
.portal-field-wrap textarea:focus {
    border-color: #3498db;
    box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.1);
    outline: none;
}

.portal-field.has-error input,
.portal-field.has-error select,
.portal-field.has-error textarea {
    border-color: #e74c3c;
}

.portal-field.has-error .portal-label {
    color: #e74c3c;
}

.portal-field.readonly input,
.portal-field.readonly select,
.portal-field.readonly textarea {
    background-color: #f7f9fc;
    border-color: #edf2f7;
    cursor: not-allowed;
}

.portal-commands {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

@media (max-width: 768px) {
    .portal-container {
        padding: 1rem;
    }

    .portal-container-grid {
        grid-template-columns: 1fr;
    }
}




/* EVERYTHING BELOW HERE IS STEVE HACKING AWAY AT THIS TO ATTEMPT TO MAKE IT LOOK BETTER
   STEVE APOLOGIZES PROFUSELY.
*/



.proven-form-field.k-form-field > .k-form-label {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
    font-size: 0.875rem !important;
    font-weight: 500;
    color: #374151;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin-bottom: 0.5rem !important;
    position: relative !important;
    border-radius: 0 !important;
    max-width: none !important;
}

.proven-form-field .k-input,
.proven-form-field .k-picker,
.proven-form-field .k-textbox,
.proven-form-field .k-textarea {
    border: 2px solid #e5e7eb !important;
    border-radius: 8px !important;
    padding: .5rem .5rem !important;
    font-size: 1rem;
    transition: all 0.2s ease;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    max-width: none !important;
}

.proven-form-field .k-checkbox,
.proven-form-field .k-radio {
    width: 1.5rem;
    height: 1.5rem;
    border: 2px solid var(--kendo-primary-60);
    border-radius: 4px;
    transition: all 0.2s ease;
    margin-left: 10px;
}


.proven-form-field .k-checkbox:checked,
.proven-form-field .k-radio:checked {
    background-color: var(--kendo-primary-90);
    border-color: var(--kendo-primary-150);
}

.proven-form-field.k-form-field:not(:has(.k-form-field-wrap > .k-checkbox)):not(:has(.k-form-field-wrap > .k-switch)) > .k-form-label {
    background: transparent !important;
    border: none !important;
    position: relative !important;
    padding: 0 !important;
    font-size: 0.875rem !important;
    margin-bottom: 0.5rem !important;
    color: #374151 !important;
}

.proven-required {
    color: #ef4444;
    font-weight: 600;
    margin-left: 0.25rem;

}

.proven-form-field.k-form-field-error {
    position: relative;
    animation: fieldErrorShake 0.5s ease-in-out;
}

@keyframes fieldErrorShake {
    0%, 100% { transform: translateX(0); }
    10%, 30%, 50%, 70%, 90% { transform: translateX(-2px); }
    20%, 40%, 60%, 80% { transform: translateX(2px); }
}

.proven-form-field.k-form-field-error .k-input,
.proven-form-field.k-form-field-error .k-picker,
.proven-form-field.k-form-field-error .k-textbox,
.proven-form-field.k-form-field-error .k-textarea {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1),
    inset 0 0 0 1px rgba(239, 68, 68, 0.2) !important;
    background-color: #fef2f2 !important;
    position: relative;
}

.proven-form-field.k-form-field-error.critical-error .k-input,
.proven-form-field.k-form-field-error.critical-error .k-picker {
    animation: errorPulse 2s infinite;
}

@keyframes errorPulse {
    0%, 100% {
        box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1),
        inset 0 0 0 1px rgba(239, 68, 68, 0.2);
    }
    50% {
        box-shadow: 0 0 0 6px rgba(239, 68, 68, 0.2),
        inset 0 0 0 1px rgba(239, 68, 68, 0.4);
    }
}

.proven-form-field.k-form-field-error > .k-form-label {
    color: #dc2626 !important;
    font-weight: 600 !important;
    position: relative;
}


.proven-form-field.k-form-field-error > .k-form-label::before {
    content: '⚠';
    display: inline-block;
    margin-right: 0.375rem;
    font-size: 1rem;
    animation: errorIconBounce 0.6s ease-in-out;
}

@keyframes errorIconBounce {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.2); }
}




.form-desktop-button {
    width: 100%;
    height: 60px;
}

.progress-bar.form-progress-bar {
    background-color: var(--kendo-primary-110);
}