/* Filter + Suche Archiv — SD-53
 * Wrapper around the dropdown row (SD-54) and the pill search bar (SD-64).
 * Layout only — both children ship their own styles.
 */

.filter-suche-archiv {
  display: flex;
  flex-direction: column;
  gap: var(--dk-space-05);
}

.filter-suche-archiv .filter-archiv {
  flex: 1 1 auto;
}

/* Die Suchleiste ist von Haus aus 72px hoch (SD-64, Suchseite). Hier — ob
   gestapelt oder in der Reihe — passt sie sich immer den 48px hohen
   Dropdown-Pillen an (SD-54), sonst steht sie sichtbar höher als Jahr/
   Titel/Alter/Thema. Die Werte in suche-global.css bleiben unangetastet,
   die Suchseite braucht sie so. */
.filter-suche-archiv__search .suche-global__input {
  height: 3rem;
  /* Platz fuer den Button: 24 + Label + 12 + Icon 20 + 16 ≈ 7.5rem */
  padding-right: 7.5rem;
}

.filter-suche-archiv__search .suche-global__submit {
  height: 3rem;
  gap: var(--dk-space-02);
  padding-left: var(--dk-space-05);
  padding-right: var(--dk-space-04);
}

.filter-suche-archiv__search .suche-global__icon {
  width: 1rem;
  height: 1rem;
}

/* L — dropdowns and search sit in one row (Figma 8291-4882); aligned to the
   standard breakpoint (row only from 1280px, stacked through M like the
   film grid's 3-column tier) */
@media (min-width: 80rem) {
  .filter-suche-archiv {
    flex-direction: row;
    align-items: flex-end;
    gap: var(--dk-space-04);
  }

  /* Nicht schrumpfen lassen: der Button belegt rund 140px der Pille, bei
     einer geschrumpften Leiste bleibt sonst kaum Platz zum Tippen. Die
     Dropdown-Reihe teilt sich den Rest. */
  .filter-suche-archiv__search {
    flex: 0 0 24rem;
    min-inline-size: 0;
  }
}