/* Test reports: template editor, generation dialog, report viewer. Prefix: trp- */

.trp-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 44%);
    gap: 24px;
    align-items: start;
}
.trp-split--generate { grid-template-columns: minmax(340px, 400px) minmax(0, 1fr); }
.trp-split--viewer { grid-template-columns: minmax(0, 1fr) minmax(300px, 340px); }
@media (max-width: 1100px) {
    .trp-split, .trp-split--generate, .trp-split--viewer { grid-template-columns: minmax(0, 1fr); }
}

.trp-form { display: flex; flex-direction: column; gap: 28px; min-width: 0; }

.trp-section { display: flex; flex-direction: column; gap: 10px; }
.trp-section__head { display: flex; align-items: baseline; gap: 10px; }
.trp-section__title { font-size: 1rem; font-weight: 600; color: var(--mud-palette-text-primary); margin: 0; }
.trp-section__hint { font-size: .8rem; color: var(--mud-palette-text-secondary); }
.trp-section__head .trp-section__actions { margin-left: auto; display: flex; gap: 4px; }

/* Numbered steps: only the generation dialog, where the order matters. */
.trp-step { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%;
    background: var(--mud-palette-primary); color: var(--mud-palette-primary-text); font-size: .75rem; font-weight: 700; flex: none; align-self: center; }
.trp-step--muted { background: var(--mud-palette-lines-default); color: var(--mud-palette-text-secondary); }

.trp-row { display: grid; grid-template-columns: repeat(var(--trp-cols, 2), minmax(0, 1fr)); gap: 4px 16px; }
@media (max-width: 700px) { .trp-row { grid-template-columns: minmax(0, 1fr); } }

