/* Late payment calculator; the form and buttons share invoice-template.css, type and colour come from seo.css. */
.lp-result{margin:8px 0 20px;padding:20px;background:var(--ground);border:1px solid var(--line);border-radius:10px}
.lp-empty{margin:0;color:var(--secondary)}
.lp-big{margin:0;font:800 clamp(40px,7vw,56px)/1.05 var(--display);color:var(--violet)}
.lp-sub{margin:8px 0 16px;font-size:17px}
.lp-list{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 0;margin:0;padding-top:16px;border-top:1px solid var(--line)}
.lp-list dt{margin:0;color:var(--secondary)}
.lp-list dd{margin:0;padding-left:16px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.lp-list .lp-total{padding-top:8px;border-top:1px solid var(--line);color:var(--ink);font-weight:800}
.lp-note{margin:14px 0 0;font-size:14px;line-height:1.5;color:var(--secondary)}
@media(max-width:559px){
  .lp-result{padding:16px}
  .lp-list{grid-template-columns:minmax(0,1fr)}
  .lp-list dd{text-align:left;margin-bottom:6px;padding-left:0}
  .lp-list dd.lp-total{border-top:0;padding-top:0}
}