/* =====================================================================
   RECEIPT — thermal-printer (80mm) + on-screen preview
   ===================================================================== */

.receipt-shell {
    min-height: 100vh;
    background: #e9ebef;
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
}

.receipt-toolbar {
    display: flex; align-items: center; gap: 10px;
    width: 100%;
    max-width: 320px;
}
.receipt-toolbar .btn {
    flex: 1;
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.receipt-toolbar .btn.primary { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }
.receipt-handle {
    flex: 1; text-align: center;
    color: var(--c-text-muted);
    font-weight: 700; font-size: 13px;
    direction: ltr;
}

.receipt-loading { padding: 60px; color: var(--c-text-muted); }

.receipt {
    width: 80mm;
    background: #fff;
    padding: 12mm 6mm;
    border-radius: 6px;
    box-shadow: 0 12px 30px rgba(0,0,0,.15);
    font-family: 'Cairo', 'Tahoma', sans-serif;
    font-size: 11.5px;
    color: #000;
    line-height: 1.5;
}

/* ---- Header ---- */
.rcp-head { text-align: center; }
.rcp-logo { max-height: 50px; max-width: 100%; object-fit: contain; margin: 0 auto 8px; display: block; }
.rcp-co-name { font-size: 16px; font-weight: 900; margin-bottom: 4px; }
.rcp-co-slogan { font-size: 10.5px; color: #333; margin-bottom: 8px; font-style: italic; }
.rcp-co-line { font-size: 10.5px; color: #222; }

.rcp-divider { border-top: 1px dashed #000; margin: 8px 0; }
.rcp-divider-dotted { border-top-style: dotted; }

/* ---- Meta ---- */
.rcp-meta { font-size: 11px; }
.rcp-doc-title {
    text-align: center;
    font-weight: 900;
    background: #000; color: #fff;
    padding: 4px;
    margin-bottom: 8px;
}
.rcp-meta-row {
    display: flex; justify-content: space-between;
    padding: 1px 0;
}
.rcp-meta-row > span:first-child { color: #444; }
.rcp-meta-row > span:last-child { font-weight: 700; }

/* ---- Items ---- */
.rcp-items {
    width: 100%;
    border-collapse: collapse;
    font-size: 10.5px;
}
.rcp-items th {
    text-align: start;
    font-weight: 800;
    padding: 3px 2px;
    border-bottom: 1px solid #000;
}
.rcp-items th.t-qty { text-align: center; width: 40px; }
.rcp-items th.t-amt { text-align: end; width: 60px; }
.rcp-items td {
    padding: 4px 2px;
    border-bottom: 1px dotted #888;
    vertical-align: top;
}
.rcp-items tr:last-child td { border-bottom: 0; }
.rcp-items td.t-qty { text-align: center; font-variant-numeric: tabular-nums; }
.rcp-items td.t-amt { text-align: end; font-variant-numeric: tabular-nums; font-weight: 700; }
.li-name { font-weight: 700; }
.li-sub { font-size: 9.5px; color: #444; margin-top: 1px; direction: ltr; text-align: start; }

/* ---- Totals ---- */
.rcp-totals { font-size: 11px; }
.rcp-tot-row {
    display: flex; justify-content: space-between;
    padding: 2px 0;
}
.rcp-tot-row > span:last-child { font-variant-numeric: tabular-nums; font-weight: 700; }
.rcp-grand {
    font-size: 14px;
    font-weight: 900;
    padding: 4px 0;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    margin: 4px 0;
}

/* ---- QR placeholder ---- */
.rcp-qr {
    text-align: center;
    margin: 10px 0;
}
.rcp-qr-box {
    display: inline-block;
    padding: 6px;
    border: 1px solid #000;
}
.rcp-qr-lines {
    display: flex; align-items: end; gap: 1px;
    height: 40px;
}
.rcp-qr-lines .bar {
    display: inline-block;
    height: 100%;
    background: #000;
}
.rcp-qr-text { font-size: 10px; margin-top: 4px; color: #000; font-family: monospace; }

/* ---- Footer ---- */
.rcp-foot { text-align: center; }
.rcp-thanks {
    font-size: 12.5px;
    font-weight: 800;
    margin-top: 6px;
}
.rcp-foot-meta {
    margin-top: 4px;
    font-size: 9.5px;
    color: #555;
    direction: ltr;
}

/* =====================================================================
   PRINT MEDIA — strip everything not in the receipt
   ===================================================================== */
@media print {
    /* Hide everything outside the receipt */
    body { background: #fff !important; }
    body * { visibility: hidden; }
    .receipt, .receipt * { visibility: visible; }
    .receipt {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        box-shadow: none;
        padding: 4mm 3mm;
        border-radius: 0;
    }
    .receipt-toolbar, .receipt-shell { background: #fff !important; padding: 0 !important; }
    .receipt-toolbar { display: none !important; }
    /* Page setup */
    @page {
        size: 80mm auto;
        margin: 0;
    }
}