/* Octopus > Statistiche — shared report styles. Tweak here to restyle all report pages. */
.statfilters { display:flex; flex-wrap:wrap; align-items:flex-end; gap:14px; margin-bottom:24px; }
.statfilters .fld { display:flex; flex-direction:column; }
.statfilters label { font-size:11px; color:#8a8a8a; text-transform:uppercase; margin-bottom:4px; }
.statfilters select, .statfilters input[type="text"] { min-width:150px; }

.toggle { display:inline-flex; border:1px solid #e4e4e4; background:#fff; border-radius:2px; overflow:hidden; }
.toggle span { padding:9px 14px; cursor:pointer; font-size:13px; white-space:nowrap; }
.toggle span.on { background:#252525; color:#fff; }

.kpigrid { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px; }
.kpicard { flex:1 1 150px; background:#fff; border:1px solid #e4e4e4; padding:16px 18px; border-radius:2px; min-width:150px; }
.kpicard .kpilabel { font-size:12px; color:#8a8a8a; text-transform:uppercase; letter-spacing:.03em; }
.kpicard .kpivalue { font-size:26px; font-weight:600; margin-top:6px; line-height:1.1; }
.kpicard .kpisub { font-size:12px; color:#a0a0a0; margin-top:4px; }
.kpicard.accent .kpivalue { color:#1a7f5a; }

.chartwrap { background:#fff; border:1px solid #e4e4e4; padding:18px; margin-bottom:24px; }
.chartwrap.half { flex:1 1 380px; min-width:320px; }
.chartrow { display:flex; flex-wrap:wrap; gap:16px; }
.chartwrap canvas { max-height:340px; }
.chartwrap h4 { margin:0 0 14px; font-size:14px; font-weight:600; }

.stattable table { width:100%; }
.stattable td, .stattable th { text-align:right; padding:8px 10px; }
.stattable td:first-child, .stattable th:first-child { text-align:left; }
.stattable tbody tr:hover { background:#fafafa; }
.stattable .swatch { display:inline-block; width:11px; height:11px; border-radius:50%; border:1px solid #ddd; margin-right:7px; vertical-align:middle; }
.exportbtn { cursor:pointer; margin-top:12px; display:inline-block; }