/* Functional additions only. Visual design is defined by the supplied styles.css. */
:root { color-scheme: light; }
.skip-link { position: absolute; top: -100px; left: 16px; z-index: 2000; background: white; padding: 12px; }
.skip-link:focus { top: 8px; }
#toast:not(:empty) { position: fixed; bottom: 20px; right: 20px; z-index: 2000; max-width: 440px; padding: 16px 20px; background: #17324d; color: white; border-radius: 12px; box-shadow: var(--portal-shadow); }
#error:empty { display: none; }
#content:focus { outline: none; }
.loading { padding: 2rem; }
.muted { color: var(--portal-muted); }
.small { font-size: .875em; }
.required { color: #c43838; }
.mt { margin-top: 1rem; }
.mb { margin-bottom: 1rem; }
.row-flex, .actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.between { justify-content: space-between; }
.grow { flex: 1; }
.btn-small { font-size: .875rem; padding: .375rem .75rem; }
.page-heading { margin-bottom: 1.25rem; }
.page-heading h1 { font-size: 1.5rem; font-weight: 700; }
.page-heading p { margin-bottom: 0; }
.field .hint { display: block; font-size: .8rem; color: var(--portal-muted); margin-top: .35rem; }
.field input:not([type=checkbox]), .field select, .field textarea { width: 100%; }
.form-grid, .context-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.context-grid { grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); }
.context-grid strong, .context-grid span { display: block; }
.context-grid span { font-size: .8rem; margin-bottom: .25rem; }
.check-list { display: flex; flex-wrap: wrap; gap: .7rem 1rem; }
.check-list label, .check-label { display: flex; align-items: flex-start; gap: .5rem; }
.check-list input, .check-label input { margin-top: .3rem; }
fieldset { min-width: 0; border: 0; padding: 0; margin: 0; }
fieldset legend { font-size: 1rem; font-weight: 600; }
.portal-content input[type=checkbox], .portal-content .form-check-input { min-height: 1em; border-radius: .25em; }
.portal-user > div:last-child { min-width: 0; }
.portal-user .fw-bold, .portal-user small { overflow-wrap: anywhere; }
.portal-user small { font-size: .8rem; color: rgba(255,255,255,.8); }
.portal-user .avatar { flex-shrink: 0; }
.scope-pill select { background: transparent; border: 0; color: inherit; max-width: 220px; font-weight: 600; cursor: pointer; }
.scope-pill select:focus-visible { outline: 2px solid var(--portal-accent); }
.scope-pill select option { color: #213547; background: white; }
.portal-nav .nav-link.disabled { opacity: .48; cursor: not-allowed; }
.portal-topbar .top-pill { white-space: nowrap; }
.portal-nav .nav-link { font-size: 1rem; }
.status-needs_more_information, .status-email_verified { background: #fff8e5; color: var(--portal-warning); }
.status-expired, .status-disabled, .status-inactive { background: #fff1f1; color: var(--portal-danger); }
.status-none { background: #eef2f6; color: #596d82; }
.impersonation-banner { padding: .85rem 1.5rem; background: #fff3cd; border-bottom: 1px solid #ffecb5; display: flex; justify-content: space-between; gap: 1rem; align-items: center; flex-wrap: wrap; }
.signature-preview { overflow-wrap: anywhere; }
.agreement-body { max-height: 380px; overflow: auto; padding: 1.25rem; border: 1px solid #d8e5f2; border-radius: 16px; background: #fafcff; }
.agreement-body h1, .agreement-body h2 { font-size: 1.25rem; }
.total-bar { padding: 1rem 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.qty { width: 82px; min-width: 82px; }
.cell-treatment { width: 85px; }
.cell-wound { min-width: 130px; }
.steps { display: flex; gap: .75rem; margin-bottom: 1rem; flex-wrap: wrap; }
.step { border: 1px solid var(--portal-border); background: white; padding: .8rem; border-radius: 12px; }
.step b { margin-right: .5rem; }
.step.active { background: #edf5ff; }
.audit-code { font-family: monospace; font-size: .8rem; }
.ad-card { background: #edf5ff; padding: 1rem; border: 1px solid var(--portal-border); border-radius: 16px; height: 100%; }
.ad-card img { max-width: 100%; height: auto; }
.admin-editor { margin-bottom: 1.5rem; }
.portal-panel h2 { font-size: 1.1rem; }
.form-section-card:has(>h2) { padding: 1.25rem; margin-bottom: 1rem; }
.form-section-card>h2 { font-size: 1rem; font-weight: 700; margin-bottom: 1rem; }
.form-control[readonly] { background-color: #f8fafc; }
.search-input { max-width: 320px; }
.inline-note { color: var(--portal-muted); font-size: .8rem; }
.two-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.auth-form-wrap .btn { display: inline-flex; align-items: center; justify-content: center; }
.auth-form-wrap form { margin: 0; }
.admin-only-note { font-size: .8rem; }
@media(max-width: 767.98px) {
    .auth-brand, .auth-form-wrap { padding: 2rem; }
    .two-columns, .form-grid { grid-template-columns: 1fr; }
    .scope-pill select { max-width: 190px; }
}

/* Static prototype dimensions expressed as classes for the CSP. */
.source-inline-1 {width: 220px;}
.source-inline-2 {width: 260px;}
.source-inline-3 {width: 260px;}
.source-inline-4 {width: 190px;}
.source-inline-5 {width: 220px;}
.source-inline-6 {width: 260px;}
.source-inline-7 {width: 220px;}
.source-inline-8 {width: 260px;}
.source-inline-9 {width: 260px;}
.source-inline-10 {width: 280px;}
.source-inline-11 {width: 180px;}