/* Betalingsrunde (feat_rounds): what can be paid to the suppliers up to a day, and who gets what. */
.rd-filters .seg button[disabled]{ opacity:.6; cursor:default }
.rd-pot button[aria-pressed="true"]::before{ content:"✓"; font-weight:700; margin-right:-2px }
.rd-bad{ font-size:12.5px }
.rd-unsaved{ font-size:12.5px; font-style:italic }
.rd-printhead{ display:none }
.rd-printonly{ display:none }
.rd-msgs{ display:grid; gap:8px; margin:0 0 12px }
.rd-msgs:empty{ display:none }
.rd-msgs .linkbtn, .rd-savemsg .linkbtn{ margin-left:6px }
.rd-head{ display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; margin:0 0 12px; font-size:13.5px }
.rd-latest{ margin:0 0 12px; font-size:13px; color:var(--ink-2) }
.rd-roundtext{ margin:0 0 12px; font-size:13.5px; line-height:1.5; white-space:pre-wrap; max-width:78ch }

/* the figures the round is made against: always in view while the amounts are typed */
.rd-summary{ position:sticky; top:0; z-index:5; display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:4px 12px;
  background:var(--raised); border:1px solid var(--hair); border-radius:var(--r); padding:12px 16px; margin:0 0 16px;
  box-shadow:0 1px 2px rgba(var(--sh), .08) }
.rd-summary > div{ display:flex; flex-direction:column; gap:2px; min-width:0 }
.rd-summary b{ font-size:19px; font-variant-numeric:tabular-nums; letter-spacing:-.01em; transition:opacity .15s }
.rd-summary .faint{ font-size:12px; color:var(--ink-2) }
.rd-summary.rd-pending b{ opacity:.5 }
.rd-s5{ grid-column:1 / -1; margin:6px 0 0; font-size:12px; line-height:1.45 }
.rd-summary .rd-short{ display:none }
.rd-summary .rd-long{ line-height:1.4 }
.rd-past{ margin:16px 0 }
.rd-top{ margin-bottom:16px; align-items:start }

/* the arithmetic */
table.rd-wf{ width:100%; border-collapse:collapse; font-size:13.5px }
table.rd-wf td{ padding:7px 0; border-bottom:1px solid var(--hair); vertical-align:top }
table.rd-wf td:nth-child(2){ text-align:right; white-space:nowrap; padding-left:12px; font-variant-numeric:tabular-nums }
table.rd-wf td:nth-child(3){ width:26px; text-align:right }
table.rd-wf td .faint{ font-size:12px; margin-top:2px; color:var(--ink-2) }
table.rd-wf td .seg{ margin-top:6px }
table.rd-wf tr.rd-sub td{ font-weight:600; color:var(--ink-2) }
table.rd-wf tr.rd-total td{ font-weight:700; font-size:15px; border-bottom:0; border-top:2px solid var(--hair-2); padding-top:10px }
table.rd-wf tr.rd-off td:first-child{ color:var(--ink-3) }
table.rd-wf tr.rd-off td:nth-child(2){ color:var(--ink-3); text-decoration:line-through }
table.rd-wf .numinput{ display:inline-flex; justify-content:flex-end }
table.rd-wf .numinput .input{ text-align:right }
.rd-check{ display:inline-flex; gap:8px; align-items:flex-start; cursor:pointer }
.rd-check input{ margin-top:2px; width:18px; height:18px; flex:none }
.rd-amt{ font-variant-numeric:tabular-nums; text-decoration-style:dotted; min-height:32px }
.rd-edit{ display:inline-flex; gap:4px; align-items:center }
.rd-otherrow{ gap:6px; flex-wrap:wrap; align-items:center }
.rd-other select.input{ padding:5px 6px }
.rd-other .input{ padding:5px 8px }
.rd-addrow{ display:flex; gap:16px; flex-wrap:wrap }
.rd-addrow .linkbtn{ min-height:32px }
.rd-small{ font-size:12px; margin-top:3px; white-space:normal }
.rd-note{ margin:10px 0 0; font-size:12.5px; line-height:1.45 }
.rd-after, .rd-done{ margin:12px 0 0; padding:10px 12px; border-radius:var(--r-s); font-size:13px }
.rd-after{ background:var(--warn-wash) }
.rd-done{ background:var(--sunk) }
.rd-after ul, .rd-done ul{ margin:6px 0 0; padding-left:18px }
.rd-after li, .rd-done li{ margin:2px 0 }
.rd-path{ max-height:520px }
table.t tr.rd-low td{ background:var(--warn-wash) }
table.t tr.rd-low td:first-child{ background:linear-gradient(var(--warn-wash), var(--warn-wash)), var(--surface) }

