.print-container{
    display: block;
}


    @page {
        margin: 0; /* Remove default margins */
        /* size: 80mm auto; Common thermal paper roll width */
        margin: 0;
        /* width: 72mm; */
        background-color: #fff;
    }
 
    /* TODO: optimize */


    .page {
      border: none;
      margin-bottom: 0;
  } 

  
  
  .cut-line {
      /* border-top: 1px dashed #000; */
      margin: 10mm 0;
      page-break-after: always;
      height: 5mm;
  }
body {
  background-color: #fff;
    font-family: 'font_8', sans-serif;
    margin: 0px;
    padding: 0px;
    display: block;
    /* width: 80mm; */

  }

  .print-container ,   .print-container * {
    display: block;
    margin: 0px;
    padding: 0px;
  }
  
  .receipt {
      padding:  1mm 3mm;
      width: 80mm;
      border: 1px solid black;
  }
  .orderNo {
    width: 100%;
    text-align: right;
    padding-bottom: 0mm;
    font-size: 8pt;
    font-weight: bold;
    display: grid;
    grid-template-columns: 1fr auto;
  }

  .print-logo{

    
    width: 64px ; display:block; margin: 0rem auto;
  }
  
  .orderNo:empty {
    display: none;
  }
  
  .headerSubTitle {
    font-family: 'font_7', 'Permanent Marker', cursive;
    text-align: center;
    font-size: 9pt;
  }
  
  .headerTitle {
    font-family: 'font_7', 'Permanent Marker', cursive;
    text-align: center;
    font-size: 12pt;
    font-weight: bold;
  }
  
  #location {
    margin-top: 5pt;
    text-align: center;
    font-size: 16pt;
    font-weight: bold;
  }
  
  #date {
    margin: 2pt 0px;
    text-align: center;
    font-size: 8pt;
  }
  
  #barcode {
    display: block;
    margin: 0px auto;
  }
  
  #barcode:empty {
    display: none;
  }
  
  .watermark {
     position: absolute;
     left: 7mm;
     top: 60mm;
     width: 75mm;
     opacity: 0.1;
  }
  
  .keepIt {
    text-align: center;
    font-size: 7pt;
    font-weight: bold;
  }
  
  
  
  .item {
    margin-bottom: 1mm;
  }
  
  .itemRow {
    display: flex;
    font-size: 8pt;
    align-items: baseline;
  }
  
  .itemRow > div {
    align-items: baseline;
  }
  
  .itemName {
    font-weight: bold;
  }
  
  .itemPrice {
    text-align: right;
    flex-grow: 1;
  }
  
  .itemColor {
    width: 10px;
    height: 100%;
    background: yellow;
    margin: 0px 2px;
    padding: 0px;
  }
  
  .itemColor:before {
    content: "\00a0";
  }
  
  
  .itemData2 {
    text-align: right;
    flex-grow: 1;
  }
  
  .itemData3 {
    width: 15mm;
    text-align: right;
  }
  
  .itemQuantity:before {
    content: "x";
  }
  
  .itemTaxable:after {
    content: " T";
  }
  
  .flex {
    display: flex;
    justify-content: center;
  }
  
  #qrcode {
    align-self: center;
    flex: 0 0 100px
  }
  
  .totals {
    flex-grow: 1;
    align-self: center;
    font-size: 8pt;
  }
  
  .totals .row {
    display: flex;
    text-align: right;
  }
  
  .totals .section {
    padding-top: 2mm;
  }
  
  .totalRow > div, .total > div {
    text-align: right;
    align-items: baseline;
    font-size: 8pt;
  }
  
  .totals .col1 {
    text-align: right;
    flex-grow: 1;
  }
  
  .totals .col2 {
     width: 22mm; 
  }
  
  .totals .col2:empty {
    display: none;
  }
  
  .totals .col3 {
    width: 15mm;  
  }
  
  .footer {
    overflow: hidden;
    margin-top: 5mm;
    border-radius: 7px;
    width: 100%;
    background: black;
    color: white;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  .footer:empty {
      display: none;
  }
  
  .eta {
    padding: 1mm 0px;
  }
  
  .eta:empty {
      display: none;
  }
  
  .eta:before {
      content: "Estimated time order will be ready: ";
    font-size: 8pt;
    display: block;
  }
  
  .etaLabel {
    font-size: 8pt;
  }
  
  .printType {
    padding: 1mm 0px;
    width: 100%;
    background: grey;
    color: white;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  .about {
    font-size: 12pt;
    overflow: hidden;
    background: #FCEC52;
    color: #3A5743;
    border-radius: 7px;
    padding: 0px;
    position: absolute;
    width: 500px;
    text-align: center;
    left: 50%;
    margin-top: 50px;
    margin-left: -250px;
  }
  
  .arrow_box h3, ul {
    margin: 5px;
  }
  
  .about li {
    text-align: left;
  }
  
  .arrow_box {
      position: absolute;
      background: #88b7d5;
    padding: 5px;
    margin-top: 20px;
    left: 95mm;
    top: 2;
    width: 500px;
      border: 4px solid #c2e1f5;
  }
  .arrow_box:after, .arrow_box:before {
      right: 100%;
      top: 50%;
      border: solid transparent;
      content: " ";
      height: 0;
      width: 0;
      position: absolute;
      pointer-events: none;
  }
  
  .arrow_box:after {
      border-color: rgba(136, 183, 213, 0);
      border-right-color: #88b7d5;
      border-width: 30px;
      margin-top: -30px;
  }
  .arrow_box:before {
      border-color: rgba(194, 225, 245, 0);
      border-right-color: #c2e1f5;
      border-width: 36px;
      margin-top: -36px;
  }


  .waiting-number{
    font-size: 30px;
  }