/*--------------------------------------------------------------------------------
Kendo overrides
--------------------------------------------------------------------------------*/
/*This is a meterial specific overrides..*/
.k-autocomplete, .k-dateinput-wrap, .k-dropdown-wrap, .k-multiselect-wrap, .k-numeric-wrap, .k-picker-wrap {
    border-color: #d8d8d8;
}

.k-numerictextbox .k-numeric-wrap {
    border-color: #d8d8d8;
    /*color: rgba(0,0,0,.87);*/
}

.k-autocomplete.k-state-disabled, .k-dateinput-wrap.k-state-disabled, .k-dropdown-wrap.k-state-disabled, .k-multiselect-wrap.k-state-disabled, .k-numeric-wrap.k-state-disabled, .k-picker-wrap.k-state-disabled, .k-state-disabled > .k-autocomplete, .k-state-disabled > .k-dateinput-wrap, .k-state-disabled > .k-dropdown-wrap, .k-state-disabled > .k-multiselect-wrap, .k-state-disabled > .k-numeric-wrap, .k-state-disabled > .k-picker-wrap {
    border-bottom-style: solid;
}

.k-autocomplete.k-state-hover, .k-autocomplete:hover, .k-dateinput-wrap.k-state-hover, .k-dateinput-wrap:hover, .k-dropdown-wrap.k-state-hover, .k-dropdown-wrap:hover, .k-multiselect-wrap.k-state-hover, .k-multiselect-wrap:hover, .k-numeric-wrap.k-state-hover, .k-numeric-wrap:hover, .k-picker-wrap.k-state-hover, .k-picker-wrap:hover {
    border-color: #808080;
}

.k-input.k-textbox.k-state-hover, .k-input.k-textbox:hover, .k-textarea.k-state-hover, .k-textarea:hover, .k-textbox.k-state-hover, .k-textbox:hover {
    border-color: #808080;
}

.k-input.k-textbox.k-state-focus, .k-input.k-textbox:focus, .k-textarea.k-state-focus, .k-textarea:focus, .k-textbox.k-state-focus, .k-textbox:focus {
    border-color: #d0d4d7;
}

k-input.k-textbox:disabled, .k-textarea:disabled, .k-textbox:disabled {
    border-style: solid;
}

.k-column-menu .k-menu:not(.k-context-menu) .k-item.k-state-selected, .k-list .k-item.k-state-selected, .k-list-container .k-button.k-state-active, .k-list-container .k-button:active, .k-list-optionlabel.k-state-selected, .k-menu-group .k-item.k-state-selected, .k-menu.k-context-menu .k-item.k-state-selected, .k-spreadsheet-popup .k-button.k-state-active, .k-spreadsheet-popup .k-button.k-state-selected, .k-spreadsheet-popup .k-button:active {
    color: #808080;
    background-color: transparent;
}

.k-list .k-item.k-state-hover.k-state-selected, .k-list .k-item:hover.k-state-selected, .k-list-optionlabel.k-state-hover.k-state-selected, .k-list-optionlabel:hover.k-state-selected {
    color: #808080;
    background-color: #ebebeb;
}

.k-autocomplete .k-input, .k-dateinput-wrap .k-input, .k-dropdown-wrap .k-input, .k-multiselect-wrap .k-input, .k-numeric-wrap .k-input, .k-picker-wrap .k-input {
    color: #a1aaaf;
}

.k-input.k-textbox, .k-textarea, .k-textbox, .k-dropdown-wrap .k-input {
    border-color: #d0d4d7; /*if you change a border color on kendo controls, you need to do it consistently*/
    font-size: 1em; /*to align with sampleui body...*/
    color: #a1aaaf; /*no need for important because i moved the stylesheet after sampleui*/
}


/*general overrides*/
.k-icon-black {
    color: black;
}

.k-textbox {
    width: 100%;
}

.k-autocomplete {
    width: 100%;
}

.k-datepicker {
    width: 100%;
}

    .k-datepicker > div.k-animation-container {
        /*to control the width of the datepicker flyout*/
        width: 351px !important;
    }

.k-combobox {
    width: 100%;
}

.k-dropdown {
    width: 100%;
}

.k-numerictextbox {
    width: 100%;
}

.k-maskedtextbox {
    width: 100%;
}

.k-secondary {
    background-color: #218838;
    border-color: #1e7e34;
    color: #fff;
}

.k-tabstrip-items .k-item .k-link {
    color: #878585;
}


.k-grid td[role='gridcell'] > input[type='checkbox'] {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 25px;
    height: 25px;
    -moz-appearance: none;
}

.k-listview {
    border: none;
    background-color: transparent !important;
}

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