/* SCENARIUM – Systemfähigkeit erfassen (Schritt 1, system-capabilities.js) */
.sf-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; }
.sf-bar { margin-top: 16px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); }
.sf-tbl th { white-space: nowrap; }
.sf-tbl td { vertical-align: middle; }
.sf-l { font-weight: 600; font-size: 13px; }
.sf-tbl td.used { box-shadow: inset 2px 0 0 color-mix(in srgb, var(--decl) 70%, transparent); }
.sf-tbl td:first-child { min-width: 210px; }
.sf-tbl td.need .inp { border-color: var(--warn); background: var(--warn-soft); }
.sf-tbl td.chg .inp { border-color: var(--accent); }
.sf-in.bad { border-color: var(--bad) !important; background: var(--bad-soft) !important; }
.sf-num { display: inline-flex; align-items: center; gap: 6px; }
.sf-num .u { color: var(--muted); font-size: 12px; white-space: nowrap; }
.sf-tbl .num-in { width: 96px; }
.sf-wide { width: 220px; }
.sf-tbl select.inp { min-width: 92px; }
.sf-use { margin-top: 4px; }
td.sf-use { margin: 0; }
.chip.sf-scn { text-decoration: none; font-family: var(--mono); font-size: 11px; margin: 1px 0; display: inline-block; }
.chip.sf-scn:hover { border-color: var(--accent); color: var(--accent); }
.sf-arr { margin-top: 12px; }
/* Anzeige-Filter */
.sf-show-used tr.unused, .sf-show-used .sf-sec.unused, .sf-show-need tr:not(.need), .sf-show-need .sf-sec.noneed { display: none; }
.sf-show-need thead tr { display: table-row !important; }
.sf-show-need .sf-arr { display: none; }
/* Status je Szenario */
.sfb { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; white-space: nowrap; cursor: help; }
.sfb.ok, .sfb.none { background: var(--ok-soft); color: var(--ok); }
.sfb.open { background: var(--warn-soft); color: var(--warn); }
.sfb.na { background: var(--panel-2); color: var(--muted); border: 1px solid var(--line); }
.sf-banner .card-b { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
@media (max-width: 640px) { .sf-wide { width: 160px; } }
