/* quote-maker only: the form, with the sums and the downloads beside it (below it on a narrow screen). */
.qm-layout { display: grid; gap: var(--matrix-space-16); }
.qm-main, .qm-form { display: grid; gap: var(--matrix-space-16); min-width: 0; }
.qm-document { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: var(--matrix-space-16); }
.qm-document .option-group, .qm-corrections .option-group, .qm-aside .option-group { min-width: 0; gap: var(--matrix-space-12); }
.qm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12em, 1fr)); gap: var(--matrix-space-12); }
.qm-field { display: grid; gap: 4px; min-width: 0; align-content: start; }
.qm-field > label, .qm-label { font-weight: 600; }
.qm-field input, .qm-field select, .qm-field textarea { width: 100%; box-sizing: border-box; min-width: 0; }
.matrix-ui .qm-text { min-height: 5em; resize: vertical; font-family: inherit; line-height: 1.45; }
.qm-hint { margin: 0; font-size: var(--matrix-type-caption); }
.qm-hint.qm-needed { font-weight: 600; } /* what Issue will ask for, said at the field while it is missing */
.qm-lines { display: grid; gap: var(--matrix-space-12); min-width: 0; }
.qm-line { border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-control); padding: var(--matrix-space-12) var(--matrix-space-16); margin: 0; display: grid; gap: var(--matrix-space-12); background: var(--matrix-surface); min-width: 0; }
.qm-line > legend { font-weight: 600; padding-inline: 4px; }
.qm-line-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(6em, 1fr)); gap: var(--matrix-space-12); min-width: 0; }
.qm-field--wide { grid-column: 1 / -1; }
.qm-field--amount { align-content: start; }
.qm-amount { display: flex; align-items: center; justify-content: flex-end; min-height: var(--matrix-control-min-height); font-variant-numeric: tabular-nums; font-weight: 600; overflow-wrap: anywhere; }
.qm-line-options { display: grid; gap: 4px; }
.qm-line-buttons, .qm-buttons { display: flex; flex-wrap: wrap; gap: var(--matrix-space-8); align-items: center; }
.qm-line-buttons { justify-content: flex-end; }
.qm-bar { display: grid; gap: var(--matrix-space-8); padding: var(--matrix-space-12) var(--matrix-space-16); border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-panel); background: var(--matrix-surface-subtle); min-width: 0; }
.qm-tick { flex-wrap: nowrap; align-items: flex-start; }
.qm-tick input[type="checkbox"] { flex: 0 0 auto; margin-top: 6px; }
.qm-tick label { min-width: 0; padding-top: 4px; }
.qm-aside { display: grid; gap: var(--matrix-space-12); padding: var(--matrix-space-12) var(--matrix-space-16); border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-panel); background: var(--matrix-surface-subtle); min-width: 0; align-content: start; }
.qm-aside h3, .qm-corrections h3 { margin: 0; font-size: 1rem; }
.qm-aside h4, .qm-corrections h4 { margin: 0 0 4px; font-size: 0.9375rem; }
.qm-corrections h3:focus, .qm-aside h3:focus, .qm-status:focus { outline: none; }
.qm-jump { justify-self: start; font-size: var(--matrix-type-caption); }
.qm-sums { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.qm-sums th { text-align: left; font-weight: 400; padding: 3px 8px 3px 0; overflow-wrap: anywhere; }
.qm-sums td { text-align: right; padding: 3px 0; white-space: nowrap; }
.qm-sums .qm-total th, .qm-sums .qm-total td { font-weight: 700; border-top: 1px solid var(--matrix-border); padding-top: 6px; }
.qm-problem-box { border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-control); padding: var(--matrix-space-8) var(--matrix-space-12); background: var(--matrix-surface); display: grid; gap: var(--matrix-space-8); }
.qm-problems { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: var(--matrix-type-caption); overflow-wrap: anywhere; }
.matrix-ui .qm-go { background: none; border: 0; padding: 0; font: inherit; font-weight: 600; color: inherit; text-align: left; text-decoration: underline; cursor: pointer; }
.qm-said { display: grid; gap: 4px; min-width: 0; }
.qm-status, .qm-alert { margin: 0; overflow-wrap: anywhere; }
.qm-alert { padding: var(--matrix-space-8) var(--matrix-space-12); border-radius: var(--matrix-radius-control); background: var(--matrix-danger-background); }
.qm-open-label { display: inline-flex; align-items: center; min-height: var(--matrix-control-min-height); box-sizing: border-box; cursor: pointer; }
#qm-open.visually-hidden { width: 1px; } /* tools.css widens every file input in the options to 100% */
#qm-open:focus-visible + .qm-open-label { outline: 2px solid var(--matrix-focus); outline-offset: 2px; }
.qm-corrections { display: grid; gap: var(--matrix-space-12); padding: var(--matrix-space-12) var(--matrix-space-16); border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-panel); background: var(--matrix-surface-subtle); min-width: 0; }
.qm-corrections .notice { margin: 0; }
.qm-credits { margin: 0; padding-left: 1.1em; display: grid; gap: var(--matrix-space-8); }
.qm-credits li > span { display: block; overflow-wrap: anywhere; margin-bottom: 4px; }
.qm-sums-box { min-width: 0; }
/* T61-04: the form's five sections - open on a wide screen; on a phone one at a time, each closed one saying in one line
   what it holds, with Next and Back at its end */
