/* css/receipt-slip.css */

.receipt-slip {
    width: 320px;
    background: #ffffff;
    border-radius: 0; /* Paper doesn't have rounded corners */
    padding: 32px 16px; /* Reduced padding to fit smaller width */
    font-family: 'Kanit', sans-serif;
    color: #000000;
    position: relative;
    overflow: hidden;
    box-shadow: none; /* No shadow on the paper itself when printed */
    border: 1px solid #e5e5e5; /* Subtle border to define the paper edge */
    box-sizing: border-box;
}

/* The resident cat remains the signature background for the original Dark and Light receipts. */
.receipt-background {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: url('../assets/receipt_bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
}

/* Ensure content is above background */
.receipt-header, .receipt-body, .receipt-footer {
    position: relative;
    z-index: 1;
}

.receipt-header {
    text-align: center;
    margin-bottom: 24px;
}

.receipt-header h2 {
    margin: 0 0 4px 0;
    font-size: 22px;
    font-weight: 700;
    color: #000000;
    letter-spacing: 0.5px;
}

.receipt-title {
    font-size: 14px;
    color: #444444;
    font-weight: 500;
}

.receipt-body {
    background: transparent; /* No inner box for paper receipt */
    border-radius: 0;
    padding: 0; /* Remove inner padding */
    border: none;
}

.r-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-size: 14px;
}

.r-row:last-child {
    margin-bottom: 0;
}

.r-label {
    color: #444444;
    font-weight: 400;
}

.r-value {
    color: #000000;
    font-weight: 500;
    text-align: right;
}

.r-value.highlight {
    color: #000000;
    font-weight: 700;
}

.r-group .r-value {
    font-weight: 700;
    font-size: 15px;
}

.receipt-box {
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
}

.box-blue {
    border: 1.5px dashed #A5D8FF;
    background: rgba(255, 255, 255, 0.4);
}

.box-green {
    border: 1.5px dashed #B2F2BB;
    background: rgba(255, 255, 255, 0.4);
}

.r-divider {
    display: none; /* No longer needed with the box layout */
}

.r-total {
    margin-top: 16px;
    font-size: 15px;
}

.r-total .r-label {
    color: #000000;
    font-weight: 700;
}

.r-total .r-value {
    color: #000000;
    font-size: 18px;
    font-weight: 700;
}

.receipt-footer {
    text-align: center;
    margin-top: 32px;
    font-size: 13px;
    color: #666666;
    font-weight: 400;
}

/* Thai Tea PRO: a collectible receipt, while keeping every number easy to read. */
body.latte .receipt-slip {
    background: #fffaf5;
    border-color: #efcfb6;
}

body.latte .receipt-background {
    background-image: url('../assets/themes/thai-tea/png/receipt-background-v3.png');
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    opacity: 1;
}

body.latte .receipt-header h2,
body.latte .r-value,
body.latte .r-value.highlight,
body.latte .r-total .r-label,
body.latte .r-total .r-value {
    color: #4d3128;
}

body.latte .receipt-title,
body.latte .r-label,
body.latte .receipt-footer {
    color: #76594d;
}

body.latte .box-blue {
    border-color: #eab37f;
    background: rgba(255, 250, 245, 0.686);
}

body.latte .box-green {
    border-color: #d8b26e;
    background: rgba(255, 250, 245, 0.697);
}

body.latte .receipt-summary {
    margin-top: 18px;
    padding: 14px 16px 12px;
    border: 1.5px dashed #d8b26e;
    border-radius: 12px;
    background: rgba(248, 239, 231, 0.752);
}

body.latte .receipt-summary .r-total {
    margin-top: 0 !important;
    margin-bottom: 10px;
    padding: 0 !important;
}

body.latte .receipt-summary .receipt-footer {
    margin-top: 0 !important;
    padding-top: 10px;
    border-top: 1px solid rgba(216, 177, 110, 0.459);
}