/* GoFast Vehicle Fitment — inherits the theme's fonts and buttons.
   Override in your theme:  .gff { --gff-accent: #c00; }  */
.gff {
  --gff-accent: #1f3864;
  --gff-accent-ink: #fff;
  --gff-line: rgba(0, 0, 0, .14);
  --gff-soft: rgba(0, 0, 0, .04);
  --gff-muted: rgba(0, 0, 0, .62);
  --gff-ok: #1d6b3a;
  --gff-warn: #8a5a00;
  font: inherit;
  color: inherit;
  margin: 0 0 2em;
}
.gff *, .gff *::before, .gff *::after { box-sizing: border-box; }
.gff [hidden] { display: none !important; }

/* ---- picker */
.gff-title { margin: 0 0 .6em; }
.gff-fields {
  display: grid;
  grid-template-columns: minmax(6.5em, .7fr) 1fr 1.3fr auto;
  gap: .75em;
  align-items: end;
}
.gff-field { display: flex; flex-direction: column; gap: .3em; margin: 0; }
.gff-label { font-size: .875em; font-weight: 600; }
.gff select, .gff input[type="search"] {
  width: 100%;
  height: 3rem;
  padding: 0 .75rem;
  font: inherit;
  font-size: 1rem;
  border: 1px solid rgba(0, 0, 0, .3);
  border-radius: 4px;
  background-color: #fff;
  color: inherit;
}
.gff select:disabled { opacity: .55; cursor: not-allowed; }
.gff .gff-go {
  height: 3rem;
  padding: 0 1.5rem;
  font: inherit;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  background: var(--gff-accent);
  color: var(--gff-accent-ink);
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}
.gff .gff-go:hover:not(:disabled) { filter: brightness(1.15); }
.gff .gff-go:disabled { opacity: .45; cursor: not-allowed; }

/* ---- the selected vehicle: the one bold element
   Recolor with  .gff { --gff-accent: #1f3864; --gff-accent-deep: #0d1a33; --gff-accent-bright: #3a6fc4; } */
.gff-vehicle {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
  padding: 1.35em 1.6em;
  border-radius: 14px;
  color: var(--gff-accent-ink);
  background:
    radial-gradient(90% 140% at 100% 0%, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, 0) 55%),
    linear-gradient(120deg, var(--gff-accent-deep, #0d1a33) 0%, var(--gff-accent) 48%, var(--gff-accent-bright, #3a6fc4) 100%);
  box-shadow: 0 10px 28px -14px rgba(13, 26, 51, .55);
}
.gff-vehicle::after { /* thin highlight along the top edge */
  content: ""; position: absolute; inset: 0 0 auto 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .45), transparent);
}
.gff-vehicle-art {
  position: absolute; z-index: -1;
  right: -1.2em; bottom: -2.6em;
  width: 10.5em; height: 10.5em; opacity: .11; pointer-events: none;
}
.gff-vehicle-text { display: flex; flex-direction: column; gap: .2em; min-width: 0; }
.gff-vehicle-eyebrow {
  font-size: .72em; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; opacity: .78;
}
.gff-vehicle-name {
  margin: 0;
  font-size: clamp(1.35em, 2.8vw, 1.95em);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -.015em;
}
.gff-change {
  position: relative;
  font: inherit;
  font-size: .88em;
  font-weight: 600;
  color: inherit;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .38);
  border-radius: 999px;
  padding: .55em 1.15em;
  cursor: pointer;
  white-space: nowrap;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transition: background .15s ease, border-color .15s ease;
}
.gff-change:hover { background: rgba(255, 255, 255, .26); border-color: rgba(255, 255, 255, .6); }

