/* The Documents workspace: a document's filed copy, its version history, and
   the deliberate act of designating one version executed. Separate from
   components.css so the card hierarchy can be reasoned about on its own. */

/* ---------- what the transaction still owes ---------- */

.docsummary{background:var(--white);border:1px solid var(--border);
  border-left:3px solid var(--amber);border-radius:var(--radius-lg);padding:16px 16px 14px;
  margin-bottom:12px}
.docsummary.is-ready{border-left-color:var(--good)}
/* work still to do and a list that could not be read are different problems,
   and only one of them is the agent's to solve */
.docsummary.has-error{border-left-color:var(--warn)}
.docsummary__head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  flex-wrap:wrap}
.docsummary__head h3{font-family:var(--serif);font-weight:500;font-size:21px;margin:0;
  letter-spacing:-.01em}
.docsummary__counts{display:flex;gap:8px;flex-wrap:wrap;margin:0}
.docsummary__counts span{font-size:11.5px;font-weight:500;color:var(--mid);
  background:var(--cream);border:1px solid var(--border);border-radius:999px;padding:3px 10px}
.docsummary__block{margin-top:12px}
.docsummary__grouptitle{font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:var(--stone);margin:0 0 4px}
.docsummary .hint{margin:0 0 8px}
.docsummary .owed{margin:0}

/* ---------- the handoff to Signing ---------- */

.docsigning{display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;background:var(--cream);border:1px solid var(--border);
  border-radius:var(--radius);padding:10px 14px;margin-bottom:18px}
.docsigning__label{font-size:13px;font-weight:500;color:var(--mid)}

/* ---------- one document ---------- */

.doccard{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:15px 16px 13px;margin-bottom:10px}
.doccard[data-origin="upload"]{background:var(--cream)}
/* N/A is a decision the agent made, not a deleted row: it stays fully legible */
.doccard--na{background:var(--cream)}
.doccard[data-doc-highlight]{border-color:var(--amber);
  box-shadow:0 0 0 3px rgba(239,159,39,.18)}

.doccard__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  flex-wrap:wrap}
.doccard__title{min-width:0}
.doccard__name{font-family:var(--sans);font-size:15px;font-weight:500;margin:0;
  overflow-wrap:anywhere}
.doccard__origin{font-size:11.5px;color:var(--stone);margin:2px 0 0}
.doccard__tags{display:flex;gap:6px;flex-wrap:wrap}

/* the filed copy owns its own full-width row: a long filename must never be
   squeezed beside a decision as consequential as designating an executed copy */
.doccard__current{margin-top:11px;padding:11px 12px;background:var(--cream);
  border:1px solid var(--border);border-radius:var(--radius)}
.doccard--na .doccard__current,.doccard[data-origin="upload"] .doccard__current{
  background:var(--white)}
