/*
 * u10 — Benchmarks surface (/panel/analytics-benchmarks)
 *
 * Page-scoped only. Recolors the ratio-table widget's bespoke markup
 * (`.fi-wi-benchmarks`, from resources/views/filament/widgets/benchmark-
 * ratios.blade.php) onto EDS tokens; every rule here is namespaced under
 * that wrapper class so it can never leak onto another surface's markup.
 *
 * EmployerAnalytics does not currently compose BenchmarkRatiosWidget, so
 * `.fi-wi-benchmarks` never renders there — this file has no effect on
 * /panel/employer-analytics today. Revisit if that page ever adds the
 * widget.
 */

/* ── Ratio tables ("Search & discovery", "Funnel conversion", "Speed",
   "Volume") — reuse the shared .fi-eds-table look for header + hairlines,
   the rows just aren't a navigation target here. */
.fi-wi-benchmarks .fi-eds-table tbody tr { cursor: default; }

/* The family tables already sit inside a .fi-section card, so the reused
   .fi-eds-table-wrap shouldn't double up its own border/shadow/radius. */
.fi-wi-benchmarks .u10-table-wrap { box-shadow: none; border: 0; border-radius: 0; }
.fi-wi-benchmarks .u10-table { min-width: 52rem; }
/* .fi-eds-table's own `thead th { text-align: left }` outranks the bare
   .text-right utility (type+class vs. a single class) — scope the override
   under the wrapper to win the specificity. Body cells carry the same
   .text-right marker (no compiled utility backs it on /panel), so align
   them here too or headers right-align over left-aligned values. */
.fi-wi-benchmarks .fi-eds-table thead th.text-right,
.fi-wi-benchmarks .fi-eds-table tbody td.text-right { text-align: right; }
/* The shared .fi-eds-table primitive centers every cell vertically
   (eds-panel.css); these rows carry a multi-line label+note in column one
   next to single-line value/sample/badge cells, so centering floats the
   value away from the label it describes. Pin the whole row back to top. */
.fi-wi-benchmarks .u10-table tbody td { vertical-align: top; }
/* The "Quotable externally" column is the narrowest and its badges carry
   the longest labels ("no - internal only (under 30)") — give it room and
   stop Filament's badge-label truncate from clipping mid-word. */
.fi-wi-benchmarks .u10-table td:last-child { white-space: nowrap; }
.fi-wi-benchmarks .u10-table .fi-badge-label { overflow: visible; text-overflow: clip; }

/* The blade leans on Tailwind utility names (space-y-6, mt-1, max-w-prose,
   text-base, text-xs) that NO compiled stylesheet on /panel provides —
   Filament v4's app.css ships only its own fi-* rules. Restate their intent
   here, scoped, so the markup keeps reading as written. */
.fi-wi-benchmarks.space-y-6 { display: flex; flex-direction: column; gap: 1.5rem; }
.fi-wi-benchmarks .u10-label { color: var(--ink); font-weight: 600; }
.fi-wi-benchmarks .u10-note { color: var(--ink3-aa); margin-top: .25rem; max-width: 65ch; font-size: .75rem; line-height: 1.5; }
.fi-wi-benchmarks .u10-value { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; font-size: 1rem; }
.fi-wi-benchmarks .u10-unit { color: var(--ink3); font-size: .75rem; }
.fi-wi-benchmarks .u10-body { color: var(--ink2); }
.fi-wi-benchmarks .u10-muted { color: var(--ink3-aa); }
.fi-wi-benchmarks .u10-sample { color: var(--ink2); font-variant-numeric: tabular-nums; }

/* ── "What these numbers describe" segment summary + caveats ─────────── */
.fi-wi-benchmarks .u10-kpi-unreadable { font-size: 15px; }
.fi-wi-benchmarks .u10-caveats { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.fi-wi-benchmarks .u10-caveats p { margin: 0; }
.fi-wi-benchmarks .u10-computed {
    margin-top: 16px;
    font: 400 13px/1.5 var(--sans);
    color: var(--ink3-aa);
}
.fi-wi-benchmarks .u10-computed strong { color: var(--ink2); font-weight: 600; }