/* Filter bar: GET form with Apply + Reset. Fields may be direct Form API children
   or wrapped in .sv-filter-bar__fields / .sv-filter-bar__actions; below 48em the optional
   <details class="sv-filter-bar__toggle" data-sv-details-wide> collapses to "Filters (n)". */

.sv-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--sv-space-3) var(--sv-space-4);
  margin-bottom: var(--sv-space-4);
  padding: var(--sv-space-3) var(--sv-space-4);
  border: 1px solid var(--sv-color-border);
  border-radius: var(--sv-radius-lg);
  background: var(--sv-color-surface);
  box-shadow: var(--sv-shadow-sm);
}
.sv-filter-bar > :where(* + *) { margin-top: 0; }
.sv-filter-bar .sv-field { flex: 0 1 12rem; min-width: 9rem; margin: 0; }
.sv-filter-bar .sv-field--wide { flex-basis: 18rem; }
.sv-filter-bar .sv-field > label { font-size: var(--sv-text-xs); color: var(--sv-color-text-muted); letter-spacing: 0.02em; }
.sv-filter-bar .sv-field--choice { align-self: center; min-width: 0; flex-basis: auto; }
.sv-filter-bar .sv-field--choice > label { font-size: var(--sv-text-sm); color: var(--sv-color-text); }

.sv-filter-bar__toggle { flex: 1 1 100%; min-width: 0; }
.sv-filter-bar__summary {
  display: none;
  align-items: center;
  gap: var(--sv-space-2);
  min-height: 2.75rem;
  font-weight: var(--sv-weight-semibold);
  cursor: pointer;
  list-style: none;
}
.sv-filter-bar__summary::-webkit-details-marker { display: none; }
.sv-filter-bar__body,
.sv-filter-bar__fields {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--sv-space-3) var(--sv-space-4);
}
.sv-filter-bar__body > :where(* + *),
.sv-filter-bar__fields > :where(* + *) { margin-top: 0; }
.sv-filter-bar__actions {
  display: flex;
  align-items: center;
  gap: var(--sv-space-3);
  margin: 0;
  padding: 0;
}
.sv-filter-bar__reset { font-size: var(--sv-text-sm); }

@media (max-width: 47.99em) {
  .sv-filter-bar:has(> .sv-filter-bar__toggle) { padding-block: var(--sv-space-1); }
  .sv-filter-bar__summary { display: flex; }
  .sv-filter-bar__toggle[open] > .sv-filter-bar__summary { margin-bottom: var(--sv-space-3); }
  .sv-filter-bar__toggle .sv-filter-bar__body { padding-bottom: var(--sv-space-3); }
  .sv-filter-bar .sv-field { flex: 1 1 100%; }
  .sv-filter-bar__summary::after {
    content: "";
    width: 0.5rem;
    height: 0.5rem;
    margin-inline-start: auto;
    border-block-end: 2px solid currentColor;
    border-inline-end: 2px solid currentColor;
    transform: rotate(45deg);
  }
  .sv-filter-bar__toggle[open] > .sv-filter-bar__summary::after { transform: rotate(-135deg); }
}

/* Active filter count in the summary and toolbar. */
.sv-filter-bar__count { margin-inline-start: var(--sv-space-1); }

/* Results toolbar under the filter bar ("132 sites", page size, exports). */
.sv-results-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sv-space-2) var(--sv-space-4);
  margin-bottom: var(--sv-space-3);
  color: var(--sv-color-text-muted);
  font-size: var(--sv-text-sm);
}