/* ---- part-type tiles */
.gff-filters { display: flex; flex-wrap: wrap; justify-content: center; gap: .5em; margin: 1.1em 0 .25em; }
.gff-tile {
  display: flex; flex-direction: column; align-items: center; gap: .3em;
  flex: 0 0 8.25em; width: 8.25em;
  padding: .8em .4em; margin: 0;
  font: inherit; font-size: .85em; font-weight: 600; line-height: 1.2; text-align: center;
  color: inherit; background: #fff;
  border: 1px solid rgba(0, 0, 0, .18); border-radius: 8px;
  cursor: pointer;
}
.gff-tile:hover { border-color: var(--gff-c, var(--gff-accent)); }
.gff-tile-count { font-size: .85em; font-weight: 400; color: var(--gff-muted); }
.gff-tile[aria-pressed="true"] {
  border: 2px solid var(--gff-c, var(--gff-accent));
  padding: calc(.8em - 1px) calc(.4em - 1px);
  background: color-mix(in srgb, var(--gff-c, var(--gff-accent)) 12%, #fff);
}
.gff-badge-icon {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 2.6em; height: 2.6em; border-radius: 50%;
  background: var(--gff-c, var(--gff-accent)); color: #fff;
}
.gff-badge-icon svg { width: 58%; height: 58%; display: block; }
.gff-tile .gff-badge-icon { width: 2.75em; height: 2.75em; font-size: 1.05em; margin-bottom: .15em; }

/* ---- results */
.gff-status, .gff-empty { padding: 1.5em 0; color: var(--gff-muted); }
.gff-group { margin-top: 1.75em; }
.gff-group-title {
  display: flex; align-items: center; gap: .55em;
  margin: 0 0 .25em;
  padding-bottom: .45em;
  border-bottom: 2px solid var(--gff-c, var(--gff-accent));
}
.gff-group-title .gff-badge-icon { width: 1.6em; height: 1.6em; }
.gff-list { list-style: none; margin: 0; padding: 0; }
.gff-item {
  display: grid;
  grid-template-columns: 88px 1fr auto;
  gap: 1em;
  align-items: start;
  padding: 1em 0;
  border-bottom: 1px solid var(--gff-line);
  margin: 0;
}
.gff-thumb img { width: 88px; height: 88px; object-fit: contain; display: block; margin: 0; }
.gff-info { min-width: 0; }
.gff-name { font-weight: 600; text-decoration: none; display: block; line-height: 1.3; }
.gff-name:hover { text-decoration: underline; }
.gff-sku { display: block; font-size: .8em; color: var(--gff-muted); margin-top: .15em; }
.gff-fits { list-style: none; margin: .5em 0 0; padding: 0; font-size: .875em; }
.gff-fits li { margin: 0 0 .2em; padding-left: 1.1em; position: relative; }
.gff-fits li::before { content: "✓"; position: absolute; left: 0; color: var(--gff-ok); font-weight: 700; }
.gff-more summary { cursor: pointer; font-size: .85em; color: var(--gff-muted); margin-top: .2em; }
.gff-buy { display: flex; flex-direction: column; align-items: flex-end; gap: .5em; text-align: right; }
.gff-price { font-weight: 700; margin: 0; }
.gff-prices { display: flex; flex-direction: column; align-items: flex-end; gap: .15em; line-height: 1.25; }
.gff-price-label { font-size: .75em; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; margin-right: .35em; }
.gff-msrp { font-size: .875em; color: var(--gff-muted); }
.gff-dealer { font-weight: 700; font-size: 1.05em; margin: 0; }
.gff-dealer .gff-price-label { color: var(--gff-accent); }
.gff-guest { font-size: .85em; text-align: right; }
.gff-guest a { font-weight: 600; }
.gff-stock { font-size: .8em; color: var(--gff-warn); }
.gff-item.is-oos .gff-thumb img { opacity: .55; }
.gff .added_to_cart { display: none; }
.gff-added {
  display: inline-flex; align-items: center; gap: .35em;
  font-size: .85em; font-weight: 600; color: var(--gff-ok);
  background: color-mix(in srgb, var(--gff-ok) 10%, #fff);
  border-radius: 999px; padding: .3em .75em .3em .55em;
  white-space: nowrap;
}
.gff-added svg { width: 1.05em; height: 1.05em; flex: 0 0 auto; }
.gff-added.is-pulse { animation: gff-pop .35s ease-out; }
@keyframes gff-pop { 0% { transform: scale(.85); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .gff-added.is-pulse { animation: none; } }

/* ---- product page tab */
.gff-tab-search { max-width: 22em; margin-bottom: .75em; }
.gff-tab-scroll { max-height: 26em; overflow: auto; border: 1px solid var(--gff-line); }
.gff-table { width: 100%; border-collapse: collapse; margin: 0; font-size: .9em; }
.gff-table th, .gff-table td { padding: .5em .75em; text-align: left; border-bottom: 1px solid var(--gff-line); vertical-align: top; }
.gff-table thead th { position: sticky; top: 0; background: var(--gff-bg, #fff); z-index: 1; }
.gff-table td:nth-child(3) { white-space: nowrap; }
.gff-disclaimer { font-size: .85em; color: var(--gff-muted); margin-top: .75em; }

/* ---- product page badge */
.gff-badge { margin: 1em 0; padding: .75em 1em; border-left: 4px solid; background: var(--gff-soft); }
.gff-badge.is-fit { border-color: var(--gff-ok); }
.gff-badge.is-unknown { border-color: var(--gff-warn); }
.gff-badge-head { margin: 0; font-weight: 600; }
.gff-badge ul { margin: .35em 0 0 1.1em; padding: 0; font-size: .9em; }

/* ---- focus + small screens */
.gff button:focus-visible, .gff a:focus-visible, .gff select:focus-visible, .gff input:focus-visible {
  outline: 2px solid var(--gff-accent); outline-offset: 2px;
}
.gff-vehicle .gff-change:focus-visible { outline-color: var(--gff-accent-ink); }

@media (max-width: 720px) {
  .gff-fields { grid-template-columns: 1fr 1fr; }
  .gff-fields .gff-field:last-of-type, .gff .gff-go { grid-column: 1 / -1; }
  .gff-vehicle { flex-wrap: wrap; padding: 1.15em 1.2em; }
  .gff-vehicle-text { flex: 1 1 100%; }
  .gff-vehicle-art { right: -.8em; bottom: -1.8em; width: 7.5em; height: 7.5em; }
  .gff-filters { gap: 6px; }
  .gff-tile { flex-basis: calc((100% - 12px) / 3); width: auto; font-size: .8em; padding: .65em .25em; }
  .gff-tile[aria-pressed="true"] { padding: calc(.65em - 1px) calc(.25em - 1px); }
  .gff-item { grid-template-columns: 64px 1fr; }
  .gff-thumb img { width: 64px; height: 64px; }
  .gff-buy { grid-column: 2; flex-direction: row; align-items: center; justify-content: space-between; text-align: left; }
  .gff-prices { align-items: flex-start; }
}

/* ---- dealer-only message */
.gff-wall {
  display: flex; gap: 1.1em; align-items: flex-start;
  padding: 1.5em 1.6em; border-radius: 14px; color: var(--gff-accent-ink);
  background:
    radial-gradient(90% 140% at 100% 0%, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, 0) 55%),
    linear-gradient(120deg, var(--gff-accent-deep, #0d1a33) 0%, var(--gff-accent) 48%, var(--gff-accent-bright, #3a6fc4) 100%);
}
.gff-wall-icon { flex: 0 0 auto; width: 2.8em; height: 2.8em; border-radius: 50%; background: rgba(255, 255, 255, .16); display: inline-flex; align-items: center; justify-content: center; }
.gff-wall-icon svg { width: 55%; height: 55%; }
.gff-wall-title { margin: 0 0 .3em; color: inherit; font-size: 1.35em; line-height: 1.2; }
.gff-wall p { margin: 0 0 .6em; color: inherit; }
.gff-wall-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1em; margin: .9em 0 0 !important; }
.gff-wall-btn { display: inline-block; background: #fff; color: var(--gff-accent) !important; font-weight: 700; text-decoration: none !important; padding: .65em 1.6em; border-radius: 999px; }
.gff-wall-btn:hover { filter: brightness(.94); }
.gff-wall-link { color: inherit !important; font-weight: 600; text-decoration: underline; }

/* ---- ship from */
.gff-ship { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .6em 1em; margin: 1em 0 0; }
.gff-ship-label { display: inline-flex; align-items: center; gap: .4em; font-weight: 600; font-size: .9em; }
.gff-ship-label svg { width: 1.2em; height: 1.2em; color: var(--gff-accent); }
.gff-ship-opts { display: inline-flex; padding: 3px; border-radius: 999px; background: var(--gff-soft); border: 1px solid var(--gff-line); }
.gff-ship-opt {
  font: inherit; font-size: .88em; font-weight: 600; color: inherit;
  background: transparent; border: 0; border-radius: 999px; padding: .45em 1.1em; cursor: pointer; white-space: nowrap;
}
.gff-ship-opt[aria-pressed="true"] { background: var(--gff-accent); color: var(--gff-accent-ink); }
.gff-ship-opt:disabled { opacity: .45; cursor: not-allowed; }
.gff-ship-note { flex: 1 1 100%; margin: 0; text-align: center; font-size: .82em; color: var(--gff-muted); }
.gff-ship-note a { font-weight: 600; }

/* ---- per-warehouse stock and buttons */
.gff-wh-stock { font-size: .8em; font-weight: 600; }
.gff-wh-stock.is-over, .gff-wh-stock.is-exact { color: var(--gff-ok); }
.gff-wh-stock.is-low { color: var(--gff-warn); }
.gff-wh-stock.is-out { color: #a32d2d; }
.gff-only-at { font-size: .8em; font-weight: 600; color: var(--gff-warn); max-width: 13em; text-align: right; }
.gff-switch {
  font: inherit; font-size: .8em; font-weight: 600; color: var(--gff-accent); background: none; border: 0; padding: 0;
  text-decoration: underline; cursor: pointer; text-align: right; max-width: 14em;
}
.gff-add.loading { opacity: .65; cursor: progress; }
.gff-add-error { font-size: .8em; color: #a32d2d; max-width: 16em; text-align: right; }
.gff-results.is-refreshing { opacity: .55; transition: opacity .15s; pointer-events: none; }

/* ---- vehicle info */
.gff-tile-info .gff-tile-count { color: var(--gff-accent); }
.gff-info-card { border: 1px solid var(--gff-line); border-radius: 10px; padding: 1em 1.2em; margin-top: 1em; }
.gff-info-card h4 { margin: 0 0 .6em; font-size: 1em; }
.gff-info-scroll { overflow-x: auto; }
.gff-info-table { width: 100%; border-collapse: collapse; margin: 0; font-size: .9em; }
.gff-info-table th, .gff-info-table td { text-align: left; padding: .5em .6em; border-bottom: 1px solid var(--gff-line); vertical-align: top; }
.gff-info-table th { font-weight: 600; color: var(--gff-muted); font-size: .85em; }
.gff-pill { display: inline-block; margin: 0 .35em .2em 0; padding: .15em .7em; border-radius: 999px; font-size: .85em; font-weight: 600; color: var(--gff-accent); background: color-mix(in srgb, var(--gff-accent) 10%, #fff); }
.gff-info-note { font-size: .8em; color: var(--gff-muted); margin: .6em 0 0; }

@media (max-width: 720px) {
  .gff-wall { flex-direction: column; padding: 1.2em; }
  .gff-only-at, .gff-switch, .gff-add-error { text-align: left; }
}
.gff .gff-add, .gff .gff-options {
  display: inline-block; font: inherit; font-size: .9em; font-weight: 600; line-height: 1.2;
  padding: .6em 1.2em; border: 0; border-radius: 4px; cursor: pointer; text-decoration: none;
  background: var(--gff-accent); color: var(--gff-accent-ink);
}
.gff .gff-add:hover, .gff .gff-options:hover { filter: brightness(1.15); }