/* Option A: a section is one navy panel header, so tables nested in a panel wear a light header
   (a second navy bar would double up). */
.panel .findings-table th,
.asset-group .findings-table th {
  background: #eef2f6;
  color: var(--text);
  border-bottom: 1px solid var(--border);
}

.panel-body.flush {
  padding: 0;
}

.panel-body.flush .findings-table-wrap {
  margin: 0;
}

.findings-table td {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
  /* table-layout is fixed, so a long unbroken URL must wrap inside its cell instead of spilling over the next column. */
  overflow-wrap: anywhere;
}

.findings-table tbody tr:last-child td {
  border-bottom: none;
}

.findings-table tbody tr:hover {
  background: var(--bg);
}

.findings-table .text-muted {
  color: var(--text-muted);
  font-size: 13px;
}

.badge.severity-info { background: var(--sev-info-bg); color: var(--sev-info-fg); }
.badge.severity-low { background: var(--sev-low-bg); color: var(--sev-low-fg); }
.badge.severity-medium { background: var(--sev-medium-bg); color: var(--sev-medium-fg); }
.badge.severity-high { background: var(--sev-high-bg); color: var(--sev-high-fg); }
.badge.severity-critical { background: var(--sev-critical-bg); color: var(--sev-critical-fg); }

.filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.filters a {
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-muted);
  text-decoration: none;
  background: var(--card);
  border: 1px solid var(--border);
  transition: background 0.15s, color 0.15s;
}

.filters a:hover {
  background: var(--border);
  color: var(--text);
}

.filters a.active {
  background: var(--panel-header);
  border-color: var(--panel-header);
  color: #fff;
}

.row-actions {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}

.row-actions form {
  margin: 0;
}

/* Sizing only — color/border/background come from .btn + its variant (primary/neutral/danger), so
   distinct action buttons (e.g. Resolve vs Ignore always) stay visually distinct inside a row. */
.row-actions button {
  padding: 4px 10px;
  font-size: 13px;
  font-weight: 500;
  border-radius: 6px;
}

@media (max-width: 820px) {
  .panels {
    grid-template-columns: 1fr;
  }
}

.badge.status-pass { background: var(--ok); }
.badge.status-warn { background: #f59e0b; }
.badge.status-fail { background: var(--bad); }
.badge.status-error { background: #7f1d1d; }
.badge.status-na { background: #94a3b8; }
.badge.status-pending { background: #6366f1; }

.tenant-switcher {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 12px;
}

/* Checks sit indented under their category header; each carries a left accent bar in its status colour,
   and its verification rows indent one step further (muted fill, no bar) so the accent reads as the marker. */
.monitors-table tr.check-row td:first-child {
  box-shadow: inset 3px 0 var(--border);
  padding-left: 48px;
}
.monitors-table tr.check-row.status-pass td:first-child {
  box-shadow: inset 3px 0 var(--ok);
}
.monitors-table tr.check-row.status-warn td:first-child {
  box-shadow: inset 3px 0 #f59e0b;
}
.monitors-table tr.check-row.status-fail td:first-child {
  box-shadow: inset 3px 0 var(--bad);
}
.monitors-table tr.check-row.status-na td:first-child {
  box-shadow: inset 3px 0 #94a3b8;
}
.monitors-table tr.check-row.status-error td:first-child {
  box-shadow: inset 3px 0 #7f1d1d;
}
.assertion-row td {
  background: rgba(99, 110, 130, 0.05);
  border-top: none;
  padding-top: 6px;
  padding-bottom: 6px;
}
.assertion-row td:first-child {
  padding-left: calc(24px + 3rem);
}
.row-code {
  display: inline-block;
  width: 3rem;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--text-muted, #6b7280);
}
/* A codeless check header (multi-assertion checks) must not reserve the code column — collapse it so
   the check name starts at the same left edge as single-assertion check codes. */
.row-code:empty {
  display: none;
}
/* Verification label matches the check-name size and weight, so the column reads as one size (not sub-text). */
.assertion-label {
  font-weight: 400;
}
.assertion-why {
  margin-top: 3px;
  color: var(--text-muted, #6b7280);
  font-size: 12.5px;
}