.doccard__file{display:block;text-decoration:none;color:inherit}
.doccard__file:hover .doccard__filename{text-decoration:underline}
.doccard__filename{display:block;font-size:14px;font-weight:500;overflow-wrap:anywhere}
.doccard__filemeta{display:block;font-size:11.5px;color:var(--stone);margin-top:2px}
.doccard__states{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.doccard__record{display:inline-block;margin-top:8px;font-size:11.5px;font-weight:600;
  color:var(--stone)}
.doccard__record:hover{color:var(--charcoal)}
.doccard__empty{font-size:12.5px;color:var(--stone);margin:10px 0 0;line-height:1.5}
.doccard__note{font-size:12px;color:var(--stone);margin:9px 0 0;line-height:1.5}
.doccard__alert{font-size:12.5px;color:var(--warn);margin:10px 0 0;line-height:1.5}

.doccard__primary{margin-top:11px}

/* ---------- history and the blank form ---------- */

.doccard__history,.doccard__more{margin-top:10px;border-top:1px solid var(--border);
  padding-top:8px}
.doccard__history>summary,.doccard__more>summary{cursor:pointer;list-style:none;
  font-size:12px;font-weight:600;color:var(--stone);min-height:32px;display:flex;
  align-items:center;gap:6px}
.doccard__history>summary::-webkit-details-marker,
.doccard__more>summary::-webkit-details-marker{display:none}
.doccard__history>summary::after,.doccard__more>summary::after{content:'+';font-size:17px;
  line-height:1}
.doccard__history[open]>summary::after,.doccard__more[open]>summary::after{content:'−'}
.doccard__history>summary:hover,.doccard__more>summary:hover{color:var(--charcoal)}

.doccard__versions{padding-top:4px}
.doccard__version{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  padding:9px 0;border-top:1px solid var(--border)}
.doccard__version:first-child{border-top:0}
.doccard__vbody{min-width:0;flex:1}
.doccard__vname{display:block;font-size:13px;font-weight:500;overflow-wrap:anywhere}
.doccard__vmeta{display:block;font-size:11.5px;color:var(--stone);margin-top:2px}
/* a reused copy must never read as a fresh upload from a phone */
.doccard__vsource{display:block;font-size:11.5px;line-height:1.4;color:var(--mid);margin-top:3px}
.doccard__current .doccard__vsource{margin:6px 0 0}
.doccard__vstates{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.doccard__vactions{display:flex;gap:6px;flex-wrap:wrap;flex:none}
.doccard__version--blank .doccard__vname{color:var(--mid);font-weight:400}

.doccard__moreitems{display:flex;gap:8px;flex-wrap:wrap;padding-top:6px}
.doccard__moreitems .btn.subtle{color:var(--stone);border-color:var(--border)}

/* ---------- reusing a copy already on the file ---------- */

.docreuse__group{margin-top:14px}
/* the band that opens the blank-forms list is a control like any other, and
   it rendered at 24px against the 44px bar on the phone this is used from */
.docreuse__group>summary{min-height:var(--tap);display:flex;align-items:center;cursor:pointer;
  font-size:13px;font-weight:600;color:var(--charcoal)}
.docreuse__group h5{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--stone);margin:0 0 3px}
.docreuse__list{display:grid;gap:7px}
.docreuse__row{display:block;width:100%;text-align:left;min-height:44px;padding:10px 11px;
  background:var(--white);border:1px solid var(--border);border-radius:8px;cursor:pointer;
  font:inherit;color:inherit}
.docreuse__row:hover{border-color:var(--amber)}
.docreuse__row:focus-visible{outline:2px solid var(--amber-dark);outline-offset:2px}
.docreuse__copy{display:grid;gap:2px;min-width:0}
.docreuse__title{font-size:13.5px;font-weight:600;color:var(--charcoal);overflow-wrap:anywhere}
.docreuse__where{font-size:11.5px;line-height:1.35;color:var(--stone);overflow-wrap:anywhere}
.docreuse__note{font-size:11.5px;line-height:1.4;color:var(--mid);margin-top:2px}
.docreuse__states{display:flex;gap:6px;flex-wrap:wrap;margin-top:5px}

/* ---------- adding and filing ---------- */

.docadd__row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}
.docadd__row:first-of-type{margin-top:0}
.docadd__row .hint{margin:0;flex:1;min-width:220px}
.docadd__row .addline{flex:1;min-width:260px}

/* every filing control says what it is: an unlabelled box asking for "9-12"
   beside two unlabelled dropdowns is where paper gets filed under the wrong
   document */
.splitcol{display:grid;gap:3px;flex:1;min-width:0}
.splitcol-pages{width:110px;flex:none}
.splitcol select,.splitcol input{width:100%}
.splitlabel{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  color:var(--stone)}

@media (max-width:640px){
  .doccard__version{flex-direction:column;gap:8px}
  .doccard__vactions{width:100%}
  .doccard__primary .btn{width:100%}
  .docsigning{align-items:stretch}
  .splitrow{flex-direction:column}
  .splitcol-pages{width:100%}
}

/* ---------- choosing what is on the file ---------- */

.docpick{min-height:var(--tap);border-bottom:1px solid var(--border);padding:11px 2px}
.docpick:last-of-type{border-bottom:0}
.docpick.is-locked{cursor:default}
.docpick.is-locked input{opacity:.55}
.docpick.is-busy{opacity:.6;pointer-events:none}
.docpick .clabel{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.docpick__fail{display:block;font-size:12px;line-height:1.4;color:var(--warn);
  margin:2px 0 8px 27px}
.docpick__band{margin-top:10px}
.docpick__bandtitle{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--stone);margin:0 0 2px}
/* The way in, on the tab he already looks at. Asked where the documents step
   was, Anthony said he had no idea, so this control is sized and worded to be
   found rather than tucked into a bare disclosure triangle. */
.docpicker{margin:12px 0;border:1px solid var(--border);border-radius:10px;
  background:var(--white)}
