/* Card payments (payments.js): company workspace cards, the Payments page and the homeowner's
   contractor records. Built on the existing pro-tool-card, nx-* and contractor-record styles. */
.hwp-pay-card { border-color:#c9d3bd; }
.hwp-pay-card h3 { margin:0 0 10px; }
.hwp-pay-card h4 { margin:18px 0 8px; font-size:15px; }
.hwp-pay-status { font-size:14px; line-height:1.6; margin:0 0 12px; overflow-wrap:anywhere; }
.hwp-pay-card .nx-button, .hwp-pay-link .nx-button { margin:8px 8px 0 0; min-height:44px; }
.hwp-pay-list { margin:10px 0; padding-left:18px; font-size:13px; line-height:1.6; }
.hwp-pay-list li { margin:4px 0; overflow-wrap:anywhere; }
.hwp-pay-list .nx-button { min-height:36px; margin:2px 0 0 4px; }
.hwp-pay-form { margin:16px 0 0; display:grid; gap:12px; }
.hwp-pay-form fieldset { border:0; margin:0; padding:0; display:grid; gap:6px; min-width:0; }
.hwp-pay-form legend { font-weight:600; font-size:14px; padding:0 0 4px; }
.hwp-pay-form label { min-width:0; }
.hwp-pay-form :is(input:not([type="radio"]),select,textarea) { width:100%; max-width:100%; box-sizing:border-box; }
.hwp-pay-link { margin:12px 0; padding:14px 16px; border:1px solid #d8c6a8; border-radius:12px; background:#fff4df; color:#3f2f12; }
.hwp-pay-link p { margin:0; line-height:1.6; font-size:14px; }
.hwp-pay-link .nx-fine { margin:8px 0 0; }
.hwp-pay-badge { display:inline-block; margin-left:6px; padding:2px 7px; border-radius:999px; background:#a64203; color:#fff; font-size:11px; font-weight:600; line-height:1.5; vertical-align:middle; }
.hwp-pay-table { overflow-x:auto; margin:12px 0; -webkit-overflow-scrolling:touch; }
.hwp-pay-table table { width:100%; border-collapse:collapse; font-size:12px; }
.hwp-pay-table caption { text-align:left; font-weight:600; padding:8px 0; }
.hwp-pay-table th, .hwp-pay-table td { padding:9px 8px; text-align:left; border-bottom:1px solid #e2e4dc; vertical-align:top; overflow-wrap:anywhere; }
.hwp-pay-table td { min-width:64px; }
#contractorHomeownerDialog .hwp-pay-home { border-style:dashed; }
#contractorHomeownerDialog .hwp-pay-link { background:#fff4df; color:#3f2f12; }
#contractorHomeownerDialog .hwp-pay-list { margin:0; }
#contractorHomeownerDialog .hwp-pay-plan .account-link { justify-self:start; }
@media (max-width:420px) {
  .hwp-pay-card .nx-button, .hwp-pay-link .nx-button { display:flex; width:100%; margin:8px 0 0; }
}