/* Full-value visibility layer, style half. The runtime half is full-value.js.
 *
 * Loaded last so it outranks the older per-screen rules that clip value-bearing
 * nodes (mobile-polish.css and product.css both set `text-overflow:ellipsis`
 * and `-webkit-line-clamp` on them). The selectors below name the clipping
 * properties and the field containers rather than whole screens, so nothing
 * else is disturbed.
 */

/* ── 1. NOTHING THAT HOLDS AN ENTERED VALUE MAY CLIP IT ──────────────────────
 * Ellipsis, line-clamp and nowrap are removed at the value-bearing nodes only:
 * a table header or a status chip may still keep to one line. */
.fc-f input, .fc-f select, .fc-f textarea,
.fc-f > span, .fc-fhelp, .fc-err, .fv-readback,
.bw-board-name, .bw-board-loc, .bw-ckt .fc-ckt-main b, .bw-ckt .fc-ckt-main span,
.bw-addboard-t b, .bw-addboard-t small,
.bw-switch-btn, .bw-cktcard-h h3,
.bw-head-t b, .bw-head-t small, .bw-ckt-desc, .bw-idname, .bw-idprop,
.fa-row-l, .fa-row-l small {
  text-overflow: clip;
  -webkit-line-clamp: none;
  overflow-wrap: anywhere;
  word-break: normal;
}
.fc-f > span, .fc-fhelp, .fc-err,
.bw-board-name, .bw-board-loc,
.bw-addboard-t b, .bw-addboard-t small,
.bw-head-t b, .bw-head-t small, .bw-ckt-desc, .bw-idname, .bw-idprop,
.fa-row-l, .fa-row-l small {
  white-space: normal;          /* labels, help and errors wrap instead of cutting */
  overflow: visible;
}
/* The modal sheet header names which board or circuit the sheet is bound to.
 * That identity is an entered value, so it wraps onto a second line rather
 * than being cut — a sheet titled "TEST DB1 Rear workshop plan…" cannot be
 * checked against the board in front of you. */
.bw-head-t { text-align: start; }
.bw-head { align-items: flex-start; }

/* A label that wraps must push its value down, never sit on top of it. */
.fc-f { min-width: 0; }
.fc-f > span { line-height: 1.35; }

/* ── 2. NORMAL HEIGHT IS A MINIMUM, NOT A CAP ────────────────────────────────
 * `height` fixes a box; `min-height` starts it. Every field container in the
 * app is switched to the second form, and the auto-grow in full-value.js then
 * has somewhere to grow to. */
.fc-f textarea, .bw-sheet .fc-f textarea {
  height: auto;
  min-height: 76px;
  max-height: none;
  overflow-y: hidden;           /* the box grows; it does not scroll inside itself */
  resize: vertical;
  white-space: pre-wrap;        /* keeps the engineer's own line breaks */
  overflow-wrap: anywhere;
}
.fc-f input, .bw-sheet .fc-f input, .fc-f select, .bw-sheet .fc-f select {
  height: auto;
  min-height: 48px;
  max-height: none;
}

/* ── 3. THE READBACK ─────────────────────────────────────────────────────────
 * The complete stored string, wrapped, inside the same labelled container,
 * directly under the control it belongs to. It is visibly part of the field —
 * indented under it with a rule on the leading edge — so it reads as "this is
 * what is in that box", not as a second field or a validation message.
 *
 * `pre-wrap` preserves meaningful whitespace; `anywhere` lets an unbroken
 * 60-character email or a long reference wrap at 320px. Neither changes the
 * value: this node is display-only and full-value.js only ever assigns
 * `textContent` from `el.value`. */
.fv-readback {
  display: block;
  margin-top: 6px;
  padding: 7px 10px;
  border-inline-start: 3px solid var(--bw-accent, var(--so-accent));
  border-radius: 0 8px 8px 0;
  background: var(--bw-field, var(--so-panel));
  color: var(--bw-ink, var(--so-accent-ink));
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  overflow: visible;
  max-height: none;
}
/* A card that clips its own corners must not clip a field's value with them.
 * `.fc-card` carries `overflow:hidden` for its rounded edge; where it actually
 * holds a readback the rounding gives way, because a value that cannot be read
 * is the failure the rounding was never worth. */
body .fc-card:has(.fv-readback),
body .bw-group:has(.fv-readback),
body .fc-grid:has(.fv-readback),
body .fc-f:has(.fv-readback) {
  overflow: visible !important;
}

/* A select's readback is always present, so it is quieter than an input's —
 * it is confirming the selection rather than rescuing a hidden tail. */
select + .fv-readback {
  background: transparent;
  padding: 4px 0 0 10px;
  border-radius: 0;
}

/* In a grid cell the readback is the only way the full value can be seen at
 * all, so it stays, but it is quieter and tighter than in a form. */
td > .fv-readback, th > .fv-readback {
  margin-top: 4px;
  padding: 4px 7px;
  font-size: 12.5px;
  border-inline-start-width: 2px;
}

/* ── 4. PAIRED FIELDS STACK WHEN CONTENT REQUIRES ────────────────────────────
 * `fv-long` is set by full-value.js on the field container of any control whose
 * real, measured value does not fit at the current width and text size. A field
 * in that state takes the whole row, whatever the grid was asked for — content
 * outranks column symmetry. */
.fc-grid > .fv-long,
.bw-sheet .fc-grid > .fv-long,
.bw-sheet .bw-g3 > .fv-long {
  grid-column: 1 / -1;
}

/* ── 5. READ-ONLY AND REVIEW FOLLOW THE SAME RULE ────────────────────────────
 * A disabled control clips exactly like an enabled one, and the review screen
 * is where a clipped address does the most damage, so the readback is kept —
 * and made a little stronger, because there is no way to focus in and scroll. */
.bw-sheet.is-readonly .fv-readback,
.is-readonly .fv-readback,
[aria-readonly='true'] .fv-readback {
  background: var(--so-panel);
  border-inline-start-color: var(--bw-ink-2, var(--so-muted));
  color: var(--bw-ink, var(--so-text));
}

/* ── 6. THE FOOTER MUST NOT SIT ON THE FIELD BEING EDITED ────────────────────
 * The bottom navigation is fixed, and on iOS the keyboard takes the bottom of
 * the viewport as well. Scroll padding keeps the focused field, its readback
 * and its validation line above both. */
body.proto-phone, body.bw-world {
  scroll-padding-bottom: 150px;
}

/* ── 7. TINY TEXT IS NOT AN ANSWER TO LONG TEXT ──────────────────────────────
 * A floor under the things that carry entered information, so no later
 * shrink-to-fit rule can satisfy "it fits" by making it unreadable. */
.fc-f input, .fc-f select, .fc-f textarea, .fv-readback { font-size: max(14px, 1em); }