ag-style = "material"
ag-root-font-family = Roboto
ag-root-font-size = 14px

ag-scrollbar-background = inherit
ag-scrollbar-thumb = inherit

ag-border-1 = none

ag-border-color-1 = #000
ag-border-color-2 = #808080

ag-background-1 = #fff

ag-foreground-1 = #666

ag-header-foreground-1 = #666

ag-separator-color = #d3d3d3

ag-cell-focused-border = 1px solid lightgrey
ag-cell-no-focus-border-top = 1px solid transparent
ag-cell-no-focus-border-bottom = 1px solid lightgrey
ag-cell-ltr-no-focus-border-right = 1px solid transparent
ag-cell-ltr-no-focus-border-left = 1px solid transparent
ag-cell-rtl-no-focus-border-right = 1px solid transparent
ag-cell-rtl-no-focus-border-left = 1px solid transparent

ag-cell-highlight-border = 1px solid darkgreen

ag-cell-padding = 2px

ag-row-selected-background-color = #F5F5F5
ag-row-selected-background-color = #F5F5F5
ag-row-odd-background-color = white
ag-row-even-background-color = white
ag-row-floating-background-color = #f0f0f0
ag-row-stub-background-color = #f0f0f0

ag-value-change-delta-up-color = darkgreen
ag-value-change-delta-down-color = darkred
ag-value-change-value-highlight-background-color = #cec

ag-range-selected-color-1 = rgba(120,120,120,0.4)
ag-range-selected-color-2 = rgba(80,80,80,0.4)
ag-range-selected-color-3 = rgba(40,40,40,0.4)
ag-range-selected-color-4 = rgba(0,0,0,0.4)

ag-header-background-1 = none
ag-header-select-padding = 5px 0px 0px 15px

ag-button-background-1 = none
ag-button-foreground-1 = #000
ag-button-border-1 = #808080

ag-header-font-weight = bold

ag-tab-border = 1px solid transparent
ag-tab-background = #f6f6f6
ag-tab-selected-background = #fff
ag-tab-padding = 6px 16px 6px 16px

ag-menu-option-active-color = #BDE2E5

ag-select-background = white
ag-select-foreground = #222

ag-menu-option-padding = 10px 6px 10px 6px
ag-menu-option-shortcut-padding = 10px 6px 10px 6px

@import "theme-common"

.ag-material
  .ag-row-hover
    background-color #eeeeee !important
  .ag-cell-not-inline-editing
    padding-top 15px
  .ag-header-cell-menu-button:hover
    border 1px solid grey

  .ag-header-cell-label
    text-align left

  .ag-header
    border-bottom 1px solid grey

  // we want checkbox to have more spacing to the right and left
  .ag-selection-checkbox
    padding-right 12px
    padding-left 12px