/**
 * This is a bare version of "slickgrid-theme-material.scss",
 * A few files were removed and aren't included in this styling theme (while they are in original theme)
 * - (colors, extra-styling, slickgrid-icons, slickgrid-icons-svg-utils, slick-without-bootstrap-min-styling)
 */

@use 'sass:color';

$slick-highlight-color:                                       #48c774;
$primary-color:                                               #009530;
$slick-filled-filter-border:                                  1px solid #{$primary-color} !default;
$slick-editor-input-group-clear-btn-icon-color:               inherit !default;

@forward './variables' with (
  $slick-primary-color:                                       $primary-color !default,
  $slick-highlight-color:                                     #48c774 !default,
  $slick-font-family:                                         #{"Roboto", "Helvetica Neue", "Sans-Serif"} !default,
  $slick-font-size-base-value:                                14 !default,
  $slick-icon-font-size:                                      18px !default,
  $slick-input-focus-border-color:                            color.adjust($primary-color, $lightness: 12%) !default,
  $slick-group-totals-formatter-color:                        #666666 !default,
  $slick-cell-border-top:                                     none !default,
  $slick-cell-font-weight:                                    400 !default,
  $slick-cell-padding-top-bottom:                             8px !default,
  $slick-cell-padding-left-right:                             7px !default,
  $slick-cell-odd-background-color:                           #f5f5f5 !default,
  $slick-cell-text-color:                                     rgba(0, 0, 0, 0.87) !default,
  $slick-header-row-filter-padding:                           8px 4px !default,
  $slick-header-font-size:                                    12px !default,
  $slick-header-font-weight:                                  700 !default,
  $slick-header-text-color:                                   rgba(0, 0, 0, 0.87) !default,
  $slick-sorting-header-color:                                rgba(0, 0, 0, 0.87) !default,
  $slick-header-border-bottom:                                transparent !default,
  $slick-header-filter-row-border-bottom:                     1px solid #d0d0d0 !default,
  $slick-header-resizable-hover:                              2px solid #{color.adjust(#48c774, $lightness: 15%)} !default,
  $slick-header-resizable-hover-border-bottom:                2px solid #{$slick-highlight-color} !default,
  $slick-header-resizable-hover-border-left:                  2px solid #{$slick-highlight-color} !default,
  $slick-header-resizable-hover-border-right:                 2px solid #{$slick-highlight-color} !default,
  $slick-header-resizable-hover-border-top:                   2px solid #{$slick-highlight-color} !default,
  $slick-header-resizable-hover-width:                        4px !default,
  $slick-header-resizable-hover-border-radius:                8px !default,
  $slick-header-resizable-hover-right:                        0 !default,
  $slick-header-resizable-hover-opacity:                      0.4 !default,
  $slick-pane-top-border-top:                                 1px solid #d0d0d0 !default,
  $slick-container-border-top:                                1px solid #ccc !default,
  $slick-container-border-bottom:                             1px solid #ccc !default,
  $slick-container-border-left:                               1px solid #ccc !default,
  $slick-container-border-right:                              1px solid #ccc !default,
  $slick-icon-sort-color:                                     $primary-color !default,
  $slick-checkbox-icon-color:                                 $primary-color !default,
  $slick-checkbox-icon-container-bg-color:                    transparent !default,
  $slick-checkbox-icon-checked-svg-path:                      "M10,17L5,12L6.41,10.58L10,14.17L17.59,6.58L19,8M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z" !default,
  $slick-checkbox-icon-partial-checked-svg-path:              "M17,13H7V11H17M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3Z" !default,
  $slick-checkbox-icon-unchecked-svg-path:                    "M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3M19,5V19H5V5H19Z" !default,
  $slick-checkbox-opacity-hover:                              0.9 !default,
  $slick-checkbox-unchecked-opacity:                          1 !default,
  $slick-column-picker-close-btn-font-size:                   23px !default,
  $slick-column-picker-item-font-size:                        14px !default,
  $slick-column-picker-item-height:                           26px !default,
  $slick-column-picker-item-line-height:                      16px !default,
  $slick-column-picker-title-font-size:                       17px !default,
  $slick-menu-item-font-size:                                 14px !default,
  $slick-menu-item-height:                                    26px !default,
  $slick-menu-icon-line-height:                               18px !default,
  $slick-menu-icon-min-width:                                 18px !default,
  $slick-menu-title-font-size:                                17px !default,
  $slick-icon-group-color:                                    $primary-color !default,
  $slick-draggable-group-drop-border-top:                     0px !default,
  $slick-draggable-group-drop-border-left:                    0px !default,
  $slick-draggable-group-drop-border-right:                   0px !default,
  $slick-draggable-group-drop-width:                          100% !default,
  $slick-draggable-group-drop-radius:                         0 !default,
  $slick-draggable-group-delete-vertical-align:               middle !default,
  $slick-draggable-group-title-height:                        24px !default,
  $slick-draggable-group-title-line-height:                   24px !default,
  $slick-draggable-group-title-vertical-align:                top !default,
  $slick-header-button-hidden-margin-right:                   -6px !default,
  $slick-header-button-height:                                18px !default,
  $slick-header-button-width:                                 18px !default,
  $slick-header-button-margin:                                -4px 0 100px 0 !default,
  $slick-header-menu-button-icon-color:                       inherit !default,
  $slick-header-menu-display:                                 inline-block !default,
  $slick-form-control-focus-box-shadow:                       0 0 0 2.5px rgba($primary-color, 0.25) !default,
  $slick-compound-filter-operator-select-border:              1px solid #{color.adjust($primary-color, $lightness: 10%)} !default,
  $slick-compound-filter-text-color:                          color.adjust($primary-color, $lightness: -20%) !default,
  $slick-multiselect-icon-checked-color:                      $slick-highlight-color !default,
  $slick-multiselect-option-highlight-bg-color:               #fafafa !default,
  $slick-preheader-border-right:                              1px solid #e2e2e2 !default,
  $slick-row-move-plugin-cursor:                              grab !default,
  $slick-row-move-plugin-icon-color:                          inherit !default,
  $slick-editor-input-height:                                 100% !default,
  $slick-editor-input-group-clear-btn-icon-padding:           1px 6px !default,
  $slick-row-mouse-hover-color:                               #ebfaef !default,
  $slick-cell-selected-color:                                 #d4f6d7 !default,
  $slick-row-selected-color:                                  #d4f6d7 !default,
  $slick-pagination-icon-color:                               $primary-color !default,
  $slick-pagination-button-border-radius:                     2px !default,
  $slick-pagination-page-input-border-radius:                 3px !default,
);

