.forms-runtime-page { height: 100%; min-height: 0; overflow: hidden; } .forms-runtime-toolbar label { display: flex; align-items: center; gap: 7px; } .forms-runtime-toolbar label > span, .forms-runtime-count { color: var(--text-soft); font-size: 0.82rem; } .forms-runtime-count, .form-instance-toolbar .status-badge { margin-left: auto; } .forms-runtime-list-viewport, .form-instance-viewport { flex: 1; min-height: 0; padding: 16px 18px 24px; } .form-instance-viewport > .action-blocker-hint { max-width: 1280px; margin: 0 auto 16px; } .form-instance-content { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); gap: 28px; max-width: 1280px; margin: 0 auto; } .form-instance-main, .form-instance-aside { min-width: 0; } .form-public-content { width: min(100%, 900px); margin: 0 auto; } .form-public-content > header { padding-bottom: 16px; border-bottom: 1px solid var(--border); } .form-public-content > header h1 { margin: 0; font-size: 1.45rem; letter-spacing: 0; } .form-public-content > header p { max-width: 70ch; margin: 7px 0 0; color: var(--text-soft); } .form-public-attachments { display: flex; flex-direction: column; gap: 10px; padding: 16px 0; border-top: 1px solid var(--border); } .form-public-attachments h2 { margin: 0; font-size: 0.98rem; letter-spacing: 0; } .form-public-attachments .file-drop-zone { min-height: 118px; } .form-public-attachment-list { border-top: 1px solid var(--border); } .form-public-attachment-list > div { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border); } .form-public-attachment-list > div > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .form-instance-main > header { padding-bottom: 16px; border-bottom: 1px solid var(--border); } .form-instance-main h1 { margin: 0; font-size: 1.45rem; letter-spacing: 0; } .form-instance-main > header p { max-width: 70ch; margin: 7px 0 0; color: var(--text-soft); } .form-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; padding: 20px 0; } .form-runtime-section > header { padding-top: 16px; border-bottom: 1px solid var(--border); } .form-runtime-section > header h2, .form-handoffs h2 { margin: 0; font-size: 0.98rem; letter-spacing: 0; } .form-runtime-section > header p { margin: 5px 0 10px; color: var(--text-soft); font-size: 0.84rem; } .form-field { display: flex; min-width: 0; flex-direction: column; gap: 6px; } .form-field:has(textarea), .form-field:has(select[multiple]) { grid-column: 1 / -1; } .form-field > span:first-child { font-size: 0.84rem; font-weight: 600; } .form-field > span b { color: var(--danger); } .form-field > small { color: var(--text-soft); font-size: 0.78rem; } .form-field textarea { resize: vertical; } .form-field select[multiple] { min-height: 110px; } .form-field-toggle { justify-content: flex-end; min-height: 58px; } .form-field-messages { display: flex; flex-direction: column; gap: 3px; } .form-field-messages [data-severity="error"] { color: var(--danger); } .form-field-messages [data-severity="warning"] { color: var(--warning); } .form-evidence-summary, .form-receipt { display: flex; flex-wrap: wrap; gap: 10px 18px; padding: 12px 0; border-top: 1px solid var(--border); color: var(--text-soft); font-size: 0.84rem; } .form-instance-evidence { display: flex; flex-direction: column; gap: 12px; padding: 16px 0; border-top: 1px solid var(--border); } .form-evidence-heading, .form-acknowledgement-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; } .form-evidence-heading h2, .form-intake-dialog h3 { margin: 0; font-size: 0.98rem; letter-spacing: 0; } .form-evidence-heading > span, .form-acknowledgement-row small { color: var(--text-soft); font-size: 0.78rem; } .form-instance-evidence .file-drop-zone { min-height: 104px; } .form-acknowledgement-row { padding: 12px 0; border-top: 1px solid var(--border); } .form-acknowledgement-row > span { display: flex; min-width: 0; flex-direction: column; gap: 3px; } .form-intake-dialog { width: min(980px, calc(100vw - 40px)); } .form-intake-create, .form-intake-profiles { display: flex; flex-direction: column; gap: 12px; } .form-intake-profiles { margin-top: 24px; } .form-intake-create-grid { align-items: end; } .form-intake-create-grid label { display: flex; min-width: 0; flex-direction: column; gap: 5px; } .form-intake-create-grid label > span { color: var(--text-soft); font-size: 0.8rem; } .form-intake-create-button { justify-self: start; } .form-intake-profile-row { display: grid; grid-template-columns: minmax(220px, 1fr) auto auto auto; align-items: center; gap: 10px 14px; min-height: 62px; padding: 10px 0; border-top: 1px solid var(--border); } .form-intake-profile-main { display: flex; min-width: 0; flex-direction: column; gap: 3px; } .form-intake-profile-main strong, .form-intake-profile-main small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .form-intake-profile-main small, .form-intake-empty { color: var(--text-soft); font-size: 0.78rem; } .form-intake-profile-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; } .form-intake-link { grid-column: 1 / -1; overflow: hidden; color: var(--text-soft); font-size: 0.75rem; text-overflow: ellipsis; white-space: nowrap; } .form-receipt { flex-direction: column; } .form-receipt code { overflow-wrap: anywhere; color: var(--text); } .form-handoffs { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); } .form-handoff-heading, .form-handoff-create, .form-handoff-actions { display: flex; align-items: center; gap: 8px; } .form-handoff-heading { justify-content: space-between; flex-wrap: wrap; } .form-handoff-create input { width: min(260px, 34vw); } .form-handoff-empty { margin: 0; color: var(--text-soft); font-size: 0.84rem; } .form-handoff-list { border-top: 1px solid var(--border); } .form-handoff-row { display: grid; grid-template-columns: minmax(160px, 1fr) auto minmax(180px, 1fr) auto; align-items: center; gap: 10px; min-height: 54px; border-bottom: 1px solid var(--border); } .form-handoff-row > span:first-child { display: flex; min-width: 0; flex-direction: column; gap: 2px; } .form-handoff-row small, .form-handoff-error { overflow: hidden; color: var(--text-soft); font-size: 0.78rem; text-overflow: ellipsis; white-space: nowrap; } .form-handoff-error { color: var(--danger); } .form-instance-actions { display: flex; align-items: end; justify-content: flex-end; gap: 10px; padding-top: 16px; border-top: 1px solid var(--border); } .form-change-reason { display: flex; min-width: min(360px, 100%); flex: 1; flex-direction: column; gap: 5px; } .form-change-reason span { color: var(--text-soft); font-size: 0.8rem; } .form-instance-aside section + section { margin-top: 24px; } .form-instance-aside h2 { margin: 0 0 8px; font-size: 0.95rem; letter-spacing: 0; } .form-instance-aside ol { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--border); } .form-instance-aside li { display: flex; flex-direction: column; gap: 3px; padding: 10px 0 10px 12px; border-bottom: 1px solid var(--border); border-left: 2px solid var(--accent); } .form-instance-aside li span, .form-instance-aside li time { color: var(--text-soft); font-size: 0.78rem; } @media (max-width: 860px) { .form-instance-content { grid-template-columns: 1fr; } .form-fields { grid-template-columns: 1fr; } .form-field:has(textarea), .form-field:has(select[multiple]) { grid-column: auto; } .form-instance-actions { align-items: stretch; flex-direction: column; } .form-evidence-heading, .form-acknowledgement-row { align-items: stretch; flex-direction: column; } .form-intake-profile-row { grid-template-columns: 1fr; } .form-intake-profile-actions { justify-content: flex-start; } .form-intake-link { grid-column: auto; } .form-handoff-create, .form-handoff-row { align-items: stretch; grid-template-columns: 1fr; } .form-handoff-create { flex-direction: column; } .form-handoff-create input { width: 100%; } }