/* Uploaded receipts in the authenticated order details drawer. */
.order-payment-receipts { margin: 24px 0; }
.order-receipts-heading { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.order-receipts-heading .order-section-title { margin: 0; }
.order-receipts-count { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 6px; background: #f2eafa; color: #75439a; font-size: 12px; font-weight: 600; }
.order-receipts-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.order-receipt-item { min-width: 0; overflow: hidden; border: 1px solid #e7e2ec; border-radius: 12px; background: #fff; }
.order-receipt-preview { position: relative; display: flex; align-items: center; justify-content: center; min-height: 150px; height: 190px; padding: 10px; background: #f8f7fa; color: #6c3895; text-decoration: none; overflow: hidden; }
.order-receipt-preview img { display: block; width: 100%; height: 100%; object-fit: contain; }
.order-receipt-preview:hover { background: #f0ebf6; }
.order-receipt-preview:focus-visible { outline: 3px solid #9966c7; outline-offset: -3px; }
.order-receipt-open { position: absolute; top: 8px; right: 8px; display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: 1px solid #e4dcea; border-radius: 7px; background: #fff; font-size: 16px; line-height: 1; }
.order-receipt-preview.is-pdf { flex-direction: column; gap: 14px; font-size: 13px; font-weight: 600; }
.order-receipt-filetype { display: flex; align-items: center; justify-content: center; width: 48px; height: 60px; border: 1px solid #d6c6e5; border-radius: 7px; background: #fff; color: #75439a; font-size: 13px; letter-spacing: .06em; }
.order-receipt-unavailable { max-width: 150px; text-align: center; font-size: 13px; line-height: 1.5; }
.order-receipt-caption { display: flex; flex-direction: column; gap: 3px; padding: 10px 11px; font-size: 12px; line-height: 1.45; }
.order-receipt-caption > span { color: #343039; font-weight: 600; }
.order-receipt-caption time, .order-receipt-caption small { color: #807589; font-size: 11px; }
@media (max-width: 380px) { .order-receipts-grid { grid-template-columns: minmax(0, 1fr); } }