/* =========================================================
   Zeal Portal — document chips
   window.DocumentPanel

   The lazy attachment surface for a subhire, a project or an
   organisation. Closed it is one chip; open it expands in place.

   INLINE BY DESIGN. The subhire editor is itself a WriteSurface,
   so an overlay opened from inside it would nest two scrims. This
   expands instead — see the header of document-panel.js.

   Geometry: the chip is a label, so --r-soft via .chip; the rows
   and their controls are act-on, so --r-1.
   ========================================================= */

.docchip { display: grid; gap: var(--s-2); }

/* The chip is the canonical .chip; this only makes it act like a
   button and shows its open state. */
.docchip__btn {
  border: 1px solid var(--rule-2);
  background: var(--paper);
  cursor: pointer;
  justify-self: start;
  transition:
    border-color var(--dur-fast) var(--ease-std),
    background var(--dur-fast) var(--ease-std);
}
.docchip__btn:hover { border-color: var(--rule-3); }
.docchip__btn.is-open {
  border-color: var(--accent);
  background: var(--accent-soft);
}
.docchip__btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.docchip__body {
  display: grid;
  gap: var(--s-1);
  padding: var(--s-3);
  border: 1px solid var(--rule);
  border-radius: var(--r-soft);
  background: var(--paper-2);
}

.docchip__row {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-2) var(--s-3);
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: var(--r-1);
}
.docchip__rowbody { flex: 1 1 auto; min-width: 0; display: grid; gap: 1px; }
.docchip__kind {
  font-family: var(--font-std);
  font-size: var(--t-form);
  color: var(--ink);
}
.docchip__meta {
  font-family: var(--font-cd);
  font-size: var(--t-micro);
  letter-spacing: var(--track-wide);
  color: var(--ink-3);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.docchip__exp {
  flex: 0 0 auto;
  font-family: var(--font-cd);
  font-size: var(--t-micro);
  letter-spacing: var(--track-wide);
}
.docchip__exp[data-state="ok"]      { color: var(--ink-3); }
.docchip__exp[data-state="soon"]    { color: var(--amber); }
.docchip__exp[data-state="expired"] { color: var(--red-status); }

.docchip__note {
  margin: 0;
  font-family: var(--font-std);
  font-size: var(--t-micro);
  color: var(--ink-3);
}
.docchip__err {
  margin: 0;
  font-family: var(--font-std);
  font-size: var(--t-micro);
  color: var(--red-status);
}

/* ── tombstones (28 Aug 2026) ──────────────────────────────
   A destroyed document leaves a muted sentence in the row it held.
   Quieter than a live row and carrying no affordance: there is
   nothing left to open, and the authority allows no link for
   non-admins. */
.docchip__row.is-tomb { opacity: 1; }
.docchip__tomb {
  font-size: 12.5px;
  color: var(--ink-3, #767676);
  font-family: var(--font-body);
}