/* Phase-8 Workouts library additions. Consumes design-system tokens; defines no --sh-* values. */
/* Wide grid: search, duration and date share row 1; equipment then Find share row 2,
 * so visual order matches DOM and focus order. Narrow flex layouts simply stack. */
body.sh-shell .sxl-main .sxl-search.sh-cf-workout-search { --sxl-filter-selects: 2; }
body.sh-shell .sxl-main .sxl-search.sh-cf-workout-search > .sh-cf-equipment { grid-column: 1 / -2; grid-row: 2; flex-basis: 100%; }
body.sh-shell .sxl-main .sxl-search.sh-cf-workout-search > button { grid-column: -2; grid-row: 2; align-self: end; }
body.sh-shell .sh-cf-equipment { border: 0; margin: 0; padding: 0; min-width: 0; }
body.sh-shell .sh-cf-equipment legend { padding: 0; margin: 0 0 8px; font-weight: 700; color: var(--sh-ink); }
body.sh-shell .sh-cf-chips { display: flex; flex-wrap: wrap; gap: 8px; }
body.sh-shell .sh-cf-chip { position: relative; display: inline-flex; margin: 0; }
/* Visually hidden but focusable and announced; the label text remains the click target. */
body.sh-shell .sh-cf-chip input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
body.sh-shell .sh-cf-chip span { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 1px solid var(--sh-line); border-radius: var(--sh-radius-pill); background: var(--sh-surface); color: var(--sh-ink); font-weight: 600; line-height: 1.2; }
body.sh-shell .sh-cf-chip input:checked + span { background: var(--sh-action); border-color: var(--sh-action); color: var(--sh-on-action); }
body.sh-shell .sh-cf-chip input:checked + span::before { content: "\2713"; margin-right: 6px; }
body.sh-shell .sh-cf-chip input:focus-visible + span { outline: 3px solid var(--sh-focus); outline-offset: 2px; }
body.sh-shell .sh-cf-chip:hover span { border-color: var(--sh-teal); }