/*
 * Inventory — Search Results Page (SRP) + Vehicle Detail Page (VDP).
 * Structure follows docs/COMPETITOR-RESEARCH.md (§2b SRP, §2c VDP order).
 */

/* ── SRP: filter rail + results grid ─────────────────────────────── */
.fd-srp {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 2rem;
	align-items: start;
}
.fd-srp__rail {
	position: sticky;
	top: calc(var(--fd-header-h) + 1rem);
	display: grid;
	gap: 1.25rem;
	padding: 1.25rem;
	background: var(--fd-white);
	border: 1px solid var(--fd-line);
	border-radius: var(--fd-r-lg);
}
.fd-facet { display: grid; gap: 0.5rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--fd-line); }
.fd-facet:last-child { border-bottom: 0; padding-bottom: 0; }
.fd-facet__legend { font-family: var(--wp--preset--font-family--display); text-transform: uppercase; letter-spacing: 0.08em; font-size: var(--wp--preset--font-size--sm); color: var(--fd-navy-800); }
.fd-facet__range { display: flex; align-items: center; gap: 0.5rem; }

.fd-srp__toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.25rem;
	flex-wrap: wrap;
}
.fd-srp__count { font-weight: 600; color: var(--fd-navy-800); }
.fd-srp__active { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }

.fd-srp__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 1.5rem;
}

/* ── Inventory card price/CTA cluster (extends .fd-card) ──────────── */
.fd-vcard__price { display: flex; align-items: baseline; gap: 0.5rem; flex-wrap: wrap; }
.fd-vcard__price .fd-price { font-size: var(--wp--preset--font-size--2xl); }
.fd-vcard__payment { font-size: var(--wp--preset--font-size--sm); color: var(--fd-ink-500); }
.fd-vcard__ctas { display: grid; gap: 0.5rem; margin-top: 0.75rem; }

/* ── VDP: gallery + specs + sticky lead rail ─────────────────────── */
.fd-vdp {
	display: grid;
	grid-template-columns: minmax(0, 1.7fr) minmax(300px, 1fr);
	gap: 2.5rem;
	align-items: start;
}
.fd-vdp__gallery { display: grid; gap: 0.75rem; }
.fd-vdp__stage { aspect-ratio: 4 / 3; border-radius: var(--fd-r-lg); overflow: hidden; background: var(--fd-paper-soft); }
.fd-vdp__stage img { width: 100%; height: 100%; object-fit: cover; }
.fd-vdp__thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 0.5rem; }
.fd-vdp__thumbs img { aspect-ratio: 4/3; object-fit: cover; border-radius: var(--fd-r-sm); cursor: pointer; }

.fd-vdp__rail {
	position: sticky;
	top: calc(var(--fd-header-h) + 1rem);
	display: grid;
	gap: 1rem;
	padding: 1.5rem;
	background: var(--fd-white);
	border: 1px solid var(--fd-line);
	border-radius: var(--fd-r-lg);
	box-shadow: var(--wp--preset--shadow--md);
}
.fd-vdp__price .fd-price { font-size: var(--wp--preset--font-size--5xl); }

/* Key-specs strip (icon chips). */
.fd-specs-strip { display: flex; flex-wrap: wrap; gap: 1.5rem; padding-block: 1.25rem; border-block: 1px solid var(--fd-line); }
.fd-spec { display: grid; gap: 0.15rem; }
.fd-spec__label { font-size: var(--wp--preset--font-size--xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--fd-ink-500); }
.fd-spec__value { font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--xl); color: var(--fd-navy-900); }

/* Full specs — a 2-column definition grid (flows down each column), not a
   long single-column hairline dump. Collapses to one column on small screens. */
.fd-specgrid { columns: 2; column-gap: 2.5rem; margin: 0; }
.fd-specgrid__item { break-inside: avoid; display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: 0.7rem 0; border-bottom: 1px solid var(--fd-line); }
.fd-specgrid dt { color: var(--fd-ink-500); font-size: var(--wp--preset--font-size--sm); }
.fd-specgrid dd { margin: 0; color: var(--fd-navy-900); font-weight: 600; font-size: var(--wp--preset--font-size--sm); text-align: right; }
@media (max-width: 700px) { .fd-specgrid { columns: 1; } }

/* Sticky mobile CTA bar (Call · Get Price · Value Trade). */
.fd-sticky-cta {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: var(--z-sticky-cta);
	display: none;
	gap: 0.5rem;
	padding: 0.6rem;
	background: var(--fd-white);
	border-top: 1px solid var(--fd-line);
	box-shadow: 0 -6px 20px rgba(12,26,48,0.1);
}
.fd-sticky-cta .fd-btn { flex: 1; padding-inline: 0.5rem; }

