/* HeroUI v3 SearchField: original dark tokens and expanded source utilities.
 * Source: packages/styles/components/search-field.css (Apache-2.0).
 * Scoped to resource search; no HeroUI dependency.
 */
.resource-search-field {
  --search-bg: oklch(0.2103 0.0059 285.89);
  --search-fg: oklch(0.9911 0 0);
  --search-muted: oklch(70.5% 0.015 286.067);
  display: flex; flex-direction: column; gap: 4px; width: 100%; min-width: 0; margin: 0;
  font-family: BronzCategoryInter, ui-sans-serif, system-ui, sans-serif;
  font-size: 14px; line-height: 20px; color: var(--search-fg); color-scheme: dark;
}
.resource-search-field * { box-sizing: border-box; }
.resource-search-label { width: fit-content; font: inherit; font-weight: 500; margin: 0; color: var(--search-fg); }
.resource-search-field .search-field__group {
  position: relative; display: inline-flex; align-items: center; height: 36px; overflow: hidden;
  border-radius: 12px; border: 0 solid transparent; background: var(--search-bg); color: var(--search-fg);
  box-shadow: 0 0 0 0 transparent inset; outline: none;
  transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}
.resource-search-field .search-field__group:hover:not(:focus-within) { background: color-mix(in oklab,var(--search-bg) 90%,var(--search-fg) 2%); }
.resource-search-field .search-field__input, .dark .resource-search-field .search-field__input {
  flex: 1; width: 100%; min-width: 0; margin: 0; padding: 8px;
  font: inherit; font-weight: 400; line-height: 20px;
  border-radius: 0; border: 0 !important; background: transparent !important;
  color: var(--search-fg) !important; box-shadow: none !important; outline: none;
}
.resource-search-field .search-field__input:focus { outline: none; }
.resource-search-field .search-field__input::placeholder { color: var(--search-muted); opacity: 1; }
.resource-search-field .search-field__input::-webkit-search-cancel-button,
.resource-search-field .search-field__input::-webkit-search-decoration { appearance: none; -webkit-appearance: none; }
.resource-search-field .search-field__search-icon { width: 16px; height: 16px; margin: 0 0 0 12px; flex-shrink: 0; color: var(--search-muted); pointer-events: none; }
.resource-search-field .search-field__clear-button {
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  width: 20px; height: 20px; padding: 0; margin: 0 8px 0 0; border: 0;
  background: transparent; color: var(--search-muted); border-radius: 999px; cursor: pointer;
}
.resource-search-field .search-field__clear-button svg { width: 12px; height: 12px; }
.resource-search-field .search-field__clear-button:hover { color: var(--search-fg); background: oklch(27.4% 0.006 286.033); }
.resource-search-field[data-empty="true"] .search-field__clear-button { opacity: 0; pointer-events: none; }
@media (max-width: 639px) { .resource-search-field .search-field__input { font-size: 16px; line-height: 24px; } }
@media (prefers-reduced-motion: reduce) { .resource-search-field .search-field__group { transition: none; } }
