/* filter-bar.css — sticky app filter bar (09 s3) + filter status / empty state shared by home and hubs.
   JS-only rows carry [data-filter-controls hidden] until app-filter.js starts. */

.filter-bar {
  position: sticky;
  top: var(--header-h);
  z-index: calc(var(--z-header) - 1);
  background: var(--surface);
  border-block: var(--border-w) solid var(--border);
  transition: top var(--dur) var(--ease);
}

.is-header-hidden .filter-bar { top: 0; }

.filter-bar__inner { display: flex; flex-direction: column; gap: var(--sp-2); padding-block: var(--sp-3); }

.filter-bar__row { display: flex; align-items: center; gap: var(--sp-3); min-width: 0; }
.filter-bar__row > .chips { flex: 1; min-width: 0; }

.filter-bar__label {
  flex: none;
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  color: var(--text-muted);
}

.filter-bar__sort { width: auto; min-height: var(--control-h-sm); }
.filter-bar__status { justify-content: space-between; }

@media (max-width: 767.98px) {
  .filter-bar__row { flex-wrap: wrap; }
  .filter-bar__row > .chips { flex-basis: 100%; }
  .filter-bar__sort-label { display: none; }
}

/* Status line and empty state (both pages). */
.filter-status { margin-bottom: var(--sp-3); }
.filter-empty { padding: var(--sp-6) 0; text-align: center; color: var(--text-muted); }

/* While filtering, grouped grids (/apps) read as one list: headings go, empty groups hide (app-filter.js). */
.is-filtered .app-group__head { display: none; }
.is-filtered .app-group + .app-group { margin-top: var(--sp-5); }