/* fc-search.css — the last styles the global search needs.
 *
 * Most of the search modal's CSS already ships in fc-home-embed.css (panel, suggest list,
 * result items, titles, meta, snippets) and in the Webflow classes .category-filters /
 * .category-tag / .filter-icon / .text-auxiliary. What was missing are the source's generic
 * layout utilities, which the search script writes into the result markup it injects.
 *
 * Values are taken from the source's index.css and then CHECKED against the source's computed
 * styles in a browser, per the project's parity rule. That check mattered: index.css declares
 * --color-primary: #006d3c, but the source's active filter chip computes rgb(0,100,60) = #00643c,
 * which is what the Webflow brand token already gives -- so no colour override is needed here.
 * Literals rather than var() names, per the project's hex-literal rule for custom code.
 *
 * DEVIATION (D-S1): the utilities are scoped under #searchModal rather than left global.
 * They only ever apply inside the injected search markup, so the rendering is identical, and
 * scoping keeps very generic names (.fc-row, .flex-1, .text-primary) out of the Webflow
 * project's global namespace where they would collide with future class work.
 */

#searchModal .fc-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}

#searchModal .fc-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

/* After .fc-row / .fc-column, as in the source, so it wins at equal specificity. */
#searchModal .align-start { align-items: flex-start; }

#searchModal .flex-1 { flex: 1; }

#searchModal .gap-8 { gap: 8px; }

#searchModal .font-16 {
  font-family: 'TWK Everett', sans-serif;
  font-size: 16px !important;
  font-weight: 400;
  line-height: 24px !important;
}

/* The source declares .text-primary twice; the first resolves --brand-primary, which is never
 * defined, so that declaration is invalid and the second (--font-color-primary, #000) applies. */
#searchModal .text-primary { color: #000 !important; }

/* The Webflow .category-filters class carries padding-top: 76px for the tag-archive rows.
 * The source's search modal has no top padding above the filter chips. */
#searchModal .category-filters { padding-top: 0; }

/* The source styles these links through a global `a { color: var(--color-default) }` plus a
 * text-decoration reset. The Webflow build has no such global rule, so the links the search
 * script injects fell back to the browser's default underlined blue. Measured on the source:
 * result links compute rgb(132,138,189) with no underline; suggestions keep their own
 * .text-auxiliary colour and have no underline.
 *
 * Targeted rather than written as `#searchModal a`, deliberately: an ID selector would outrank
 * .category-tag and repaint the filter chips, which are already correct.
 */
#searchModal .header-hits-container a.result-link {
  color: #848abd;
  text-decoration: none;
}

#searchModal .suggest-list .suggest-item { text-decoration: none; }