/* search
   Search box and filter tabs on list pages.

   Loaded by `stylesheet_link_tag :app`, which includes every .css under
   app/assets sorted by filename — so the NUMBER PREFIX IS THE CASCADE ORDER.
   Renaming a file moves it in the cascade. */

/* Search and filters on list pages. */
.search-form { display: flex; align-items: center; gap: 8px; }
.search-wrap { position: relative; display: flex; align-items: center; }
.search-clear {
  position: absolute; right: 10px;
  text-decoration: none; color: var(--ink-3);
  font-size: 17px; line-height: 1;
}
.search-clear:hover { color: var(--ink); }
.search-input {
  width: 230px;
  padding: 7px 11px;
  font-size: 14px;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  background: var(--surface);
}
.search-input:focus { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(23,25,26,.08); outline: none; }
.search-input::-webkit-search-cancel-button { display: none; }

.filter-tabs { display: flex; gap: 3px; margin-top: 10px; flex-wrap: wrap; }
.filter-tabs a {
  font-size: 13px;
  padding: 4px 11px;
  border-radius: 999px;
  text-decoration: none;
  color: var(--ink-2);
}
.filter-tabs a:hover { background: var(--paper); color: var(--ink); }
.filter-tabs a.on { background: var(--ink); color: #fff; }