/* =========================
   THERMAL RECEIPT CSS
   ========================= */

/* Page Setup */
html, body {
    display: flex;
    justify-content: center;
}
body {
    margin: 0;
    padding: 5px;
    font-family: monospace;
    font-size: 12px;
    color: #000;
    background: #fff;
	
	 width: 80mm;
    margin: 0 auto; /* center */
    padding: 5px;
}
@page {
    size: 80mm auto;
    margin: 0;
}


/* Reset */
* {
    box-sizing: border-box;
}

/* =========================
   TEXT SIZES
   ========================= */
.text-small {
    font-size: 10px;
}

.text-normal {
    font-size: 12px;
}

.text-large {
    font-size: 14px;
    font-weight: bold;
}

.text-header {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

/* =========================
   ALIGNMENT
   ========================= */
.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

/* =========================
   SPACING
   ========================= */
.mt-5 { margin-top: 5px; }
.mt-10 { margin-top: 10px; }

.mb-5 { margin-bottom: 5px; }
.mb-10 { margin-bottom: 10px; }

/* =========================
   DIVIDERS
   ========================= */
.divider {
    border-top: 1px dashed #000;
    margin: 5px 0;
}

.divider-solid {
    border-top: 1px solid #000;
    margin: 5px 0;
}

/* =========================
   FLEX ROW (ITEMS)
   ========================= */
.row {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.col-left {
    width: 70%;
    text-align: left;
    word-wrap: break-word;
}

.col-right {
    width: 30%;
    text-align: right;
}

/* =========================
   ITEM LIST
   ========================= */
.item {
    font-size: 12px;
    margin:0px 3px 3px 3px;
}

.item-name {
    width: 60%;
}

.item-qty {
    width: 15%;
    text-align: center;
}

.item-price {
    width: 25%;
    text-align: right;
}

/* =========================
   TOTAL SECTION
   ========================= */
.total-row {
    font-size: 14px;
    font-weight: bold;
}

.subtotal-row {
    font-size: 12px;
}

/* =========================
   HEADER / STORE
   ========================= */
.store-name {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

.store-info {
    font-size: 10px;
    text-align: center;
}

/* =========================
   FOOTER
   ========================= */
.footer {
    font-size: 10px;
    text-align: center;
    margin-top: 10px;
}

/* =========================
   PRINT SETTINGS
   ========================= */
@media print {

    body {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .no-print {
        display: none;
    }
}

/* =========================
   OPTIONAL: 58mm SUPPORT
   ========================= */
@media (max-width: 58mm) {
    body {
        width: 58mm;
        font-size: 11px;
    }

    .text-header {
        font-size: 14px;
    }

    .text-large {
        font-size: 13px;
    }
}