/* the creditors */
.rd-tools{ gap:8px; flex-wrap:wrap; justify-content:flex-end }
.rd-search{ width:220px; padding:5px 9px }
.rd-legend{ display:flex; flex-wrap:wrap; gap:4px 16px; padding:0 16px 10px; font-size:12px; color:var(--ink-2) }
.rd-legend b{ color:var(--ink); font-weight:600 }
.rd-actions{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:0 16px 10px }
.rd-payday{ display:inline-flex; gap:6px; align-items:center; font-size:12.5px; color:var(--ink-2); margin-right:4px }
.rd-payday .input{ padding:4px 6px; font-size:12.5px }
.rd-toolmsg{ padding:0 16px 10px; font-size:12.5px; color:var(--ink-2) }
.rd-toolmsg:empty{ display:none }
.rd-hint{ margin:0 16px 10px; padding:8px 12px; border-radius:var(--r-s); background:var(--wash); font-size:12.5px; line-height:1.45 }
.rd-orphans{ margin:0 16px 12px; padding:10px 12px; border-radius:var(--r-s); background:var(--warn-wash); font-size:13px; line-height:1.45 }
.rd-orphans ul{ margin:6px 0 0; padding-left:18px }
.rd-orphans li{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:2px 0 }
.rd-creditors{ container-type:inline-size }
.rd-twrap{ max-height:calc(100vh - 150px) }
table.t.rd-t tfoot td{ position:sticky; bottom:0; z-index:2; background:var(--sunk); border-top:1px solid var(--hair-2) }
table.t.rd-t tfoot td:first-child{ z-index:3 }
table.t.rd-t td{ vertical-align:top }
table.t.rd-t td:first-child{ white-space:normal; min-width:208px; max-width:330px; text-align:left }
table.t.rd-t .rd-name{ font-weight:600; line-height:1.3 }
table.t.rd-t .rd-facts{ margin-top:2px; line-height:1.35 }
table.t.rd-t .rd-fold{ display:none; margin-top:2px; line-height:1.35 }
table.t.rd-t .rd-tags{ display:flex; gap:6px; flex-wrap:wrap; margin-top:4px }
table.t.rd-t td .faint{ font-size:11.5px; color:var(--ink-2) }
table.t.rd-t th.rd-hl, table.t.rd-t td.rd-hl{ background:var(--wash) }
table.t.rd-t tr.rd-on td{ background:var(--wash) }
table.t.rd-t tr.rd-on td:first-child{ background:linear-gradient(var(--wash), var(--wash)), var(--surface) }
table.t.rd-t tr.rd-on td.rd-hl{ background:var(--wash-2) }
table.t.rd-t input, table.t.rd-t select, table.t.rd-t button{ scroll-margin-top:140px }
.pill.rd-dashed{ background:transparent; border:1px dashed currentColor; color:var(--ink-2) }
.rd-sort{ border:0; background:none; padding:0; font:inherit; color:inherit; cursor:pointer; text-decoration:underline dotted; text-underline-offset:3px }
.rd-sort.on{ color:var(--accent); text-decoration:underline }
th .rd-sort + div, th div .rd-sort{ font-weight:500; font-size:11px }
.rd-level{ padding:4px 6px; font-size:12.5px; width:140px; min-height:32px }
.rd-level.crit{ color:var(--neg); border-color:var(--neg-wash); background:var(--neg-wash) }
.rd-level.warn{ color:var(--warn); border-color:var(--warn-wash); background:var(--warn-wash) }
.rd-level.acc{ color:var(--accent); border-color:var(--wash-2); background:var(--wash) }
.rd-level.faintpill{ color:var(--ink-2) }
table.t.rd-t .numinput .input{ text-align:right; padding:5px 8px }
table.t.rd-t td input[type="date"].input{ padding:4px 6px; font-size:12.5px; min-height:32px }
.rd-quick{ display:flex; flex-wrap:wrap; gap:0 10px; justify-content:flex-end; font-size:11.5px; max-width:150px; margin-left:auto }
.rd-quick .linkbtn{ min-height:32px; display:inline-flex; align-items:center }
.rd-warnline{ color:var(--warn); font-size:11.5px; line-height:1.4; margin:4px 0 0; white-space:normal; max-width:240px; text-align:left }
/* a line's warnings: kept in the saved round and printed with it */
.rd-flags{ display:grid; gap:3px; margin:6px 0 0; font-size:11.5px; line-height:1.4; white-space:normal; max-width:260px; text-align:left; color:var(--ink-2) }
.rd-flags .pill{ font-size:10.5px; padding:0 6px }
.rd-flags .rd-addnote{ justify-self:start; margin:0 }
td.rd-wrap .rd-flags{ max-width:none }
.rd-bankpaid{ margin-top:4px; font-size:11.5px; line-height:1.35; color:var(--warn); font-weight:600 }
p.rd-warnline{ max-width:none; font-size:12.5px }
.rd-notein{ display:block; width:100%; box-sizing:border-box; margin-top:6px; padding:4px 8px; font-size:12px }
.rd-addnote{ font-size:12px; min-height:28px; margin-top:2px }
.rd-printnote{ display:none }
table.t.rd-t .rd-date{ width:126px }
.rd-count{ padding:0 16px 8px; font-size:12.5px; color:var(--ink-2) }
.rd-count .linkbtn{ font-size:12.5px }
/* invoices the books do not have yet: the form, each one under its firm, the notice when the books have them */
.rd-ubform{ display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:10px 12px; align-items:end; margin:0 16px 12px;
  padding:12px; border:1px solid var(--hair); border-radius:var(--r-s); background:var(--wash) }
