/* secmon — on top of Bootstrap 5.3. No inline styles anywhere (CSP style-src 'self'). */
:root, [data-bs-theme="light"] {
  --sev-critical: #c1121f; --sev-critical-bg: #fde7e9;
  --sev-high: #d9480f;     --sev-high-bg: #fff0e6;
  --sev-medium: #b08900;   --sev-medium-bg: #fff8db;
  --sev-low: #1c7ed6;      --sev-low-bg: #e7f3ff;
  --sev-unknown: #6c757d;  --sev-unknown-bg: #eef0f2;
  --secmon-surface: #ffffff; --secmon-canvas: #f5f6f8;
}
[data-bs-theme="dark"] {
  --sev-critical: #ff6b6b; --sev-critical-bg: rgba(255, 107, 107, .15);
  --sev-high: #ff922b;     --sev-high-bg: rgba(255, 146, 43, .15);
  --sev-medium: #fcc419;   --sev-medium-bg: rgba(252, 196, 25, .13);
  --sev-low: #74c0fc;      --sev-low-bg: rgba(116, 192, 252, .13);
  --sev-unknown: #adb5bd;  --sev-unknown-bg: rgba(173, 181, 189, .13);
  --secmon-surface: #1b1e22; --secmon-canvas: #121417;
}
body { background: var(--secmon-canvas); }
.navbar-secmon { background: #14213d; }
.navbar-secmon .navbar-brand { font-weight: 600; letter-spacing: .01em; }
.navbar-secmon .nav-link.active { color: #fff; box-shadow: inset 0 -2px 0 #fca311; }
.card { background: var(--secmon-surface); border-color: var(--bs-border-color-translucent); }
.page-title { font-size: 1.35rem; font-weight: 600; margin: 0; }
.mono { font-family: var(--bs-font-monospace); font-size: .85em; }
.nowrap { white-space: nowrap; }
.text-break-all { word-break: break-all; }

.badge.sev { font-weight: 600; letter-spacing: .02em; }
.sev-critical { background: var(--sev-critical-bg); color: var(--sev-critical); }
.sev-high { background: var(--sev-high-bg); color: var(--sev-high); }
.sev-medium { background: var(--sev-medium-bg); color: var(--sev-medium); }
.sev-low { background: var(--sev-low-bg); color: var(--sev-low); }
.sev-unknown { background: var(--sev-unknown-bg); color: var(--sev-unknown); }
.count-critical, .table > :not(caption) > * > .count-critical { color: var(--sev-critical); font-weight: 600; }
.count-high, .table > :not(caption) > * > .count-high { color: var(--sev-high); font-weight: 600; }
.badge.kev { background: var(--sev-critical); color: #fff; }
.count-zero, .table > :not(caption) > * > .count-zero { color: var(--bs-secondary-color); }
tr.is-muted > td { --bs-table-color: var(--bs-secondary-color); }
.title-cell { max-width: 28rem; }
.col-lg-6 .title-cell { max-width: 16rem; }

.stat-card .stat-value { font-size: 2rem; font-weight: 600; line-height: 1.1; font-variant-numeric: tabular-nums; }
.stat-card .stat-label { color: var(--bs-secondary-color); font-size: .85rem; }
.stat-card.is-critical .stat-value { color: var(--sev-critical); }
.stat-card.is-warning .stat-value { color: var(--sev-high); }

.table-secmon { --bs-table-bg: transparent; margin-bottom: 0; }
.table-secmon th { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em;
  color: var(--bs-secondary-color); font-weight: 600; white-space: nowrap; }
.table-secmon td { vertical-align: middle; }
.table-secmon td.num, .table-secmon th.num { text-align: right; font-variant-numeric: tabular-nums; }
tr.is-muted td { color: var(--bs-secondary-color); }

.trend { width: 100%; height: auto; display: block; }
.trend .grid { stroke: var(--bs-border-color); stroke-width: 1; }
.trend .axis { fill: var(--bs-secondary-color); font-size: 11px; }
.trend .line { fill: none; stroke-width: 2; stroke-linejoin: round; }
.trend .line-critical { stroke: var(--sev-critical); }
.trend .line-high { stroke: var(--sev-high); }
.trend .line-medium { stroke: var(--sev-medium); }
.legend { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .85rem; color: var(--bs-secondary-color); }
.legend-item { display: inline-flex; align-items: center; gap: .4rem; }
.legend-swatch { width: .8rem; height: .25rem; border-radius: 2px; display: inline-block; }
.swatch-critical { background: var(--sev-critical); }
.swatch-high { background: var(--sev-high); }
.swatch-medium { background: var(--sev-medium); }

.auth-wrap { min-height: 100vh; display: grid; place-items: center; padding: 1rem; }
.auth-card { width: 100%; max-width: 380px; }
.facts dt { color: var(--bs-secondary-color); font-weight: 500; }
.facts dd { margin-bottom: .5rem; overflow-wrap: anywhere; }
.filter-checks .form-check { margin-right: .75rem; }
