#receiptsDialog, #receiptCalculationDialog { box-sizing: border-box; width: min(720px, calc(100% - 24px)); padding: 0; border: 1px solid var(--border, #334155); border-radius: 8px; background: var(--bg-dark, #0f172a); color: var(--text-primary, #f8fafc); font-family: inherit; overflow: hidden; margin: auto; }
#receiptsDialog { height: min(640px, calc(var(--visual-vh, 100dvh) - 24px)); max-height: calc(100dvh - 24px); }
#receiptsDialog[open] { display: flex; flex-direction: column; }
#receiptsDialog::backdrop, #receiptCalculationDialog::backdrop { background: rgb(0 0 0 / 65%); }
.receipts-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--border); gap: 12px; flex: 0 0 auto; }
.receipts-header h2 { margin: 0; font-size: 18px; letter-spacing: 0; }
.receipts-header-actions { display: flex; gap: 8px; }
.receipts-content { overflow: hidden; padding: 8px 16px 10px; min-height: 0; flex: 1; display: flex; flex-direction: column; }
#receiptsDialog *, #receiptCalculationDialog * { box-sizing: border-box; letter-spacing: 0; }
.receipt-icon-button { flex: 0 0 34px; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; background: transparent; color: inherit; border: 1px solid var(--border); border-radius: 5px; cursor: pointer; }
.receipt-icon-button:hover { background: rgb(255 255 255 / 8%); }
.receipt-icon-button:disabled { opacity: .3; cursor: default; }
.receipt-icon-button svg, #fabReceiptsBtn svg { width: 18px; height: 18px; }
.receipt-icon-button:focus-visible, .receipt-compact-row:focus-visible { outline: 2px solid #6ee7b7; outline-offset: -2px; }
.receipt-list-heading, .receipt-compact-row { display: grid; grid-template-columns: minmax(0, 1fr) 100px 130px; gap: 14px; align-items: center; text-align: left; }
.receipt-list-heading-row { display: flex; align-items: center; flex: 0 0 auto; }
.receipt-list-heading { padding: 8px 8px 10px; color: var(--text-secondary, #94a3b8); font-size: 12px; flex: 1; min-width: 0; }
.receipt-compact-list { flex: 1; min-height: 0; overflow: hidden; }
.receipt-compact-list ul { padding: 0; margin: 0; list-style: none; }
.receipt-compact-list li { display: flex; align-items: center; height: 56px; border-bottom: 1px solid var(--border); }
.receipt-compact-list li.receipt-row-selected { background: #183149; box-shadow: inset 2px 0 #7399bc; }
.receipt-select-target { flex: 0 0 36px; width: 36px; height: 44px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.receipt-selection { appearance: none; flex: 0 0 18px; width: 18px; height: 18px; margin: 0; padding: 0 !important; border: 1px solid #52708e !important; border-radius: 50% !important; background: #1b3047 !important; box-shadow: none; cursor: pointer; display: grid; place-content: center; }
.receipt-selection:checked, .receipt-selection:indeterminate { background: #304f70 !important; border-color: #7399bc !important; }
.receipt-selection:checked::after { content: ''; width: 4px; height: 7px; border: solid #a1bed8; border-width: 0 1.5px 1.5px 0; transform: translateY(-1px) rotate(45deg); }
.receipt-selection:indeterminate::after { content: ''; width: 7px; border-top: 1.5px solid #a1bed8; }
.receipt-selection:focus-visible { outline: 2px solid #8baecc; outline-offset: 3px; }
.receipt-selection:disabled { opacity: .35; cursor: default; }
.receipt-compact-row { min-width: 0; flex: 1; }
.receipt-details-heading { flex: 0 0 36px; width: 36px; }
.receipt-row-details { flex: 0 0 36px; width: 36px; height: 44px; border: 0; color: #9eb8ce; }
.receipt-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex: 0 0 44px; }
.receipt-toolbar [role=tablist] { display: flex; }
.receipt-toolbar button, .receipt-unlock button { font: inherit; font-size: 12px; color: inherit; background: transparent; border: 1px solid var(--border); padding: 7px 9px; cursor: pointer; }
.receipt-toolbar button[aria-selected=true] { border-bottom: 2px solid #6ee7b7; color: #6ee7b7; }
.receipt-toolbar button:disabled { opacity: .4; cursor: default; }
.receipt-toolbar [data-done] { display: flex; align-items: center; gap: 5px; border-radius: 4px; }
.receipt-toolbar svg { width: 16px; height: 16px; }
.receipt-unlock { background: var(--bg-dark, #0f172a); color: var(--text-primary, #f8fafc); border: 1px solid var(--border); border-radius: 8px; width: min(340px, calc(100% - 24px)); }
.receipt-unlock label { display: grid; gap: 10px; }
.receipt-unlock input { width: 100%; box-sizing: border-box; padding: 8px; margin-bottom: 16px; }
.receipt-unlock form > div { display: flex; justify-content: flex-end; gap: 8px; }
.receipt-compact-row { width: 100%; height: 55px; padding: 7px 8px; border: 0; border-radius: 0; color: inherit; background: transparent; font: inherit; font-size: 14px; cursor: pointer; }
.receipt-compact-row:hover { background: rgb(255 255 255 / 5%); }
.receipt-compact-row[aria-disabled=true] { cursor: default; }
.receipt-name, .receipt-method { min-width: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; line-height: 1.35; }
.receipt-name { font-weight: 600; }
.receipt-method { font-size: 12px; color: var(--text-secondary, #94a3b8); }
.receipt-prepaid { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.receipt-list-note { flex: 0 0 24px; padding-top: 6px; font-size: 11px; color: #f6c76c; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.receipt-pagination { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex: 0 0 42px; font-size: 12px; color: var(--text-secondary, #94a3b8); }
.receipt-pagination > div { display: flex; gap: 12px; align-items: center; }
.receipt-pagination > div > span { min-width: 45px; text-align: center; font-variant-numeric: tabular-nums; }
.receipt-empty { font-size: 14px; text-align: center; padding: 24px 0; color: var(--text-secondary, #94a3b8); }
#receiptCalculationDialog { width: min(420px, calc(100% - 32px)); max-height: calc(var(--visual-vh, 100dvh) - 16px); }
.receipt-calculation-guest { min-width: 0; }
#receiptCalculationName { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; font-size: 16px; line-height: 1.3; }
#receiptCalculationPayment { margin: 3px 0 0; font-size: 12px; color: var(--text-secondary, #94a3b8); }
.receipt-calculation-body { padding: 10px 16px 14px; }
#receiptCalculationValues { margin: 0; }
#receiptCalculationValues > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border); font-size: 14px; }
#receiptCalculationValues dt { color: var(--text-secondary, #94a3b8); }
#receiptCalculationValues dd { margin: 0; font-variant-numeric: tabular-nums; font-weight: 600; user-select: text; }
#receiptCalculationValues .receipt-net { color: #6ee7b7; font-size: 18px; }
#receiptCalculationNote { margin: 12px 0 0; font-size: 11px; line-height: 1.45; color: #f6c76c; }
.receipt-detail-indicator { padding: 6px 9px; width: fit-content; color: #a7f3d0; border: 1px solid #427065; background: #18382f; border-radius: 4px; font: inherit; font-size: 12px; cursor: pointer; }
body.receipts-open { overflow: hidden !important; }
body.receipts-open .fab-container { visibility: hidden; }
@media (max-width: 640px) {
    .receipts-header { padding: 10px 12px; }
    .receipts-content { padding: 6px 8px 8px; }
    .receipt-list-heading, .receipt-compact-row { grid-template-columns: minmax(0, 1fr) 62px 56px; gap: 4px; padding-left: 4px; padding-right: 4px; }
    .receipt-select-target, .receipt-details-heading, .receipt-row-details { flex-basis: 32px; width: 32px; }
    .receipt-compact-row { font-size: 13px; }
    .receipt-method { font-size: 11px; }
}
@media (max-height: 500px) {
    #receiptCalculationDialog { width: min(660px, calc(100% - 24px)); }
    #receiptCalculationValues { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; }
    #receiptCalculationValues > div { padding: 8px 0; font-size: 13px; }
    #receiptCalculationValues .receipt-net { font-size: 15px; }
    .receipt-calculation-body { padding-top: 4px; }
}