/* Message right under a field, like the production sheet configurator. */
.trp-msg { display: flex; align-items: flex-start; gap: 4px; font-size: .75rem; line-height: 1.35; margin-top: 3px; }
.trp-msg .mud-icon-root { font-size: 1rem; flex: none; margin-top: -1px; }
.trp-msg--error { color: var(--mud-palette-error); }
.trp-msg--warning { color: var(--mud-palette-warning-darken, #b26a00); }
.trp-msg--info { color: var(--mud-palette-text-secondary); }
.trp-msg--ok { color: var(--mud-palette-success-darken, #2e7d32); }

/* Auto-detection status under the configuration picker. */
.trp-detect { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 6px;
    background: rgba(6, 163, 163, .07); border: 1px solid rgba(6, 163, 163, .25); font-size: .82rem; }
.trp-detect--warning { background: rgba(255, 152, 0, .08); border-color: rgba(255, 152, 0, .35); }

/* The measurement matrix: flow points × temperatures, headed like the table in the PDF. */
.trp-matrix { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.trp-matrix th, .trp-matrix td { vertical-align: top; padding: 8px 8px; border-bottom: 1px solid var(--mud-palette-lines-default); }
.trp-matrix thead th { text-align: left; font-weight: 600; border-bottom: 1px solid var(--mud-palette-lines-default); }
.trp-matrix th:first-child, .trp-matrix td:first-child { width: 30%; padding-left: 0; }
.trp-matrix tbody tr:last-child td { border-bottom: none; }
.trp-matrix thead .trp-matrix__corner { vertical-align: bottom; font-size: .75rem; font-weight: 400; color: var(--mud-palette-text-secondary); }
/* Each temperature column: its name over a primary rule, like "T20°C" in the PDF, with the test temperature below. */
.trp-matrix thead .trp-matrix__col { padding-top: 0; }
.trp-matrix__colname { display: flex; align-items: center; gap: 2px; padding-bottom: 2px; border-bottom: 2px solid var(--mud-palette-primary); }
.trp-matrix__colname .trp-plain-input input { text-align: center; }
.trp-matrix__temp { display: flex; align-items: center; justify-content: center; gap: 4px; margin-top: 4px; font-size: .75rem; font-weight: 400; color: var(--mud-palette-text-secondary); }
.trp-matrix__temp-input { flex: 0 0 72px; }
.trp-matrix__temp-input input { text-align: right; font-variant-numeric: tabular-nums; }
.trp-matrix__head { display: flex; align-items: center; gap: 4px; }
.trp-matrix__actions { display: flex; gap: 8px; }

/* Inputs that read as text until hovered or focused (names inside the matrix). */
.trp-plain-input.mud-input-control { margin: 0; }
.trp-plain-input .mud-input { border-radius: 4px; padding: 0 6px; transition: background-color .12s ease, box-shadow .12s ease; }
.trp-plain-input .mud-input:hover { background: var(--mud-palette-action-default-hover); }
.trp-plain-input .mud-input:focus-within { background: var(--mud-palette-surface); box-shadow: inset 0 0 0 2px var(--mud-palette-primary); }
.trp-plain-input--title input { font-weight: 600; }
.trp-matrix__ref { font-size: .72rem; color: var(--mud-palette-text-secondary); margin-top: 3px; font-variant-numeric: tabular-nums; }
.trp-cell--error { box-shadow: inset 3px 0 0 var(--mud-palette-error); }
.trp-cell--warning { box-shadow: inset 3px 0 0 var(--mud-palette-warning); }

/* Header-field toggles: square-ish tiles with a checkbox, one per printed field. */
.trp-toggles { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 8px; }
.trp-toggle { display: flex; align-items: center; gap: 8px; min-height: 38px; padding: 6px 10px; border-radius: 8px; cursor: pointer;
    border: 1px solid var(--mud-palette-lines-inputs); background: var(--mud-palette-surface); color: var(--mud-palette-text-secondary);
    font: inherit; font-size: .85rem; text-align: left; transition: background-color .12s ease, border-color .12s ease, color .12s ease; }
.trp-toggle:hover { background: var(--mud-palette-action-default-hover); }
.trp-toggle:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 2px; }
.trp-toggle .mud-icon-root { font-size: 1.15rem; flex: none; color: var(--mud-palette-text-disabled); }
.trp-toggle--on { border-color: var(--mud-palette-primary); background: rgba(6, 163, 163, .08); color: var(--mud-palette-text-primary); font-weight: 500; }
.trp-toggle--on:hover { background: rgba(6, 163, 163, .14); }
.trp-toggle--on .mud-icon-root { color: var(--mud-palette-primary); }

/* PDF preview pane. */
.trp-preview { position: sticky; top: 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.trp-preview__bar { display: flex; align-items: center; gap: 8px; min-height: 32px; }
.trp-preview__title { font-weight: 600; }
.trp-preview__meta { font-size: .78rem; color: var(--mud-palette-text-secondary); }
.trp-preview__frame { position: relative; height: calc(100vh - 230px); min-height: 520px; overflow: auto; border-radius: 6px;
    background: var(--mud-palette-background-gray, #f1f3f4); border: 1px solid var(--mud-palette-lines-default); }
.trp-preview__pages { display: flex; flex-direction: column; gap: 16px; padding: 16px; transition: opacity .15s ease; }
.trp-preview__frame--busy .trp-preview__pages { opacity: .55; }
.trp-preview__page { display: block; width: 100%; height: auto; background: #fff; border-radius: 2px;
    box-shadow: 0 1px 2px rgba(31, 42, 48, .12), 0 4px 14px rgba(31, 42, 48, .08); }
.trp-preview__spinner { position: absolute; top: 12px; right: 12px; }
.trp-preview__empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center;
    padding: 32px; color: var(--mud-palette-text-secondary); font-size: .9rem; line-height: 1.5; }

/* Row actions in the grids: one aligned line of equal-size buttons. */
.trp-row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 2px; white-space: nowrap; }
.trp-row-actions .mud-menu { display: flex; align-items: center; }

/* Full-height dialogs (template editor, generation): the form scrolls on its own next to the preview or the
   sensor list, which fill the height, so neither scrollbar ends up past the other pane and footers stay in view. */
.trp-dialog--fill { height: calc(100vh - var(--mud-appbar-height)); height: calc(100dvh - var(--mud-appbar-height)); }
.trp-dialog--fill .mud-dialog-content { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.trp-dialog--fill .trp-split { flex: 1 1 auto; min-height: 0; grid-template-rows: minmax(0, 1fr); align-items: stretch; }
.trp-dialog--fill .trp-split > .trp-form { overflow-y: auto; padding: 2px 8px 16px 0; }
.trp-dialog--fill .trp-preview { position: static; min-height: 0; }
.trp-dialog--fill .trp-preview__frame { flex: 1 1 auto; height: auto; min-height: 0; }
.trp-dialog--fill .trp-done { flex: 1 1 auto; justify-content: center; }
@media (max-width: 1100px) {
    .trp-dialog--fill .mud-dialog-content { display: block; overflow: auto; }
    .trp-dialog--fill .trp-split > .trp-form { overflow: visible; }
    .trp-dialog--fill .trp-sensors, .trp-dialog--fill .trp-preview__frame { height: 70vh; }
}

/* Sensor list in the generation dialog. */
.trp-sensors { position: relative; display: flex; flex-direction: column; min-width: 0; min-height: 0; border: 1px solid var(--mud-palette-lines-default); border-radius: 8px; overflow: hidden; }
.trp-sensors__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--mud-palette-lines-default); }
.trp-sensors__bar--tools { flex-wrap: nowrap; padding: 10px 12px; }
.trp-sensors__bar--tools .mud-input-control { margin: 0; }
.trp-sensors__search { flex: 1 1 auto; min-width: 180px; }
.trp-sensors__filter { flex: 0 0 170px; }
.trp-sensors__progress { position: absolute; left: 0; right: 0; top: 0; z-index: 2; }
.trp-sensors__list { flex: 1 1 auto; min-height: 200px; overflow: auto; }
.trp-sensors__foot { display: flex; flex-direction: column; gap: 4px; padding: 6px 12px 8px 14px; border-top: 1px solid var(--mud-palette-lines-default); }
.trp-sensors__summary { display: flex; align-items: center; gap: 12px; min-height: 30px; font-size: .85rem; }
.trp-sensors__count { font-weight: 600; font-variant-numeric: tabular-nums; }
.trp-sensors__shown { color: var(--mud-palette-text-secondary); font-variant-numeric: tabular-nums; }
.trp-option { display: flex; align-items: center; gap: 16px; width: 100%; }
.trp-option__count { margin-left: auto; font-size: .78rem; color: var(--mud-palette-text-secondary); font-variant-numeric: tabular-nums; }
.trp-sort { display: inline-flex; align-items: center; gap: 2px; padding: 0; border: 0; background: none; cursor: pointer; font: inherit; color: inherit; }
.trp-sort:hover, .trp-sort--active { color: var(--mud-palette-text-primary); }
.trp-sort:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 2px; border-radius: 2px; }
.trp-sort__icon.mud-icon-root { font-size: .9rem; opacity: 0; }
.trp-sort:hover .trp-sort__icon, .trp-sort--active .trp-sort__icon { opacity: 1; }
.trp-sensors table { width: 100%; border-collapse: collapse; font-size: .85rem; }
.trp-sensors thead th { position: sticky; top: 0; z-index: 1; background: var(--mud-palette-surface); text-align: left; font-weight: 600;
    font-size: .75rem; color: var(--mud-palette-text-secondary); padding: 6px 10px; border-bottom: 1px solid var(--mud-palette-lines-default); }
.trp-sensors tbody td { padding: 4px 10px; border-bottom: 1px solid var(--mud-palette-lines-default); vertical-align: middle; }
.trp-sensors tbody tr { cursor: pointer; }
.trp-sensors tbody tr:hover td { background: var(--mud-palette-action-default-hover); }
.trp-sensors tr.trp-sensors__row--off td { color: var(--mud-palette-text-disabled); }
.trp-sensors .trp-num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.trp-sensors__note { font-size: .75rem; color: var(--mud-palette-text-secondary); }
.trp-sensors__empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center;
    height: 100%; min-height: 200px; padding: 32px; color: var(--mud-palette-text-secondary); }

/* Verdict chips. */
.trp-verdict { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 10px; font-size: .75rem; font-weight: 600; white-space: nowrap; }
.trp-verdict--passed { background: rgba(28, 147, 141, .12); color: #137a75; }
.trp-verdict--failed { background: rgba(198, 40, 40, .1); color: #c62828; }
.trp-verdict--incomplete { background: rgba(255, 152, 0, .14); color: #a15c00; }
.trp-verdict--muted { background: var(--mud-palette-action-disabled-background); color: var(--mud-palette-text-secondary); }

/* Done state after generating. */
.trp-done { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; padding: 48px 24px; }
.trp-done__count { font-size: 2.4rem; font-weight: 700; line-height: 1; color: var(--mud-palette-primary); font-variant-numeric: tabular-nums; }
.trp-done__range { color: var(--mud-palette-text-secondary); font-variant-numeric: tabular-nums; }

/* Viewer facts. */
.trp-facts { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 14px; font-size: .85rem; }
.trp-facts dt { color: var(--mud-palette-text-secondary); }
.trp-facts dd { margin: 0; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

/* Grids. */
.trp-grid-search { flex: 0 1 320px; margin: 0 0 0 16px; }
.trp-grid-search .mud-input-control-input-container { margin: 0; }
.trp-grid-primary { font-weight: 600; white-space: nowrap; }
.trp-grid-secondary { font-size: .75rem; color: var(--mud-palette-text-secondary); }

.trp-dialog-footer { display: flex; align-items: center; gap: 8px; width: 100%; }
.trp-dialog-footer__status { margin-right: auto; font-size: .82rem; }

@media (prefers-reduced-motion: reduce) {
    .trp-preview__pages, .trp-toggle, .trp-plain-input .mud-input { transition: none; }
}