/* ═══════════════════════════════════════════════════════════════════════
 * Phase 2 — SRP block (faceted rail + rich cards + pagination) and VDP block.
 * The base .fd-srp / .fd-vdp / .fd-specs-strip / .fd-spec-table / .fd-sticky-cta
 * scaffolding is above; this section styles the interactive Phase-2 markup.
 * ═════════════════════════════════════════════════════════════════════ */

/* Price primitive — Oswald display, navy, tight. */
.fd-price { font-family: var(--wp--preset--font-family--display); font-weight: 700; line-height: 1; color: var(--fd-navy-900); }

/* SRP archive intro (H1 above the search block) + block rhythm. */
.fd-srp-intro { padding-block: clamp(1.5rem, 4vw, 2.5rem) 0; }
.fd-srp-intro__title { margin: 0; }
.fd-srp-block { padding-block: clamp(1.25rem, 3vw, 2rem) clamp(3rem, 7vw, 6rem); }

/* Rail form: reset the fieldset UA chrome but keep the .fd-facet divider. */
.fd-srp__rail fieldset.fd-facet { border-top: 0; border-left: 0; border-right: 0; margin: 0; padding-inline: 0; min-inline-size: 0; }
.fd-facet legend.fd-facet__legend { padding: 0; }
.fd-srp__rail-head { display: flex; align-items: baseline; justify-content: space-between; }
.fd-srp__clear { font-size: var(--wp--preset--font-size--sm); color: var(--fd-orange-700); text-decoration: none; }
.fd-srp__clear:hover { text-decoration: underline; }

/* Checkbox facets. */
.fd-facet__options { display: grid; gap: 0.4rem; }
.fd-facet__options--scroll { max-height: 12rem; overflow-y: auto; padding-right: 0.25rem; }
.fd-check { display: flex; align-items: center; gap: 0.5rem; font-size: var(--wp--preset--font-size--sm); color: var(--fd-ink-700); cursor: pointer; }
.fd-check input { flex: none; width: 1rem; height: 1rem; accent-color: var(--fd-orange-500); }
.fd-check__label { flex: 1; }
.fd-check__count { color: var(--fd-ink-500); font-size: var(--wp--preset--font-size--xs); }
.fd-facet__field { display: grid; gap: 0.35rem; }
.fd-facet__field .fd-check__label { flex: none; font-weight: 600; color: var(--fd-navy-800); font-size: var(--wp--preset--font-size--sm); }
.fd-facet__range .fd-input { width: auto; flex: 1; min-width: 0; }

/* Results column + sort. */
.fd-srp__results { min-width: 0; }
.fd-srp__sort { display: flex; align-items: center; gap: 0.5rem; }
.fd-srp__sort select { min-width: 12rem; }

/* Inventory card price/CTA cluster. */
.fd-card__media-link { display: block; width: 100%; height: 100%; }
.fd-card__noimg { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: var(--fd-paper-soft); }
.fd-card__noimg-logo { width: 44%; max-width: 150px; opacity: 0.22; }
.fd-vcard__pricing { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.6rem; margin-top: auto; }
.fd-vcard__pricing .fd-price { font-size: var(--wp--preset--font-size--2xl); }
.fd-vcard__was { text-decoration: line-through; color: var(--fd-ink-500); font-size: var(--wp--preset--font-size--sm); }
.fd-vcard__save {
	color: var(--fd-orange-700); font-weight: 700; font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.02em;
	background: rgba(238, 138, 46, 0.12);
	padding: 0.22rem 0.55rem; border-radius: var(--fd-r-pill);
}
.fd-vcard__pricing .fd-vcard__payment { flex-basis: 100%; }

/* Empty state. */
.fd-srp__empty { padding: 3rem 1rem; text-align: center; border: 1px dashed var(--fd-line); border-radius: var(--fd-r-lg); }
.fd-srp__empty-title { margin: 0 0 0.5rem; font-size: var(--wp--preset--font-size--xl); color: var(--fd-navy-800); }
.fd-srp__empty-hint { margin: 0 0 1.25rem; color: var(--fd-ink-500); }
.fd-srp__empty-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: center; }

/* Pagination. */
.fd-pagination { display: flex; flex-wrap: wrap; gap: 0.35rem; justify-content: center; margin-top: 2rem; }
.fd-pagination__link { display: inline-flex; align-items: center; justify-content: center; min-width: 2.5rem; height: 2.5rem; padding: 0 0.6rem; font-size: var(--wp--preset--font-size--sm); font-weight: 600; color: var(--fd-navy-700); text-decoration: none; background: var(--fd-white); border: 1px solid var(--fd-line); border-radius: var(--fd-r-md); transition: background var(--fd-transition), border-color var(--fd-transition), color var(--fd-transition); }
a.fd-pagination__link:hover { border-color: var(--fd-navy-700); color: var(--fd-navy-900); }
.fd-pagination__link.is-current { background: var(--fd-navy-800); border-color: var(--fd-navy-800); color: var(--fd-white); }
.fd-pagination__gap { align-self: flex-end; padding: 0 0.25rem; color: var(--fd-ink-500); }

