/* ============================================================================
   F08  A RE-ISSUED EUROFORM ORDER UPDATES EVERYTHING
   The re-issue boxes in the order drawer and on the job, and the list on
   Purchase Orders. Tokens only (app.css), so both themes work; no inline
   styles (the console's CSP forbids them).
   ============================================================================ */

.f08-wrap{margin:0 0 14px}
.f08-box{margin:0 0 12px}
.f08-box .note{margin:0 0 8px}
.f08-h{display:flex;align-items:center;gap:6px}
.f08-h h4{margin:0}

/* What changed, one change per line, and the total on its own line. */
.f08-changes{margin:4px 0 6px;padding-left:18px;font-size:12.5px;line-height:1.5;color:var(--ink)}
.f08-changes li{margin:0 0 3px}
.f08-total{margin:0 0 8px;font-size:12.5px;font-weight:700;color:var(--ink)}

.f08-btns{margin:8px 0 4px}
/* The console's .frm is display:flex, which would beat the hidden attribute. */
.f08-frm{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin:6px 0 10px}
.f08-frm[hidden]{display:none}
.f08-frm .btnrow{margin-bottom:0}

/* The full new version, and earlier versions, folded away until asked for. */
.f08-more{margin:4px 0 8px;font-size:12.5px}
.f08-more summary{cursor:pointer;color:var(--ink-2);padding:4px 0}
.f08-more .x-note{margin:8px 0 4px}
.f08-tbl{width:100%;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;font-size:12px;
  border-collapse:separate;border-spacing:0;background:var(--panel);margin:4px 0 6px}
.f08-tbl th,.f08-tbl td{padding:6px 9px;text-align:left;vertical-align:top}
.f08-tbl th.num,.f08-tbl td.num{text-align:right;white-space:nowrap;width:70px}
.f08-tbl tbody tr+tr td{border-top:1px solid var(--line)}

/* Purchase Orders: re-issues waiting, and the ones applied lately. */
.f08-sec{margin:22px 0 18px}
.f08-list{display:flex;flex-direction:column;gap:8px}
.f08-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px}
.f08-rt{font-size:13px;color:var(--ink)}
.f08-rr{grid-column:1;font-size:12px;line-height:1.45;color:var(--ink-2)}
.f08-rr.f08-rwarn{color:var(--crit);font-weight:600}
.f08-rt .pill{margin-left:4px;vertical-align:1px}
/* Only the row's own Open the order sits in the right-hand column. */
.f08-row > .btn{grid-column:2;grid-row:1 / span 2}

/* A re-issue waiting: the two choices side by side under the row, each
   button with what it does in one line (Adam, 29 Oct 2026). */
.f08-choices{grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:6px}
.f08-choice{display:flex;flex-direction:column;align-items:flex-start;gap:5px;background:var(--panel-2);
  border:1px solid var(--line);border-radius:var(--r);padding:9px 11px}
.f08-then{font-size:12px;line-height:1.45;color:var(--ink-2)}
.f08-wait > .f08-frm,.f08-wait > .frm-err{grid-column:1 / -1}
.f08-wait > .f08-frm{margin:4px 0 0}

@media (max-width:640px){
  .f08-row{grid-template-columns:1fr}
  .f08-row > .btn{grid-column:1;grid-row:auto;justify-self:start;min-height:44px}
  .f08-choices{grid-template-columns:1fr}
  .f08-choice .btn{min-height:44px}
  .f08-btns .btn{min-height:44px}
  .f08-tbl th.num,.f08-tbl td.num{width:auto}
}