.offline-payment-dialog { box-sizing: border-box; width: min(560px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 24px; border: 1px solid #b8caca; border-radius: 20px; background: #fff; color: #12383b; overflow-y: auto; overscroll-behavior: contain; }
.offline-payment-dialog::backdrop { background: #001b24b3; }
.offline-payment-dialog header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.offline-payment-dialog h2 { margin: 0; font-size: 1.35rem; }
.offline-payment-dialog form, .offline-payment-dialog fieldset { display: grid; gap: 16px; }
.offline-payment-dialog fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.offline-payment-dialog legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.offline-payment-dialog label { display: grid; gap: 6px; font-weight: 600; min-width: 0; }
.offline-payment-dialog input, .offline-payment-dialog select { box-sizing: border-box; width: 100%; min-width: 0; min-height: 44px; border: 1px solid #789c9e; border-radius: 8px; padding: 10px; font: inherit; background: #fff; color: #12383b; }
.offline-payment-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.offline-payment-dialog .offline-payment-attestation { display: flex; align-items: center; font-weight: 400; }
.offline-payment-attestation input { width: 22px; height: 22px; min-height: 22px; flex-shrink: 0; }
.offline-payment-dialog [data-message] { margin: 0; overflow-wrap: anywhere; }
.offline-payment-dialog details { margin-top: 20px; }
.offline-payment-entry { margin-block: 12px; }
.offline-payment-entry-action { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.offline-payment-entry-action [data-offline-payment-attempt] { flex: 1 1 240px; margin: 0; line-height: 1.4; }
.offline-payment-entry-action [data-offline-payment-attempt] strong { color: #12383b; }
.offline-payment-attempt-status { color: #8a3f25; font-weight: 700; }
.offline-payment-entry p { margin: 6px 0 0; }
.offline-payment-verified { display: flex; align-items: center; gap: 12px; padding: 14px 16px; margin-bottom: 10px; border: 1px solid #82bba0; border-radius: 12px; background: #e7f5eb; color: #175637; box-shadow: 0 0 16px #38a16918; }
.offline-payment-verified > span { display: grid; place-items: center; flex: 0 0 32px; height: 32px; border-radius: 50%; background: #c4e8d0; font-size: 23px; font-weight: 700; }
.offline-payment-verified strong, .offline-payment-verified small { display: block; color: #175637; line-height: 1.4; }
.offline-payment-verified strong { font-size: 16px; }
.offline-payment-verified small { font-size: 13px; }
.offline-payment-attempt-history { margin-top: 20px; padding-top: 18px; border-top: 1px solid #cfdddd; }
.offline-payment-attempt-history > summary { cursor: pointer; font-size: 1rem; font-weight: 600; min-height: 32px; }
.offline-payment-attempt-history > p { margin: 6px 0 12px; color: #49696b; }
.offline-payment-attempt-history ol { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.offline-payment-attempt-history li { display: grid; gap: 4px; padding: 12px; border: 1px solid #cfdddd; border-radius: 10px; background: #f7faf9; overflow-wrap: anywhere; }
.offline-payment-attempt-history li > div { display: flex; justify-content: space-between; gap: 10px; }
.offline-payment-attempt-history time, .offline-payment-attempt-history small { color: #49696b; font-size: 13px; }
.offline-payment-attempt-history small { color: #8a3f25; font-weight: 700; }
.offline-payment-attempt-history .offline-payment-attempt-empty { margin-bottom: 0; }
@media (max-width: 420px) { .offline-payment-dialog { padding: 18px; } .offline-payment-grid { grid-template-columns: 1fr; } }
.offline-payment-attempt-summary { padding: 12px; border: 1px solid #cfdddd; border-radius: 10px; background: #f7faf9; line-height: 1.5; overflow-wrap: anywhere; }
.offline-payment-receipt-summary { padding: 14px 16px; margin-bottom: 18px; border: 1px solid #a8c6cf; border-radius: 12px; background: #f0f7fa; overflow-wrap: anywhere; }
.offline-payment-receipt-summary p { margin: 0; line-height: 1.5; }