h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}
/* ---------- HIPS Central: tokens (light / dark) ---------- */
:root {
    color-scheme: light;
    --surface-0: #f4f4f2;
    --surface-1: #fcfcfb;
    --text-primary: #0b0b0b;
    --text-secondary: #52514e;
    --text-muted: #898781;
    --grid: #e1e0d9;
    --baseline: #c3c2b7;
    --border: rgba(11, 11, 11, 0.10);
    --series-1: #2a78d6;   /* this facility */
    --series-2: #eb6834;   /* peer pooled */
    --band: #d6d5cf;       /* peer interquartile band (neutral) */
    /* national BLS rates (grouped chart): purple for hospitals, greys for all private industry / all industries */
    --series-3: #6d4fd8;
    --series-4: #a996ee;
    --series-5: #6b6a66;
    --series-6: #a9a8a2;
    --accent: #0F766E;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;
        --surface-0: #111110;
        --surface-1: #1a1a19;
        --text-primary: #ffffff;
        --text-secondary: #c3c2b7;
        --text-muted: #898781;
        --grid: #2c2c2a;
        --baseline: #383835;
        --border: rgba(255, 255, 255, 0.10);
        --series-1: #3987e5;
        --series-2: #d95926;
        --band: #3c3c39;
        --series-3: #8f76ee;
        --series-4: #5e4bb0;
        --series-5: #a9a8a2;
        --series-6: #6b6a66;
        --accent: #3FB8AE;
    }
}
:root[data-theme="dark"] {
    color-scheme: dark;
    --surface-0: #111110;
    --surface-1: #1a1a19;
    --text-primary: #ffffff;
    --text-secondary: #c3c2b7;
    --text-muted: #898781;
    --grid: #2c2c2a;
    --baseline: #383835;
    --border: rgba(255, 255, 255, 0.10);
    --series-1: #3987e5;
    --series-2: #d95926;
    --band: #3c3c39;
    --series-3: #8f76ee;
    --series-4: #5e4bb0;
    --series-5: #a9a8a2;
    --series-6: #6b6a66;
    --accent: #3FB8AE;
}

body {
    margin: 0;
    background: var(--surface-0);
    color: var(--text-primary);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    line-height: 1.45;
}
.site-header {
    display: flex; align-items: center; gap: 24px;
    padding: 12px 24px; background: var(--surface-1); border-bottom: 1px solid var(--border);
}
.site-header .brand { font-weight: 650; color: var(--text-primary); text-decoration: none; }
.site-header nav { display: flex; gap: 16px; }
.site-header nav a { color: var(--text-secondary); text-decoration: none; padding: 4px 0; }
.site-header nav a.active { color: var(--text-primary); box-shadow: inset 0 -2px 0 var(--accent); }
.site-main { max-width: 1040px; margin: 0 auto; padding: 24px 16px 48px; }
.page-lead, .chart-sub { color: var(--text-secondary); margin-top: 0; }
.chart-title { font-size: 1.1rem; margin: 24px 0 2px; }
.chart-sub { font-size: .85rem; }
table { border-collapse: collapse; }
th, td { padding: 4px 10px; text-align: left; border-bottom: 1px solid var(--border); font-variant-numeric: tabular-nums; }

/* filters: one row above the charts */
.filters { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: end;
           padding: 12px 16px; background: var(--surface-1); border: 1px solid var(--border); border-radius: 8px; }
.filters label { display: flex; flex-direction: column; gap: 4px; font-size: .8rem; color: var(--text-secondary); }
.filters select, .filters input { font: inherit; font-size: .9rem; padding: 4px 6px; color: var(--text-primary);
                                  background: var(--surface-1); border: 1px solid var(--baseline); border-radius: 6px; }

/* ---------- report bar chart (OHSN style) ---------- */
.viz-root { background: var(--surface-1); border: 1px solid var(--border); border-radius: 8px; padding: 12px 16px 8px; }
.viz-title { text-align: center; line-height: 1.45; margin: 0 0 8px; font-size: .9rem; color: var(--text-secondary); }
.viz-title div:first-child { font-weight: 600; font-size: 1.02rem; color: var(--text-primary); }
.viz-caption { margin: 0 0 8px; font-size: .85rem; color: var(--text-secondary); }
.viz-scroll { overflow-x: auto; }
.viz-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; list-style: none; margin: 0 0 6px; padding: 0;
              font-size: .85rem; color: var(--text-secondary); }