/* ── VDP block ─────────────────────────────────────────────────────── */
.fd-vdp-block { padding-block: clamp(1.5rem, 4vw, 3rem) clamp(3rem, 7vw, 6rem); }
.fd-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin-bottom: 1rem; font-size: var(--wp--preset--font-size--sm); color: var(--fd-ink-500); }
.fd-breadcrumb a { color: var(--fd-navy-700); text-decoration: none; }
.fd-breadcrumb a:hover { color: var(--fd-orange-700); }
.fd-breadcrumb span[aria-hidden] { color: var(--fd-line); }
.fd-vdp__head { margin-bottom: 1.5rem; }
.fd-vdp__title { margin: 0; font-size: var(--wp--preset--font-size--5xl); line-height: 1.05; color: var(--fd-navy-900); }
.fd-vdp__subtitle { margin: 0.35rem 0 0; color: var(--fd-ink-500); }
.fd-vdp__main { display: grid; gap: 2rem; min-width: 0; }

/* Gallery buttons (stage opens the lightbox; thumbs swap the stage). */
.fd-vdp__stage { position: relative; }
.fd-vdp__stage-btn { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.fd-vdp__stage-badge { position: absolute; top: 0.9rem; left: 0.9rem; }
.fd-vdp__stage-badge--sold { left: auto; right: 0.9rem; }
.fd-vdp__stage-empty { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.fd-vdp__stage-empty svg, .fd-vdp__stage-empty img { width: 40%; max-width: 180px; opacity: 0.3; }
.fd-vdp__thumb { padding: 0; line-height: 0; overflow: hidden; background: none; border: 2px solid transparent; border-radius: var(--fd-r-sm); cursor: pointer; }
.fd-vdp__thumb.is-active { border-color: var(--fd-orange-500); }
.fd-vdp__thumb img { margin: 0; }

/* Sections + prose. */
.fd-vdp__section { display: grid; gap: 1rem; }
.fd-vdp__h2 { margin: 0; font-size: var(--wp--preset--font-size--2xl); color: var(--fd-navy-900); }
.fd-vdp__prose { color: var(--fd-ink-700); line-height: 1.7; }
.fd-vdp__prose :is(h2, h3, h4) { color: var(--fd-navy-800); }
.fd-vdp__trust { display: flex; flex-wrap: wrap; gap: 0.5rem; }

/* Location. */
.fd-vdp__location-body { display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between; gap: 1rem; }
.fd-vdp__location-name { margin: 0 0 0.25rem; font-weight: 700; color: var(--fd-navy-800); }
.fd-vdp__address { font-style: normal; color: var(--fd-ink-700); }
.fd-vdp__hours { margin-top: 0.5rem; font-size: var(--wp--preset--font-size--sm); color: var(--fd-ink-500); }

/* Sticky lead rail internals. */
.fd-vdp__rail-ctas { display: grid; gap: 0.6rem; }
.fd-vdp__save { justify-self: start; margin: 0.25rem 0 0; color: var(--fd-orange-700); font-weight: 700; font-size: var(--wp--preset--font-size--sm); }
.fd-vdp__lead { display: grid; gap: 0.6rem; margin-top: 0.25rem; padding-top: 1rem; border-top: 1px solid var(--fd-line); }
.fd-vdp__lead-title { margin: 0; font-size: var(--wp--preset--font-size--lg); color: var(--fd-navy-900); }
.fd-vdp__similar { margin-top: 2.5rem; }

/* Full-screen gallery lightbox (assets/js/fdmrv.js builds the DOM). */
.fd-lightbox { position: fixed; inset: 0; z-index: var(--z-modal); display: none; align-items: center; justify-content: center; gap: 1rem; padding: clamp(1rem, 4vw, 3rem); background: rgba(8, 16, 30, 0.92); }
.fd-lightbox[data-open="true"] { display: flex; }
.fd-lightbox__figure { margin: 0; max-width: min(1100px, 92vw); max-height: 86vh; }
.fd-lightbox__figure img { width: 100%; max-height: 86vh; object-fit: contain; border-radius: var(--fd-r-md); }
.fd-lightbox__close { position: absolute; top: 1rem; right: 1rem; }
.fd-lightbox__close, .fd-lightbox__nav { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; font-size: 1.6rem; line-height: 1; color: var(--fd-white); background: rgba(255, 255, 255, 0.12); border: 0; border-radius: var(--fd-r-pill); cursor: pointer; transition: background var(--fd-transition); }
.fd-lightbox__close:hover, .fd-lightbox__nav:hover { background: rgba(255, 255, 255, 0.28); }
.fd-lightbox__count { position: absolute; bottom: 1rem; left: 50%; transform: translateX(-50%); color: var(--fd-mist); font-size: var(--wp--preset--font-size--sm); }
