/* Lift progress (js/strengthProgressHtml.js): Strength → Progress and the Client Hub's
   Progress tab draw the same lifts the same way. */
.sp-panel [hidden], .sp-hub [hidden]{ display:none !important; }
.sp-head{ margin-bottom:14px; }
.sp-head h2{ margin:4px 0 4px; }
.sp-head p{ margin:0; color:var(--muted); font-size:14px; }
.sp-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:8px; margin:0 0 14px; }
.sp-stat{ display:flex; flex-direction:column; gap:2px; padding:12px; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.03); min-width:0; }
.sp-stat strong{ font:400 26px/1.05 var(--font-display); letter-spacing:.02em; color:var(--text); text-transform:uppercase; }
.sp-stat span{ color:var(--muted); font-size:12px; }
.sp-stat small{ color:var(--muted); font-size:11px; }
.sp-weeks{ display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:6px; align-items:end; height:96px; padding:8px 0 0; }
.sp-week{ display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:4px; height:100%; min-width:0; }
.sp-week-bar{ width:100%; max-width:34px; border-radius:6px 6px 2px 2px; background:color-mix(in srgb, var(--orange) 55%, transparent); }
.sp-week.is-now .sp-week-bar{ background:var(--primary); }
.sp-week-label{ color:var(--muted); font-size:10px; white-space:nowrap; }
.sp-note{ margin:6px 0 14px; color:var(--muted); font-size:12px; }
.sp-search{ display:block; margin:0 0 10px; }
.sp-search input{ width:100%; height:42px; padding:0 12px; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.04); color:var(--text); }
.sp-list{ display:flex; flex-direction:column; gap:6px; }
.sp-row{ display:grid; grid-template-columns:minmax(0,1fr) auto 18px; align-items:center; gap:10px; width:100%; padding:12px; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.025); color:var(--text); text-align:left; cursor:pointer; font:inherit; }
.sp-row:hover{ border-color:var(--primary); }
.sp-row-main{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.sp-row-main strong{ font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sp-row-main span{ color:var(--muted); font-size:12px; }
.sp-row-side{ display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
.sp-row-best{ font-weight:700; font-size:13px; white-space:nowrap; }
.sp-row-go{ color:var(--muted); }
.sp-row-go svg{ width:16px; height:16px; }
.sp-trend{ display:inline-block; padding:2px 8px; border-radius:999px; font-size:11px; font-weight:700; white-space:nowrap; border:1px solid var(--border); color:var(--muted); }
.sp-trend.is-up{ color:var(--green); border-color:color-mix(in srgb, var(--green) 45%, transparent); }
.sp-trend.is-down{ color:var(--amber); border-color:color-mix(in srgb, var(--amber) 45%, transparent); }
.sp-empty, .sp-empty-state p{ color:var(--muted); }
.sp-empty-state{ padding:18px; border:1px dashed var(--border); border-radius:12px; }
.sp-back{ display:inline-flex; align-items:center; gap:4px; min-height:36px; margin:0 0 8px; padding:0 10px 0 4px; border:0; background:none; color:var(--primary); font:700 14px var(--font-body); cursor:pointer; }
.sp-back svg{ width:16px; height:16px; }
.sp-figure{ margin:0 0 14px; padding:12px; border:1px solid var(--border); border-radius:12px; }
.sp-figure figcaption{ color:var(--muted); font-size:12px; margin-bottom:6px; }
.sp-chart{ display:block; width:100%; height:140px; }
.sp-line{ fill:none; stroke:var(--primary); stroke-width:2; }
.sp-dot{ fill:var(--primary); }
.sp-dot-pr{ fill:var(--green); stroke:var(--bg); stroke-width:.4; }
.sp-axis{ display:flex; justify-content:space-between; color:var(--muted); font-size:11px; margin-top:4px; }
.sp-sub{ margin:6px 0 8px; font-size:15px; }
.sp-sessions{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.sp-session{ display:grid; grid-template-columns:92px minmax(0,1fr); gap:4px 10px; padding:10px 12px; border:1px solid var(--border); border-radius:10px; font-size:13px; }
.sp-session-date{ color:var(--muted); }
.sp-session-main{ min-width:0; }
.sp-badges{ grid-column:2; display:flex; flex-wrap:wrap; gap:4px; }
.sp-badge{ padding:2px 8px; border-radius:999px; background:color-mix(in srgb, var(--green) 16%, transparent); color:var(--green); font-size:11px; font-weight:700; }
@media (max-width:420px){
    .sp-session{ grid-template-columns:1fr; }
    .sp-badges{ grid-column:1; }
    .sp-row{ grid-template-columns:minmax(0,1fr) auto; }
    .sp-row-go{ display:none; }
}
.sp-more{ width:100%; min-height:40px; margin-top:8px; border:1px dashed var(--border); border-radius:10px; background:none; color:var(--primary); font:700 14px var(--font-body); cursor:pointer; }
.sp-hub{ margin-top:14px; }
.sp-lift > summary{ list-style:none; }
.sp-lift > summary::-webkit-details-marker{ display:none; }
.sp-lift[open] > summary{ border-color:var(--primary); }
.sp-lift[open] > summary .sp-row-go svg{ transform:rotate(180deg); }
.sp-lift-body{ padding:12px 2px 6px; }

/* Records a strength session set (js/strengthSession.js recordsHtml; also in the Client Hub). */
.st-records{ margin:0 0 12px; padding:10px 12px; border:1px solid color-mix(in srgb, var(--primary) 45%, transparent); border-radius:var(--radius-sm); background:color-mix(in srgb, var(--primary) 12%, transparent); }
.st-records strong{ display:flex; align-items:center; gap:6px; color:var(--primary-light, var(--primary)); font-size:14px; }
.st-records strong svg{ width:16px; height:16px; }
.st-records ul{ margin:6px 0 0; padding-left:18px; color:var(--text); font-size:14px; line-height:1.5; }
.st-records li b{ margin-right:4px; }