.docpicker[open]{border-color:var(--amber)}
.docpicker__summary{min-height:var(--tap);display:flex;align-items:center;gap:8px;
  padding:0 14px;cursor:pointer;font-size:14px;font-weight:600;color:var(--charcoal)}
.docpicker>[data-document-picker]{border:0;margin:0}
.docpick__fold{margin-top:12px}
.docpick__fold>summary{min-height:var(--tap);display:flex;align-items:center;cursor:pointer;
  font-size:13px;font-weight:600;color:var(--charcoal)}

/* The three bands, and the two lists inside the first of them. One list he
   fills in and one he goes and gets read as different work, so they are
   headed as different work rather than run together as one checklist. */
.docpick__sub{margin-top:12px}
.docpick__sub:first-child{margin-top:2px}
.docpick__subtitle{font-size:12px;font-weight:700;color:var(--charcoal);margin:0 0 2px}
/* Twenty-one blanks is more than anyone scrolls. The field is a control like
   any other, so it takes the same 48px a form field takes. */
.docpick__search{width:100%;min-height:var(--field);border:1px solid var(--border);
  border-radius:8px;padding:0 12px;font:inherit;font-size:15px;color:var(--charcoal);
  background:var(--white);margin-bottom:8px}
.docpick__search:focus{outline:2px solid var(--amber);outline-offset:1px}
.docpick__nohits{margin:6px 0 2px}

/* THREE DOORS ON EVERY ROW, AND THE 320px PROBLEM.

   Anthony asked for upload and attach on every row, and a build beside them
   wherever Agent Hero can fill one. That is three controls on a line that also
   carries a checkbox, a name, chips and a sentence, on a screen 320px wide.
   The answer is not to take a door away, it is to let them wrap: the row is a
   column and the doors are a wrapping flex line under the sentence, so three
   of them stack instead of squeezing. Nothing is hidden behind a menu, so
   every door stays one tap.

   The height is NOT set here on purpose. `.btn.sm` is 38px on a mouse-driven
   desktop and `var(--tap)` under 860px, which is the convention every other
   small button in this app already follows; a min-height written here was
   silently outranked by `.btn.sm` anyway, and pinning it would have made these
   three the only small buttons that disagree with the rest.

   The doors sit inside a <label> that wraps the checkbox, which is why they
   are drawn as real buttons: a label's activation stops at interactive
   content, so tapping one does not toggle the row. That is verified by
   clicking it in a browser, not assumed. */
.docpick__acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.docpick__act{flex:0 1 auto}

/* A ROW HE TOOK OFF THAT THE CONTRACT STILL ASKS FOR.

   An optional row he never ticked and a required row he unticked both sit
   unticked in the same fold, and they are not the same news: one of them stops
   a signing request. The warn edge and the chip are what make that a glance
   rather than a read. */
.docpick--owed{border-left:3px solid var(--warn);padding-left:9px}
.docpick--owed .cval{color:var(--warn)}

/* What an untick just cost him, at the top of the picker where he is looking.
   Taking a required row off moves it down into a fold that is closed by
   default, so the sentence on the row can land off screen; this one does not
   move, and it is drawn from the rows themselves so it survives the redraw the
   write kicks off. */
.docpick__owed{margin:0 0 10px;padding:9px 11px;border-radius:8px;
  border:1px solid var(--warn);background:color-mix(in srgb, var(--warn) 7%, transparent);
  color:var(--warn);font-size:12.5px;line-height:1.45}

/* A document the answers added, or took away, said out loud. Never a toast:
   this is the one sentence that stops a contract from quietly gaining or
   losing a piece of paper, and it stays on the screen that caused it. */
.docarrivals{margin-top:14px}
.docarrivals__list{margin:0;padding-left:18px;font-size:14px;line-height:1.5;
  color:var(--charcoal)}
.docarrivals__list li{margin-bottom:4px}
.docarrivals__list .hint{display:block}

/* The chase list on the Documents tab. Each name is a control, so it carries
   the full touch target rather than reading as a link that misses. */
.collectlist{list-style:none;margin:0;padding:0}
.collectlist__row{display:flex;flex-direction:column;gap:2px;padding:8px 0;
  border-bottom:1px solid var(--border)}
.collectlist__row:last-child{border-bottom:0}
.collectlist__name{min-height:var(--tap);display:flex;align-items:center;background:none;
  border:0;padding:0;font:inherit;font-size:15px;font-weight:600;color:var(--charcoal);
  text-align:left;cursor:pointer}
.collectlist__name:hover{color:var(--warn)}