﻿/*
1. General
2. Headings/Headers/Groupings
3. Container
4. Columns/Footers
5. Rows
6. Cells
7. Controls
8. Context Menus
9. Status Bar
10. ThirdParty Controls
11. Grid Toolbar
12. Grid Options
13. Templates
14. Tree Grid
*/

/* 1. Beginning of General */

.grid {
    background-color: #ffffff;
    border: 1px solid #322C26;
}

    .grid[data-enabled="false"], .grid [data-gridpart="rowContextMenu"] [data-enabled="false"], .gridRow[data-enabled="false"] {
        color: #888888;
    }

    .grid .sortable-placeholder {
        background: #F2F2F2;
    }

.nestedgrid.grid {
    border: 1px solid #D3D3D3;
}

.groupCollapsed:before {
    content: url('ThemeImages/right.png');
}

.groupExpanded:before {
    content: url('ThemeImages/right_down.png');
}

.expandCollapseNestedGrid {
    color: #322C26;
}

.removeGrouping {
    color: #ffffff;
}

.validation_error {
    color: #9E0000 !important;
    border: 1px solid #9E0000 !important;
    background-color: #fff4f4 !important;
}

.rowTypeCover {
    background-color: #ffffff;
    color: #999999;
}

.rowTypeNew {
    background-color: #ffffff;
}

/* Ending of General */

/* 2. Beginning of Grid Headings/Headers/Groupings */

.gridHeadingsContainer {
    border-bottom: 1px solid #444444;
    background-color: #4E453B;
}

.resizeHelper {
    background-color: #888888;
}

.groupings {
    background-color: #CDC4BC;
    border-bottom: 1px solid #4E453B;
}

    .groupings:after {
        color: #4E453B;
    }

.gridHeader, .grouping {
    color: #ffffff;
    border: solid 1px #f2f2f2;
    background-color: #4E453B;
}

.gridHeader {
    border-left: 1px solid #f2f2f2;
}

.groupingheader {
    color: #ffffff;
    background-color: #4E453B;
}

/* Ending of Grid Headings/Headers/Groupings */

/* 3. Beginning of Grid Container */

.gridContainer {
    background-color: #e0e0e0;
}

.nodata {
    color: #888888;
}

/* Ending of Grid Container */

/* 4. Beginning of Grid Columns/Footers */

.gridFooter, .grandTotalFooterContainer {
    color: #444444;
    background-color: #CDC4BC;
    border-top: dashed 1px #888888;
}

    .gridFooter .column {
        background-color: #CDC4BC;
    }

    .grandTotalFooter li {
        background-color: #CDC4BC;
    }

ul.gridRow li.column.indexColumn, ul.gridRow li.column.budgetTotalColumn {
    background-color: #4E453B;
    color: #ffffff;
    border-bottom: 1px solid #fff;
}

.gridRow .summaryColumnHighlight.column {
    background-color: #CDC4BC;
}

/* Ending of Grid Columns/Footers */

/* 5. Beginning of Grid Rows */

[data-index] li, .grandTotalFooter li {
    border-left: 1px solid #f2f2f2;
}

.filterbar {
    background-color: #CDC4BC;
    border-bottom: 1px solid #4E453B;
}

.filterbar li {
    border-left: 1px solid #f2f2f2;
}

    .valuebar[data-editing="true"] {
        background-color: #DBD1C9;
    }

    .valuebar textarea[data-control="textarea"] {
        background-color: #CDC4BC;
    }

    .valuebar.error {
        background-color: #FFF4F4;
    }

        .valuebar.error:before {
            color: #D15E5E;
        }

.valuebarContainer, .valuebarContainer .formulaButton, .valuebarContainer .display, .valuebarContainer .formulaButton:disabled {
    background-color: #CDC4BC !important;
}

    .valuebarContainer .formulaButton, .valuebarContainer .display, .valuebarContainer .formulaButton:disabled {
        color: #4E453B;
    }

    .valuebarContainer .formulaButton:not(:disabled):hover, .valuebarContainer .formulaButton[data-editing="true"] {
        background-color: #FFDDCC !important;
        color: #FF7733;
        border-right: 1px solid #ffA070;
    }

.zebra_dark .column  {
    background-color: #fbfbfb;
}

.zebra_light .column {
    background-color: #ffffff;
}

.activeRow.gridRow li.column {
    background-color: #ffa070;
}

.activeRow[data-editing="true"] li.column[data-enabled="true"], .activeRow[data-editing="true"] li.column[data-col="select"] {
    border-top: 2px solid #ff7733;
    border-bottom: 2px solid #ff7733;
}

.activeRow[data-editing="true"] li.column[data-enabled="false"] {
    border-top: 2px solid #bbbbbb;
    border-bottom: 2px solid #bbbbbb;
}

