/* use in common */
html {
}

/* light mode */
html[data-color-mode="light"] {
  --bg-button-green: #D8FBD9;
  --dropdown-hover: #f5f5f5;
  --menu-disabled: #cccccc;
  --context-menu-hover: #ebecf0;
  --context-menu-icon: #606161;
  --bg-dropdown: #fff;
  --text-modal-create-spreadsheet: grey;
  --text-breadcumd-hover: #006644;
  --background-icon-tools-hover: #E7E7E7;
  --bg-search-button-disabled: #F5F5F5;
  --icon-search-box: #6B778C;
  --button-toolbar-bg: rgba(9,30,66,.08);
  --button-toolbar-disabled-bg: rgba(9,30,66,.04);
  --button-toolbar-bg-hover: rgba(9,30,66,.13);
  --button-toolbar-icon: #344563;
  --select-2-item: #344563;
  --button-toolbar-disabled-icon: #bdbdbd;
  --icon-column-config: #333;
  --gc-corner: #f1f1f1;
  --gc-scrollbar-corner: #ffffff;
  --gc-scrollbar-color: linear-gradient(to bottom,#fff 0,#e0e0e0 100%);
  --gc-scrollbar-background: #d9d9d9;
  --gc-scrollbar-arrow-border: #ccc;
  --nomal-scrollbar: #f5f5f5;
  --nomal-scrollbar-thumb: #c1c1c1;
  --column-setting-select: #ffffff;
  --skeleton-bg: linear-gradient(110deg, #f5f5f7 8%, rgba(9, 30, 66, 0.08) 28%, #f5f5f7 33%); 
  --skeleton-loading :  linear-gradient(110deg, rgba(246,246,246, 0.1) 8% , rgba(255, 255, 255, 0.7) 28%, rgba(246,246,246, 0.1) 33%);
  --border-color : #E7E7E7 ;
  --backgroud-saved-filter: #F5F5F5 ; 
  --text-saved-filter: black ;
  --icon-search-disable : #757575 ;
  --icon-search-enable : white ;

  --icon-toolbar : #f5f5f5;
  --icon-toolbar-hover : #e5e5e5;
  --icon-toolbar-active : #d8fbd9;
  --icon-toolbar-active-hover : #d8fbd9;
  --border-saved-filter: #00a134 ;

  --icon-save:#F5F5F5;
  --icon-save-active :#007526 ;
  --icon-save-active-hover: #00a134;

  --bg-issueeditor-toolbar-item-second : white;
  --icon-toolbar-second-hover : #f5f5f5 ;
  --icon-toolbar-second-active : #d8fbd9;
  --icon-toolbar-second-content: #007526;
  --text-button : #757575 ;
  --disabled-button-text : #bdbdbd;
  --disabled-button-bg: #f5f5f5;
  --bg-jql-btn:white;
  --text-jgl-button:#757575;
  --filter-dropdown : #006644 ;
  /* icontoolbar middle */
  --icons-tool-bar: #F5F5F5 ;
  --icons-tool-bar-hover : #EAEAEA ; 
  --icons-tool-bar-active : #D8FBD9 ;
  --icons-tool-bar-active-hover : #BBEFBC ;
  --text-button-active : #027526 ;
  /* end-of icontoolbar middle */

  --icon-top-menu-button: #757575 ;
  --icon-top-menu-button-bg: transparent;
  --icon-top-menu-button-bg-hover: #f5f5f5;
  --icon-top-menu-button-active: #027526 ;
  --icon-top-menu-button-active-bg: transparent;
  --icon-top-menu-button-active-bg-hover: #d8fbd9;

  --icon-search-box-border: #00a134;

  /* smartFilter-Variable*/
  --label-color : #757575;
  --atlaskit-button: #ec1414;
  --color-chev : #757575 ;
  --bg-toolbar-active-action : #9ce69f ;
  --bg-top-operation-active-action : #9ce69f ; 
  --ds-border-input: #DCDFE4 !important;

  /* floating bar */
  --bg-floating-bar: linear-gradient(90deg, rgb(0 96 50) 0%, rgba(0, 111, 35, 1) 30%, rgb(0 93 29) 100%);
  --text-floating-bar: white;
  --button-floating-bar-hover: #108334;
  --button-floating-bar-active: #007a27;
}

/* dark mode */
html[data-color-mode="dark"] {
  --bg-button-green: #133527;
  --dropdown-hover: #f5f5f5;
  --bg-dropdown: #2C333A;
  --text-modal-create-spreadsheet: #c7d1db;
  --text-breadcumd-hover: white;
  --background-icon-tools-hover: #ffffff2d;
  --bg-search-button-disabled: transparent;
  --icon-search-box: #ffffff;
  --button-toolbar-bg: #ffffff45;
  --button-toolbar-disabled-bg: #ffffff1a;
  --button-toolbar-bg-hover: #ffffff52;
  --button-toolbar-icon: #fff;
  --select-2-item: #C7D1DB;
  --button-toolbar-disabled-icon: #9e9e9e;
  --icon-column-config: #bcbcbc;
  --gc-corner: #26292c;
  --gc-scrollbar-color: #2c333a;
  --gc-scrollbar-background: #161a1d;
  --gc-scrollbar-corner: #161a1d;
  --menu-disabled: #9f9f9f;
  --context-menu-hover: #00000061;  
  --context-menu-icon: #C7D1DB;

  --gc-scrollbar-arrow-border: #2c333a;
  --nomal-scrollbar: #424242;
  --nomal-scrollbar-thumb: #686868;
  --column-setting-select: #1d2125;
  --skeleton-bg: linear-gradient(110deg, #1d2125 8%, rgb(169 176 188 / 8%) 28%, #1d2125 33%);
  --skeleton-loading :  linear-gradient(110deg, rgb(112 112 113 / 10%) 8% , rgb(184 184 184 / 10%) 28%, rgb(112 112 113 / 10%) 33%);
  --text-button: #C7D1DB;
  --border-color : #384149 ;
  --backgroud-saved-filter: #ffffff2d ; 
  --text-saved-filter:#DEE4EA ;
  --icon-search-disable : #C7D1DB ;
  --icon-search-enable : #161a1dc4 ;
  --icon-toolbar : #292e32;
  --icon-toolbar-hover : #3b4045;
  --icon-toolbar-active : #133527;
  --icon-toolbar-active-hover : #184331;
  --border-saved-filter: #217346 ;
  --icon-save:#292e32;
  --icon-save-active : #006644;
  --icon-save-active-hover: #008c5c;
  --bg-issueeditor-toolbar-item-second : transparent;
  /* --icon-toolbar-second-hover : #3b4045 ; */
  --icon-toolbar-second-hover : #292e32 ;
  --icon-toolbar-second-active : #133527;
  --icon-toolbar-second-content: #7fe2b8;
  --text-button : #f5f5f5 ;

  --filter-dropdown : #41a761 ;
  /* icontoolbar middle */
  --icons-tool-bar: #292E32 ;
  --icons-tool-bar-hover : #3B4045 ;
  --icons-tool-bar-active : #133527 ;
  --icons-tool-bar-active-hover : #184331  ;
  --text-button-active : #7FE2B8 ;
  /* end-of icontoolbar middle */

  --icon-top-menu-button: #f5f5f5 ;
  --icon-top-menu-button-bg: transparent;
  --icon-top-menu-button-bg-hover: #292e32;
  --icon-top-menu-button-active: #7fe2b8 ;
  --icon-top-menu-button-active-bg: transparent;
  --icon-top-menu-button-active-bg-hover: #133527;

  --icon-search-box-border: #217346;
  --disabled-button-text : #9e9e9e;
  --disabled-button-bg: #292e32;

    /* smartFilter-Variable*/
    --label-color : #9FADBC;
    --atlaskit-button: #b11f1f;
    --color-chev : #F5F5F5 ;
    --bg-toolbar-active-action : #015533 ;
    --bg-top-operation-active-action : #015533 ; 

  /* floating bar */
  --bg-floating-bar: #133527;
  --text-floating-bar: #b5c2cf;
  --button-floating-bar-hover: #184331;
  --button-floating-bar-active: #015533;

  --ds-border-input: #384148 !important;
}