/* A seasonal keepsake from the same illustrated notebook as the café. */
html[data-cafe-theme="halloween"] #receiptDialog{
 color:#846676;scrollbar-color:#c99e78 transparent;
}
html[data-cafe-theme="halloween"] #receiptDialog::backdrop{
 background:#47344791;backdrop-filter:blur(5px);
}
html[data-cafe-theme="halloween"] #receiptDialog .receipt-paper{
 isolation:isolate;border:0;border-image:none;padding:32px 30px 28px;
 background:#fff4e2 url('paper-fibres.svg') 0 0/180px 180px repeat;
}
html[data-cafe-theme="halloween"] #receiptDialog .receipt-paper:before{
 content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 border:20px solid transparent;border-image:var(--painted-book) 120 / 20px / 0 round;
 filter:var(--stationery-orange-filter,url(#stationery-orange));
}
html[data-cafe-theme="halloween"] #receiptDialog .receipt-brand{
 padding:5px 0 16px;border-color:#caab8a;
}
html[data-cafe-theme="halloween"] #receiptDialog .receipt-brand .cafe-logo{
 width:250px;max-width:100%;height:auto;
}
html[data-cafe-theme="halloween"] #receiptClose{
 top:8px;right:8px;color:#91694f;
}
html[data-cafe-theme="halloween"] #receiptClose:hover{background:#f4dbc2}
html[data-cafe-theme="halloween"] #receiptClose:focus-visible,
html[data-cafe-theme="halloween"] #receiptNext:focus-visible{outline-color:#a67654}

.slip-seasonal-heading{
 position:relative;display:grid;grid-template-columns:46px minmax(0,1fr) 46px;
 align-items:center;gap:5px;padding:18px 0 13px;text-align:center;
}
.slip-seasonal-heading:before{
 content:'';position:absolute;top:-6px;left:calc(50% - 35px);width:70px;height:12px;
 background-color:#efc29c;background-image:linear-gradient(90deg,#fff5e16b 50%,transparent 50%),linear-gradient(#fff5e16b 50%,transparent 50%);
 background-size:8px 8px;opacity:.83;transform:rotate(-4deg);
}
.slip-seasonal-heading small{display:block;color:#9f7961}
.slip-seasonal-heading strong{display:block;font-size:var(--type-body)!important;line-height:1.35;color:#846277}
.slip-seasonal-sticker{display:block;width:46px;height:46px;background:url('ui/halloween-stickers.png') 0 0/200% 200% no-repeat}
.slip-pumpkin-latte{transform:rotate(-9deg)}
.slip-ghost{background-position:0 100%;transform:rotate(8deg)}

html[data-cafe-theme="halloween"] #receiptDialog :is(.slip-meta,.slip-fill,.slip-items thead,.slip-feedback,.slip-footer){border-color:#cfad8a}
html[data-cafe-theme="halloween"] #receiptDialog .slip-meta{padding-top:0}
html[data-cafe-theme="halloween"] #receiptDialog .slip-drink{color:#95664d}
html[data-cafe-theme="halloween"] #receiptDialog .slip-items thead{background:#efc29b42;color:#946d53}
html[data-cafe-theme="halloween"] #receiptDialog .slip-items tbody tr+tr{border-top:1px dotted #ddc2a85c}
html[data-cafe-theme="halloween"] #receiptDialog :is(.slip-items caption,.slip-step,.slip-rank,.slip-footer>small,.slip-total>span small){color:#9b7a67}
html[data-cafe-theme="halloween"] #receiptDialog .slip-total{
 position:relative;isolation:isolate;border:0;margin:16px -7px 0;padding:14px 12px;
}
html[data-cafe-theme="halloween"] #receiptDialog .slip-total:before{
 content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 border:16px solid transparent;border-image:var(--painted-card) 300 fill / 16px / 0 stretch;
 filter:var(--stationery-orange-filter,url(#stationery-orange));transform:rotate(-.6deg);
}
html[data-cafe-theme="halloween"] #receiptDialog .slip-total>strong{color:#b97f51}
html[data-cafe-theme="halloween"] #receiptDialog .slip-perfect .slip-total>strong{color:#608268}
html[data-cafe-theme="halloween"] #receiptDialog .slip-stamp{
 color:#9d704f;border-color:#c09064;box-shadow:inset 0 0 0 2px #fff5e5,inset 0 0 0 3px #c0906460;transform:rotate(-3deg);
}
html[data-cafe-theme="halloween"] #receiptDialog .slip-stamp-retry{color:#9c6372;border-color:#b98791;box-shadow:none}
html[data-cafe-theme="halloween"] #receiptDialog .slip-footer:after{
 content:'';display:block;width:60px;height:60px;margin:4px auto -10px;
 background:url('ui/halloween/bat-flap.webp') 0 0/200% 100% no-repeat;transform:rotate(-8deg);
}
html[data-cafe-theme="halloween"] #receiptNext{color:#8d624d}
@media(max-width:380px){
 html[data-cafe-theme="halloween"] #receiptDialog .receipt-paper{padding:32px 21px 25px}
 .slip-seasonal-heading{grid-template-columns:38px minmax(0,1fr) 38px;gap:3px}
 .slip-seasonal-sticker{width:38px;height:38px}
}