/* Drafts saved as you write, and read receipts (drafts.js). */

.compose-win .draft-note { font-size: 12px; white-space: nowrap; margin-left: 4px; }

.receipt-banner { display: flex; align-items: center; gap: 12px; background: var(--surface-2); border-radius: 8px; padding: 6px 8px 6px 12px; margin: 0 0 16px; }
.receipt-banner[hidden] { display: none; }
.receipt-banner svg { width: 20px; height: 20px; fill: var(--accent-ink); flex: none; }
.receipt-banner .btn.small { margin-left: 0; }
@media (max-width: 600px) { .receipt-banner { flex-wrap: wrap; } .receipt-banner .spacer { flex-basis: calc(100% - 40px); } }

.receipt-item { display: flex; align-items: center; gap: 6px; }
.receipt-check { display: inline-block; width: 16px; text-align: center; }

.gen.receipts .radios { flex-direction: column; }
.receipt-help { font-size: 12px; }