.main_content .rec-grid div.k-grid-content, .dxgvControl {
    background: var(--grille-results-background) !important;
}

    .main_content .rec-grid div.k-grid-content.ux2-grid-tab-enable,
    .k-alt, .dxgvDataRowAlt, .dxgvDataRow, .k-alt.kendo-data-row,
    .ux2-grid-dx .dxgvDataRowAlt, .k-master-row.kendo-data-row {
        background: var(--grille-rows-background) !important;
    }

.k-tabstrip-wrapper .k-tabstrip-items .k-state-active {
    background: var(--grille-onglets-background) !important;
}

.fic-grd-panneau, .panneau, .ux2-grid-dx, .main_content_page {
    background: var(--grille-container-background) !important;
}

ul.rec-grid-fmenu {
    background: var(--grille-footer-buttons-container-background) !important;
}

.k-pager-wrap, .k-grid-footer {
    background: var(--grille-footer-background) !important;
}

.k-grid-header th.k-header, .k-grid-header th.k-header .k-link,
[class*=dxtlHeader], [class*=dxeListBox] .dxeHD {
    background: var(--grille-colonnes-header-background) !important;
    color: var(--grille-colonnes-header-text);
    font-weight: bold !important;
}

.k-grid-header, .dxgvHeader, .dxgvHeader table,
.fic-content-form div.FormPanel .dxgvHeader,
.fic-content-form div.FormPanel .dxgvHeader table,
[class*=dxgvHeader], .main_content.main_content_page .panneau-admin .dxgvHeader,
.main_content.main_content_page .panneau-admin .dxgvHeader table {
    background: var(--grille-colonnes-header-background) !important;
}

.k-header, .k-widget, .k-grid-header-wrap, .k-grid td, .k-filter-row > th {
    border-color: var(--grille-elements-inside-containter-border);
}

.k-tabstrip-wrapper .k-tabstrip-items {
    background: var(--grille-onglets-container-background) !important;
    border-bottom: none !important;
}

.k-tabstrip-wrapper .k-tabstrip-top {
    border-color: transparent !important;
}

.dxpcLite .dxpc-contentWrapper, .dxpcLite .dxpc-header {
    background: var(--grille-colonnes-personnalisation-background) !important;
}

.k-pager-wrap .k-link:hover, ul.rec-grid-fmenu > li.k-state-hover > span.k-link {
    background: var(--grille-footer-buttons-hover-background) !important;
}

.rec-grid .k-grouping-header, .k-grouping-row td, td.k-group-cell, .dxgvGroupRow,
.dxgvGroupPanel, [class*=dxgvGroupPanel], #msgNoGrouping, .main_content_page .dxgvGroupRow {
    background: var(--grille-grouping-header-background) !important;
    color: var(--grille-grouping-header-text) !important;
}

    .main_content_page .dxgvGroupRow td.dxgv, .main_content_page .dxgvFocusedGroupRow td.dxgv {
        border-bottom: solid 1px var(--grille-grouping-header-border) !important;
    }

.dxgvGroupRow {
    background-color: var(--grille-grouping-header-background) !important;
}

.dxgvFocusedGroupRow {
    background: var(--grille-grouping-header-selected-background) !important;
}

.main_content_page .dxgvDataRow td.dxgvIndentCell, .main_content_page .dxgvGroupRow td.dxgvIndentCell,
.main_content_page .dxgvGroupFooter td.dxgvIndentCell {
    background: var(--grille-grouping-indent-row-background) !important;
    border-right: solid 1px var(--grille-grouping-header-border) !important;
}

.k-group-footer td {
    background: var(--grille-grouping-totals-background) !important;
}

.fic-grd-panneau > .PanelCriteresRecherche > .trButtonsuBandeauRecherche,
.fic-content-container > .fic-content-form .fic-grd-panneau table.tableauBandeauRecherche {
    background: var(--grille-barre-recherche-background) !important;
}

[class*=dxgvFooter] td.dxgv, .TableauDetailLigne, .tableauBandeauFooter {
    background: var(--grille-footer-devexpress-background) !important;
    border: none !important;
    color: var(--grille-footer-devexpress-text);
}

.dxgvFilterRow {
    background: var(--grille-filter-row-background) !important;
}

.rec-grid {
    background: var(--grille-container-background);
    box-shadow: none;
    padding: 8px;
}

.ux2-grid-tabstrip-scrollable, .k-tabstrip-items {
    border: none !important;
}

.k-filter-row .k-input, [class*=dxeTextBox] [class*=dxeEditArea], [class*=dxeTextBox],
[class*=dxeButtonEdit] [class*=dxeEditArea], [class*=dxeButtonEdit] {
    background-color: var(--grille-filter-row-input-background) !important;
    border-color: transparent !important;
}

