dialog.billing-flow{border:1px solid #dde4e8;border-radius:8px;padding:0;width:min(680px,calc(100% - 32px));max-height:90vh;max-height:90dvh;margin:auto;background:#fff;color:#25332e;box-shadow:0 28px 100px #102b2938;font-family:inherit;letter-spacing:0}
.billing-flow::backdrop{background:rgba(19,31,35,.55);backdrop-filter:blur(5px)}
.billing-flow .billing-flow-frame{display:flex;flex-direction:column;max-height:inherit;margin:0}
.billing-flow header{display:flex;align-items:center;gap:14px;margin:0;padding:22px 26px;border-bottom:1px solid #e4e9ed;background:#fff;flex:none}
.billing-flow header p{margin:0 0 4px;font-size:10px;color:#75817c;font-weight:600}
.billing-flow header h2{margin:0;font-size:22px;font-weight:650;line-height:1.3;letter-spacing:0}
.billing-flow .billing-flow-symbol{width:42px;height:42px;display:grid;place-items:center;flex:none;border-radius:8px;background:#eef3fc;color:#48669f}
.billing-flow svg{width:20px;height:20px;flex:none}
.billing-flow .billing-flow-close{margin-left:auto;width:34px;height:34px;display:grid;place-items:center;border:1px solid #e1e6e9;border-radius:6px;background:#fff;color:#6b7972;cursor:pointer;flex:none;padding:0}
.billing-flow .billing-flow-body{padding:24px 26px;overflow:auto;min-height:0;overscroll-behavior:contain;font-size:13px;line-height:1.6}
.billing-flow [hidden]{display:none!important}
.billing-flow .billing-flow-body>section{padding:0 0 22px;margin:0 0 20px;border-bottom:1px solid #edf0f2;background:none;border-radius:0;box-shadow:none}
.billing-flow h3{font-size:14px;margin:0 0 14px;font-weight:650;letter-spacing:0}
.billing-flow .billing-flow-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.billing-flow label{display:block;font-size:12px;font-weight:600;min-width:0;color:#4a5c53}
.billing-flow .billing-flow-body>label{margin:0 0 18px}
.billing-flow label>span{color:#b14c3c}
.billing-flow input,.billing-flow select,.billing-flow textarea{display:block;box-sizing:border-box;width:100%;min-width:0;border:1px solid #cfd9d4;border-radius:6px;padding:11px 12px;font:inherit;font-size:14px;font-weight:400;background:#fff;color:#253b30;margin-top:7px;outline:none}
.billing-flow textarea{min-height:94px;resize:vertical;line-height:1.6}
.billing-flow input:focus,.billing-flow select:focus,.billing-flow textarea:focus{border-color:#478b73;box-shadow:0 0 0 3px #16855814}
.billing-flow button:focus-visible{outline:2px solid #358461;outline-offset:3px}
.billing-flow .billing-flow-note{font-size:12px;line-height:1.7;padding:12px 14px;background:#f2f5fa;color:#5d7087;border-left:3px solid #becce1;margin:16px 0 20px}
.billing-flow .billing-flow-review{margin:0 0 20px}
.billing-flow .billing-flow-review>div{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px;padding:12px 0;border-bottom:1px solid #e9edea}
.billing-flow dt{font-size:12px;color:#748078}
.billing-flow dd{margin:0;font-size:14px;overflow-wrap:anywhere;text-align:right}
.billing-flow .billing-flow-balance{padding:4px 0 24px;display:grid;gap:8px}
.billing-flow .billing-flow-balance span{color:#748078;font-size:12px}
.billing-flow .billing-flow-balance strong{font-size:32px;font-weight:600}
.billing-flow footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:16px 26px;border-top:1px solid #e4e9ed;background:#fafcfb;flex:none}
.billing-flow footer button{padding:10px 18px;font:inherit;font-size:13px;min-height:40px;border-radius:6px;cursor:pointer;letter-spacing:0}
.billing-flow footer .primary{background:#15754f;color:#fff;border:1px solid #15754f}
.billing-flow footer .ghost{background:#fff;color:#52635a;border:1px solid #dbe3dd}
.billing-flow footer button:disabled{opacity:.5;cursor:default}
.billing-flow .billing-flow-stage{margin-right:auto;font-size:11px;color:#849089}
.billing-flow .billing-flow-error{color:#9f352a;background:#fff0ee;border-left:3px solid #cc685c;padding:10px 14px;margin:0 26px 16px;font-size:13px;overflow-wrap:anywhere;max-height:90px;overflow:auto}
.billing-flow .billing-flow-success{text-align:center;padding:28px 0}
.billing-flow .billing-flow-success>svg{width:44px;height:44px;color:#268563;margin:0 0 18px}
.billing-flow .billing-flow-success p{color:#738077;font-size:13px}
.billing-flow code{overflow-wrap:anywhere;font-size:12px}
@media(max-width:560px){.billing-flow .billing-flow-fields{grid-template-columns:1fr}.billing-flow header{padding:18px}.billing-flow header h2{font-size:19px}.billing-flow .billing-flow-body{padding:20px 18px}.billing-flow footer{padding:14px 18px;flex-wrap:wrap}.billing-flow .billing-flow-review>div{grid-template-columns:95px minmax(0,1fr);gap:12px}.billing-flow .billing-flow-error{margin:0 18px 14px}.billing-flow .billing-flow-stage{flex-basis:100%}}
/* Saved titles and manual invoice review share the billing modal shell. */
.invoice-workflow .invoice-section-head { display:flex; gap:16px; align-items:center; justify-content:space-between; }
.invoice-workflow .invoice-section-head p { flex:1; }
.invoice-workflow .invoice-title-list article { display:flex; justify-content:space-between; gap:16px; padding:20px 0; border-bottom:1px solid #dce5e1; }
.invoice-workflow .invoice-title-list p { margin:6px 0; color:#62746b; overflow-wrap:anywhere; }
.invoice-workflow .invoice-title-list article>div:last-child { display:flex; align-items:center; gap:8px; }
.invoice-workflow .invoice-default { margin-left:12px; font-size:12px; color:#087350; }
.invoice-workflow .invoice-confirm { display:flex; align-items:flex-start; gap:10px; margin-top:18px; font-size:14px; }
.invoice-workflow .invoice-confirm input { width:18px; height:18px; flex:0 0 18px; margin:2px 0 0; }
.invoice-workflow .invoice-confirm span { color:inherit; }
.invoice-workflow .invoice-status { display:flex; gap:12px; align-items:center; padding:16px; background:#eef8f3; color:#14563e; border-radius:6px; }
.invoice-workflow .invoice-status span { margin-left:auto; white-space:nowrap; }
.invoice-workflow button { display:inline-flex; gap:8px; align-items:center; justify-content:center; }
.invoice-workflow .billing-flow-review dd { overflow-wrap:anywhere; }
.invoice-workflow hr { border:0; border-top:1px solid #dce5e1; margin:24px 0; }
@media(max-width:600px) { .invoice-workflow .invoice-section-head,.invoice-workflow .invoice-title-list article { flex-direction:column; align-items:stretch; } .invoice-workflow .invoice-status { flex-wrap:wrap; } }