/* vs01 — Vital Signs — v0.3.0 */ /* ---------------------------------------------------------------------------- VS FORM — question text and field labels All text in the VS form uses sans-serif at consistent sizes anchored to the civicinfra type scale. This overrides the region_2 serif inheritance so the form reads as UI, not prose. ---------------------------------------------------------------------------- */ .vs01-content { font-family: var(--bs-font-sans-serif); font-size: var(--civicinfra-fs-base); color: var(--civicinfra-text); } /* Question text — the diagnostic question above each form */ .vs01-diagnostic-question { font-family: var(--bs-font-sans-serif); font-size: var(--civicinfra-fs-sm); color: var(--civicinfra-muted); margin-bottom: var(--civicinfra-space-4); line-height: 1.5; } /* Field question labels rendered as
in the renderer */ .vs01-form p { font-family: var(--bs-font-sans-serif); font-size: var(--civicinfra-fs-sm); line-height: 1.5; margin-bottom: var(--civicinfra-space-2); } .vs01-form p strong, .vs01-form label { font-family: var(--bs-font-sans-serif); font-size: var(--civicinfra-fs-sm); font-weight: 600; color: var(--civicinfra-text); } /* Instruction text above the form */ .vs01-instruction { font-family: var(--bs-font-sans-serif); font-size: var(--civicinfra-fs-sm); color: var(--civicinfra-muted); margin-bottom: var(--civicinfra-space-4); padding: var(--civicinfra-space-3) var(--civicinfra-space-4); background: var(--civicinfra-surface); border-left: 0.25rem solid var(--civicinfra-accent-muted); border-radius: 0 var(--civicinfra-radius) var(--civicinfra-radius) 0; } /* VS form field grouping */ .vs01-form .mb-3 { padding-bottom: var(--civicinfra-space-3); border-bottom: 1px solid var(--civicinfra-surface-muted); } .vs01-form .mb-3:last-of-type { border-bottom: none; } /* ---------------------------------------------------------------------------- VS HEADER — breadcrumb and title block ---------------------------------------------------------------------------- */ .vs01-vs-header { border-bottom: 2px solid var(--civicinfra-rule); padding-bottom: var(--civicinfra-space-4); margin-bottom: var(--civicinfra-space-6); } .vs01-vs-header h3 { font-size: var(--civicinfra-fs-lg); font-weight: 700; color: var(--civicinfra-primary); margin-bottom: var(--civicinfra-space-2); } /* ---------------------------------------------------------------------------- VS NAVIGATION — association landing list and prev/next arrows ---------------------------------------------------------------------------- */ .vs01-vs-nav .list-group-item { background: transparent; border-color: var(--civicinfra-border); padding: var(--civicinfra-space-3) var(--civicinfra-space-4); font-family: var(--bs-font-sans-serif); font-size: var(--civicinfra-fs-sm); transition: background-color var(--civicinfra-transition); } .vs01-vs-nav .list-group-item:hover { background: var(--civicinfra-surface); } .vs01-vs-nav .list-group-item p { font-size: var(--civicinfra-fs-xs); color: var(--civicinfra-muted); margin-bottom: 0; margin-top: var(--civicinfra-space-1); } .vs01-vs-nav-arrows { border-top: 1px solid var(--civicinfra-surface-muted); padding-top: var(--civicinfra-space-4); } /* ---------------------------------------------------------------------------- VERIFICATION SOURCES — "Where to verify this" button ---------------------------------------------------------------------------- */ .vs01-verification-sources { margin-bottom: var(--civicinfra-space-4); } /* ---------------------------------------------------------------------------- ASSOCIATION INDEX LIST ---------------------------------------------------------------------------- */ .vs01-association-list .list-group-item { background: transparent; border-color: var(--civicinfra-border); padding: var(--civicinfra-space-3) var(--civicinfra-space-4); font-family: var(--bs-font-sans-serif); font-size: var(--civicinfra-fs-sm); transition: background-color var(--civicinfra-transition); } .vs01-association-list .list-group-item:hover { background: var(--civicinfra-surface); } /* ---------------------------------------------------------------------------- IMMUTABLE NOTICE ---------------------------------------------------------------------------- */ .vs01-immutable-notice { font-family: var(--bs-font-sans-serif); font-size: var(--civicinfra-fs-sm); background: var(--civicinfra-surface); border-color: var(--civicinfra-border); color: var(--civicinfra-muted); }