[class*=dxeButtonEditButton] {
    background: var(--grille-filter-row-input-background) !important;
}

.k-filter-row .k-autocomplete.k-state-default {
    border-color: transparent;
}

.k-filter-row,
.main_content.main_content_page .panneau-admin .dxgvFilterRow td.dxgv {
    background: var(--grille-filter-row-background);
    border-bottom: none !important;
}

    .k-filter-row th, .k-grid-header-wrap > table, .k-grid-header-wrap > table > thead,
    div.k-grid-header {
        border-bottom-width: 0px !important;
    }

.k-grid td {
    border-bottom-width: 1px !important;
}

    .k-state-selected, .ux2-grid-dx .dxgvFocusedRow, .dxgvSelectedRow,
    .dxgvFocusedRow, [class*=dxgvFocusedRow], .k-grid td.k-state-selected, .k-grid tr.k-state-selected > td {
        background: var(--grille-row-selected-background) !important;
        color: var(--grille-row-selected-text) !important;
    }

.k-grid-pager a, select.k-dropdown, select.k-dropdowntree,
.k-pager-sizes .k-dropdown-wrap,
.rec-grid-fmenu li.k-item:not(.grid-footer-img) {
    background: var(--grille-footer-buttons-background) !important;
}

div::-webkit-scrollbar-track, ul::-webkit-scrollbar-track {
    background: var(--scrollbar-track-background) !important;
}

div::-webkit-scrollbar, ul::-webkit-scrollbar {
    background: var(--scrollbar-background) !important;
}

div::-webkit-scrollbar-thumb, ul::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb-background);
    border-color: var(--scrollbar-thumb-border);
    border-style: solid;
    border-width: 1px;
}

div::-webkit-scrollbar-button:single-button, ul::-webkit-scrollbar-button:single-button {
    background-color: var(--scrollbar-button-background);
    display: block;
    border-style: solid;
    height: 13px;
    width: 13px;
}

    div::-webkit-scrollbar-button:single-button:vertical:decrement, ul::-webkit-scrollbar-button:single-button:vertical:decrement {
        border-width: 0 8px 8px 8px;
        border-color: transparent transparent var(--scrollbar-button-arrow-background) transparent;
    }


    div::-webkit-scrollbar-button:single-button:vertical:increment, ul::-webkit-scrollbar-button:single-button:vertical:increment {
        border-width: 8px 8px 0 8px;
        border-color: var(--scrollbar-button-arrow-background) transparent transparent transparent;
    }

div::-webkit-scrollbar-button:horizontal:decrement, ul::-webkit-scrollbar-button:horizontal:decrement {
    border-width: 8px 8px 8px 0;
    border-color: transparent var(--scrollbar-button-arrow-background) transparent transparent;
}


div::-webkit-scrollbar-button:horizontal:increment, ul::-webkit-scrollbar-button:horizontal:increment {
    border-width: 8px 0 8px 8px;
    border-color: transparent transparent transparent var(--scrollbar-button-arrow-background);
}

.k-grid-header th.k-state-focused {
    box-shadow: none !important;
}

.ux2-grid-panel .dxbButton, .panneau .dxbButton {
    background: var(--grille-panneau-buttons-background) !important;
    border: none !important;
    color: var(--grille-panneau-buttons-text) !important;
    font-weight: bold !important;
    border-radius: 5px !important;
}

    .ux2-grid-panel .dxbButton:hover, .panneau .dxbButton:hover,
    .ux2-grid-panel .dxbButtonHover, .panneau .dxbButtonHover {
        color: var(--grille-panneau-buttons-hover-text) !important;
        background: var(--grille-panneau-buttons-hover-background) !important;
    }

        .ux2-grid-panel .dxbButtonHover span, .panneau .dxbButtonHover span {
            color: var(--grille-panneau-buttons-hover-text) !important;
        }

.ux2-grid-panel .tableauBandeauRecherche .dxbButtonHover i.fas.fa-search:before,
.panneau .tableauBandeauRecherche .dxbButtonHover i.fas.fa-search:before {
    color: var(--grille-panneau-buttons-hover-icon) !important;
}

.ux2-grid-panel > table:first-of-type {
    padding: 0px 8px 0px 8px;
}

.ux2-grid-panel .grd-header-menu > table {
    padding: 2px 0 0 0;
}

.ux2-grid-panel .grd-header-menu .trButtonsDynamiques > td > table .dxbButton {
    font-weight: normal !important;
    height: 28px !important;
    padding: 1px 6px 1px 6px !important;
    vertical-align: middle;
}

    .ux2-grid-panel .grd-header-menu .trButtonsDynamiques > td > table .dxbButton > .dxb {
        padding: 0 !important;
    }

        .ux2-grid-panel .grd-header-menu .trButtonsDynamiques > td > table .dxbButton > .dxb > i {
            padding-right: 6px !important;
            vertical-align: middle;
        }

        .ux2-grid-panel .grd-header-menu .trButtonsDynamiques > td > table .dxbButton > .dxb > span {
            padding: 0;
            vertical-align: middle;
        }

