/* ============================================================
   Raporty — dashboard 5e (pas KPI, paski udziału/acceptance, stacked
   bar pipeline) + przekroje szczegółowe spec §10. Kolory: tylko tokeny.
   (Tabela .tbl bazowa żyje w styles.css — współdzielona z Adminem.)
   ============================================================ */

/* --- kontrolki globalne: okres + brand + eksport w jednej linii --- */
.rep-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.rep-brand{width:auto;min-width:150px;padding-top:6px;padding-bottom:6px}
.rep-csv-sm{padding:4px 10px;font-size:var(--font-size-sm)}

/* --- pas KPI (mono 24px, border góra/dół) --- */
.rep-kpi-strip{display:flex;align-items:baseline;gap:36px;margin-top:24px;padding:18px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.rep-kpi-label{font:400 var(--font-size-sm) var(--font-mono);color:var(--text-faint)}
.rep-kpi-val{font:600 24px var(--font-mono);letter-spacing:-.02em;margin-top:6px;color:var(--text-primary)}
.rep-kpi-val.is-soft{color:var(--text-soft)}
.rep-kpi-val.is-accent{color:var(--accent-soft)}
.rep-kpi-note{align-self:center;font:400 var(--font-size-xs) var(--font-mono);color:var(--text-faint);text-align:right}

/* --- siatka dwóch kolumn: PER BRAND / PER MODEL·ACCEPTANCE --- */
.rep-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;margin-top:26px}
.rep-grid .section-label{display:block;margin-bottom:0}

/* --- wiersze sekcji z paskami --- */
.rep-row{display:grid;align-items:center;gap:0 14px;padding:10px 0;border-bottom:1px solid var(--border-hairline);font-size:var(--font-size-base)}
.rep-row.is-head{padding:8px 0;margin-top:8px;font-size:var(--font-size-xs);letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint)}
.rep-row:last-of-type{border-bottom:none}
.rep-cell-name{font-weight:500;color:var(--text-primary)}
.rep-num{font:500 var(--font-size-sm) var(--font-mono);color:var(--text-primary)}
.rep-num.is-muted{font-weight:400;color:var(--text-secondary)}
.rep-num.is-best{color:var(--success)}
.rep-num.is-accent{color:var(--accent-soft)}
.rep-empty{padding:10px 0;font-size:var(--font-size-base);color:var(--text-secondary)}
.rep-note{font:400 var(--font-size-xs) var(--font-mono);color:var(--text-faint);margin-top:14px}

/* --- paski udziału / acceptance --- */
.rep-bar-track{height:3px;background:var(--border-section);border-radius:var(--radius-pill);overflow:hidden}
.rep-bar-fill{display:block;height:100%;background:var(--text-secondary)}
.rep-bar-fill.is-best{background:var(--success)}

/* --- stacked bar pipeline + legenda --- */
.rep-stack{display:flex;height:14px;border-radius:var(--radius-1);overflow:hidden;margin-top:12px;gap:2px}
.rep-stack-seg{height:100%}
.rep-legend{display:flex;flex-wrap:wrap;gap:32px;margin-top:10px;font-size:var(--font-size-base);color:var(--text-secondary)}
.rep-legend-item{display:inline-flex;align-items:center;gap:7px}
.rep-legend-sw{width:8px;height:8px;border-radius:2px;display:inline-block}
.rep-legend .rep-num{color:var(--text-primary)}
/* 4 odcienie stacked bara — najbliższe tokeny do szarości planszy */
.stack-1{background:var(--border-field-hover)}
.stack-2{background:var(--border-chip)}
.stack-3{background:var(--border-ghost)}
.stack-4{background:var(--border-section)}

/* --- przekroje szczegółowe (spec §10) pod dashboardem --- */
.rep-detail-head{display:flex;align-items:baseline;gap:12px;margin-top:40px}
.rep-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.rep-tab{background:var(--surface-1);border:1px solid var(--border-chip);border-radius:var(--radius-2);padding:5px 12px;font:500 var(--font-size-base) var(--font-ui);color:var(--text-secondary);cursor:pointer}
.rep-tab:hover{border-color:var(--border-field-hover);color:var(--text-primary)}
.rep-tab.is-active{background:var(--surface-active);color:var(--text-primary);border-color:var(--border-field-hover)}
.tbl tr.rep-total td{border-top:1px solid var(--border-strong);border-bottom:none;color:var(--text-primary)}
