/**
 * FunnelWon SERP template — Google-style layout.
 *
 * Form controls (select / buttons / inputs) are sealed under .fw-si-serp-main so
 * themes cannot restyle them independently (Results Per Page vs Color/Size parity).
 */

/* Full-width main so SERP background (--fw-si-serp-bg) spans the theme content area; column lives on .fw-si-serp-inner.
   Top spacing is padding on main (not margin on inner) so the background paints the gap and margin-collapse does not show theme white. */
.fw-si-serp-main {
  --fw-si-serp-control-height: 30px;
  --fw-si-serp-control-radius: 6px;
  --fw-si-serp-control-border: var(--fw-si-serp-border, #d0d7de);
  --fw-si-serp-control-bg: var(--fw-si-serp-surface, #ffffff);
  --fw-si-serp-control-fg: var(--fw-si-serp-primary, #202124);
  --fw-si-serp-control-font: 12px;
  /* Tile min track: fluid below 225px so 2-col grids never force horizontal scroll. */
  --fw-si-serp-tile-min: min(100%, 225px);
  /* Chevron for native selects (neutral ink that works on light surfaces). */
  --fw-si-serp-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.5 4.25L6 7.75L9.5 4.25' stroke='%235f6368' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 1em 0 0;
  box-sizing: border-box;
  overflow-x: clip;
  /* Default solid white; --fw-si-serp-bg may be a hex or transparent (match theme). */
  background-color: var(--fw-si-serp-bg, #ffffff);
  /* Stable metrics across Botiga / FSE / classic themes. */
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: var(--fw-si-serp-primary, #202124);
  /* Min-height for short pages: set by fw-si-serp-layout.js (measured vs viewport; no theme-specific guesses). */
}

.fw-si-serp-main *,
.fw-si-serp-main *::before,
.fw-si-serp-main *::after {
  box-sizing: border-box;
}

.fw-si-serp-inner {
  max-width: 800px;
  width: 100%;
  margin: 0 auto;
  padding: 1em 1em 40px;
  box-sizing: border-box;
  min-width: 0;
}

/* ---------- Form-control isolation (theme leak shield) ---------- */

/* Shared native <select> skin: appearance none, fixed chrome, custom chevron. */
.fw-si-serp-main select,
.fw-si-serp-main .fw-si-serp-select,
.fw-si-serp-main .fw-si-serp-var-select,
.fw-si-serp-main .fw-si-serp-per-page-form select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  display: inline-block !important;
  width: auto;
  max-width: 100%;
  min-width: 0;
  min-height: var(--fw-si-serp-control-height) !important;
  height: var(--fw-si-serp-control-height) !important;
  margin: 0 !important;
  padding: 0 1.85em 0 0.55em !important;
  border: 1px solid var(--fw-si-serp-control-border) !important;
  border-radius: var(--fw-si-serp-control-radius) !important;
  background-color: var(--fw-si-serp-control-bg) !important;
  background-image: var(--fw-si-serp-select-chevron) !important;
  background-repeat: no-repeat !important;
  background-position: right 0.45em center !important;
  background-size: 12px 12px !important;
  box-shadow: none !important;
  color: var(--fw-si-serp-control-fg) !important;
  font-family: inherit !important;
  font-size: var(--fw-si-serp-control-font) !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  text-align: left !important;
  text-indent: 0 !important;
  vertical-align: middle;
  cursor: pointer;
  /* Kill theme “form control” filters / transitions that change height. */
  filter: none !important;
  transition: border-color 0.12s ease, background-color 0.12s ease;
}

.fw-si-serp-main select:hover,
.fw-si-serp-main .fw-si-serp-select:hover,
.fw-si-serp-main .fw-si-serp-var-select:hover,
.fw-si-serp-main .fw-si-serp-per-page-form select:hover {
  border-color: #b0b7bf !important;
}

.fw-si-serp-main select:focus,
.fw-si-serp-main select:focus-visible,
.fw-si-serp-main .fw-si-serp-select:focus,
.fw-si-serp-main .fw-si-serp-select:focus-visible,
.fw-si-serp-main .fw-si-serp-var-select:focus,
.fw-si-serp-main .fw-si-serp-var-select:focus-visible {
  outline: none !important;
  border-color: var(--fw-si-serp-accent, #1a73e8) !important;
  box-shadow: 0 0 0 1px var(--fw-si-serp-accent, #1a73e8) !important;
}

/* IE/legacy arrow */
.fw-si-serp-main select::-ms-expand {
  display: none;
}

/* Reset theme button chrome on SERP chrome controls (not product CTAs — those have their own skin). */
.fw-si-serp-main button.fw-si-serp-search-clear,
.fw-si-serp-main button.fw-si-serp-search-submit,
.fw-si-serp-main .fw-si-media-modal__close,
.fw-si-serp-main .fw-si-media-modal__toggle-size,
.fw-si-serp-main .fw-si-media-modal__variant-btn {
  -webkit-appearance: none !important;
  appearance: none !important;
  font-family: inherit !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Product CTA links styled as buttons — strip theme .button / a.button */
.fw-si-serp-main a.fw-si-serp-product-btn,
.fw-si-serp-main span.fw-si-serp-product-btn {
  -webkit-appearance: none !important;
  appearance: none !important;
  font-family: inherit !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  box-shadow: none !important;
  text-shadow: none !important;
  float: none !important;
}

/* No default / accent rings unless our select focus ring above. */
.fw-si-serp-main a:focus,
.fw-si-serp-main a:focus-visible,
.fw-si-serp-main button:focus,
.fw-si-serp-main button:focus-visible,
.fw-si-serp-main input:focus,
.fw-si-serp-main input:focus-visible {
  outline: none;
  box-shadow: none;
}

/* Page title (h1) above search */
.fw-si-serp-page-title {
  margin: 0 0 0.35em;
  font-size: 1.75rem;
  font-weight: 400;
  color: var(--fw-si-serp-primary, #202124);
}

/* Scoped search context (Search Embeds / fw_scope) */
.fw-si-serp-scope-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin: 0 0 1em;
}

.fw-si-serp-scope-banner {
  margin: 0;
  padding: 0;
  font-size: 0.95rem;
  line-height: 1.45;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-scope-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  max-width: 100%;
  padding: 0.2rem 0.35rem 0.2rem 0.55rem;
  border: 1px solid var(--fw-si-serp-border, #dadce0);
  border-radius: 999px;
  background: var(--fw-si-serp-surface, #f1f3f4);
  color: var(--fw-si-serp-primary, #202124);
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.fw-si-serp-scope-chip:hover,
.fw-si-serp-scope-chip:focus {
  background: #e8eaed;
  border-color: #bdc1c6;
  color: var(--fw-si-serp-primary, #202124);
  text-decoration: none;
  outline: none;
}

.fw-si-serp-scope-chip__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 12rem;
}

.fw-si-serp-scope-chip__remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  font-size: 0.95rem;
  line-height: 1;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-scope-chip:hover .fw-si-serp-scope-chip__remove,
.fw-si-serp-scope-chip:focus .fw-si-serp-scope-chip__remove {
  color: var(--fw-si-serp-primary, #202124);
  background: rgba(0, 0, 0, 0.06);
}

.fw-si-serp-main--scoped .fw-si-serp-page-title {
  margin-bottom: 0.25em;
}

.fw-si-serp-scope-row--price + .fw-si-serp-search-form,
.fw-si-serp-scope-row + .fw-si-serp-scope-row--price {
  margin-top: -0.35em;
}

.fw-si-serp-scope-row + .fw-si-serp-scope-row--price {
  margin-bottom: 1em;
}

.fw-si-serp-scope-banner--secondary {
  font-size: 0.875rem;
}

/* Search form — pill with X, divider, input, magnifying glass */
.fw-si-serp-search-form {
  width: 100%;
  max-width: 100%;
  margin-bottom: 1.5em;
  padding: 0;
}

.fw-si-serp-search-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.fw-si-serp-search-box {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.5em 0.75em;
  font-size: 16px;
  border: 1px solid var(--fw-si-serp-border, #dadce0) !important;
  border-radius: 24px !important;
  background: var(--fw-si-serp-surface, #ffffff) !important;
  box-shadow: none !important;
}

/* Keep the same border as unfocused — no accent ring around the whole pill + submit. */
.fw-si-serp-search-box:focus-within {
  border-color: var(--fw-si-serp-border, #dadce0) !important;
  box-shadow: none !important;
}

.fw-si-serp-search-left {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin-right: 0.5em;
}

.fw-si-serp-search-clear {
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  margin: 0 !important;
  margin-right: 0.5em !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  width: auto !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  cursor: pointer;
  /* Icons: auto from Search Box / Tiles (surface) via inline --fw-si-serp-search-box-icon */
  color: var(--fw-si-serp-search-box-icon, var(--fw-si-serp-secondary, #5f6368)) !important;
}

.fw-si-serp-search-clear:hover {
  color: var(--fw-si-serp-search-box-icon-hover, var(--fw-si-serp-primary, #202124)) !important;
  background: none !important;
}

.fw-si-serp-search-divider {
  color: var(--fw-si-serp-border, #dadce0);
  font-size: 14px;
  user-select: none;
}

.fw-si-serp-search-input {
  flex: 1;
  min-width: 0;
  max-width: none !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0.35em 0 !important;
  margin: 0 !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--fw-si-serp-primary, #202124) !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

/* type=search adds a native clear (X) on the right in WebKit/Blink; we already have .fw-si-serp-search-clear. */
.fw-si-serp-search-input::-webkit-search-cancel-button,
.fw-si-serp-search-input::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}

.fw-si-serp-search-input::-moz-search-clear {
  display: none;
}

.fw-si-serp-search-input:focus {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

.fw-si-serp-search-input::placeholder {
  color: var(--fw-si-serp-secondary, #9aa0a6);
  opacity: 1;
}

.fw-si-serp-search-submit {
  flex-shrink: 0;
  padding: 0.35em !important;
  margin: 0 !important;
  margin-left: 0.25em !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  width: auto !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  cursor: pointer;
  color: var(--fw-si-serp-search-box-icon, var(--fw-si-serp-secondary, #5f6368)) !important;
}

.fw-si-serp-search-submit:hover {
  color: var(--fw-si-serp-search-box-icon-hover, var(--fw-si-serp-primary, #202124)) !important;
  background: none !important;
}

/* Search results heading + synonym */
.fw-si-serp-heading {
  margin: 0 0 0.25em;
  font-size: 14px;
  font-weight: 400;
  color: var(--fw-si-serp-primary, #202124);
  line-height: 1.4;
}

.fw-si-serp-heading-query {
  font-weight: 500;
}

.fw-si-serp-synonym-query,
.fw-si-serp-synonym-canonical {
  font-style: italic;
  color: var(--fw-si-serp-synonym, var(--fw-si-serp-secondary, #5f6368));
}

.fw-si-serp-result-count {
  margin: 0;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-results-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 18px;
  flex-wrap: wrap;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-results-meta__facets {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
}

.fw-si-serp-results-meta__facets + .fw-si-serp-per-page-form {
  margin-left: 0;
}

/* Filter trigger */
.fw-si-serp-filter-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0.35rem 0.7rem;
  border: 1px solid var(--fw-si-serp-control-border, #d0d7de) !important;
  border-radius: var(--fw-si-serp-control-radius, 6px) !important;
  background: var(--fw-si-serp-control-bg, #fff) !important;
  color: var(--fw-si-serp-control-fg, #202124) !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  cursor: pointer;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background 0.12s ease, border-color 0.12s ease;
}

.fw-si-serp-filter-btn:hover,
.fw-si-serp-filter-btn:focus {
  background: #f8f9fa !important;
  border-color: #bdc1c6 !important;
  color: var(--fw-si-serp-control-fg, #202124) !important;
  outline: none;
}

.fw-si-serp-filter-btn:focus-visible {
  box-shadow: 0 0 0 2px rgba(26, 115, 232, 0.28) !important;
}

.fw-si-serp-filter-btn__icon {
  flex: 0 0 auto;
  display: block;
}

.fw-si-serp-filter-btn__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.15rem;
  height: 1.15rem;
  padding: 0 0.3rem;
  border-radius: 999px;
  background: #1a73e8;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
}

/* Product facets drawer */
.fw-si-serp-facets[hidden] {
  display: none !important;
}

.fw-si-serp-facets {
  position: fixed;
  inset: 0;
  z-index: 100050;
  display: block;
}

.fw-si-serp-facets__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(32, 33, 36, 0.45);
  cursor: pointer;
  animation: fw-si-facets-fade 0.18s ease both;
}

.fw-si-serp-facets__drawer {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  width: min(22.5rem, 100vw);
  height: 100%;
  max-height: 100vh;
  max-height: 100dvh;
  background: var(--fw-si-serp-surface, #fff);
  color: var(--fw-si-serp-primary, #202124);
  box-shadow: -8px 0 28px rgba(0, 0, 0, 0.12);
  animation: fw-si-facets-slide 0.22s ease both;
  outline: none;
}

@keyframes fw-si-facets-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fw-si-facets-slide {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

.fw-si-serp-facets__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex: 0 0 auto;
  padding: 1rem 1rem 0.75rem;
  border-bottom: 1px solid var(--fw-si-serp-border, #dadce0);
}

.fw-si-serp-facets__title {
  margin: 0;
  padding: 0;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.3;
  color: inherit;
}

.fw-si-serp-facets__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin: 0;
  padding: 0;
  border: none !important;
  border-radius: 50%;
  background: transparent !important;
  color: var(--fw-si-serp-secondary, #5f6368) !important;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  box-shadow: none !important;
}

.fw-si-serp-facets__close:hover,
.fw-si-serp-facets__close:focus {
  background: #f1f3f4 !important;
  color: var(--fw-si-serp-primary, #202124) !important;
  outline: none;
}

.fw-si-serp-facets__form {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
}

.fw-si-serp-facets__body {
  flex: 1 1 auto;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 0.75rem 1rem 1.25rem;
  -webkit-overflow-scrolling: touch;
}

.fw-si-serp-facets__group {
  margin: 0 0 1.15rem;
  padding: 0;
  border: none;
  min-width: 0;
}

.fw-si-serp-facets__group-title {
  display: block;
  margin: 0 0 0.5rem;
  padding: 0;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-facets__options {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  max-height: 12.5rem;
  overflow: auto;
}

.fw-si-serp-facets__option label {
  display: flex !important;
  align-items: center;
  gap: 0.5rem;
  margin: 0 !important;
  padding: 0.35rem 0.25rem;
  border-radius: 4px;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  color: var(--fw-si-serp-primary, #202124) !important;
  cursor: pointer;
  width: 100%;
}

.fw-si-serp-facets__option label:hover {
  background: #f8f9fa;
}

.fw-si-serp-facets__option input[type="checkbox"] {
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: #1a73e8;
}

.fw-si-serp-facets__option-label {
  flex: 1 1 auto;
  min-width: 0;
}

.fw-si-serp-facets__option-count {
  flex: 0 0 auto;
  font-size: 0.75rem;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-facets__price-readout {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--fw-si-serp-primary, #202124);
}

.fw-si-serp-facets__price-inputs {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.fw-si-serp-facets__price-field {
  flex: 1 1 0;
  margin: 0 !important;
}

.fw-si-serp-facets__price-input {
  width: 100% !important;
  min-width: 0 !important;
  height: var(--fw-si-serp-control-height, 30px) !important;
}

.fw-si-serp-facets__price-sep {
  flex: 0 0 auto;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-facets__hint {
  margin: 0.45rem 0 0;
  font-size: 0.75rem;
  line-height: 1.35;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-facets__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex: 0 0 auto;
  padding: 0.85rem 1rem;
  border-top: 1px solid var(--fw-si-serp-border, #dadce0);
  background: var(--fw-si-serp-surface, #fff);
}

.fw-si-serp-facets__clear {
  font-size: 0.875rem;
  font-weight: 500;
  color: #1a73e8;
  text-decoration: none;
}

.fw-si-serp-facets__clear:hover,
.fw-si-serp-facets__clear:focus {
  text-decoration: underline;
  color: #1558b0;
}

.fw-si-serp-facets__apply {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0.55rem 1rem !important;
  border: none !important;
  border-radius: var(--fw-si-serp-control-radius, 6px) !important;
  background: #1a73e8 !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  cursor: pointer;
  box-shadow: none !important;
}

.fw-si-serp-facets__apply:hover,
.fw-si-serp-facets__apply:focus {
  background: #1558b0 !important;
  color: #fff !important;
  outline: none;
}

html.fw-si-serp-facets-open {
  overflow: hidden;
}

[dir="rtl"].fw-si-serp-main .fw-si-serp-results-meta__facets {
  margin-left: 0;
  margin-right: auto;
}

[dir="rtl"] .fw-si-serp-facets__drawer {
  right: auto;
  left: 0;
  box-shadow: 8px 0 28px rgba(0, 0, 0, 0.12);
  animation-name: fw-si-facets-slide-rtl;
}

@keyframes fw-si-facets-slide-rtl {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}

.fw-si-serp-results-meta-sep {
  color: var(--fw-si-serp-secondary, #5f6368);
  font-size: 12px;
  line-height: 1.4;
}

/* Theme label/form styles often force vertical stack or tiny type; keep SERP meta one size. */
.fw-si-serp-per-page-form {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 8px;
  margin: 0 0 0 auto;
  padding: 0;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--fw-si-serp-secondary, #5f6368);
  white-space: nowrap;
}

.fw-si-serp-per-page-form label {
  display: inline !important;
  float: none !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  color: inherit !important;
  white-space: nowrap !important;
  writing-mode: horizontal-tb !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  background: transparent !important;
  border: none !important;
}

/* Width only — chrome comes from shared .fw-si-serp-main select rules. */
.fw-si-serp-per-page-form select,
.fw-si-serp-per-page-form .fw-si-serp-select {
  min-width: 4.5rem !important;
  flex: 0 0 auto;
}

.fw-si-serp-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 20px 0 8px;
}

.fw-si-serp-pagination--inline {
  justify-content: flex-start;
  gap: 10px;
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.fw-si-serp-pagination--inline .fw-si-serp-pagination__link,
.fw-si-serp-pagination--inline .fw-si-serp-pagination__status {
  font-size: 12px;
  line-height: 1.4;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-pagination--inline .fw-si-serp-pagination__link {
  color: var(--fw-si-serp-accent, #1a73e8);
}

.fw-si-serp-pagination-bottom {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 12px;
  padding-bottom: 0;
  flex-wrap: wrap;
}

.fw-si-serp-pagination__link {
  color: var(--fw-si-serp-accent, #1a73e8);
  text-decoration: none;
  font-size: 13px;
}

.fw-si-serp-pagination__status {
  font-size: 13px;
  color: var(--fw-si-serp-secondary, #5f6368);
}


.fw-si-serp-spell-suggestion {
  font-size: 14px;
  color: var(--fw-si-serp-secondary, #5f6368);
  margin: 0.5em 0 0;
}

.fw-si-serp-spell-suggestion a {
  color: var(--fw-si-serp-link, #1a0dab);
}

.fw-si-serp-load-more-sentinel {
  width: 100%;
  height: 1px;
}

/* Search result type tabs */
.fw-si-serp-tabs {
  border-bottom: 1px solid var(--fw-si-serp-border, #dadce0);
  margin: 1em 0 1.5em;
}

.fw-si-serp-tabs--mobile {
  display: none;
}

.fw-si-serp-tabs-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}

.fw-si-serp-tab-item {
  margin: 0;
}

.fw-si-serp-tab-link {
  display: inline-block;
  padding: 0.75em 1.25em;
  color: var(--fw-si-serp-secondary, #5f6368);
  text-decoration: none;
  font-size: 14px;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
}

.fw-si-serp-tab-link:hover {
  color: var(--fw-si-serp-primary, #202124);
}

.fw-si-serp-tab-link.fw-si-serp-tab-active {
  color: var(--fw-si-serp-accent, #1a73e8);
  font-weight: 500;
  border-bottom-color: var(--fw-si-serp-accent, #1a73e8);
}

/* Results */
.fw-si-serp-results {
  margin-top: 0.5em;
}

.fw-si-serp-result {
  margin-bottom: 1.5em;
  padding-bottom: 1em;
  border-bottom: 1px solid var(--fw-si-serp-border, #eeeeee);
}

.fw-si-serp-result:last-child {
  border-bottom: none;
}

.fw-si-serp-result-thumb {
  display: block;
  margin-bottom: 0.5em;
}

/* Only images-grid (and generic grid) get fluid img; list view uses fixed 150×150 below */
.fw-si-serp-results--images-grid .fw-si-serp-result-thumb img,
.fw-si-serp-results--grid .fw-si-serp-result-thumb img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

/* List view (All tab): uniform thumb — fixed 150×150 container + center crop.
   Exclude grid, images-grid, and 404-recovery so 150px rules only apply to list view. */
.fw-si-serp-results:not(.fw-si-serp-results--grid):not(.fw-si-serp-results--images-grid):not(.fw-si-serp-results--shopping-grid):not(.fw-si-serp-results--404-recovery) .fw-si-serp-result-thumb {
  display: block !important;
  position: relative !important;
  width: 150px !important;
  height: 150px !important;
  max-width: 150px !important;
  min-width: 150px !important;
  overflow: hidden;
  border-radius: 4px;
  background: var(--fw-si-serp-btn-muted, #f1f3f4);
  flex-shrink: 0;
  box-sizing: border-box;
}

.fw-si-serp-results:not(.fw-si-serp-results--grid):not(.fw-si-serp-results--images-grid):not(.fw-si-serp-results--shopping-grid):not(.fw-si-serp-results--404-recovery) .fw-si-serp-result-thumb img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  vertical-align: top;
}

.fw-si-serp-result-body {
  display: block;
}

/* Header: icon + title + URL */
.fw-si-serp-result-header {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 0.75em;
  margin-bottom: 0.25em;
}

.fw-si-serp-result-icon {
  flex-shrink: 0;
}

.fw-si-serp-result-favicon {
  display: block;
  width: 32px;
  height: 32px;
  border-radius: 4px;
  vertical-align: middle;
}

/* Override theme/custom CSS that hides .search img — our SERP favicon and thumbnails must stay visible */
.search .fw-si-serp-result-favicon,
.search .fw-si-serp-result-icon img,
.search .fw-si-serp-result-thumb img {
  display: block !important;
  visibility: visible !important;
}

/* Force list-view thumb size inside .search so theme/WordPress cannot override */
.search .fw-si-serp-results:not(.fw-si-serp-results--grid):not(.fw-si-serp-results--images-grid):not(.fw-si-serp-results--shopping-grid):not(.fw-si-serp-results--404-recovery) .fw-si-serp-result-thumb {
  width: 150px !important;
  height: 150px !important;
  max-width: 150px !important;
  min-width: 150px !important;
}
.search .fw-si-serp-results:not(.fw-si-serp-results--grid):not(.fw-si-serp-results--images-grid):not(.fw-si-serp-results--shopping-grid):not(.fw-si-serp-results--404-recovery) .fw-si-serp-result-thumb img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
}

.fw-si-serp-result-icon-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: var(--fw-si-serp-btn-muted, #e8eaed);
  border-radius: 4px;
}

.fw-si-serp-result-icon-placeholder svg {
  flex-shrink: 0;
}

.fw-si-serp-result-meta {
  flex: 1;
  min-width: 0;
}

.fw-si-serp-result-title {
  margin: 0 0 0.2em;
  font-size: 1.2em;
  font-weight: 400;
  line-height: 1.3;
}

.fw-si-serp-result-title a {
  color: var(--fw-si-serp-link, #1a0dab) !important;
  text-decoration: none !important;
}

.fw-si-serp-result-title a:hover {
  text-decoration: underline !important;
}

.fw-si-serp-result-title a:focus,
.fw-si-serp-result-title a:focus-visible,
.fw-si-serp-result-title a:active {
  outline: none;
  text-decoration: underline !important;
}

.fw-si-serp-result-title--clamp-2 a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.fw-si-serp-result-url {
  font-size: 13px;
  color: var(--fw-si-serp-secondary, #5f6368);
  line-height: 1.4;
  display: flex;
  align-items: center;
  min-height: 1.5em;
}

/* Excerpt clamp by mode. JS binary-search truncates so "Read more" stays visible at end. */
.fw-si-excerpt {
  line-height: 1.4;
  max-height: calc(1.4em * 2);
  overflow: hidden;
  margin-top: 0.35em;
  font-size: 14px;
  color: var(--fw-si-serp-primary, #4d5156);
  box-sizing: border-box;
}

.fw-si-excerpt--short {
  max-height: calc(1.4em * 1);
}

.fw-si-excerpt--medium {
  max-height: calc(1.4em * 2);
}

.fw-si-excerpt--long {
  max-height: calc(1.4em * 4);
}

.fw-si-text {
  display: inline;
}

.fw-si-serp-meta-line {
  margin-top: 0.45em;
  font-size: 12px;
  color: var(--fw-si-serp-secondary, #5f6368);
  line-height: 1.4;
  text-transform: uppercase;
}

.fw-si-read-more {
  white-space: nowrap;
  font-weight: 500;
  margin-left: 0.25em;
  font-size: 14px;
  color: var(--fw-si-serp-link, #1a0dab) !important;
  text-decoration: none !important;
}

.fw-si-read-more:hover {
  text-decoration: underline !important;
}

.fw-si-read-more:focus,
.fw-si-read-more:focus-visible,
.fw-si-read-more:active {
  outline: none;
  text-decoration: underline !important;
}

/* URL display — breadcrumb style, full URL without protocol; single line with ellipsis */
.fw-si-serp-result-url--breadcrumb {
  min-width: 0;
}

.fw-si-serp-result-url-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

a.fw-si-serp-result-url-text.fw-si-media-open {
  color: inherit;
  text-decoration: none;
  display: inline-block;
  max-width: 100%;
  vertical-align: bottom;
}

a.fw-si-serp-result-url-text.fw-si-media-open:hover,
a.fw-si-serp-result-url-text.fw-si-media-open:focus-visible {
  text-decoration: underline;
}

a.fw-si-serp-result-favicon-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: inherit;
}

/* Small type icon next to URL (All tab only) */
.fw-si-serp-result-type-icon {
  display: inline-flex;
  align-items: center;
  gap: 0.2em;
  vertical-align: middle;
  margin-right: 0.35em;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-result-type-icon svg {
  flex-shrink: 0;
}


/* Grid layout (generic) — match images-grid cleaner style.
   minmax(min(100%, 225px), 1fr) keeps tracks fluid so narrow theme columns never overflow. */
.fw-si-serp-results--grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(var(--fw-si-serp-tile-min), 1fr)) !important;
  gap: 24px !important;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.fw-si-serp-results--grid .fw-si-serp-result {
  display: flex !important;
  flex-direction: column;
  border: 1px solid var(--fw-si-serp-border, #d3d9e1);
  border-radius: 8px;
  padding: 0;
  margin-bottom: 0;
  overflow: hidden;
  min-width: 0;
  max-width: 100%;
}

.fw-si-serp-results--grid .fw-si-serp-result-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  width: 100%;
  aspect-ratio: 1;
  min-height: 0;
  overflow: hidden;
  background: var(--fw-si-serp-btn-muted, #f3f5f8);
  flex-shrink: 0;
  position: relative;
}

.fw-si-serp-results--grid .fw-si-serp-result-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.fw-si-serp-results--grid .fw-si-serp-result--image .fw-si-serp-result-thumb img {
  object-fit: contain;
  object-position: center;
}

.fw-si-serp-results--grid .fw-si-serp-result-thumb .fw-si-serp-result-thumb-placeholder {
  object-fit: cover;
}

/* Grid logo fallback: keep logo contained and centered on gray background. */
.fw-si-serp-results--grid .fw-si-serp-result-thumb .fw-si-serp-result-thumb-logo,
.fw-si-serp-results--images-grid .fw-si-serp-result-thumb .fw-si-serp-result-thumb-logo,
.fw-si-serp-results--shopping-grid .fw-si-serp-result-thumb .fw-si-serp-result-thumb-logo {
  max-width: 90%;
  width: auto;
  height: auto;
  margin: 0 auto;
  display: block;
  object-fit: contain;
}

.fw-si-serp-results--grid .fw-si-serp-result-body {
  padding: 0.75em;
  flex: 1;
  min-width: 0;
  background: var(--fw-si-serp-surface, #fafbfc);
}

.fw-si-serp-results--grid .fw-si-serp-result-header {
  margin-bottom: 0;
}

.fw-si-serp-results--grid .fw-si-serp-result-title {
  font-size: 0.95em;
  margin-bottom: 0.2em;
}

.fw-si-serp-results--grid .fw-si-serp-result-url {
  font-size: 11px;
}

.fw-si-serp-video-play-overlay {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  pointer-events: none;
}

.fw-si-serp-video-play-overlay::before {
  content: "";
  position: absolute;
  left: 22px;
  top: 17px;
  border-style: solid;
  border-width: 11px 0 11px 16px;
  border-color: transparent transparent transparent #fff;
}

/* Shopping tab — same card tile language as images/video grids (not a bare 3-col list). */
.fw-si-serp-results--shopping-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(var(--fw-si-serp-tile-min), 1fr)) !important;
  gap: 24px !important;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.fw-si-serp-results--shopping-grid .fw-si-serp-result {
  display: flex !important;
  flex-direction: column;
  border: 1px solid var(--fw-si-serp-border, #d3d9e1);
  border-radius: 8px;
  padding: 0;
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
  overflow: hidden;
  min-width: 0;
  max-width: 100%;
  min-height: 0;
}

.fw-si-serp-results--shopping-grid .fw-si-serp-result-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  width: 100%;
  aspect-ratio: 1;
  min-height: 0;
  overflow: hidden;
  background: var(--fw-si-serp-btn-muted, #f3f5f8);
  flex-shrink: 0;
  position: relative;
}

.fw-si-serp-results--shopping-grid .fw-si-serp-result-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}

.fw-si-serp-results--shopping-grid .fw-si-serp-result-thumb .fw-si-serp-result-thumb-placeholder {
  object-fit: cover;
}

.fw-si-serp-results--shopping-grid .fw-si-serp-result-body {
  padding: 0.75em;
  flex: 1;
  min-width: 0;
  background: var(--fw-si-serp-surface, #fafbfc);
}

.fw-si-serp-results--shopping-grid .fw-si-serp-result-header {
  margin-bottom: 0;
}

.fw-si-serp-results--shopping-grid .fw-si-serp-result-title {
  font-size: 0.95em;
  margin-bottom: 0.2em;
}

.fw-si-serp-results--shopping-grid .fw-si-serp-result-url {
  font-size: 11px;
}

.fw-si-serp-product-price {
  margin-top: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--fw-si-serp-primary, #202124);
  display: inline-flex;
  align-items: center;
  min-height: 30px;
}

.fw-si-serp-product-actions {
  margin-top: 0.55em;
  display: flex;
  flex-wrap: nowrap;
  gap: 0.45em;
  align-items: center;
  justify-content: flex-start;
}

.fw-si-serp-product-actions--variable {
  flex-wrap: wrap;
  flex-direction: column;
  align-items: stretch;
  gap: 0.45em;
}

.fw-si-serp-var-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4em 0.55em;
  align-items: flex-end;
}

.fw-si-serp-var-field {
  display: flex;
  flex-direction: column;
  gap: 0.15em;
  min-width: 5.5em;
  flex: 1 1 auto;
  max-width: 11em;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  font-size: 12px;
  color: var(--fw-si-serp-secondary, #5f6368);
}

.fw-si-serp-var-label {
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  color: var(--fw-si-serp-secondary, #5f6368) !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Full width of card field; chrome from shared select rules. */
.fw-si-serp-var-select {
  width: 100% !important;
  max-width: 100% !important;
}

.fw-si-serp-product-actions--variable .fw-si-serp-var-buy {
  align-self: flex-start;
  width: auto;
  max-width: 100%;
}

.fw-si-serp-results--shopping-grid .fw-si-serp-product-actions--variable .fw-si-serp-var-fields {
  flex-direction: column;
  align-items: stretch;
}

.fw-si-serp-results--shopping-grid .fw-si-serp-var-field {
  max-width: none;
}

.fw-si-serp-product-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: var(--fw-si-serp-control-height) !important;
  height: auto !important;
  padding: 0 0.62em !important;
  margin: 0 !important;
  border-radius: var(--fw-si-serp-control-radius) !important;
  border: 1px solid var(--fw-si-serp-border, #d0d7de) !important;
  background: var(--fw-si-serp-surface, #ffffff) !important;
  color: var(--fw-si-serp-link, #1a0dab) !important;
  text-decoration: none !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  white-space: nowrap;
  cursor: pointer;
}

.fw-si-serp-product-btn--primary {
  background: var(--fw-si-serp-accent, #1a73e8) !important;
  border-color: var(--fw-si-serp-accent, #1a73e8) !important;
  color: #fff !important;
}

.fw-si-serp-product-btn--primary:hover,
.fw-si-serp-product-btn--primary:focus {
  filter: brightness(0.96);
  color: #fff !important;
  text-decoration: none !important;
}

.fw-si-serp-product-btn--disabled {
  background: var(--fw-si-serp-btn-muted, #f1f3f4) !important;
  border-color: var(--fw-si-serp-border, #dadce0) !important;
  color: var(--fw-si-serp-secondary, #5f6368) !important;
  cursor: not-allowed !important;
  pointer-events: none;
}

.fw-si-serp-product-btn--disabled:hover {
  filter: none;
}

/* Smart 404 recovery: 2 cols, wider/taller tiles, images fill width, max 6 (enforced in PHP) */
.fw-si-serp-main--404-recovery .fw-si-serp-results--grid {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 24px !important;
  max-width: 900px;
  margin: 0 auto;
}

.fw-si-serp-main--404-recovery .fw-si-serp-results--grid .fw-si-serp-result {
  min-height: 420px;
}

.fw-si-serp-main--404-recovery .fw-si-serp-results--grid .fw-si-serp-result-thumb {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  aspect-ratio: 16 / 10;
  min-height: 180px;
}

.fw-si-serp-main--404-recovery .fw-si-serp-results--grid .fw-si-serp-result-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

.fw-si-serp-main--404-recovery .fw-si-serp-results--grid .fw-si-serp-result-body {
  padding: 1em;
}

.fw-si-serp-main--404-recovery .fw-si-serp-results--grid .fw-si-serp-result-title {
  font-size: 1em;
  margin-bottom: 0.25em;
}

/* Smart 404 recovery keeps long-form excerpt visibility. */
.fw-si-serp-main--404-recovery .fw-si-excerpt {
  max-height: calc(1.4em * 4);
}

/* Images tab — grid: articles are direct children of .fw-si-serp-results (page template markup). */
.fw-si-serp-results.fw-si-serp-results--images-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(var(--fw-si-serp-tile-min), 1fr)) !important;
  gap: 24px !important;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.search .fw-si-serp-results.fw-si-serp-results--images-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(var(--fw-si-serp-tile-min), 1fr)) !important;
  gap: 24px !important;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

/* Legacy: if .fw-si-serp-content ever wraps images (e.g. other template), same grid. */
.fw-si-serp-results--images-grid .fw-si-serp-content {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(var(--fw-si-serp-tile-min), 1fr)) !important;
  gap: 24px !important;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.search .fw-si-serp-results--images-grid .fw-si-serp-content {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(var(--fw-si-serp-tile-min), 1fr)) !important;
  gap: 24px !important;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

/* Narrow/tablet: keep 2 fluid columns that always fit the theme content width. */
@media (max-width: 760px) {
  .fw-si-serp-results--grid,
  .fw-si-serp-results--shopping-grid,
  .fw-si-serp-results.fw-si-serp-results--images-grid,
  .search .fw-si-serp-results.fw-si-serp-results--images-grid,
  .fw-si-serp-results--images-grid .fw-si-serp-content,
  .search .fw-si-serp-results--images-grid .fw-si-serp-content {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
    gap: 12px !important;
  }

  .fw-si-serp-results--grid .fw-si-serp-result-thumb,
  .fw-si-serp-results--shopping-grid .fw-si-serp-result-thumb,
  .fw-si-serp-results--images-grid .fw-si-serp-result-thumb {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 1;
  }

  .fw-si-serp-results--grid .fw-si-serp-result-body,
  .fw-si-serp-results--shopping-grid .fw-si-serp-result-body,
  .fw-si-serp-results--images-grid .fw-si-serp-result-body {
    padding: 0.55em;
  }

  .fw-si-serp-results--grid .fw-si-serp-result-title,
  .fw-si-serp-results--shopping-grid .fw-si-serp-result-title,
  .fw-si-serp-results--images-grid .fw-si-serp-result-title {
    font-size: 0.85em;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .fw-si-serp-results--shopping-grid .fw-si-serp-product-actions,
  .fw-si-serp-results--shopping-grid .fw-si-serp-var-select,
  .fw-si-serp-results--shopping-grid .fw-si-serp-product-btn {
    max-width: 100%;
  }
}

/* API-0 / non-article direct child spans full width */
.fw-si-serp-results--images-grid .fw-si-serp-content > div:not([class^="fw-si-"]) {
  grid-column: 1 / -1;
}

.fw-si-serp-results--images-grid .fw-si-serp-result {
  display: flex !important;
  flex-direction: column;
  border: 1px solid var(--fw-si-serp-border, #d3d9e1);
  border-radius: 8px;
  padding: 0;
  margin-bottom: 0;
  overflow: hidden;
  min-width: 0; /* allow grid item to respect column width */
  max-width: 100%;
}

/* Fluid square thumb — fills the grid track (not a fixed 225px box that overflows phones). */
.fw-si-serp-results--images-grid .fw-si-serp-result-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--fw-si-serp-btn-muted, #f3f5f8);
  flex-shrink: 0;
}

.fw-si-serp-results--images-grid .fw-si-serp-result-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.fw-si-serp-results--images-grid .fw-si-serp-result-body {
  padding: 0.75em;
  flex: 1;
  min-width: 0;
  background: var(--fw-si-serp-surface, #fafbfc);
}

.fw-si-serp-results--images-grid .fw-si-serp-result-header {
  margin-bottom: 0;
}

.fw-si-serp-results--images-grid .fw-si-serp-result-title {
  font-size: 0.95em;
  margin-bottom: 0.2em;
}

.fw-si-serp-results--images-grid .fw-si-serp-result-url {
  font-size: 11px;
}

.fw-si-serp-no-results {
  margin: 2em 0;
  padding: 2em;
  font-size: 18px;
  color: var(--fw-si-serp-primary, #202124);
  text-align: center;
  background: var(--fw-si-serp-surface, #f8f9fa);
  border-radius: 8px;
  line-height: 1.55;
}

.fw-si-serp-no-results a {
  color: var(--fw-si-serp-link, #09b1c5);
  text-decoration: underline;
}

.fw-si-serp-no-results a:hover {
  color: var(--fw-si-serp-link-hover, #078a9a);
}

.fw-si-serp-api-0 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  width: auto !important;
  overflow: visible !important;
  clip-path: none !important;
  position: relative !important;
  z-index: 2147483647 !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 2em auto 1em !important;
  max-width: 800px;
  text-align: center !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: var(--fw-si-serp-api-0-color, var(--fw-si-serp-secondary, #5f6368)) !important;
  pointer-events: auto !important;
}

.fw-si-serp-api-0--below {
  font-size: 12px !important;
  font-weight: 400 !important;
}

.fw-si-serp-api-0--under {
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  margin: 0.75em auto 1.25em !important;
}

/* API-0 links */
.fw-si-serp-content .fw-si-serp-api-0 a,
.fw-si-serp-main .fw-si-serp-api-0 a {
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  color: var(--fw-si-serp-api-0-color, var(--fw-si-serp-secondary, #5f6368)) !important;
  text-decoration: none !important;
  height: auto !important;
  width: auto !important;
  overflow: visible !important;
  clip-path: none !important;
  position: static !important;
  transform: none !important;
  pointer-events: auto !important;
}

.fw-si-serp-content .fw-si-serp-api-0 a:hover,
.fw-si-serp-main .fw-si-serp-api-0 a:hover {
  text-decoration: underline !important;
}

/**
 * SERP content + API-0 — shared container.
 * Defensive !important prevents height:0, overflow:hidden, clip-path, position:absolute off-screen.
 */
.fw-si-serp-content {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: #666 !important;
  height: auto !important;
  overflow: visible !important;
  clip-path: none !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
}

.fw-si-serp-content--images-grid {
  display: grid !important;
}

.fw-si-limit-warning {
  margin: 1em auto;
  max-width: 800px;
  padding: 12px 16px;
  background: #e7f3ff;
  border: 1px solid #2196f3;
  border-radius: 4px;
  font-size: 14px;
}

.fw-si-serp-content a {
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: inherit !important;
  text-decoration: none !important;
  font: inherit !important;
  overflow: visible !important;
  clip-path: none !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
}

/* Result title and Read more stay link color despite .fw-si-serp-content a */
.fw-si-serp-content .fw-si-serp-result-title a,
.fw-si-serp-content .fw-si-read-more {
  color: var(--fw-si-serp-link, #1a0dab) !important;
  text-decoration: none !important;
}

.fw-si-serp-content .fw-si-serp-result-title a:hover,
.fw-si-serp-content .fw-si-read-more:hover {
  text-decoration: underline !important;
}

/* Mobile — full width, touch-friendly targets */
@media (max-width: 600px) {
  .fw-si-serp-main {
    padding-top: 0.75em;
  }

  .fw-si-serp-tabs--desktop {
    display: none;
  }

  .fw-si-serp-tabs--mobile {
    display: block;
  }

  .fw-si-serp-tabs--mobile .fw-si-serp-tab-item {
    flex: 1 1 0;
    min-width: 0;
  }

  .fw-si-serp-tabs--mobile .fw-si-serp-tab-link {
    display: block;
    padding-right: 0.5em;
    padding-left: 0.5em;
    text-align: center;
  }

  .fw-si-serp-tabs-list--media {
    border-top: 1px solid var(--fw-si-serp-border, #dadce0);
  }

  .fw-si-serp-inner {
    padding: 0.75em 0.75em 40px;
  }

  .fw-si-serp-search-box {
    min-height: 44px;
  }

  .fw-si-serp-search-submit {
    min-width: 44px;
    min-height: 44px;
  }

  .fw-si-serp-result-title a {
    padding: 0.25em 0;
  }
}

/* SERP: ensure theme logo shows (some themes hide it for search); .fw-si-serp = FunnelWon SERP body class */
body.search.fw-si-serp .site-branding,
body.search.fw-si-serp .site-branding a,
body.search.fw-si-serp .site-branding img,
body.search.fw-si-serp .custom-logo,
body.search.fw-si-serp .site-logo,
body.search.fw-si-serp .site-logo img,
body.search.fw-si-serp .header-logo,
body.search.fw-si-serp .header-logo img,
body.search.fw-si-serp .logo img,
body.search.fw-si-serp #masthead .custom-logo,
body.search.fw-si-serp .site-header .custom-logo,
body.search.fw-si-serp header .custom-logo,
body.search.fw-si-serp header a[rel="home"] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Media modal (Phase 1B: PDF/DOC/VIDEO/AUDIO). */
.fw-si-media-modal {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: none;
}

.fw-si-media-modal.is-open {
  display: block;
}

.fw-si-media-modal__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
}

.fw-si-media-modal__dialog {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(980px, calc(100vw - 2rem));
  height: min(82vh, 780px);
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  z-index: 1;
}

.fw-si-media-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #e5e7eb;
}

.fw-si-media-modal__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  color: #111827;
}

.fw-si-media-modal__header-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.fw-si-media-modal__toggle-size,
.fw-si-media-modal__close {
  border: 1px solid #d1d5db;
  background: #fff;
  color: #111827;
  border-radius: 6px;
  font-size: 1rem;
  line-height: 1;
  width: 34px;
  height: 34px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.fw-si-media-modal__toggle-size svg {
  width: 18px;
  height: 18px;
}

.fw-si-media-modal__toggle-size .fw-si-media-modal__toggle-icon {
  width: 19px;
  height: 19px;
  display: block;
  pointer-events: none;
}

.fw-si-media-modal__close svg {
  width: 22px;
  height: 22px;
  pointer-events: none;
}

.fw-si-media-modal__body {
  flex: 1;
  min-height: 0;
  background: #111827;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fw-si-media-modal__iframe,
.fw-si-media-modal__video {
  width: 100%;
  height: 100%;
  border: 0;
}

.fw-si-media-modal__image {
  max-width: 100%;
  max-height: 100%;
  display: block;
  object-fit: contain;
}

.fw-si-media-modal__fallback {
  color: #f9fafb;
  text-align: center;
  padding: 1rem;
}

.fw-si-media-modal__fallback p {
  margin: 0 0 0.75rem;
}

.fw-si-media-modal__audio {
  width: min(860px, calc(100% - 2rem));
}

.fw-si-media-modal__footer {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid #e5e7eb;
  background: #fff;
}

.fw-si-media-modal__variants {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-right: auto;
}

.fw-si-media-modal__variants-label {
  font-size: 0.75rem;
  color: #4b5563;
  margin-right: 0.25rem;
}

.fw-si-media-modal__variant-btn {
  border: 1px solid #d1d5db;
  background: #fff;
  color: #111827;
  border-radius: 999px;
  font-size: 0.75rem;
  line-height: 1;
  padding: 0.35rem 0.55rem;
  cursor: pointer;
}

.fw-si-media-modal__variant-btn.is-active {
  border-color: #2563eb;
  color: #2563eb;
}

.fw-si-media-modal__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 0.75rem;
  border-radius: 6px;
  border: 1px solid #d1d5db;
  color: #111827;
  text-decoration: none;
  font-size: 0.875rem;
}

.fw-si-media-modal__action--primary {
  border-color: #2563eb;
  color: #fff;
  background: #2563eb;
}

.fw-si-media-modal.is-fullscreen .fw-si-media-modal__dialog {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 95vw;
  height: 95vh;
  max-width: none;
  max-height: none;
  border-radius: 10px;
}

body.fw-si-modal-open {
  overflow: hidden;
}

/* RTL overrides — flip physical horizontal margins/positions when dir="rtl" is set on <main>. */
[dir="rtl"].fw-si-serp-main .fw-si-serp-search-left {
  margin-right: 0;
  margin-left: 0.5em;
}

[dir="rtl"].fw-si-serp-main .fw-si-serp-search-clear {
  margin-right: 0;
  margin-left: 0.5em;
}

[dir="rtl"].fw-si-serp-main .fw-si-serp-search-submit {
  margin-left: 0;
  margin-right: 0.25em;
}

[dir="rtl"].fw-si-serp-main .fw-si-serp-per-page-form {
  margin-left: 0;
  margin-right: auto;
}

/* Select chevron + padding flip for RTL. */
[dir="rtl"].fw-si-serp-main select,
[dir="rtl"].fw-si-serp-main .fw-si-serp-select,
[dir="rtl"].fw-si-serp-main .fw-si-serp-var-select,
[dir="rtl"].fw-si-serp-main .fw-si-serp-per-page-form select {
  padding: 0 0.55em 0 1.85em !important;
  background-position: left 0.45em center !important;
  text-align: right !important;
}

[dir="rtl"].fw-si-serp-main .fw-si-read-more {
  margin-left: 0;
  margin-right: 0.25em;
}

[dir="rtl"].fw-si-serp-main .fw-si-serp-result-type-icon {
  margin-right: 0;
  margin-left: 0.35em;
}

/* List-view thumbnail img: flip absolute left → right */
[dir="rtl"].fw-si-serp-main .fw-si-serp-results:not(.fw-si-serp-results--grid):not(.fw-si-serp-results--images-grid):not(.fw-si-serp-results--shopping-grid):not(.fw-si-serp-results--404-recovery) .fw-si-serp-result-thumb img {
  left: auto !important;
  right: 0 !important;
}

[dir="rtl"].fw-si-serp-main.search .fw-si-serp-results:not(.fw-si-serp-results--grid):not(.fw-si-serp-results--images-grid):not(.fw-si-serp-results--shopping-grid):not(.fw-si-serp-results--404-recovery) .fw-si-serp-result-thumb img {
  left: auto !important;
  right: 0 !important;
}

/* Modal footer variants: flip auto-margin */
[dir="rtl"].fw-si-serp-main .fw-si-media-modal__variants {
  margin-right: 0;
  margin-left: auto;
}

[dir="rtl"].fw-si-serp-main .fw-si-media-modal__variants-label {
  margin-right: 0;
  margin-left: 0.25rem;
}
