/* FuelbedGrid styling. The .readonly color rule is ported as-is from the
   original jexcel.css (assets/styles/jexcel.css:190-193); everything else is
   new, since FuelbedGrid renders its own plain <table> instead of jexcel's
   canvas-like cell markup. */

table.fuelbed-grid {
    border-collapse: collapse;
    background-color: #fff;
	margin-bottom: 0.65em;
}

table.fuelbed-grid > thead > tr > td {
    font-weight: bold;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    padding: 4px 6px;
    font-size: 12px;
}

table.fuelbed-grid > tbody > tr > td {
    border: 1px solid #ccc;
    padding: 2px 4px;
    font-size: 12px;
    vertical-align: middle;
}

table.fuelbed-grid > tbody > tr > td.readonly {
    color: rgba(0, 0, 0, 0.7);
    background-color: #e2e2e2;
}

table.fuelbed-grid textarea {
    font-family: inherit;
    resize: vertical;
}

table.fuelbed-grid input[type="text"],
table.fuelbed-grid input[type="number"],
table.fuelbed-grid textarea {
    width: 100%;
    box-sizing: border-box;
    border: none;
    padding: 0;
    margin: 0;
    background: transparent;
    font-size: 12px;
}

table.fuelbed-grid select {
    width: 100%;
    font-size: 12px;
}

table.fuelbed-grid button {
    font-size: 11px;
}

/* MultiSelectDropdown */
.multiselect-display {
    width: 100%;
    box-sizing: border-box;
    cursor: pointer;
    background: #fff;
    font-size: 12px;
}

.multiselect-popup {
    position: absolute;
    z-index: 1000;
    background: #fff;
    border: 1px solid #999;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
    padding: 6px;
    min-width: 220px;
    max-height: 260px;
    overflow-y: auto;
}

.multiselect-popup input[type="search"] {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 4px;
}

.multiselect-popup ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.multiselect-popup li label {
    display: block;
    padding: 2px 0;
    font-size: 12px;
    white-space: nowrap;
}