/* Mingle – a napi zárás „Áruk szerinti forgalom” szakasza és a riport „Áttekintés” (tulajdonosi irányítópult) stílusa.
   Csak tokenek (style.css): sötét és világos módban ugyanúgy olvasható. Nincs külső betű, kép, script. */

/* ---------- napi zárás: áruk szerinti forgalom ---------- */
.prod-section > summary { justify-content: flex-start; }
.prod-summary-title { flex: 1 1 auto; }
.prod-summary-sum { font-family: var(--font-num); font-weight: 600; color: var(--num); }
.prod-body { display: flex; flex-direction: column; gap: var(--space-3); }
.prod-cat { display: flex; flex-direction: column; background: var(--surface); border-radius: var(--radius); }
.prod-row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; gap: var(--space-3);
  min-height: 40px; padding: 8px var(--space-4); border-bottom: 1px solid var(--border);
}
.prod-row:last-child { border-bottom: 0; }
.prod-name { color: var(--ink2); overflow-wrap: anywhere; }
.prod-qty { color: var(--muted); font-size: 13px; text-align: right; }
.prod-sum { min-width: 88px; font-family: var(--font-num); font-weight: 600; color: var(--num); text-align: right; font-variant-numeric: tabular-nums lining-nums; }
.prod-cat-head .prod-name { color: var(--text); font-weight: 600; }
.prod-total { background: var(--surface); border-radius: var(--radius); border-bottom: 0; }
.prod-total .prod-name { color: var(--text); font-weight: 600; }
.prod-voided .prod-cat-head .prod-name { color: var(--ink2); }
.prod-row.is-void .prod-name, .prod-row.is-void .prod-sum { color: var(--muted); text-decoration: line-through; }
.prod-check { margin: 0; }

/* ---------- riport: nézet-választó ---------- */
.report-mode { margin-top: 0; }

/* ---------- irányítópult ---------- */
.dash-view { display: flex; flex-direction: column; gap: var(--space-4); }
.dash-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
@media (min-width: 900px) {
  .dash-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dash-card-wide { grid-column: 1 / -1; }
}
/* csak a riport kártyái (.dash-cards): a tulajdonosi Áttekintés (style.css .dash-card / .dash-hero) saját stílusát nem írja felül */
.dash-cards > .dash-card { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; padding: var(--space-4); background: var(--surface); border-radius: var(--radius); }
.dash-cards > .dash-card .section-title { margin: 0; }
.dash-cards > .dash-card .hint { margin: 0; }
.dash-plot { width: 100%; min-width: 0; overflow: hidden; }

/* SVG-rajz: a színek a tokenekből */
.dash-chart { display: block; max-width: 100%; height: auto; overflow: visible; }
.dash-grid { stroke: var(--border); stroke-width: 1; }
.dash-base { stroke: var(--border-strong); }
.dash-axis { fill: var(--muted); font-family: var(--font-num); font-size: 11px; font-variant-numeric: tabular-nums; }
/* csak az SVG-rajzon: az Áttekintés div-es oszlopai (style.css .dash-bar) nem halványulnak */
.dash-chart .dash-bar { fill: var(--primary); opacity: .72; }
.dash-chart .dash-bar-max { opacity: 1; }
.dash-hit { fill: transparent; }
.dash-hit:hover + .dash-axis, .dash-chart .dash-bar:hover { opacity: 1; }
.dash-share-bar { width: 100%; height: 20px; border-radius: 4px; }

/* fizetési módok: szakasz-színek (a jelmagyarázatban mindig szöveg + százalék is) */
.pm-0 { fill: var(--primary); background: var(--primary); }
.pm-1 { fill: var(--c-sor, var(--amb)); background: var(--c-sor, var(--amb)); }
.pm-2 { fill: var(--c-kok, var(--red)); background: var(--c-kok, var(--red)); }
.pm-3 { fill: var(--ink2); background: var(--ink2); }
.dash-legend { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.dash-legend-row {
  display: grid; grid-template-columns: 12px minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-3);
  min-height: 40px; border-bottom: 1px solid var(--border);
}
.dash-legend-row:last-child { border-bottom: 0; }
.dash-swatch { width: 12px; height: 12px; border-radius: 2px; }
.dash-legend-label { color: var(--ink2); }
.dash-legend-pct { color: var(--text); font-family: var(--font-num); font-weight: 600; }
.dash-legend-num { min-width: 88px; color: var(--num); font-family: var(--font-num); font-weight: 600; text-align: right; }

/* top / gyenge termékek: vízszintes sávok (a sáv csak díszítés; a szám szövegként is ott van) */
.dash-hbars { display: flex; flex-direction: column; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.dash-hbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "label num" "track sub"; align-items: baseline; gap: 2px var(--space-3); }
.dash-hbar-label { grid-area: label; color: var(--text); overflow-wrap: anywhere; }
.dash-hbar-num { grid-area: num; color: var(--num); font-family: var(--font-num); font-weight: 600; text-align: right; }
.dash-hbar-sub { grid-area: sub; color: var(--muted); font-size: 12px; text-align: right; }
.dash-hbar-track { grid-area: track; align-self: center; height: 6px; background: var(--surface-2); border-radius: 3px; overflow: hidden; }
.dash-hbar-fill { display: block; height: 100%; background: var(--primary); border-radius: 3px; }