/* Scoped billing layout: never inherit marketing-theme button dimensions. */
.spai-portal .spai-billing { display:grid; gap:28px; min-width:0; font-size:15px; line-height:1.55; }
.spai-portal .spai-billing :is(h2,h3,p) { margin:0; }
.spai-portal .spai-billing h2 { font-size:22px; letter-spacing:-.025em; }
.spai-portal .spai-billing h3 { font-size:17px; }
.spai-portal .spai-billing button { text-transform:none!important; letter-spacing:normal!important; white-space:normal; height:auto; line-height:1.4; }
.spai-portal .spai-billing .spai-button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:12px 18px; border-radius:10px; font-size:14px; }
.spai-portal .spai-billing .spai-button--outline { background:#fff!important; color:#30343a!important; border:1px solid #dfe2e6!important; }
.spai-billing-notice { display:flex; gap:14px; align-items:flex-start; padding:18px 22px; background:#fff6ee; border:1px solid #f2ddcb; border-radius:14px; color:#7b431e; }
.spai-portal .spai-billing-notice p { color:#7b563d; font-size:14px; margin-top:3px; }
.spai-billing-tag { display:inline-flex; flex-shrink:0; align-self:flex-start; border:1px solid #e5e5e7; background:#fff; border-radius:30px; padding:5px 11px; font-size:12px; font-weight:650; color:#52565d; }
.spai-billing-overview { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:16px; }
.spai-billing-balance,.spai-billing-stat { border:1px solid #e3e5e8; border-radius:18px; padding:26px; min-width:0; background:#fff; display:flex; flex-direction:column; gap:10px; }
.spai-portal .spai-billing-balance { background:#182d32; border-color:#182d32; color:#fff; }
.spai-portal .spai-billing-balance p { color:#fff; }
.spai-billing-balance strong { font-size:38px; line-height:1.2; letter-spacing:-.035em; font-variant-numeric:tabular-nums; }
.spai-billing-balance small { color:#c2d4d5; font-size:12px; }
.spai-billing-stat>span { color:#687078; font-size:14px; }
.spai-billing-stat>strong { font-size:25px; color:#20272d; font-variant-numeric:tabular-nums; }
.spai-billing-stat strong small { font-size:14px; font-weight:400; }
.spai-portal .spai-billing-stat p { font-size:13px; }
.spai-billing-section { background:#fff; border:1px solid #e3e5e8; border-radius:18px; padding:28px; min-width:0; }
.spai-billing-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px; margin-bottom:24px; }
.spai-portal .spai-billing-heading p { margin-top:6px; font-size:14px; }
.spai-billing-packs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.spai-billing-pack { display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding:22px 18px; border:1px solid #e3e5e8; border-radius:14px; gap:10px; background:#fcfcfd; }
.spai-billing-pack-credits { font-size:25px; letter-spacing:-.03em; color:#19282d; }
.spai-portal .spai-billing-pack-price { font-size:18px; color:#30343a; }
.spai-portal .spai-billing-pack-images { font-size:13px; margin:4px 0 12px; }
.spai-billing-pack .spai-button { width:100%; margin-top:auto; }
.spai-portal .spai-billing-caption { font-size:12px; margin-top:18px; }
.spai-portal .spai-billing-status { margin-top:16px; font-size:13px; color:#3e5960; }
.spai-billing-orders { display:grid; gap:0; }
.spai-billing-order { display:flex; align-items:center; gap:24px; flex-wrap:wrap; border-top:1px solid #edf0f2; padding:20px 0; }
.spai-billing-order:last-child { padding-bottom:0; }
.spai-billing-order-info { display:flex; align-items:flex-start; flex-direction:column; gap:5px; flex:1; min-width:180px; }
.spai-billing-order-info>span:not(.spai-billing-badge),.spai-billing-order-amount>span { font-size:13px; color:#687078; }
.spai-billing-order-amount { display:flex; flex-direction:column; gap:4px; }
.spai-billing-badge { display:inline-block; border-radius:20px; padding:3px 10px; font-size:12px; background:#f1f2f4; color:#555d66; }
.spai-billing-badge.is-paid { background:#eaf6ef; color:#20623e; }
.spai-billing-table-wrap { max-width:100%; overflow-x:auto; }
.spai-portal table.spai-billing-table { width:100%; border:0; border-collapse:collapse; font-size:14px; margin:0; }
.spai-portal .spai-billing-table :is(th,td) { text-align:left; border:0; border-bottom:1px solid #edf0f2; padding:16px 12px; background:#fff; vertical-align:top; }
.spai-portal .spai-billing-table th { background:#f7f8fa; color:#59606b; font-size:12px; font-weight:600; }
.spai-billing-table td:first-child { white-space:nowrap; font-size:13px; }
.spai-billing-table td:nth-child(n+3) { white-space:nowrap; font-variant-numeric:tabular-nums; }
.spai-billing-table small { display:block; min-width:190px; color:#687078; margin-top:4px; font-size:12px; }
.spai-billing-positive { color:#267148; }
.spai-billing-test { border:1px dashed #d5dae0; border-radius:14px; padding:18px 22px; }
.spai-billing-test summary { cursor:pointer; font-weight:600; color:#59606b; }
.spai-portal .spai-billing-test p { margin:14px 0; font-size:14px; }
.spai-billing-test-actions { display:flex; align-items:flex-end; flex-wrap:wrap; gap:12px; }
.spai-billing-test label { display:grid; gap:6px; font-size:13px; }
.spai-billing-test input { width:120px; padding:10px; border:1px solid #dfe2e6; border-radius:8px; }
.spai-billing-empty { padding:20px 0; }
@media(max-width:1250px) { .spai-billing-packs{grid-template-columns:repeat(2,minmax(0,1fr))} .spai-billing-overview{grid-template-columns:1fr 1fr} .spai-billing-balance{grid-column:1/-1} }
@media(max-width:620px) { .spai-portal .spai-billing{gap:18px} .spai-billing-overview,.spai-billing-packs{grid-template-columns:1fr} .spai-billing-section{padding:20px 16px} .spai-billing-notice{flex-direction:column;padding:16px} .spai-billing-balance,.spai-billing-stat{padding:20px} .spai-billing-order{gap:16px} .spai-billing-heading{gap:12px} .spai-billing-tag{white-space:normal} }
/* The shared UI adapter also styles small text and paragraphs with higher priority. */
.spai-ui[data-spai-ui] .spai-billing .spai-billing-balance small { color:#c2d4d5!important; }
.spai-ui[data-spai-ui] .spai-billing .spai-billing-caption { margin-top:18px!important; }
.spai-ui[data-spai-ui] .spai-billing .spai-billing-status { margin-top:12px!important; }