.viz-legend li { display: inline-flex; align-items: center; gap: 6px; }
.viz-chart { width: 100%; height: auto; display: block; font-size: 12px; }
.viz-grid { stroke: var(--grid); stroke-width: 1; }
.viz-baseline { stroke: var(--baseline); stroke-width: 1; }
.viz-tick { fill: var(--text-muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.viz-label { fill: var(--text-secondary); }
.viz-value { fill: var(--text-primary); font-size: 11px; font-variant-numeric: tabular-nums; }
.viz-value-peer { fill: var(--text-secondary); }
.viz-axis-title { fill: var(--text-secondary); font-size: 11px; }
.mark-facility { fill: var(--series-1); }
.mark-peer { fill: var(--series-2); }
.mark-band { fill: var(--band); }
.mark-whisker { fill: none; stroke: var(--text-primary); stroke-width: 1.5; }
.viz-hit { fill: transparent; }
.viz-row:hover .viz-hit, .viz-row:focus .viz-hit { fill: var(--grid); fill-opacity: .45; }
.viz-row:focus { outline: none; }
.viz-row:focus-visible .viz-hit { stroke: var(--accent); stroke-width: 1.5; }
.viz-table { margin-top: 8px; font-size: .85rem; }
.viz-table summary { cursor: pointer; color: var(--text-secondary); }
.viz-table table { margin-top: 6px; width: 100%; }
.viz-empty { color: var(--text-secondary); }

.is-updating { opacity: .55; transition: opacity .15s; }

.site-header .brand { display: inline-flex; align-items: center; gap: 8px; }
.site-header .brand img { width: 22px; height: 22px; }
.back-home { display: inline-block; margin-top: 12px; }
a { color: var(--accent); }

/* ---------- Submissions ---------- */
.table-wrap { overflow-x: auto; margin: 8px 0 20px; }
table.data { border-collapse: collapse; width: 100%; font-size: .9rem; }
table.data th, table.data td { text-align: left; padding: 7px 10px; border-bottom: 1px solid var(--border); vertical-align: top; }
table.data thead th { color: var(--text-secondary); font-weight: 600; font-size: .8rem; white-space: nowrap; }
table.data .nw { white-space: nowrap; }
table.data .num { text-align: right; font-variant-numeric: tabular-nums; }
table.data.facts { width: auto; margin: 8px 0 12px; }
table.data.facts th { color: var(--text-secondary); font-weight: 500; padding-right: 24px; }
.badge { display: inline-block; font-size: .72rem; padding: 1px 7px; border-radius: 10px; border: 1px solid var(--border); color: var(--text-secondary); margin-left: 4px; }
.status { display: inline-block; font-size: .78rem; font-weight: 600; padding: 2px 8px; border-radius: 10px; background: var(--surface-0); border: 1px solid var(--border); }
.status-I { color: var(--accent); }
.status-X { color: #b42318; }
.status-W { color: #9a6700; }
.status-S, .status-R { color: var(--text-secondary); }
ul.issues { padding-left: 0; list-style: none; }
ul.issues li { padding: 6px 0; border-bottom: 1px solid var(--border); font-size: .9rem; }
.filters label.check { flex-direction: row; align-items: center; gap: 6px; }
.pager { display: flex; align-items: center; gap: 12px; margin: 4px 0 24px; }
.btn { font: inherit; font-size: .9rem; padding: 6px 14px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface-1); color: var(--text-primary); cursor: pointer; }
.btn:disabled { opacity: .45; cursor: default; }

/* ---------- Reports ---------- */
.filter-more { margin: 4px 0 14px; }
.filter-more summary { cursor: pointer; color: var(--text-secondary); font-size: .9rem; }
.report-title { margin: 16px 0 6px; line-height: 1.45; }
.report-title div:first-child { font-weight: 600; font-size: 1.05rem; }
.report-title div:not(:first-child) { color: var(--text-secondary); font-size: .9rem; }
.report-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 6px 0 10px; }
.report-tabs { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: -4px 0 14px; border-bottom: 1px solid var(--border); }
.report-tabs a { padding: 6px 0; color: var(--text-secondary); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.report-tabs a.active { color: var(--text-primary); border-bottom-color: var(--accent); font-weight: 600; }
.standard-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; margin-top: 12px; }
.standard-group { padding: 14px 16px; background: var(--surface-1); border: 1px solid var(--border); border-radius: 8px; }
.standard-group h2 { font-size: 1rem; margin: 0 0 8px; }
.standard-group ul { margin: 0; padding-left: 18px; line-height: 1.8; }
table.data td.num, table.data th.num { text-align: right; font-variant-numeric: tabular-nums; }
.footnotes { font-size: .82rem; color: var(--text-secondary); padding-left: 20px; max-width: 900px; }
.months-summary { margin-top: 10px; }

/* ---------- Dashboard ---------- */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
:root { --ms-ok: var(--accent); --ms-due: #9a6700; --ms-late: #b42318; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --ms-due: #e3b341; --ms-late: #f97066; } }
:root[data-theme="dark"] { --ms-due: #e3b341; --ms-late: #f97066; }
.month-strip { display: flex; gap: 4px; list-style: none; margin: 8px 0; padding: 0; flex-wrap: wrap; }
.month-strip li { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.month-strip .ms-label { font-size: .7rem; color: var(--text-muted); white-space: nowrap; }
.ms-cell { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 22px; border-radius: 4px;
           font-size: .72rem; font-weight: 700; border: 1.5px solid transparent; box-sizing: border-box; }
.month-strip.compact { margin: 0; gap: 2px; flex-wrap: nowrap; }
.month-strip.compact .ms-cell { width: 12px; height: 16px; border-radius: 2px; font-size: .6rem; border-width: 1px; }
.ms-submitted .ms-cell { background: var(--ms-ok); }
.ms-noevents .ms-cell { background: var(--surface-1); border-color: var(--ms-ok); color: var(--ms-ok); }
.ms-notpart .ms-cell { background: repeating-linear-gradient(135deg, var(--grid) 0 3px, var(--surface-1) 3px 6px); border-color: var(--baseline); }
.ms-due .ms-cell { background: var(--surface-1); border: 1.5px dashed var(--ms-due); }
.ms-pastdue .ms-cell { background: var(--ms-late); color: #fff; }
.ms-inprogress .ms-cell { background: var(--surface-1); border: 1px dashed var(--baseline); }
.month-strip.compact .ms-noevents .ms-cell, .month-strip.compact .ms-pastdue .ms-cell { font-size: 0; }
.month-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; list-style: none; margin: 4px 0 12px; padding: 0; font-size: .8rem; color: var(--text-secondary); }
.month-legend li { display: inline-flex; align-items: center; gap: 6px; }
.month-legend .ms-cell { width: 18px; height: 14px; font-size: .6rem; }
.dash-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin: 12px 0 20px; }
.tile { padding: 12px 14px; background: var(--surface-1); border: 1px solid var(--border); border-radius: 8px; }
.tile .tile-value { font-size: 1.6rem; font-weight: 650; font-variant-numeric: tabular-nums; line-height: 1.2; }
.tile .tile-label { font-size: .82rem; color: var(--text-secondary); }
.tile .tile-value.late { color: var(--ms-late); }
.card { padding: 14px 16px; background: var(--surface-1); border: 1px solid var(--border); border-radius: 8px; margin: 12px 0; }
.card h2 { font-size: 1rem; margin: 0 0 8px; }
.alerts { list-style: none; padding: 0; margin: 12px 0; }
.alerts li { padding: 8px 12px; border-left: 3px solid var(--ms-due); background: var(--surface-1); border-radius: 0 6px 6px 0; margin-bottom: 6px; font-size: .92rem; }
.alerts li.late { border-left-color: var(--ms-late); }
.alerts li.good { border-left-color: var(--ms-ok); }
.standing { font-weight: 600; }
.standing.good { color: var(--ms-ok); }
.standing.low { color: var(--ms-late); }
.quick-links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 8px 0 20px; }

/* ---------- Review before import ---------- */
.field-block { display: flex; flex-direction: column; gap: 4px; font-size: .85rem; color: var(--text-secondary); max-width: 640px; }
.field-block textarea { font: inherit; font-size: .95rem; padding: 6px 8px; color: var(--text-primary); background: var(--surface-1);
                        border: 1px solid var(--border); border-radius: 6px; }
.alert-text { color: var(--ms-late); }
.btn-primary { background: var(--accent); color: var(--surface-0); border-color: transparent; }
.ms-review .ms-cell { background: repeating-linear-gradient(90deg, var(--accent) 0 2px, var(--surface-1) 2px 5px); border: 1px solid var(--accent); }

/* ---------- Health system admin ---------- */
.limit-box { border: 1px solid var(--border); border-radius: 6px; padding: 8px 12px; display: flex; flex-wrap: wrap; gap: 4px 18px; }
.limit-box legend { font-size: .85rem; color: var(--text-secondary); }
.limit-box label.check { display: inline-flex; gap: 6px; align-items: center; font-size: .9rem; }
.limit-box p { flex-basis: 100%; margin: 6px 0 0; }
details.card summary { cursor: pointer; font-weight: 600; }
.btn-link { background: none; border: none; color: var(--accent); cursor: pointer; font: inherit; padding: 0 4px; text-decoration: underline; }
code.secret { display: inline-block; padding: 6px 10px; background: var(--surface-0); border: 1px solid var(--border); border-radius: 6px; word-break: break-all; font-size: .95rem; }
.staffing-grid input { width: 8em; text-align: right; font: inherit; padding: 3px 6px; color: var(--text-primary); background: var(--surface-1); border: 1px solid var(--border); border-radius: 4px; }

/* ---------- grouped bar chart (national rates by year) ---------- */
.mark-s1 { fill: var(--series-1); }
.mark-s2 { fill: var(--series-2); }
.mark-s3 { fill: var(--series-3); }
.mark-s4 { fill: var(--series-4); }
.mark-s5 { fill: var(--series-5); }
.mark-s6 { fill: var(--series-6); }
.rate-table td.num, .rate-table th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rate-table tr.is-bls td, .rate-table tr.is-bls th { color: var(--text-secondary); }
.rate-notes { font-size: .85rem; color: var(--text-secondary); padding-left: 18px; }
.rate-latest { margin: 4px 0; }
.rate-scope { margin: 0 0 10px; font-size: .9rem; color: var(--text-secondary); }
