/*
 * The check-in form, in the "Log update" dialog: the value, then the status
 * note, stacked. The submit row keeps the form contract's hairline.
 */
@layer components {
  .check-in-form {
    display: grid;
    gap: var(--space-4);

    /* The grid gap spaces the fields; the paragraph rhythm of forms.css would double it. */
    & > p,
    & > p + p {
      margin: 0;
      max-inline-size: none;
    }

    & input[type="number"] {
      inline-size: 10rem;
    }

    & textarea {
      max-inline-size: none;
    }
  }
}