@import url('https://fonts.googleapis.com/css?family=Fira+Mono&display=swap');

.wide #receipt-table, .headerContent {
  font-family: 'Fira Mono', monospace !important;
  font-size: 0.9em;
}

#result-holder{
  background: #12008a;
}

.highlighted {
  border-color: #f70026 !important;
}

.posBtns {
  &:focus, &.selected {
    box-shadow: 0px 0px 3px rgb(249, 83, 83) !important;
    border: 3px solid #f70026;
  }
}


.element {
  &:focus, &.selected {
    box-shadow: 0px 0px 3px rgb(249, 83, 83) !important;
    border: 3px solid #f70026 !important;
    border: none;
  }
}
.wide .result-content {
  .receiptRow {
    border: 3px solid transparent !important;
    &.disabledBtn, &.disabledBtn .priceText, &.disabledBtn .quiet span{
      color: #444 !important;
    }

    &.selected {
      box-shadow: 0px 0px 3px rgb(249, 83, 83) !important;
      border: 3px solid #f70026 !important;
    }
  }
}
.resultText,  #result-holder .receiptRow, .result-content .priceText, .contragentName {
  color: #fff;
}
.numPad, .numBack {
    background: #fff !important;
    border: #AAA 1px solid !important;
    color: #111 !important;
    &:hover {
        border: #999 1px solid !important;
        background: #999 !important;
        box-shadow: inset 0 0 50px white;
    }
}
.operationBtn, .operationHolder {
    border-radius: 3px;
    background-color: #bbb;
    &:hover {
        background-color: #999;
    }
}

.divider {
  background: rgba(255,255,255, 0.8);
  color: #333 !important;
  font-weight: bold;
  border-color: #999;
}

.tabHolder li{
  border-color: transparent !important;
  color: #99c;
}

.tabHolder li.active {
  color: #fff;
  border-bottom: 4px solid #fff !important;
}

#result-holder {
    color: #fff;
    .element {
        color: #000
    }
    .posBtns, .element {
        opacity: 0.9;
        &.selected {
            opacity: 1;
        }
    }
}
.tabHolder li {
    color: #666;
    border: none !important;
    &.active {
      color: #333 !important;
      border: none !important;
    }
}