.rd-ubform label{ display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--ink-2); min-width:0 }
.rd-ubform .input{ width:100%; box-sizing:border-box }
.rd-ubform .numinput{ display:block }
.rd-ubform .rd-ubname, .rd-ubform .rd-ubnote{ grid-column:span 2 }
.rd-ubintro{ grid-column:1 / -1; margin:0; font-size:12.5px; line-height:1.45; color:var(--ink-2) }
.rd-ubbtns{ display:flex; gap:8px; align-items:center; flex-wrap:wrap }
.rd-uberr{ grid-column:1 / -1 }
.rd-ubseen{ margin:0 16px 10px; padding:8px 12px; border-radius:var(--r-s); background:var(--wash); font-size:12.5px; line-height:1.45 }
.rd-unbooked{ display:grid; gap:4px; margin-top:6px; font-size:12px; line-height:1.4; white-space:normal; text-align:left }
.rd-unbooked .pill{ font-size:10.5px; padding:0 6px; line-height:1.5; vertical-align:1px }
.rd-unbooked .linkbtn{ font-size:12px }
.rd-ubacts{ display:flex; gap:4px 12px; align-items:center; flex-wrap:wrap }
.rd-ubask{ grid-column:1 / -1; display:flex; gap:8px 12px; align-items:center; flex-wrap:wrap; padding:8px 10px; border-radius:var(--r-s);
  background:var(--warn-wash); color:var(--ink); font-size:12.5px; line-height:1.45 }
.rd-ubmaybe{ max-width:none }

/* saving, history */
.rd-save{ margin:16px 0 }
.rd-savemsg{ margin:0 0 10px }
.rd-savemsg:empty{ display:none }
.rd-roundnote{ width:100%; resize:vertical; font:inherit; font-size:13.5px; padding:8px 10px; box-sizing:border-box }
.rd-buttons{ gap:10px; margin-top:10px; flex-wrap:wrap; align-items:center }
.rd-endbuttons{ margin:16px 0 }
table.t.rd-hist td:first-child{ white-space:normal; max-width:280px }
.rd-histnote{ font-size:11.5px; line-height:1.3 }
table.t.rd-t td.rd-wrap{ white-space:normal; text-align:left; min-width:160px }

