/* 
    See include/InitializeTabularCombobox.js for the Tabular combobox control usage. 
    See xslt/HtmlControls.xslt on "InsertTabularComboboxControl" for the HTML generation.
*/

/* Clean the default data table style to make the control more look like the default combobox. */
/*.eConTabularComboboxTableContainer table.dataTable tr.odd {
    background-color: white;
}*/
.eConTabularComboboxTableContainer table.dataTable tr td {
    /*override sorting column default style*/
    /*background-color: transparent !important;*/
    cursor: pointer;
}
.eConTabularComboboxTableContainer table.dataTable tbody tr:not(.ui-state-focus):not(:first-child) {
    border-top: 1px solid #eeeeee;
}
.eConTabularComboboxTableContainer .ui-toolbar {
    background: #eeeeee;
    color: black;
}
.eConTabularComboboxTableContainer {
    /*-webkit-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);*/
    border: 1px solid #bbbbbb;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
.eConTabularComboboxTableContainer th {
    border-top: 0px;
}
.eConTabularComboboxTableContainer th:first-child {
    border-left: 0px;
}
.eConTabularComboboxTableContainer th:last-child {
    border-right: 0px;
}
.eConTabularComboboxTableContainer .table_processing {
    /*display: none;*/ /* because this element is not nice, uses visibility: hidden which causes overflow */
    overflow: hidden;
    width: 250px;
}

.eConTabularComboboxTableContainer table.dataTable img {
    max-height: 100px; /* use max-height to prevent stretching images*/

    margin-left: -10px;
    margin-right: -10px;
}

.dataTables_scrollHeadInner {
	width: auto !important;
	padding-right: 0px !important;
}

table.dataTable thead th {
	padding-left: 0px;
	padding-right: 0px;
	box-sizing: border-box;
}

/* In some themes, there are borders on the outside. This causes a scrollbar in Chrome */
table.dataTable tr.ui-state-focus {
	border: 0px;
}
.eConTabularComboboxTableContainer table.dataTable td:last-child {
    border-right: 0px;
}
.eConTabularComboboxTableContainer table.dataTable td:first-child {
    border-left: 0px;
}

.toggle-columns-button {
	float: right;
	height: 18px;
	margin-left: 0.1em;
	margin-right: 0.1em;
}
.toggle-columns-button .ui-button-text {
    padding: 0px 4px !important;
}