.account-payment{border-top:1px solid #dfe5e4;padding-top:20px;margin-top:20px;min-width:0;color:#101313}
.account-payment .pf-local{font-size:12px;color:#606a6b;margin:0 0 14px}
.account-payment .pf-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.account-payment h3{font:700 20px/1.3 Ubuntu,Arial,sans-serif;margin:0}.account-payment .pf-amount{font:700 20px/1.3 Ubuntu,Arial,sans-serif;white-space:nowrap}
.account-payment .pf-status{font-weight:700;margin:14px 0 6px;color:#606a6b}.account-payment[data-status="paid"] .pf-status{color:#087553}.account-payment[data-status="failed"] .pf-status,.account-payment .pf-error{color:#b32424}.account-payment .pf-explanation{font-size:14px;line-height:1.5;min-height:42px;margin:0 0 18px}
.account-payment .pf-methods{border:0;padding:0;margin:0 0 18px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.account-payment legend{font-weight:700;margin-bottom:10px}.account-payment .pf-methods label{display:flex;align-items:flex-start;gap:10px;border:1px solid #dfe5e4;border-radius:6px;padding:14px;cursor:pointer;margin:0;min-width:0}.account-payment .pf-methods label:has(input:checked){background:#e7f8fb;border-color:#079cb7}.account-payment .pf-methods input{width:16px;height:16px;margin:3px 0 0;flex-shrink:0;accent-color:#079cb7}.account-payment .pf-methods strong{display:block;font-size:15px}.account-payment .pf-methods small{display:block;font-size:13px;line-height:1.45;color:#606a6b;margin-top:5px}.account-payment .pf-methods label:has(input:focus-visible){outline:2px solid #079cb7;outline-offset:3px}
.account-payment .pf-updated{font-size:12px;color:#606a6b;min-height:18px}.account-payment .pf-error:empty{display:none}.account-payment .pf-simulator{border-top:1px dashed #dfe5e4;padding-top:14px;margin-top:14px}.account-payment .pf-simulator summary{cursor:pointer;font-size:13px;color:#606a6b}.account-payment .pf-simulator p{font-size:13px}.account-payment .pf-scenarios{display:flex;flex-wrap:wrap;gap:8px}
.account-payment [hidden]{display:none!important}
@media(max-width:660px){.account-payment .pf-methods{grid-template-columns:1fr}.account-payment .pf-submit{width:100%}.account-payment .pf-top{align-items:flex-start}.account-payment .pf-scenarios{display:grid;grid-template-columns:1fr}}

/* Published project button library, generated with htmlButtonStyleCss. Run scripts/export-payment-button-styles.mjs to refresh. */
.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]{box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:rgb(32, 199, 229)!important;color:#101313!important;text-decoration:none!important;border-style:solid!important;border-width:0px!important;border-color:#101313!important;border-radius:6px!important;font-family:Ubuntu,sans-serif!important;font-size:14px!important;font-weight:700!important;line-height:1.5!important;letter-spacing:0.21px!important;text-transform:uppercase!important;padding-inline:23px!important;padding-block:0px!important;min-height:52px!important;height:auto!important;gap:16px!important;text-shadow:none!important;filter:none!important;transform:none!important;transition-property:background-color,color,border-color,box-shadow,filter,transform!important;transition-duration:0.2s!important;cursor:pointer!important}.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:not(:focus-visible){box-shadow:rgba(15, 156, 183, 0.16) 0px 12px 28px 0px!important}.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]):hover,.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]):focus-visible{background:rgb(22, 185, 213)!important;color:#101313!important;border-color:#101313!important;transform:translateY(-2px)!important}.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:disabled,.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"][aria-disabled="true"],.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"][aria-busy="true"]{transform:none!important;filter:none!important;opacity:.55!important;cursor:default!important;pointer-events:none!important}.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"][hidden]{display:none!important}.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"] [data-button-style-arrow]{font-size:14px!important;color:#101313!important;position:relative!important;top:0px!important;transform:none!important;transition:transform .2s ease!important}.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]):hover [data-button-style-arrow],.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]):focus-visible [data-button-style-arrow]{transform:translateX(0px)!important;color:#101313!important}@media(max-width:479px){}@media(prefers-reduced-motion:reduce){.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"],.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:hover,.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:focus-visible,.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"] [data-button-style-arrow],.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:hover [data-button-style-arrow],.account-payment :is(a,button)[data-button-style-id="button-style-ed5aeb7d-cd11-4c69-b557-df160f0bdda3"]:focus-visible [data-button-style-arrow]{transition:none!important;transform:none!important}}.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]{box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:#ffffff!important;color:#101313!important;text-decoration:none!important;border-style:solid!important;border-width:1px!important;border-color:#dfe5e4!important;border-radius:6px!important;font-family:Ubuntu,sans-serif!important;font-size:14px!important;font-weight:700!important;line-height:1.5!important;letter-spacing:0.21px!important;text-transform:uppercase!important;padding-inline:23px!important;padding-block:0px!important;min-height:52px!important;height:auto!important;gap:16px!important;text-shadow:none!important;filter:none!important;transform:none!important;transition-property:background-color,color,border-color,box-shadow,filter,transform!important;transition-duration:0.2s!important;cursor:pointer!important}.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:not(:focus-visible){box-shadow:none!important}.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]):hover,.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]):focus-visible{background:#f2f5f4!important;color:#101313!important;border-color:#079cb7!important;transform:translateY(-2px)!important}.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:disabled,.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"][aria-disabled="true"],.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"][aria-busy="true"]{transform:none!important;filter:none!important;opacity:.55!important;cursor:default!important;pointer-events:none!important}.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"][hidden]{display:none!important}.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"] [data-button-style-arrow]{font-size:14px!important;position:relative!important;transform:none!important;transition:transform .2s ease!important}.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]):hover [data-button-style-arrow],.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]):focus-visible [data-button-style-arrow]{transform:translateX(0px)!important}@media(max-width:479px){}@media(prefers-reduced-motion:reduce){.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"],.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:hover,.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:focus-visible,.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"] [data-button-style-arrow],.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:hover [data-button-style-arrow],.account-payment :is(a,button)[data-button-style-id="button-style-7047af58-ac61-42bd-950e-d4017cd4858c"]:focus-visible [data-button-style-arrow]{transition:none!important;transform:none!important}}
.account-payment button:focus-visible{outline:2px solid #007d94;outline-offset:3px}

.account-payment .pf-methods label,.account-payment .pf-methods small{letter-spacing:normal;text-transform:none}.account-payment .pf-simulator{margin-bottom:18px}

.account-payment .pf-updated:empty{display:none}

.account-payment .pf-offers{display:block;margin:0 0 18px;font-size:14px}.account-payment .pf-offers select{display:block;width:100%;margin-top:8px;min-height:44px;font:inherit;border:1px solid #dfe5e4;border-radius:6px;padding:10px}.account-payment .pf-invoice p{overflow-wrap:anywhere}.account-payment .pf-invoice img{max-width:100%;height:auto}.account-payment .pf-methods label:has(input:disabled){cursor:default}

.account-payment.pf-nav{border:0;padding:0;margin:0}.account-payment .pf-refresh{margin-top:12px}.account-payment .pf-sync-status{font-size:13px;line-height:1.5;color:#606a6b;min-height:20px;margin:8px 0}.account-payment .pf-status{font-size:22px;line-height:1.3}.account-payment .pf-explanation{max-width:65ch}.account-payment .pf-method-summary{font-size:14px}.account-payment[data-status="paid"] .pf-status{color:#087553}@media(max-width:660px){.account-payment .pf-refresh{width:100%}}

.statuses.statuses-payment-focus{grid-template-columns:1fr}
.account-payment .pf-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.account-payment .pf-actions .pf-refresh,.account-payment .pf-actions .pf-change{margin:0}.account-payment .pf-actions a:focus-visible{outline:2px solid #087f95;outline-offset:3px}@media(max-width:660px){.account-payment .pf-actions>*{width:100%}}

/* Payment method and invoice share the existing account component and button library. */
.account-payment .pf-method-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 16px;padding:14px 0;border-block:1px solid #dfe5e4}
.account-payment .pf-method-row .pf-method-summary{margin:0;font-weight:700}
.account-payment .pf-invoice:not(:empty){margin-top:20px;padding:20px;border:1px solid #dfe5e4;border-radius:9px;background:#fff}
.account-payment .pf-invoice h3{margin-bottom:12px;font-size:18px}
.account-payment .pf-invoice-note{font-size:13px;line-height:1.5;color:#606a6b}
.account-payment .pf-invoice-actions{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 16px}
.account-payment .pf-invoice p{font-size:13px;line-height:1.5;margin:8px 0}
@media(max-width:660px){.account-payment .pf-method-row{align-items:stretch;flex-direction:column;gap:12px}.account-payment .pf-invoice{padding:14px}.account-payment .pf-invoice-actions{display:grid;grid-template-columns:1fr}}

.account-payment .pf-status-panel{margin:16px 0 20px;padding:16px 18px;border:1px solid #b7e6ef;border-radius:9px;background:#eefafd}
.account-payment .pf-status-panel .pf-status{display:block;font:700 20px/1.35 Ubuntu,Manrope,sans-serif;color:#087f95;background:none;padding:0;margin:0 0 6px}
.account-payment .pf-status-panel .pf-status:before{display:none}
.account-payment .pf-status-panel .pf-explanation{font-size:14px;line-height:1.5;margin:0;min-height:0;color:#606a6b}
.account-payment[data-status="paid"] .pf-status-panel{background:#f0faf5;border-color:#b8ddcc}
.account-payment[data-status="paid"] .pf-status-panel .pf-status{color:#087553}
.account-payment:is([data-status="failed"],[data-status="cancelled"]) .pf-status-panel{background:#fff7f7;border-color:#ebc9c9}
.account-payment:is([data-status="failed"],[data-status="cancelled"]) .pf-status-panel .pf-status{color:#b32424}
/* Shared payment dialog: header stays visible; only provider content scrolls. */
.account-payment .pf-forma-dialog{box-sizing:border-box;width:min(680px,calc(100vw - 32px));max-width:none;height:min(640px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid #dfe5e4;border-radius:10px;background:#fff;color:#101313;overflow:hidden}
.account-payment .pf-forma-dialog[open]{display:flex;flex-direction:column}
.pf-forma-dialog::backdrop{background:rgba(16,19,19,.5)}
.account-payment .pf-forma-dialog header{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:12px;padding:8px 16px;border-bottom:1px solid #dfe5e4}
.account-payment .pf-forma-dialog h3{min-width:0;font:700 18px/1.3 Ubuntu,Arial,sans-serif;margin:0}
.account-payment .pf-forma-dialog header button{flex-shrink:0;margin:0;width:auto!important}
.account-payment .pf-forma-status{flex:0 0 auto;font-size:13px;line-height:1.5;margin:0;padding:10px 16px;box-sizing:border-box;color:#606a6b;overflow-wrap:anywhere}
.account-payment .pf-forma-dialog>iframe{display:block;flex:1;min-height:0;width:100%;border:0;background:#fff;box-sizing:border-box;padding:0 12px 12px}
.account-payment .pf-embedded-container{flex:1;min-height:0;overflow:auto;padding:12px;box-sizing:border-box}
.account-payment .pf-embedded-container iframe{display:block;width:100%;max-width:100%;min-height:0;border:0}
.account-payment .pf-invoice-dialog{width:min(760px,calc(100vw - 32px))}
.account-payment .pf-invoice-preview{flex:1;min-height:0;overflow:auto;background:#fff}
.account-payment .pf-invoice-preview img{display:block;width:100%;height:auto}
.account-payment .pf-embedded-container .pf-yapay-methods>div{min-height:180px}
.account-payment .pf-forma-dialog.pf-embedded-message,.account-payment .pf-forma-dialog.pf-dialog-compact{height:auto}
.account-payment .pf-embedded-message .pf-embedded-container,.account-payment .pf-dialog-compact .pf-embedded-container{flex:0 1 auto;padding:12px 16px 20px}
.account-payment .pf-embedded-message .pf-embedded-container p{margin:0;font-size:14px;line-height:1.5}
@media(max-width:660px){
 .account-payment .pf-forma-dialog{width:calc(100vw - 16px);height:min(640px,calc(100dvh - 16px));max-height:calc(100dvh - 16px)}
 .account-payment .pf-forma-dialog header{padding:8px 12px;gap:8px}
 .account-payment .pf-forma-dialog h3{font-size:16px}
 .account-payment .pf-forma-status{padding:8px 12px}
 .account-payment .pf-forma-dialog>iframe{padding:0 8px 8px}
 .account-payment .pf-embedded-container{padding:8px}
}
/* Invoice QR preview: compact entry point, original PNG download. */
.account-payment .pf-qr-thumbnail{display:flex;align-items:center;gap:12px;box-sizing:border-box;max-width:100%;padding:10px 14px;border:1px solid #dfe5e4;border-radius:6px;background:#fff;color:#101313;text-align:left;cursor:pointer;font:inherit}
.account-payment .pf-qr-thumbnail img{display:block;width:64px;height:64px;flex:none;object-fit:contain}
.account-payment .pf-qr-thumbnail span{display:grid;gap:4px;min-width:0}
.account-payment .pf-qr-thumbnail strong{font:700 16px/1.3 Ubuntu,Manrope,sans-serif}
.account-payment .pf-qr-thumbnail small{font-size:13px;line-height:1.4;color:#606a6b}
.account-payment .pf-qr-thumbnail:hover{border-color:#079cb7;background:#f2f5f4}
.account-payment .pf-forma-dialog.pf-qr-dialog{width:min(400px,calc(100vw - 24px));height:max-content;max-height:calc(100dvh - 24px);border-radius:4px}
.account-payment .pf-qr-dialog>header{min-height:52px;padding:8px 16px;align-items:center}
.account-payment .pf-qr-dialog>header h3{font:700 18px/24px Ubuntu,Manrope,sans-serif}
.account-payment .pf-qr-dialog>header .pf-qr-close{display:inline-flex;align-items:center;justify-content:center;flex:none;width:36px!important;min-width:36px;min-height:36px;height:36px;margin:0;padding:8px;border:0;border-radius:4px;background:transparent;color:#101313;box-shadow:none;cursor:pointer}
.account-payment .pf-qr-close svg{display:block;flex:none}
.account-payment .pf-qr-close:hover,.account-payment .pf-qr-close:active{color:#079cb7;background:transparent}
.account-payment .pf-qr-close:focus-visible{outline:1px solid #101313;outline-offset:2px}
.account-payment .pf-qr-body{display:flex;flex-direction:column;align-items:center;gap:16px;min-height:0;overflow:auto;padding:24px;box-sizing:border-box}
.account-payment .pf-qr-body img{display:block;width:min(100%,280px);height:auto;aspect-ratio:1;object-fit:contain;background:#fff}
.account-payment .pf-qr-body p{margin:0;font-size:13px;line-height:1.5;text-align:center}
@media(max-width:480px){.account-payment .pf-qr-body{padding:20px;gap:12px}.account-payment .pf-qr-dialog>header{padding:8px 12px}}

.account-payment .pf-invoice-controls{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.account-payment .pf-invoice-controls>a{box-sizing:border-box;text-align:center}
.account-payment .pf-invoice>h3{margin:0 0 12px}
@media(max-width:480px){.account-payment .pf-invoice-controls{display:grid;grid-template-columns:minmax(0,1fr)}.account-payment .pf-invoice-controls>*{width:100%;min-width:0}}
/* A single payment toolbar, with a quieter method-change action. */
.customer-flow .account-payment .pf-method-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:16px;margin:0 0 12px;padding:12px 0}
.customer-flow .account-payment .pf-method-row .pf-method-summary{flex:1;min-width:0;margin:0;font-size:14px;line-height:1.5}
.customer-flow .account-payment .pf-method-tools{display:flex;flex:0 0 auto;align-items:center;justify-content:flex-end;gap:14px}
.customer-flow .account-payment .pf-method-tools>.pf-change{display:inline-flex;align-items:center;justify-content:center;min-width:0;min-height:36px;height:36px;width:auto;margin:0;padding:0 4px;border:0;border-radius:4px;background:transparent;color:#606a6b;font:400 13px/20px Manrope,Arial,sans-serif;text-transform:none;letter-spacing:normal;box-shadow:none;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.customer-flow .account-payment .pf-method-tools>.pf-change:hover{color:#101313;background:transparent}
.customer-flow .account-payment .pf-method-tools>:is(.pf-submit,.pf-continue){flex:none;width:auto;min-width:160px;margin:0;align-self:center}
body.customer-flow main :is(#customer-view .account-payment,.account-payment) .pf-method-tools>:is(.pf-submit,.pf-continue)[data-button-style-id]{background:#101313!important;color:#fff!important;border-color:#101313!important}
body.customer-flow main :is(#customer-view .account-payment,.account-payment) .pf-method-tools>:is(.pf-submit,.pf-continue)[data-button-style-id]:not(:disabled):hover{background:#282c2c!important;color:#fff!important;border-color:#282c2c!important}
@media(max-width:660px){.customer-flow .account-payment .pf-method-row{flex-wrap:wrap;gap:8px}.customer-flow .account-payment .pf-method-row .pf-method-summary{flex-basis:100%}.customer-flow .account-payment .pf-method-tools{width:100%;justify-content:space-between}.customer-flow .account-payment .pf-method-tools>:is(.pf-submit,.pf-continue){width:auto;min-width:150px}}