/* a narrower card folds the debt in all and the last payment under the name, so the amount and day stay in view */
@container (max-width: 1280px){
  table.t.rd-t .rd-c-owed, table.t.rd-t .rd-c-paid{ display:none }
  table.t.rd-t .rd-fold{ display:block }
}
@media (max-width: 1100px){
  .rd-top{ grid-template-columns:minmax(0, 1fr) }
}
@media (max-width: 980px){
  .rd-summary{ top:49px; grid-template-columns:repeat(2, minmax(0, 1fr)) }
}
/* a card narrower than the table: one card per creditor, so the amount and the day are never scrolled out of view */
@media screen{
  @container (max-width: 900px){
    /* every creditor as a card is a long list: it scrolls in its own box, so saving is never 300 screens away */
    .rd-twrap{ max-height:75vh; overflow:auto }
    table.t.rd-t thead, table.t.rd-t tfoot{ display:none }
    table.t.rd-t, table.t.rd-t tbody{ display:block }
    table.t.rd-t tr{ display:grid; grid-template-columns:repeat(auto-fill, minmax(132px, 1fr)); gap:8px 12px; padding:12px 16px;
      border-bottom:1px solid var(--hair) }
    table.t.rd-t td{ display:block; border:0; padding:0; text-align:left; white-space:normal; position:static; min-width:0 }
    table.t.rd-t td:first-child{ grid-column:1 / -1; position:static; min-width:0; max-width:none; background:transparent }
    table.t.rd-t tr.rd-on td, table.t.rd-t tr.rd-on td:first-child, table.t.rd-t td.rd-hl, table.t.rd-t tr.rd-on td.rd-hl{ background:transparent }
    table.t.rd-t tr.rd-on{ background:var(--wash) }
    table.t.rd-t td[data-label]:not(:first-child)::before{ content:attr(data-label); display:block; font-size:11px; color:var(--ink-3); font-weight:600; margin-bottom:2px }
    table.t.rd-t .numinput .input{ text-align:left }
    .rd-quick{ justify-content:flex-start; flex-wrap:wrap }
    .rd-level, table.t.rd-t td input[type="date"].input{ width:100% }
  }
}
@media (max-width: 560px){
  .rd-path table.t th, .rd-path table.t td{ padding:6px }
  .rd-quick .linkbtn, .rd-addnote, .rd-addrow .linkbtn, .rd-amt{ min-height:44px }
  .rd-level, table.t.rd-t td input[type="date"].input{ min-height:44px }
  .rd-search{ width:100% }
  table.rd-wf .numinput{ width:120px !important }
  .rd-ubform .rd-ubname, .rd-ubform .rd-ubnote{ grid-column:auto }
  .rd-ubform .input, .rd-ubbtns .btn, .rd-ubask .btn, .rd-actions .btn, .rd-ubacts .linkbtn, .rd-count .linkbtn{ min-height:44px }
  .rd-ubacts .linkbtn, .rd-count .linkbtn{ padding:0 8px }
}
@media (max-width: 520px){
  /* all four figures in two rows, each with its one short line; the pot's sub line is left for the wider page */
  .rd-summary{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px 10px; padding:8px 12px; border-radius:var(--r-s) }
  .rd-summary .rd-s5, .rd-summary .rd-long{ display:none }
  .rd-summary .rd-short{ display:inline }
  .rd-summary b{ font-size:16px }
  .rd-summary .faint{ font-size:11px; line-height:1.3 }
  .rd-summary .rd-s2 span:last-child{ display:none }
}
@media print{
  .rd-printhead{ display:block; font-weight:700; font-size:14px; margin:0 0 10px }
  .rd-printonly, .rd-printnote{ display:block }
  .rd-noprint{ display:none !important }
  .rd-filters, .rd-tools, .rd-actions, .rd-toolmsg, .rd-hint, .rd-quick, .rd-buttons, .rd-histcard, .rd-savemsg, .rd-latest,
  .rd-count, .rd-ubform, .rd-ubseen, .rd-unbooked .linkbtn,
  .rd-legend, .rd-addnote, .rd-addrow, .rd-msgs .linkbtn, .rd-roundnote, .rd-notein, .rd-warnline, .rd-summary .rd-short,
  table.t.rd-t select, table.t.rd-t input, table.t.rd-t .numinput, .rd-wfcard header .tools,
  table.rd-wf input, table.rd-wf select, table.rd-wf .numinput, table.rd-wf .seg{ display:none !important }
  table.t thead th, table.t tfoot td, table.t th:first-child, table.t td:first-child{ position:static !important }
  .rd-amt{ text-decoration:none; color:inherit }
  .rd-summary{ position:static; box-shadow:none }
  table.t.rd-t tbody tr:not(.rd-on){ display:none }
  .rd-twrap, .rd-path{ max-height:none !important; overflow:visible !important }
  .rd-sort{ text-decoration:none }
}