// Dark Mode
// -----------
$slick-dark-primary-color:                                #66bb6a;
$slick-dark-base-dark-menu-bg-color:                      #212121;
$slick-dark-highlight-color:                              $slick-dark-primary-color;
$slick-dark-text-color:                                   #d4d4d4;

.ms-dark-mode,
.ms-drop.ms-dark-mode,
.slick-dark-mode .ms-dark-mode,
.slick-dark-mode .slick-submenu,
.slick-dark-mode .icon-checkbox-container,
.slick-dark-mode {
  --slick-base-dark-menu-bg-color:                #212121;
  --slick-button-primary-bg-color:                #66bb6a;
  --slick-filled-filter-border:                   1px solid #438446;
  --slick-form-control-focus-border-color:        #438446;
  --slick-cell-box-shadow:                        none;
  --slick-compound-filter-text-color:             #66bb6a;
  --slick-compound-filter-operator-select-border: 1px solid #66bb6a;
  --slick-header-filter-row-border-bottom:        1px solid #505050;
  --slick-container-border-right:                 1px solid #505050;
  --slick-container-border-top:                   1px solid #505050;
  --slick-container-border-left:                  1px solid #505050;
  --slick-container-border-bottom:                1px solid #505050;
  --slick-form-control-focus-border-color:        #66bb6a;
  --slick-form-control-focus-box-shadow:          #{0 0 0 2px rgba(#66bb6a, 0.25)};
  --slick-pane-top-border-top:                    1px solid #505050;
  --slick-filled-filter-color:                    #66bb6a;
  --slick-highlight-color:                        #49a54e;
  --slick-pagination-icon-color:                  #49a54e;
  --slick-checkbox-icon-color:                    #4dae52;
  --slick-row-mouse-hover-box-shadow:             none;
  --slick-row-mouse-hover-color:                  #575757;
  --slick-cell-selected-color:                    #474a45;
  --slick-row-selected-color:                     #474a45;
  --slick-checkbox-icon-color:                    #59c55f;
  --slick-checkbox-icon-height:                   22px;
  --slick-checkbox-icon-bg-color:                 transparent;
  --slick-checkbox-icon-border:                   none;
  --slick-icon-sort-color:                        #66bb6a;
  --slick-multiselect-icon-radio-color:           #66bb6a;
  --ms-checkbox-color:                            #66bb6a;
  --ms-checkbox-hover-color:                      #{color.adjust(#49a54e, $lightness: 13%)};
  --ms-choice-focus-box-shadow:                   #{0 0 0 2px rgba(#66bb6a, 0.25)};
  --ms-ok-button-text-color:                      #66bb6a;
  --ms-ok-button-text-hover-color:                #{color.adjust(#66bb6a, $lightness: 5%)};
}