/* Payment presentation only; callers retain their validation and send flow. */
.munia-payment-button {
    position: relative; box-sizing: border-box; width: 76px; min-width: 0;
    max-width: 100%; height: 40px; min-height: 40px; padding: 0 !important;
    border: 0; border-radius: 999px; background: #0ac18e !important;
    color: #06281f !important; box-shadow: none !important; white-space: nowrap;
    overflow: hidden; cursor: pointer; transition: background-color .15s ease;
}
.munia-payment-button:hover:not(:disabled) { background: #08ad7f !important; }
#superchatSendBtn.munia-payment-button[data-payment-status],
#dm-send-btn.munia-payment-button[data-payment-status] { padding: 0 !important; }
.munia-payment-button:focus-visible { outline: 2px solid var(--munia-positive-text, #00865d); outline-offset: 3px; }
#superchatSendBtn.munia-payment-button:disabled, #superchatSendBtn.munia-payment-button:disabled:hover,
#dm-send-btn.munia-payment-button:disabled, #dm-send-btn.munia-payment-button:disabled:hover {
    background: #0ac18e !important; opacity: .65; cursor: progress; font-size: 0 !important;
}
.munia-payment-button:disabled::after {
    content: ""; position: absolute; left: calc(50% - 9px); top: calc(50% - 9px);
    width: 18px; height: 18px; box-sizing: border-box; border: 2px solid #06281f40;
    border-top-color: #06281f; border-radius: 50%; animation: munia-payment-spin .8s linear infinite;
}
.munia-payment-status {
    display: block; flex-shrink: 0; min-width: 0; height: 16px;
    color: var(--munia-muted, #65736b); font: 11px/16px Arial, sans-serif;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.munia-payment-status:empty { visibility: hidden; }
@keyframes munia-payment-spin { to { transform: rotate(360deg); } }

.user-donation-overlay {
    position: fixed; top: var(--munia-viewport-top, 0px); left: 0; right: 0;
    height: var(--munia-viewport-height, 100dvh); z-index: 13000;
    align-items: center; justify-content: center; box-sizing: border-box;
    padding: 20px; background: #18352b66; backdrop-filter: blur(3px);
}
html[data-theme="dark"] .user-donation-overlay { background: #26343f99; }
.user-donation-card {
    width: 480px; max-width: 100%; max-height: 100%; min-height: 0;
    padding: 24px; box-sizing: border-box; overflow-y: auto; overscroll-behavior: contain;
    border: 1px solid var(--munia-line, #dfe7e2); border-radius: 22px;
    background: var(--munia-surface, #fff); color: var(--munia-text, #18231e);
    box-shadow: 0 18px 65px #112c2433; font: 15px/1.5 Arial, sans-serif;
}
.user-donation-header { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 24px; }
.user-donation-identity { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.user-donation-identity h2 { margin: 0 0 4px; font-size: 23px; line-height: 1.3; }
.user-donation-identifier { margin-bottom: 8px; color: var(--munia-muted, #65736b); font-size: 13px; }
#userDonationOverlay #udProfileLink { color: var(--munia-positive-text, #00865d); font-size: 13px; text-decoration: none; }
#userDonationOverlay #udProfileLink:hover { text-decoration: underline; }
#userDonationOverlay .user-donation-close {
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
    width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%;
    background: transparent; color: var(--munia-muted, #65736b); font: 24px/1 Arial,sans-serif; cursor: pointer;
}
#userDonationOverlay .user-donation-close:hover { background: var(--munia-control-hover, #edf1ef) !important; color: var(--munia-text, #18231e); }
.user-donation-amount { display: block; margin-bottom: 18px; }
.user-donation-amount > label { display: block; margin-bottom: 8px; color: var(--munia-muted, #65736b); font-size: 13px; }
.user-donation-amount-field { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--munia-line, #dfe7e2); border-radius: 12px; background: var(--munia-surface, #fff); }
.user-donation-amount-field:focus-within { border-color: var(--munia-positive-line, #00865d); box-shadow: 0 0 0 2px #0ac18e22; }
#userDonationOverlay #udAmountInput { flex: 1; width: 0; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: var(--munia-text, #18231e); font: 20px/1.5 Arial,sans-serif; }
.user-donation-amount-field > span { flex-shrink: 0; color: var(--munia-muted, #65736b); font-size: 13px; }
.user-donation-actions { display: flex; flex-direction: column; gap: 10px; }
#userDonationOverlay .user-donation-primary,
#userDonationOverlay .user-donation-secondary {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    width: 100%; min-height: 44px; padding: 11px 16px; box-sizing: border-box;
    border: 1px solid var(--munia-line, #dfe7e2); border-radius: 999px;
    background: transparent; color: var(--munia-text, #18231e);
    font: 600 14px/1.45 Arial,sans-serif; text-align: center; text-decoration: none;
    overflow-wrap: anywhere; cursor: pointer; transition: background-color .15s ease;
}
#userDonationOverlay .user-donation-primary { background: #0ac18e; border-color: transparent; color: #06281f; }
#userDonationOverlay .user-donation-primary:hover:not(:disabled) { background: #08ad7f !important; }
#userDonationOverlay .user-donation-primary:disabled,
#userDonationOverlay .user-donation-primary:disabled:hover { background: var(--munia-control-hover, #edf1ef) !important; color: var(--munia-muted, #65736b); cursor: default; }
#userDonationOverlay .user-donation-secondary:hover { background: var(--munia-control-hover, #edf1ef) !important; }
#userDonationOverlay :is(button, a):focus-visible { outline: 2px solid var(--munia-positive-text, #00865d); outline-offset: 3px; }
.user-donation-final { display: flex; flex-direction: column; gap: 12px; }
#udSendBtn { margin-top: 12px; }
#udCheckResult { padding: 14px 16px; border-radius: 12px; background: var(--munia-surface-soft, #f5f8f6); font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
#udCheckResult > div:last-child { color: var(--munia-text, #18231e) !important; }
#udError { color: var(--munia-danger-text, #b23838); font-size: 13px; margin-bottom: 12px; overflow-wrap: anywhere; }
@media (max-width: 400px) {
    .user-donation-overlay { padding: 12px; }
    .user-donation-card { padding: 20px; border-radius: 18px; }
    .user-donation-identity h2 { font-size: 21px; }
}
@media (prefers-reduced-motion: reduce) {
    .munia-payment-button, #userDonationOverlay button, #userDonationOverlay a { transition: none; }
    .munia-payment-button:disabled::after { animation: none; }
}
