.handsontable {
  touch-action: manipulation;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Helvetica Neue", Arial, sans-serif;
  font-size: 13px;
  font-weight: normal;
  color: #373737;
}

.handsontable a {
  color: #104acc;
}

.handsontable.htAutoSize {
  visibility: hidden;
  left: -99000px;
  position: absolute;
  top: -99000px;
}

.handsontable td.htInvalid {
  background-color: #ff4c42 !important; /*gives priority over td.area selection background*/
}

.handsontable td.htNoWrap {
  white-space: nowrap;
}

#hot-display-license-info {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Helvetica Neue", Arial, sans-serif;
  font-size: 10px;
  font-weight: normal;
  color: #373737;
  padding: 5px 0 3px 0;
  text-align: left;
}

#hot-display-license-info a {
  color: #104acc;
  font-size: 10px;
}

/* plugins */

/* row + column resizer*/
.handsontable .manualColumnResizer {
  position: absolute;
  top: 0;
  cursor: col-resize;
  z-index: 210;
  width: 5px;
  height: 25px;
}

.handsontable .manualRowResizer {
  position: absolute;
  left: 0;
  cursor: row-resize;
  z-index: 210;
  height: 5px;
  width: 50px;
}

.handsontable .manualColumnResizer:hover,
.handsontable .manualColumnResizer.active,
.handsontable .manualRowResizer:hover,
.handsontable .manualRowResizer.active {
  background-color: #34a9db;
}

.handsontable .manualColumnResizerGuide {
  position: absolute;
  right: 0;
  top: 0;
  background-color: #34a9db;
  display: none;
  width: 0;
  border-right: 1px dashed #777;
  margin-left: 5px;
}

.handsontable .manualRowResizerGuide {
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: #34a9db;
  display: none;
  height: 0;
  border-bottom: 1px dashed #777;
  margin-top: 5px;
}

.handsontable .manualColumnResizerGuide.active,
.handsontable .manualRowResizerGuide.active {
  display: block;
  z-index: 209;
}

.handsontable .columnSorting {
  position: relative;
}

.handsontable .columnSorting.sortAction:hover {
  text-decoration: underline;
  cursor: pointer;
}/* Arrow position */
.handsontable span.colHeader.columnSorting::before {
  /* Centering start */
  top: 50%;
  margin-top: -6px; /* One extra pixel for purpose of proper positioning of sorting arrow, when `font-size` set to default */
  /* Centering end */

  padding-left: 8px; /* For purpose of continuous mouse over experience, when moving between the `span` and the `::before` elements */
  position: absolute;
  right: -9px;

  content: '';
  height: 10px;
  width: 5px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position-x: right;
}

.handsontable span.colHeader.columnSorting.ascending::before {
  /* arrow up; 20 x 40 px, scaled to 5 x 10 px; base64 size: 0.3kB */
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAoCAMAAADJ7yrpAAAAKlBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAKE86IAAAADXRSTlMABBEmRGprlJW72e77tTkTKwAAAFNJREFUeAHtzjkSgCAUBNHPgsoy97+ulGXRqJE5L+xkxoYt2UdsLb5bqFINz+aLuuLn5rIu2RkO3fZpWENimNgiw6iBYRTPMLJjGFxQZ1hxxb/xBI1qC8k39CdKAAAAAElFTkSuQmCC");
}

.handsontable span.colHeader.columnSorting.descending::before {
  /* arrow down; 20 x 40 px, scaled to 5 x 10 px; base64 size: 0.3kB */
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAoCAMAAADJ7yrpAAAAKlBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAKE86IAAAADXRSTlMABBEmRGprlJW72e77tTkTKwAAAFJJREFUeAHtzjkSgCAQRNFmQYUZ7n9dKUvru0TmvPAn3br0QfgdZ5xx6x+rQn23GqTYnq1FDcnuzZIO2WmedVqIRVxgGKEyjNgYRjKGkZ1hFIZ3I70LyM0VtU8AAAAASUVORK5CYII=");
}

.htGhostTable .htCore span.colHeader.columnSorting:not(.indicatorDisabled)::after {
  content: '*';
  display: inline-block;
  position: relative;
  /* The multi-line header and header with longer text need more padding to not hide arrow,
  we make header wider in `GhostTable` to make some space for arrow which is positioned absolutely in the main table */
  padding-right: 20px;
}

.handsontable td.area,
.handsontable td.area-1,
.handsontable td.area-2,
.handsontable td.area-3,
.handsontable td.area-4,
.handsontable td.area-5,
.handsontable td.area-6,
.handsontable td.area-7 {
  position: relative;
}

.handsontable td.area:before,
.handsontable td.area-1:before,
.handsontable td.area-2:before,
.handsontable td.area-3:before,
.handsontable td.area-4:before,
.handsontable td.area-5:before,
.handsontable td.area-6:before,
.handsontable td.area-7:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  bottom: -100%\9; /* Fix for IE9 to spread the ":before" pseudo element to 100% height of the parent element */
  background: #005eff;
}