.panneau [class*=dxgvStatusBar] .dxbButton, .panneau [class*=dxgvStatusBar] .dxbButton:hover {
    min-width: 170px !important
}

.k-column-menu, .k-column-menu .k-item {
    border-color: var(--grille-avancee-colonnes-menu-border);
    background: var(--grille-avancee-colonnes-menu-background);
    color: var(--grille-avancee-colonnes-menu-text) !important;
}

.fic-content-form .grd-pcr {
    background: transparent;
    box-shadow: none;
}

.fic-content-container > .fic-content-form .fic-grd-panneau table.trButtonsuBandeauRecherche input.InputRecherche {
    background-color: var(--grille-input-recherche-background);
}

.dxgvDataRow td.dxgv, .dxgvDataRowAlt td.dxgv,
.dxgvSelectedRow td.dxgv, .dxgvFocusedRow td.dxgv {
    border-bottom: solid 1px var(--grille-rows-border) !important;
    border-right: solid 1px var(--grille-rows-border) !important;
}

.fic-content-form div.FormPanel .dxgvFilterRow td.dxgv {
    background: var(--grille-filter-row-background);
    border-top: none;
}

.ux2-grid-dx .dxgvHeader table, .ux2-grid-dx .dxgvHeader {
    color: black !important;
    font-weight: bold !important;
}

.k-grid-pager a.k-state-disabled {
    opacity: 1;
}

.k-filtercell, .dxgvHeader table,
[class*=dxgvHeader] table {
    color: black !important;
    font-weight: bold !important;
}

.dxgvHeader, .dxgvTable, .dxgvHeader td.dxgvHeader,
.dxgvControl, .dxgvFilterRow td.dxgv, .dxgvFocusedRow td.dxgv,
[class*=dxgvHeader], [class*=dxgvHeader] td[class*=dxgvHeader] {
    border-bottom: 1px solid var(--grille-results-border) !important;
    border-right: 1px solid var(--grille-results-border) !important;
}

[class*=dxgvControl], [class*=dxtlHeader], [class*=dxtlControl], [class*=dxeListBox] {
    border: 1px solid var(--grille-results-border) !important;
}

    [class*=dxeListBox] .dxeHD {
        border-bottom: 1px solid var(--grille-results-border) !important;
    }

    [class*=dxeListBox] .dxeHIC, [class*=dxeListBox] .dxeHFC, [class*=dxeListBox] .dxeHCC,
    [class*=dxeListBox] td.dxeLTM, [class*=dxeListBox] td.dxeTM, [class*=dxeListBox] td.dxeMIM {
        border-left: 1px solid var(--grille-results-border) !important;
    }

    [class*=dxeListBox] .dxeHLC {
        border-right: 1px solid var(--grille-results-border) !important;
    }

.fic-content-form div.FormPanel .ux2-grid-dx td.grid-td-container {
    background: transparent;
    box-shadow: none;
}

.dxeTextBox .dxeEditArea, .dxeTextBox,
.dxeButtonEdit .dxeEditArea, .dxeButtonEdit {
    background: var(--background-lighter-2) !important;
    border: none !important;
}

[class*=dxgvStatusBar] {
    border-top: none !important;
    background-image: none;
}

    [class*=dxgvStatusBar] .dxbButton {
        background: var(--background-primary) !important;
        color: white !important;
        border: none !important;
        font: bold 12px Tahoma, Geneva, sans-serif !important;
    }

    [class*=dxgvStatusBar] .dxbButtonHover {
        background: var(--bouton-background-dark) !important;
        font: bold 12px Tahoma, Geneva, sans-serif !important;
        color: white !important;
    }

        [class*=dxgvStatusBar] .dxbButtonHover span {
            color: white !important;
        }

.dxgvControl, .dxgvDisabled {
    font: bold 12px Tahoma, Geneva, sans-serif !important;
}

.dxeCalendarFooter {
    background-color: var(--background-lighter-2) !important;
    border-top: none !important;
}

.dxpcLite .dxpc-footer, .dxdpLite .dxpc-footer {
    background-color: var(--background-lighter-2) !important;
    border-top: 1px solid var(--border-lighter-2) !important;
}

fieldset .panneau {
    border-radius: 10px;
}

.k-grid-footer {
    background: var(--grille-footer-row-totals-background);
}

.dxgvDataRow, .dxgvFocusedRow {
    font-weight: normal;
}

.fic-content-form div.FormPanel .dxgvGroupPanel,
.fic-content-form div.FormPanel [class*=dxgvGroupPanel],
.k-header, .k-grid-header-wrap, .k-grid .k-grouping-header,
.k-grid-header, .k-grouping-header .k-group-indicator {
    background-color: var(--grille-grouping-header-background) !important;
}

