/* ---------- DASHBOARD ADD-ON ----------
   Fitness-specific components layered on base.css: the trajectory chart,
   the row-filter bar, macro-vs-target meters, and session-log trim.
   Loaded only by the pages that need them. */

/* row filter bar (progressive enhancement; hidden until site.js shows it) */
.filter{
  display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px;
}
.filter button{
  font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;
  color:var(--muted);background:var(--panel);border:1px solid var(--line);
  padding:7px 13px;border-radius:6px;cursor:pointer;
}
.filter button:hover{color:var(--ink);border-color:rgba(242,167,59,.45)}
.filter button[aria-pressed="true"]{color:#0d0f12;background:var(--amber);border-color:var(--amber)}
.filter button:focus-visible{outline:2px solid var(--amber);outline-offset:1px}
.parts-card.is-empty,.parts-system.is-empty{display:none}

/* delta figures (progress) */
.delta{font-family:var(--mono);font-size:12px;font-weight:600;margin-top:6px}
.delta.up{color:var(--green)}
.delta.down{color:var(--green)}   /* losing weight/fat is good here */
.delta.warn{color:var(--red)}
.stat .sub{font-family:var(--mono);font-size:11px;color:var(--muted);margin-top:7px;text-transform:uppercase;letter-spacing:1px}

/* ---------- TRAJECTORY CHART (static inline SVG; no JS) ---------- */
.chart{
  background:var(--panel);border:1px solid var(--line);border-radius:10px;
  padding:18px 16px 14px;margin-bottom:16px;
}
.chart svg{width:100%;height:auto;display:block;font-family:var(--mono)}
.chart .grid{stroke:var(--line);stroke-width:1}
.chart .axis{fill:var(--muted2);font-size:10px}
.chart .s-weight{stroke:var(--amber)}
.chart .s-bf{stroke:var(--blue)}
.chart .s-muscle{stroke:var(--green)}
.chart .series{fill:none;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.chart .dot{stroke-width:2;fill:var(--bg)}
.chart .d-weight{stroke:var(--amber)}
.chart .d-bf{stroke:var(--blue)}
.chart .d-muscle{stroke:var(--green)}

/* ---------- MACRO METERS (menu / macros) ---------- */
.meters{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.meter{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 15px}
.meter .top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:9px}
.meter .name{font-family:var(--disp);font-weight:600;font-size:13.5px;letter-spacing:.3px}
.meter .fig{font-family:var(--mono);font-size:12px;color:var(--muted)}
.meter .fig b{color:var(--ink);font-weight:600}
.meter .track{height:7px;border-radius:4px;background:var(--panel2);overflow:hidden;border:1px solid var(--line-soft)}
.meter .fill{height:100%;border-radius:4px;background:var(--c,var(--amber))}

/* ---------- MEAL CARDS (menu) ---------- */
.meal-timing{font-family:var(--mono);font-size:11px;color:var(--amber);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}
.meal-macros{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0 0 12px;font-family:var(--mono);font-size:12px;color:var(--muted)}
.meal-macros b{color:var(--ink);font-weight:600}

/* ---------- SESSION LOG (workouts) ---------- */
.session{margin-bottom:16px}
.session .log-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.session .log-head .when{font-family:var(--mono);font-size:12px;color:var(--muted)}
.session .ex{font-family:var(--disp);font-weight:600;font-size:13.5px;letter-spacing:.3px;margin:14px 0 6px}
.session .ex:first-of-type{margin-top:6px}
.setrow td.n{font-family:var(--mono);color:var(--muted);width:46px}
.log-empty{color:var(--muted);font-size:13.5px}

/* mono macro string in the reference table */
.macros{font-family:var(--mono);font-size:12.5px;color:var(--ink);white-space:nowrap}
.macros .u{color:var(--muted)}

@media(max-width:600px){
  .meters{grid-template-columns:1fr}
  /* labelled stacking: when base.css collapses a multi-column .items table into
     blocks on phones, show each value's column name so bare numbers stay legible */
  table.items.labeled td[data-l]::before{
    content:attr(data-l);display:inline-block;min-width:90px;
    color:var(--muted);font-family:var(--mono);font-size:11px;
    text-transform:uppercase;letter-spacing:.5px;
  }
  .macros{white-space:normal}
}