/* Fix for IE10 and IE11 to spread the ":before" pseudo element to 100% height of the parent element */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .handsontable td.area:before,
  .handsontable td.area-1:before,
  .handsontable td.area-2:before,
  .handsontable td.area-3:before,
  .handsontable td.area-4:before,
  .handsontable td.area-5:before,
  .handsontable td.area-6:before,
  .handsontable td.area-7:before {
    bottom: -100%;
  }
}

.handsontable td.area:before {
  opacity: 0.1;
}
.handsontable td.area-1:before {
  opacity: 0.2;
}
.handsontable td.area-2:before {
  opacity: 0.27;
}
.handsontable td.area-3:before {
  opacity: 0.35;
}
.handsontable td.area-4:before {
  opacity: 0.41;
}
.handsontable td.area-5:before {
  opacity: 0.47;
}
.handsontable td.area-6:before {
  opacity: 0.54;
}
.handsontable td.area-7:before {
  opacity: 0.58;
}

.handsontable tbody th.ht__highlight,
.handsontable thead th.ht__highlight {
  background-color: #dcdcdc;
}

.handsontable tbody th.ht__active_highlight,
.handsontable thead th.ht__active_highlight {
  background-color: #8eb0e7;
  color: #000;
}

.handsontableInput {
  border: none;
  outline-width: 0;
  margin: 0;
  padding: 1px 5px 0 5px;
  font-family: inherit;
  line-height: 21px;
  font-size: inherit;
  box-shadow: 0 0 0 2px #5292F7 inset;
  resize: none;
  /*below are needed to overwrite stuff added by jQuery UI Bootstrap theme*/
  display: block;
  color: #000;
  border-radius: 0;
  background-color: #FFF;
  /*overwrite styles potentionally made by a framework*/
}

.handsontableInput:focus {
  outline: none;
}

.handsontableInputHolder {
  position: absolute;
  top: 0;
  left: 0;
}

.htSelectEditor {
  -webkit-appearance: menulist-button !important;
  position: absolute;
  width: auto;
}

.htSelectEditor:focus {
  outline: none;
}

/*
TextRenderer readOnly cell
*/

.handsontable .htDimmed {
  color: #777;
}

.handsontable .htSubmenu {
  position: relative;
}

.handsontable .htSubmenu :after{
  content: '\25B6';
  color: #777;
  position: absolute;
  right: 5px;
  font-size: 9px;
}


/*
TextRenderer horizontal alignment
*/
.handsontable .htLeft{
  text-align: left;
}
.handsontable .htCenter{
  text-align: center;
}
.handsontable .htRight{
  text-align: right;
}
.handsontable .htJustify{
  text-align: justify;
}
/*
TextRenderer vertical alignment
*/
.handsontable .htTop{
  vertical-align: top;
}
.handsontable .htMiddle{
  vertical-align: middle;
}
.handsontable .htBottom{
  vertical-align: bottom;
}

/*
TextRenderer placeholder value
*/

.handsontable .htPlaceholder {
  color: #999;
}

/**
 * Handsontable listbox theme
 */

.handsontable.listbox {
  margin: 0;
}

.handsontable.listbox .ht_master table {
  border: 1px solid #ccc;
  border-collapse: separate;
  background: white;
}

.handsontable.listbox th,
.handsontable.listbox tr:first-child th,
.handsontable.listbox tr:last-child th,
.handsontable.listbox tr:first-child td,
.handsontable.listbox td {
  border-color: transparent;
}

.handsontable.listbox th,
.handsontable.listbox td {
  white-space: nowrap;
  text-overflow: ellipsis;
}

.handsontable.listbox td.htDimmed {
  cursor: default;
  color: inherit;
  font-style: inherit;
}

.handsontable.listbox .wtBorder {
  visibility: hidden;
}

.handsontable.listbox tr td.current,
.handsontable.listbox tr:hover td {
  background: #eee;
}

.ht_editor_hidden {
  z-index: -1;
}

.ht_editor_visible {
  z-index: 200;
}

.handsontable td.htSearchResult {
  background: #fcedd9;
  color: #583707;
}

.collapsibleIndicator {
  position: absolute;
  top: 50%;
  transform: translate(0% ,-50%);
  right: 5px;
  border: 1px solid #A6A6A6;
  line-height: 8px;
  color: #222;
  border-radius: 10px;
  font-size: 10px;
  width: 10px;
  height: 10px;
  cursor: pointer;
  -webkit-box-shadow: 0 0 0 6px rgba(238,238,238,1);
  -moz-box-shadow: 0 0 0 6px rgba(238,238,238,1);
  box-shadow: 0 0 0 6px rgba(238,238,238,1);
  background: #eee;
  text-align: center;
}