.k-listview:after, .form-view dl:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

#listView, .k-pager-wrap {
    margin: 0 auto;
}

.k-button .k-icon {
    margin: 2px;
    padding: 0;
}

.k-button .custom-icon {
    margin-bottom: 2px;
    padding: 0;
}

.k-button[disabled] {
    color: #ebebeb;
}

.k-button[disabled] .k-icon {
    opacity: 0.4;
}

.k-button[disabled] span {
    opacity: 0.4;
}

.k-dialog .k-dialog-buttongroup {
    padding: 5px;
}

.k-dialog-buttongroup .k-button {
    margin: 0;
}

.k-grid .k-button {
    margin: 1px;
}

.k-text-button {
    padding: 3px 7px 3px 7px;
}

.k-text-button-lg {
    padding: 5px 9px 5px 9px;
}

.k-block {
    width: 100%;
}

.k-pane {
    height: 100%;
}

.k-grid tbody button.k-button {
    min-width: 20px;
    /* for all except IE8 */
}

.k-grid tbody .k-button,
.k-ie8 .k-grid tbody button.k-button {
    min-width: 18px;
}

.k-grid tbody td button.k-button {
    margin-left: 0;
    margin-right: 0;
}

.k-grid tbody td a.k-button {
    width: calc(100% - 2px);
}

.k-grid tbody td a.k-button span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.k-input :not(.k-checkbox), .k-dropdown {
    min-width: 30px;
    max-width: 200px;
}

.k-input-button, .k-input-button.k-button {
    height: auto;
    width: auto;
    max-height: 28px;
    border-radius: 0;
}

.k-input, input {    
    border-radius: 4px;
    border: none;    
}

.text-box.single-line {
    padding: 6px 8px;
}

.custom-input {
    border-radius: 4px;
    padding: 6.0px 8px;
    border: none;
}

.k-grid .field-validation-error{
    font-size:8px;
    color:#fff;
    font-weight:300;
    padding: 3px 8px;
    
}

.k-input[readonly] {
    background-color: #ebebeb;
}

.k-grid {
    height: 100%;
    border-width: 0;
}

.k-grid table {
    table-layout: fixed;
    border-collapse: collapse;
}

.k-splitter {
    height: 100%;
    border-width: 0;
}

html .k-edit-cell .k-tooltip,
html .k-grid-edit-row .k-tooltip {
    max-width: 600px;
}

.k-grid td {
    white-space: nowrap;
    font-size:12px
}

.k-numerictextbox {
    width: 130px !important;
    padding: 0;
}

.k-datepicker {
    max-width: 120px;
    padding:0;
}

.k-menu .k-item > .k-link {
    padding: .3em .7em .4em .6em;
}

.k-tooltip-validation {
    position: fixed;
}

.k-filename {
    white-space: normal;
    max-width: 1200px;
    overflow: visible;
}

.k-splitbar {
    height: 8px;
}

.k-splitbar-vertical .k-icon {
    height: 8px;
}

.k-splitbar-vertical .k-resize-handle {
    background-position: -38px -307px;
}

.k-splitbar-vertical-hover .k-resize-handle {
    background-position: -38px -307px;
}

input[type="checkbox"] {
    width: 1.3em;
    height: 1.3em;
    background: dodgerblue;
}

.k-grid .k-toolbar {
    padding-left: 3px;
}

.k-grid .k-toolbar label {
    margin-left: 3px;
}

.k-numerictextbox .k-icon {
    height: 14px;
}

.k-select > .k-icon.k-i-calendar {
    margin-bottom: 4px;
}

.km-buttongroup > :first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.km-buttongroup > :last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.km-buttongroup > li.km-state-active {
    background-color: royalblue;
    font-weight: bold;
}

.k-dropdown.commodity-dropdown {
    width: 200px;
}

div.k-widget.k-window {
    z-index: 20003 !important;
}

.clearDateButton {
    margin-left: -10px;
    margin-right: 10px;
}

.k-widget,
.k-inline-block,
.k-textbox > input,
.k-input[type="text"],
.k-input[type="number"],
.k-textbox,
.k-picker-wrap,
.k-input,
.k-button,
.k-draghandle,
.k-picker {
    font-size: 85%; /* Adjust this value to your desired font size */
    width: auto;
}

/* Set the font size for Kendo UI grid specifically */
.k-grid-header,
.k-grid-content,
.k-grid-footer,
.k-grid {
    font-size: 100%; /* Adjust this value to your desired font size */
}
.k-dropdownlist {
     width: 145px;
     height: auto;
     
}

.k-grid .k-dropdownlist {
    width: auto;
    min-width: 130px;
}

.k-grid .k-selected {
    background-color: deepskyblue !important;
}

html {
    overflow: hidden !important;
}

.k-autocomplete {
    background-color: white;
    height:28px;
}

.ui-grid-viewport .ui-grid-canvas .ui-grid-row .ng-isolate-scope .ui-grid-cell .uigrid-cellbutton.k-button.ng-scope .custom-icon.mail-icon, .ui-grid-viewport .ui-grid-canvas .ui-grid-row .ng-isolate-scope .ui-grid-cell .uigrid-cellbutton.k-button.ng-scope .k-icon.k-i-close {
    margin: 0;
}

.k-grid-content {
    overflow-x: hidden;
}

.disabled {
    pointer-events: none !important;
}

span.k-invalid-msg {
    position: absolute;
    display: inline;
    z-index: 1;
}

.field-validation-error {
    color: #fff !important;
    background: red;
    font-size:xx-small !important;
    font-weight: initial !important;
    padding: 3px !important;
    border-radius: 2px;

}

.disabled {
    pointer-events: none !important;
}

/*DatetimePicker -> selected date style not applying bz these classes area different than legacy app.
    legacy classes: k-state-selected k-state-focused k-state-hover
*/
.k-calendar-td.k-selected.k-focus {
    color: #ffffff;
    background-color: #0a8ceb;
    border-color: #0a8ceb;
    box-shadow: #004080 0px 0px 3px 1px inset;
}

/*DatetimePicker -> hide border of TODAY to remove confusion b/w current date and selected date*/
.k-calendar .k-today .k-link {
    box-shadow: inset 0 0 0 0px #7bd2f6 !important;
}

.custom-height {
    height: 25px;
}

.custom-margin-bottom {
    margin-bottom: -12px !important;
}

.k-grid-edit-row .k-textbox,
.k-grid-edit-row .text-box {
    padding: 10px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.white-font{
    color: white
}