/* React-only rules. application.css stays untouched (shared with other worklines). */

/* The React mount point must not add a box between #main-content and the page it renders. */
#root { display: contents; }

/* Inline "can't be cleared here" message under an autosaving field. */
.field-error {
  display: block;
  margin: 0.2rem 0 0;
  font-size: 0.75rem;
  line-height: 1.3;
  color: var(--desk-danger);
  flex-basis: 100%;
}
.qty-row, .rate-row { flex-wrap: wrap; }

/* A failed-write banner: message + dismiss. */
.write-failure { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.write-failure p { margin: 0; }

/* The stage header wraps instead of squeezing the title to a sliver when the readiness hint is showing. */
.stage-header { flex-wrap: wrap; }
.stage-title { flex: 1 1 14rem; }
.stage-actions { flex-wrap: wrap; margin-left: auto; }
.status-hint { white-space: normal; }

/* Credit control: the email body lives in a sandboxed iframe (no scripts, no same-origin), so it can't size itself. */
.cc-mail-frame { display: block; width: 100%; height: 34rem; border: 0; }
.cc-mail-body:has(> .cc-mail-frame) { padding: 0; }