div.panneau .tabForm input.ValComboMS_Disabled, div.panneau .ColChampFiche .ValComboMS_Disabled {
    background: transparent !important;
}

div.dxeHD > table > tbody > tr {
    background: var(--grille-colonnes-personnalisation-background) !important;
}

    div.dxeHD > table > tbody > tr > td {
        font: 11px 'Open Sans' !important;
    }

/*  Surcharge du style pour ressembler un peu plus à la grille devExpress   */
.k-block,
.k-header,
.k-grid-header,
.k-grouping-header,
.k-draghandle,
html .km-pane-wrapper .k-header {
    background-color: #9c9ab7;
}

    .k-state-selected,
    .k-state-selected:link,
    .k-state-selected:visited,
    .k-list > .k-state-selected,
    .k-list > .k-state-highlight,
    .k-panel > .k-state-selected,
    .k-ghost-splitbar-vertical,
    .k-ghost-splitbar-horizontal,
    .k-draghandle.k-state-selected:hover,
    .k-scheduler .k-scheduler-toolbar .k-state-selected {
        background-color: var(--grille-row-selected-background);
        color: var(--grille-row-selected-text);
        border-color: var(--grille-rows-border);
    }

.k-icon.k-i-more-vertical {
    background-color: unset !important;
}

.k-pager-nav {
    padding: 0 0;
}

.k-grid .k-header-column-menu,
.k-grid-header .k-i-sort-asc-sm,
.k-grid-header .k-i-sort-desc-sm,
.k-grid-header .k-sort-order,
.k-calendar .k-footer .k-nav-today:hover {
    color: var(--grille-grouping-header-background) !important;
}

.k-calendar .k-state-selected .k-link {
    background-color: var(--datepicker-date-selected);
}

.k-calendar .k-state-focused,
.k-calendar .k-state-focused.k-state-selected,
.k-calendar .k-state-selected:hover .k-link {
    box-shadow: none;
    background-color: var(--datepicker-date-selected) !important;
}

.k-calendar .k-state-selected.k-state-focused .k-link {
    box-shadow: unset;
}

.k-grid-header {
    background-color: var(--grille-colonnes-header-background) !important;
}

.k-column-menu, .k-column-menu .k-item {
    background: var(--grille-colonnes-header-background);
    color: var(--grille-colonnes-header-text) !important;
}

.k-animation-container-shown,
.k-animation-container > .k-popup {
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.5),0 4px 5px 0 rgba(0,0,0,.3);
}

.k-grid-header th.k-header, .k-filter-row th {
    border-bottom-width: 1px !important;
}

.dxgvTable .tableauBandeau {
    background: var(--grille-footer-buttons-container-background);
}

.save-layout:enabled {
    background: var(--grille-footer-save-button-background);
    border: none;
}

    .save-layout:enabled:hover {
        background: var(--grille-footer-save-button-hover-background) !important;
    }

.grd-footer-models .ui-valcombo-container input.ui-widget.ui-autocomplete-input {
    width: calc(100% - 15px) !important;
    border-bottom: none !important;
}

.grd-footer-models {
    width: 110px;
}

.k-grid tbody tr:hover,
.dxgvDataRow:hover {
    background-color: var(--grille-rows-hover-background) !important;
    cursor: pointer;
}

.ux2-grid-selection-info .grid-selection-info-title {
    color: var(--grille-rows-text) !important;
}

.ux2-grid-selection-info a.grid-selection-info-item {
    color: var(--grille-bandeau-rows-text);
}

    .ux2-grid-selection-info a.grid-selection-info-item:hover {
        color: var(--grille-bandeau-rows-hover-text);
    }

.rfilter {
    position: absolute !important;
    top: 10px !important;
    right: 34px !important;
}

table[class*=dxeCalendar] {
    border: 1px solid var(--grille-filter-row-calendar-border) !important;
}

[class*=dxeCalendarHeader] {
    background: var(--grille-filter-row-calendar-header-background) !important;
}

[class*=dxeCalendarFooter] {
    background-color: var(--grille-filter-row-calendar-footer-background) !important;
    border-top: 1px solid var(--grille-filter-row-calendar-footer-border) !important;
}

[class*=dxeCalendarButton] {
    background: var(--grille-filter-row-calendar-button-background) !important;
    border: 1px solid var(--grille-filter-row-calendar-button-border) !important;
}

[class*=dxeCalendarButtonHover] {
    background: var(--grille-filter-row-calendar-button-hover-background) !important;
    border: 1px solid var(--grille-filter-row-calendar-button-hover-border) !important;
    color: var(--grille-filter-row-calendar-button-hover-color) !important;
}