/* Native article discovery uses the existing reader and design-system tokens. */
.article-filters {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 1.25rem 1.5rem;
  max-width: 68rem;
  margin-bottom: 1.5rem;
  padding: 1.5rem;
  background: var(--aabha-color-surface);
  border: 1px solid var(--aabha-color-border-strong);
  border-radius: var(--aabha-radius-md, .75rem);
}
.article-filter-field { min-width: 0; }
.article-filter-field label { display: block; margin-bottom: .5rem; font-weight: 600; }
.article-filter-field input, .article-filter-field select {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: .65rem .8rem;
  color: var(--aabha-color-text);
  background: var(--aabha-color-surface-subtle);
  border: 1px solid var(--aabha-color-border-strong);
  border-radius: .4rem;
  font: inherit;
}
.article-filter-field p { margin: .5rem 0 0; color: var(--aabha-color-text-muted); font-size: .95rem; }
.article-filter-field .article-topic-caption { font-size: 1rem; white-space: normal; overflow-wrap: anywhere; }
.article-filter-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; grid-column: 1 / -1; }
.article-filter-actions button {
  min-height: 48px;
  padding: .6rem 1.25rem;
  border: 1px solid var(--aabha-color-brand-strong);
  border-radius: .4rem;
  color: var(--aabha-color-text-inverse);
  background: var(--aabha-color-brand-strong);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.article-filter-actions a { display: inline-flex; align-items: center; min-height: 44px; }
.article-filter-errors { grid-column: 1 / -1; overflow-wrap: anywhere; }
.article-filter-errors h2 { margin-top: 0; font-size: 1.4rem; }
.article-result-count { max-width: 68rem; overflow-wrap: anywhere; }
.article-empty { padding-block: 2rem; }
.article-empty h2 { margin-top: 0; }
@media (max-width: 620px) {
  .article-filters { grid-template-columns: minmax(0, 1fr); padding: .75rem; }
}