/* Ending of Grid Rows */

/* 6. Beginning of Grid Cells */

.activeRow li.activeCell.column {
    background-color: #ff7733;
    color: #ffffff;
}

.activeRow[data-editing="true"] > li {
    background-color: #ffffff;
    color: #444444;
}

    .activeRow[data-editing="true"] > li.activeCell, .activeRow[data-editing="true"] > li.activeCell textarea, .rowTypeNew > li.activeCell, .rowTypeNew > li.activeCell textarea {
        background-color: #ffddcc;
        color: #444444;
    }

.gridRow[data-enabled="false"] li.activeCell {
    color: #e0e0e0;
}

.grid .gridRow:not(.activeRow):not(.valuebar) .budgetDollarsFormulaError,
.grid .gridRow.activeRow .activeCell .budgetDollarsFormulaError {
    background-color: #FFF4F4;
    color: #000000;
}

.isCalculated, .cellDisabled {
    color: #888888;
}

/* Disabled cells in the Add New Row more obvious (Case-sensitive) */
.grid .rowTypeNew li[data-datatype="Lookup"][data-enabled="false"],
.grid .rowTypeNew li[data-datatype="Boolean"][data-enabled="false"],
.grid .rowTypeNew li[data-datatype="String"][data-enabled="false"],
.grid .rowTypeNew li[data-datatype="Number"][data-enabled="false"], 
.grid .rowTypeNew li[data-datatype="Date"][data-enabled="false"], 
.grid .rowTypeNew textarea:disabled {
    background-color: #F2F2F2;
}

.lastFrozen:after {
    background-color: #f2f2f2;
}

.headings .lastFrozen:after, .grandTotalFooter .lastFrozen:after {
    background-color: #fff;
}

.headings .frozen {
    background-color: #322C26;
}

/* Ending of Grid Cells */

/* 7. Beginning of Grid Controls */

[data-control="textarea"] {
    background-color: #ffffff;
}

.column .fa-check {
    color: #349B3B;
}

.activeRow .column .fa-check {
    color: #000000;
}

.column.activeCell .fa-check {
    color: #ffffff;
}

/* Ending of Grid Controls */

/* 8. Beginning of Grid Context Menus */

[data-gridpart="contextMenu"] {
    border: 1px solid #444444;
    background-color: #ffffff;
}

/* Ending of Grid Context Menus */

/* 9. Beginning of Grid Status Bar */

.gridStatusBar {
    background-color: #4E453B;
}

.gridStatusBarCount, .gridStatusBarFilter, .gridStatusBarRefresh {
    border-left: 1px solid #FFFFFF;
    color: #FFFFFF;
}

    .gridStatusBarRefresh:hover {
        background-color: #FF7733;
    }

.gridStatusBarFilter {
    background-color: #CDC4BC;
    color: #000000;
}

.gridStatusBarCount.recordsLimited {
    background-color: #FF7733;
    color: #FFFFFF;
}

    .gridStatusBarCount.recordsLimited:hover {
        background-color: #FF7E3D;
    }

/* Ending of Grid Status Bar */

/* 10. Beginning of Grid ThirdParty Controls */

.grid .select2-container .select2-choice {
    background-color: transparent;
}

/* Ending of Grid ThirdParty Controls */

/* 11. Beginning of Grid Toolbar */

.toolbar {
    background-color: #4E453B;
    color: #ffffff;
}

    .toolbar li.selected {
        background-color: #FFA070;
        color: #000000;
    }

    .toolbar li:hover {
        background-color: #FF7733;
        color: #FFFFFF;
    }

    .toolbar .action ul {
        background-color: #fcfcfc;
        color: #444444;
        border: 1px solid #444444;
    }

    .toolbar .disabled {
        color: #bbbbbb;
    }

    .toolbar #itmSave, .toolbar #itmHelp {
        border-top: 1px dotted #999999;
    }

    .toolbar li.action.disabled:hover {
        background-color: #4E453B;
        color: #bbbbbb;
    }

/* Ending of Grid Toolbar */

/* 12. Beginning of Grid Grid Options */


.listpicker [data-selected="true"] {
    background: #ff7733;
    color: white;
}

.listpicker li:hover {
    background-color: #CDC4BC;
}

#gridOptions fieldset {
    border: 1px solid #939393;
}

#availableGridColumns [data-required="true"]:after, #selectedGridColumns [data-required="true"]:after {
    color: #D15E5E;
}

/* Ending of Grid Grid Options */

/* 13. Beginning of Grid Templates */

/* Ending of Grid Templates */

/* Beginning of Tree Grid */
.tree-expandable i {
    color: #4E453B;
}

/* Ending of  Tree Grid */