/* FF Pay purchase page uses the existing light/dark design tokens. */
#pPay{padding:18px 20px 100px;max-width:430px;margin:auto}#pPay button,#payPurchaseDialog button{cursor:pointer;font:inherit}#pPay .pay-card,#payPurchaseDialog .pay-card{background:var(--surf);border:1px solid var(--b2);border-radius:16px;padding:16px;margin-bottom:14px}#pPay h2,#payPurchaseDialog h2{font-size:15px;margin:0 0 13px;color:var(--t1)}#pPay p,#payPurchaseDialog p{font-size:12px;color:var(--t2);line-height:1.6}#pPay .pay-balance{font-size:26px;font-weight:700;letter-spacing:-.7px;margin:7px 0 15px}#pPay .pay-actions,#pPay .pay-two,#payPurchaseDialog .pay-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.pay-secondary{border:1px solid var(--b2);border-radius:11px;background:var(--surf);color:var(--t1);padding:11px;font-size:12px!important;font-weight:600!important;display:flex;align-items:center;justify-content:center;gap:6px}.pay-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;color:var(--blue)}#pPay .pay-tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--b1);padding:4px;border-radius:12px;gap:4px;margin:18px 0}.pay-tabs button{border:0;border-radius:9px;padding:12px 4px;background:transparent;color:var(--t2);font-size:12px!important;font-weight:650!important}.pay-tabs button.active{background:var(--surf);color:var(--blue)}#pPay .pay-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.pay-link{background:none;border:0;color:var(--blue);font-size:12px!important;padding:5px}.pay-beneficiaries{display:flex;gap:10px;overflow-x:auto;margin-bottom:16px;padding-bottom:5px;scrollbar-width:none}.pay-beneficiary{min-width:154px;max-width:180px;text-align:left;padding:12px;border:1px solid var(--b2);background:var(--surf);color:var(--t1);border-radius:13px}.pay-beneficiary.selected{border-color:var(--blue);background:var(--pill)}.pay-beneficiary strong,.pay-beneficiary small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pay-beneficiary strong{font-size:12px;margin:8px 0 5px}.pay-beneficiary small{font-size:10px;color:var(--t3)}.pay-avatar{display:inline-flex;width:30px;height:30px;align-items:center;justify-content:center;border-radius:10px;background:var(--b1);color:var(--blue);font-size:11px;font-weight:700}.pay-note{font-size:11px!important;color:var(--t3)!important;line-height:1.5;margin:10px 0}.pay-field{margin-bottom:12px}.pay-field label{display:block;font-size:12px;font-weight:600;color:var(--t1);margin:0 0 7px}.pay-field input,.pay-field select,.pay-field textarea{width:100%;min-width:0;border:1px solid var(--b2);border-radius:11px;background:var(--surf);color:var(--t1);padding:12px;font:inherit;font-size:13px}.pay-field textarea{min-height:70px;resize:vertical}.pay-item{border:1px solid var(--b2);border-radius:12px;padding:13px;margin-bottom:12px;background:var(--bg)}.pay-item .pay-head{font-size:12px;color:var(--t1)}.pay-line-total{text-align:right;font-size:12px;color:var(--t2)}.pay-row{display:flex;justify-content:space-between;gap:12px;margin:11px 0;font-size:12px;color:var(--t2)}.pay-row strong{color:var(--t1);overflow-wrap:anywhere}.pay-total{border-top:1px solid var(--b2);padding-top:13px;font-weight:650}.pay-total strong{font-size:19px;color:var(--blue)}.pay-upload{display:flex;align-items:center;gap:10px;border:1px dashed var(--b2);background:var(--bg);border-radius:11px;padding:14px;width:100%;color:var(--t1);text-align:left}.pay-upload strong,.pay-upload small{display:block}.pay-upload strong{font-size:12px}.pay-upload small{font-size:11px;color:var(--t3);margin-top:4px}.pay-evidence{display:flex;align-items:center;justify-content:space-between;font-size:12px;border-bottom:1px solid var(--b2);padding:9px 0;overflow-wrap:anywhere}.pay-evidence span{min-width:0}.pay-primary{width:100%;border:0;border-radius:13px;padding:15px;background:var(--blue);color:#fff;font-size:14px!important;font-weight:650!important}.pay-primary:disabled{opacity:.5;cursor:default!important}.pay-history-row{display:flex;justify-content:space-between;gap:12px;text-align:left;width:100%;padding:13px 0;border:0;border-bottom:1px solid var(--b2);background:none;color:var(--t1)}.pay-history-row strong,.pay-history-row small{display:block}.pay-history-row strong{font-size:12px}.pay-history-row small{color:var(--t3);font-size:11px;margin-top:5px}.pay-status{font-size:10px;color:var(--t2);background:var(--b1);padding:6px 8px;border-radius:7px;align-self:center;white-space:nowrap}#payPurchaseDialog[hidden]{display:none}#payPurchaseDialog{position:fixed;inset:0;background:#0f172a70;z-index:2000;display:flex;align-items:flex-end;justify-content:center}#payPurchaseDialog .pay-sheet{width:100%;max-width:430px;max-height:88dvh;overflow-y:auto;border-radius:22px 22px 0 0;background:var(--surf);padding:20px;color:var(--t1)}#payPurchaseDialog .pay-sheet-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}#payPurchaseDialog .pay-sheet-head h2{font-size:18px;margin:0}#payPurchaseDialog .pay-close{background:var(--b1);border:0;color:var(--t2);border-radius:10px;padding:9px;display:flex}.pay-doc-item{font-size:12px;padding:12px 0;border-bottom:1px solid var(--b2)}.pay-doc-item small{display:block;color:var(--t3);font-size:11px;margin-top:4px}.pay-document dt{font-size:11px;color:var(--t3);margin-top:12px}.pay-document dd{font-size:12px;margin:4px 0;overflow-wrap:anywhere}.pay-document img{display:block;max-width:100%;max-height:180px;object-fit:contain;margin:10px 0}.pay-document a{color:var(--blue)}#pPay [hidden],#payPurchaseDialog [hidden]{display:none!important}.pay-inline-check{display:flex;gap:9px;align-items:center;font-size:12px;color:var(--t2);margin:12px 0}.pay-inline-check input{width:auto}.pay-danger{color:var(--red)!important}@media(max-width:350px){#pPay{padding-left:12px;padding-right:12px}.pay-tabs button{font-size:11px!important}}@media print{body>*{display:none!important}body>#payPurchaseDialog{display:block!important;position:static;background:#fff}#payPurchaseDialog .pay-sheet{max-width:none;max-height:none;background:white;color:black;padding:0}#payPurchaseDialog .pay-sheet-head,#payPurchaseDialog .pay-primary,#payPurchaseDialog .pay-note,#payPurchaseDialog .pay-file-action{display:none!important}#payPurchaseDialog .pay-document,#payPurchaseDialog .pay-document *{color:black!important}.pay-card{border:0!important;background:white!important}}

/* Pay form spacing and mobile input focus */
#payPurchaseDialog #payConfirmButton {
    margin-top: 16px;
}
#pPay .pay-field input,
#pPay .pay-field select,
#pPay .pay-field textarea,
#payPurchaseDialog .pay-field input,
#payPurchaseDialog .pay-field select,
#payPurchaseDialog .pay-field textarea {
    font-size: 16px !important;
}

/* Match FF Pay's desktop content width. */
#pPay {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box;
    padding: 18px 16px 105px;
}
@media (min-width: 768px) {
    #pPay {
        max-width: 1112px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}