/* ICX HR Patch 18 R4 — Service Owner billing UI. */
.p18r4-billing-launch{border-color:#bfd3ee!important;color:#0c4f9e!important;background:#f7fbff!important}
.modal-card.p18r4-billing-modal{width:min(1180px,96vw)!important;max-width:1180px!important}
.p18r4-billing-shell{display:grid;gap:16px}.p18r4-billing-summary{display:grid;grid-template-columns:1fr 1fr;gap:16px}.p18r4-billing-card,.p18r4-history-card{border:1px solid #dce6f2;background:#fff;border-radius:15px;padding:18px;box-shadow:0 5px 20px rgba(25,56,94,.05)}
.p18r4-card-head,.p18r4-history-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}.p18r4-card-head span:first-child,.p18r4-history-head span{display:block;font-size:10px;font-weight:800;letter-spacing:.11em;color:#6f86a3;margin-bottom:4px}.p18r4-card-head h3,.p18r4-history-head h3{margin:0;font-size:18px;color:#112c50}.p18r4-facts{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #edf2f7;border-left:1px solid #edf2f7}.p18r4-facts>div{padding:12px;border-right:1px solid #edf2f7;border-bottom:1px solid #edf2f7;min-height:74px}.p18r4-facts span,.p18r4-stripe-list span{display:block;color:#71849e;font-size:11px}.p18r4-facts strong{display:block;color:#122e53;font-size:14px;margin-top:5px}.p18r4-facts small{display:block;color:#8a99ac;font-size:10px;margin-top:3px}
.p18r4-stripe-list{display:grid;gap:0;border:1px solid #e4ebf4;border-radius:10px;overflow:hidden;margin-bottom:14px}.p18r4-stripe-list>div{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-bottom:1px solid #edf2f7;align-items:center}.p18r4-stripe-list>div:last-child{border-bottom:0}.p18r4-stripe-list code{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#f4f7fb;padding:4px 7px;border-radius:6px;font-size:10px}.p18r4-stripe-list strong{font-size:12px;color:#18385f}
.p18r4-action-row,.p18r4-inline-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:14px}.p18r4-warn{background:#fff9ec!important;border-color:#f1ce82!important;color:#8d5b00!important}.p18r4-note{margin-top:13px;border:1px solid #cfe0f7;background:#f4f9ff;color:#46617e;border-radius:10px;padding:11px 12px;font-size:11px;line-height:1.55}.p18r4-note strong{color:#153d70}.p18r4-action-grid{display:grid;grid-template-columns:1fr;gap:9px;margin-top:12px}.p18r4-action-card{border:1px solid #dbe7f5;border-radius:10px;background:#fbfdff;text-align:left;padding:12px 13px;cursor:pointer;color:#18385f}.p18r4-action-card:hover{border-color:#9fc2ee;background:#f4f9ff}.p18r4-action-card strong{display:block;font-size:12px}.p18r4-action-card span{display:block;font-size:10px;color:#71849e;margin-top:4px;line-height:1.45}
.p18r4-history-card{padding-top:15px}.p18r4-payment-list{border:1px solid #e6edf5;border-radius:10px;overflow:hidden}.p18r4-payment-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:11px 13px;border-bottom:1px solid #edf2f7}.p18r4-payment-row:last-child{border-bottom:0}.p18r4-payment-row>div:last-child{text-align:right}.p18r4-payment-row strong{display:block;color:#17365b;font-size:12px}.p18r4-payment-row span{display:block;color:#7b8da5;font-size:10px;margin-top:3px;text-transform:capitalize}
.p18r4-form .formgrid{margin-top:14px}.p18r4-link-result{text-align:center;padding:10px 2px}.p18r4-link-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#eaf8ef;color:#16834a;font-weight:900;font-size:23px;margin:0 auto 12px}.p18r4-link-result h3{margin:0 0 6px;color:#14345a}.p18r4-link-result p{margin:0 auto 15px;max-width:620px;color:#677d98;font-size:12px;line-height:1.55}.p18r4-link-result .input{text-align:left}.p18r4-link-result .modal-actions{justify-content:center;margin-top:13px}
@media(max-width:860px){.p18r4-billing-summary{grid-template-columns:1fr}.modal-card.p18r4-billing-modal{width:100%!important;max-width:none!important}.p18r4-payment-row{align-items:flex-start}}
@media(max-width:560px){.p18r4-facts{grid-template-columns:1fr}.p18r4-payment-row{flex-direction:column;gap:7px}.p18r4-payment-row>div:last-child{text-align:left}.p18r4-action-row>.btn{width:100%}.p18r4-history-head{flex-direction:column}.p18r4-history-head>.btn{width:100%}}