.qm-document:has(> .qm-section) { gap: 0; } /* the sections' own rules and headings space them */
.qm-section { display: grid; gap: var(--matrix-space-12); min-width: 0; border-top: 1px solid var(--matrix-border); }
.qm-section[open] { padding-bottom: var(--matrix-space-12); }
.qm-section:not([open]) { gap: 0; } /* its fields are hidden: nothing to space after the heading */
.qm-section-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--matrix-space-8); min-height: 44px; box-sizing: border-box; cursor: pointer; padding: 2px 0; list-style: none; }
.qm-section-head::-webkit-details-marker { display: none; }
/* the browser's own triangle goes with a flex heading: a chevron says the heading opens and closes its section */
.qm-section-head::before { content: ""; flex: none; width: 0.45em; height: 0.45em; margin-inline: 3px 2px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); }
.qm-section[open] > .qm-section-head::before { transform: rotate(45deg); }
@media (prefers-reduced-motion: no-preference) { .qm-section-head::before { transition: transform 0.15s; } }
.qm-section-title { font-weight: 700; font-size: 1.0625rem; }
.qm-section-digest { color: var(--matrix-muted); font-size: var(--matrix-type-caption); overflow-wrap: anywhere; min-width: 0; }
.qm-section-fix { font-size: var(--matrix-type-caption); font-weight: 600; color: var(--matrix-danger); white-space: nowrap; } /* "2 things to fix": one piece */
.qm-section-fix[hidden] { display: none; }
.qm-section[open] > .qm-section-head :is(.qm-section-digest, .qm-section-fix) { display: none; } /* an open section shows its fields instead */
.qm-steps { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--matrix-space-8); margin: 0; }
.qm-step { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.qm-step:last-child { margin-inline-start: auto; } /* Next at the end of its row, also where there is no Back */
@media (min-width: 561px) {
  .qm-steps { display: none; } /* every section is open beside the sums: no steps to take */
  .qm-section-head { min-height: 32px; padding: 2px 0; } /* a heading for the pointer, not a finger's target */
}
@media (max-width: 480px) {
  .qm-line { padding: var(--matrix-space-8) var(--matrix-space-12); }
  .qm-document .option-group, .qm-corrections .option-group { padding: var(--matrix-space-8) var(--matrix-space-12); }
}
@media (min-width: 900px) {
  .qm-jump { display: none; }
  .qm-layout { grid-template-columns: minmax(0, 1fr) 320px; align-items: start; }
  .qm-aside { position: sticky; top: var(--matrix-space-12); max-height: calc(100vh - 24px); overflow: auto; }
}