/*
The darken/lighten is not giving accurate results for the toasters so specific vars for them below.

- Red background: #c23848 you can get this colour roughly from using the red variable and with HSL lower lightness by 20.
- Blue background: #377ebd you can get this colour roughly from using the blue variable and with HSL lower lightness by 20.
- Orange background: #ff9933
- The text colour on all of these, could they please be #E2E2E2, except from warning which remains with black text.

*/
/*is not being used anywhere; the same as @redAlert*/
a, a:active {
  text-decoration: none;
  color: #C2C2C2; }

:host {
  flex: 1;
  flex-basis: auto;
  display: grid;
  display: -ms-grid;
  grid-template-rows: 23px 1fr;
  grid-template-columns: 1fr;
  grid-template-areas: 'block-tab-header'
 'block-tab-content';
  -ms-grid-rows: 23px 1fr;
  -ms-grid-columns: 1fr; }
  :host .fx-block-tabs-header {
    grid-area: block-tab-header;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    display: grid;
    grid-template-columns: 1fr 90px;
    grid-template-rows: 1fr;
    grid-template-areas: 'vertical-page import';
    display: -ms-grid;
    -ms-grid-columns: 1fr 90px;
    -ms-grid-rows: 1fr; }
    :host .fx-block-tabs-header et-vertical-page {
      grid-area: vertical-page;
      -ms-grid-column: 1;
      -ms-grid-row: 1; }
      :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline {
        display: inline-block;
        min-width: 90px; }
        :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline:first-child .fx-block-tab-item {
          margin-left: 2.5px; }
        :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item {
          display: grid;
          margin: 2px 1.5px -4px 1.5px;
          border-width: 1px;
          border-style: solid solid none solid;
          padding: 4px 4px 4.5px 4px;
          border-color: #666570;
          background-color: #1F1F1F;
          opacity: 0.4;
          grid-template-columns: 1fr auto;
          grid-column-gap: 2px;
          grid-template-rows: 1fr;
          flex-grow: 0;
          flex-basis: auto;
          display: -ms-grid;
          -ms-grid-columns: 1fr 10px;
          -ms-grid-rows: 1fr; }
          :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item .fx-block-tab-name {
            display: block;
            -ms-grid-row: 1;
            -ms-grid-column: 1; }
          :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item .fx-block-tab-close {
            display: block;
            -ms-grid-row: 1;
            -ms-grid-column: 2;
            position: relative; }
            :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item .fx-block-tab-close .icon-cross-mini-2 {
              right: -5px;
              position: absolute; }
      :host .fx-block-tabs-header et-vertical-page .fx-block-tabs-header-add {
        display: inline-block;
        width: 23px;
        height: 12px; }
        :host .fx-block-tabs-header et-vertical-page .fx-block-tabs-header-add .icon-bigger-plus {
          position: absolute;
          top: 6px; }
    :host .fx-block-tabs-header .fx-block-tab-item-import {
      grid-area: import;
      -ms-grid-column: 2;
      -ms-grid-row: 1;
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: 1fr;
      display: -ms-grid;
      -ms-grid-columns: 1fr;
      -ms-grid-rows: 1fr;
      margin: 2px 2.5px -4px 1.5px;
      border-width: 1px;
      border-style: solid solid none solid;
      padding: 2px 4px;
      border-color: #666570;
      background-color: #1F1F1F;
      opacity: 0.4;
      min-width: 0; }
  :host .fx-block-tab-content-container {
    grid-area: block-tab-content;
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    display: grid;
    grid-template-rows: 1fr;
    grid-template-columns: 1fr;
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 1fr;
    margin: 0;
    padding: 0; }
    :host .fx-block-tab-content-container .fx-block-tab-content {
      -ms-grid-row: 1;
      -ms-grid-column: 1;
      display: grid;
      grid-template-rows: 1fr;
      grid-template-columns: 1fr;
      display: -ms-grid;
      -ms-grid-columns: 1fr;
      -ms-grid-rows: 1fr;
      margin: 0;
      padding: 0;
      z-index: 1;
      position: relative; }
  :host .fx-block-tabs-header.last-tab et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.empty .fx-block-tab-close {
    display: none; }
  :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.active, :host .fx-block-tabs-header .fx-block-tab-item-import.active {
    opacity: 1;
    position: relative;
    z-index: 2; }
    :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.active .fx-block-tab-name:hover, :host .fx-block-tabs-header .fx-block-tab-item-import.active .fx-block-tab-name:hover {
      cursor: default; }
  :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.empty, :host .fx-block-tabs-header .fx-block-tab-item-import.empty {
    background-color: #2E2E33; }
  :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.emphasize-alert, :host .fx-block-tabs-header .fx-block-tab-item-import.emphasize-alert {
    background-color: #ff9933; }
  :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.Negotiate, :host .fx-block-tabs-header .fx-block-tab-item-import.Negotiate {
    background-color: #DEC763; }
    :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.Negotiate a, :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.Negotiate a:active, :host .fx-block-tabs-header .fx-block-tab-item-import.Negotiate a, :host .fx-block-tabs-header .fx-block-tab-item-import.Negotiate a:active {
      color: black; }
    :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.Negotiate .fx-block-tab-close, :host .fx-block-tabs-header .fx-block-tab-item-import.Negotiate .fx-block-tab-close {
      display: none; }
  :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.Disabled .fx-block-tab-close, :host .fx-block-tabs-header .fx-block-tab-item-import.Disabled .fx-block-tab-close {
    display: none; }
  :host .fx-block-tabs-header et-vertical-page .fx-block-tab-item-inline .fx-block-tab-item.Done, :host .fx-block-tabs-header .fx-block-tab-item-import.Done {
    background-color: #2498BA; }