/*
 * WDI Vehicle Fitment 3.1.1 — Precision Frontend UI
 * Customer-facing visual system only. Admin styling remains in alternative-ui.css.
 */

body.wdi-vff-ui-precision {
    --vff-ui-bg: #f5f7fa;
    --vff-ui-surface: #ffffff;
    --vff-ui-surface-soft: #f8fafc;
    --vff-ui-surface-tint: #eef3f7;
    --vff-ui-ink: #111827;
    --vff-ui-ink-soft: #344054;
    --vff-ui-muted: #667085;
    --vff-ui-line: #e1e7ee;
    --vff-ui-line-strong: #cdd6e1;
    --vff-ui-primary: #0b63ce;
    --vff-ui-primary-dark: #084faa;
    --vff-ui-primary-soft: #eaf3ff;
    --vff-ui-accent: #18a179;
    --vff-ui-accent-soft: #eaf8f3;
    --vff-ui-warning: #9a6700;
    --vff-ui-warning-soft: #fff7df;
    --vff-ui-danger: #b42318;
    --vff-ui-danger-soft: #fff0ee;
    --vff-ui-radius-xs: 8px;
    --vff-ui-radius-sm: 12px;
    --vff-ui-radius: 18px;
    --vff-ui-radius-lg: 28px;
    --vff-ui-shadow-sm: 0 8px 24px rgba(16, 24, 40, .06);
    --vff-ui-shadow: 0 24px 70px rgba(16, 24, 40, .10);
    --vff-ui-focus: 0 0 0 4px rgba(11, 99, 206, .16);
}

body.wdi-vff-ui-precision :where(.vff-frontpage-finder, .vff-reg-lookup, .vff-filter-form, .vff-frontpage-selected, .vff-shop-page, .vff-shortcode-shop, .vff-shop-results, .vff-garage, .vff-product-info-tab, .vff-empty-state) {
    color: var(--vff-ui-ink)!important;
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif!important;
}

body.wdi-vff-ui-precision :where(.vff-frontpage-finder, .vff-reg-lookup, .vff-filter-form, .vff-frontpage-selected, .vff-shop-page, .vff-garage, .vff-product-info-tab) *,
body.wdi-vff-ui-precision :where(.vff-frontpage-finder, .vff-reg-lookup, .vff-filter-form, .vff-frontpage-selected, .vff-shop-page, .vff-garage, .vff-product-info-tab) *::before,
body.wdi-vff-ui-precision :where(.vff-frontpage-finder, .vff-reg-lookup, .vff-filter-form, .vff-frontpage-selected, .vff-shop-page, .vff-garage, .vff-product-info-tab) *::after {
    box-sizing: border-box!important;
}

body.wdi-vff-ui-precision :where(.vff-frontpage-finder, .vff-reg-lookup, .vff-filter-form, .vff-garage, .vff-product-info-tab) :where(button, input, select, textarea) {
    font: inherit!important;
}

body.wdi-vff-ui-precision :where(.vff-frontpage-finder, .vff-reg-lookup, .vff-filter-form, .vff-garage, .vff-product-info-tab) :where(button, input, select, a):focus-visible {
    outline: none!important;
    box-shadow: var(--vff-ui-focus)!important;
}

/* --------------------------------------------------------------------------
   Vehicle finder — clean single-workspace composition
   -------------------------------------------------------------------------- */
body.wdi-vff-ui-precision .vff-alt-finder {
    position: relative!important;
    overflow: hidden!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: var(--vff-ui-radius-lg)!important;
    background: var(--vff-ui-surface)!important;
    box-shadow: var(--vff-ui-shadow)!important;
}

body.wdi-vff-ui-precision .vff-alt-finder::before {
    content: ""!important;
    position: absolute!important;
    inset: 0 0 auto!important;
    height: 4px!important;
    background: linear-gradient(90deg, var(--vff-ui-primary), #4a93e8 58%, var(--vff-ui-accent))!important;
    z-index: 2!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-hero {
    display: grid!important;
    grid-template-columns: auto minmax(0, 1fr) auto!important;
    gap: 20px!important;
    align-items: center!important;
    padding: clamp(26px, 4vw, 44px) clamp(24px, 5vw, 58px) 30px!important;
    border-bottom: 1px solid var(--vff-ui-line)!important;
    background:
        radial-gradient(circle at 88% 10%, rgba(11, 99, 206, .08), transparent 32%),
        linear-gradient(180deg, #fff 0%, #fbfcfe 100%)!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-symbol {
    display: grid!important;
    place-items: center!important;
    width: 66px!important;
    height: 66px!important;
    border: 1px solid #d7e5f7!important;
    border-radius: 18px!important;
    background: var(--vff-ui-primary-soft)!important;
    color: var(--vff-ui-primary)!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-symbol svg {
    width: 34px!important;
    height: 34px!important;
    fill: currentColor!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-copy {
    min-width: 0!important;
}

body.wdi-vff-ui-precision .vff-alt-overline,
body.wdi-vff-ui-precision .vff-reg-kicker,
body.wdi-vff-ui-precision .vff-reg-eyebrow,
body.wdi-vff-ui-precision .vff-garage-kicker {
    display: inline-flex!important;
    align-items: center!important;
    gap: 7px!important;
    margin: 0 0 8px!important;
    color: var(--vff-ui-primary)!important;
    font-size: 11px!important;
    font-weight: 800!important;
    line-height: 1.2!important;
    letter-spacing: .11em!important;
    text-transform: uppercase!important;
}

body.wdi-vff-ui-precision .vff-alt-overline::before,
body.wdi-vff-ui-precision .vff-reg-kicker::before,
body.wdi-vff-ui-precision .vff-garage-kicker::before {
    content: ""!important;
    width: 7px!important;
    height: 7px!important;
    border-radius: 99px!important;
    background: var(--vff-ui-accent)!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-copy h2 {
    margin: 0!important;
    max-width: 760px!important;
    color: var(--vff-ui-ink)!important;
    font-size: clamp(27px, 4vw, 46px)!important;
    font-weight: 780!important;
    line-height: 1.06!important;
    letter-spacing: -.045em!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-copy p {
    max-width: 760px!important;
    margin: 11px 0 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 14px!important;
    line-height: 1.65!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-assurance {
    display: flex!important;
    flex-wrap: wrap!important;
    justify-content: flex-end!important;
    gap: 8px!important;
    max-width: 280px!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-assurance span {
    display: inline-flex!important;
    align-items: center!important;
    gap: 7px!important;
    min-height: 34px!important;
    padding: 7px 10px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 999px!important;
    background: rgba(255,255,255,.8)!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 11px!important;
    font-weight: 700!important;
    white-space: nowrap!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-assurance b {
    display: grid!important;
    place-items: center!important;
    width: 17px!important;
    height: 17px!important;
    border-radius: 50%!important;
    background: var(--vff-ui-accent-soft)!important;
    color: var(--vff-ui-accent)!important;
    font-size: 10px!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-workspace {
    display: block!important;
    padding: clamp(22px, 4vw, 48px) clamp(18px, 5vw, 58px)!important;
    background: var(--vff-ui-surface)!important;
}

body.wdi-vff-ui-precision .vff-alt-method-tabs {
    display: grid!important;
    grid-template-columns: repeat(3, minmax(0, 1fr))!important;
    gap: 8px!important;
    width: 100%!important;
    margin: 0 0 34px!important;
    padding: 6px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 16px!important;
    background: var(--vff-ui-surface-soft)!important;
}

body.wdi-vff-ui-precision .vff-alt-method-tabs.has-2-methods {
    grid-template-columns: repeat(2, minmax(0, 1fr))!important;
}

body.wdi-vff-ui-precision .vff-alt-method-tab {
    display: grid!important;
    grid-template-columns: 32px minmax(0, 1fr)!important;
    gap: 10px!important;
    align-items: center!important;
    min-width: 0!important;
    min-height: 70px!important;
    padding: 12px 14px!important;
    border: 1px solid transparent!important;
    border-radius: 11px!important;
    background: transparent!important;
    color: var(--vff-ui-muted)!important;
    text-align: left!important;
    cursor: pointer!important;
    box-shadow: none!important;
    transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease!important;
}

body.wdi-vff-ui-precision .vff-alt-method-tab:hover {
    border-color: var(--vff-ui-line)!important;
    background: #fff!important;
    color: var(--vff-ui-ink-soft)!important;
}

body.wdi-vff-ui-precision .vff-alt-method-tab.is-active {
    border-color: #d6e6f8!important;
    background: #fff!important;
    color: var(--vff-ui-ink)!important;
    box-shadow: 0 5px 18px rgba(16,24,40,.07)!important;
}

body.wdi-vff-ui-precision .vff-alt-tab-number {
    display: grid!important;
    place-items: center!important;
    width: 32px!important;
    height: 32px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 10px!important;
    background: #fff!important;
    color: var(--vff-ui-muted)!important;
    font-size: 10px!important;
    font-weight: 850!important;
}

body.wdi-vff-ui-precision .vff-alt-method-tab.is-active .vff-alt-tab-number {
    border-color: var(--vff-ui-primary)!important;
    background: var(--vff-ui-primary)!important;
    color: #fff!important;
}

body.wdi-vff-ui-precision .vff-alt-method-tab strong,
body.wdi-vff-ui-precision .vff-alt-method-tab small {
    display: block!important;
    min-width: 0!important;
}

body.wdi-vff-ui-precision .vff-alt-method-tab strong {
    color: inherit!important;
    font-size: 13px!important;
    font-weight: 760!important;
    line-height: 1.3!important;
}

body.wdi-vff-ui-precision .vff-alt-method-tab small {
    margin-top: 3px!important;
    overflow: hidden!important;
    color: var(--vff-ui-muted)!important;
    font-size: 10px!important;
    line-height: 1.3!important;
    text-overflow: ellipsis!important;
    white-space: nowrap!important;
}

body.wdi-vff-ui-precision .vff-alt-method-panel[hidden] {
    display: none!important;
}

body.wdi-vff-ui-precision .vff-alt-method-panel.is-active {
    display: block!important;
    animation: vffPrecisionReveal .22s ease both!important;
}

@keyframes vffPrecisionReveal {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

body.wdi-vff-ui-precision .vff-alt-panel-intro {
    display: grid!important;
    grid-template-columns: minmax(0, 1fr)!important;
    gap: 4px!important;
    max-width: 760px!important;
    margin: 0 0 22px!important;
}

body.wdi-vff-ui-precision .vff-alt-panel-intro > span {
    color: var(--vff-ui-primary)!important;
    font-size: 10px!important;
    font-weight: 850!important;
    letter-spacing: .11em!important;
    text-transform: uppercase!important;
}

body.wdi-vff-ui-precision .vff-alt-panel-intro h3 {
    margin: 0!important;
    color: var(--vff-ui-ink)!important;
    font-size: clamp(22px, 3vw, 30px)!important;
    font-weight: 760!important;
    line-height: 1.15!important;
    letter-spacing: -.025em!important;
}

body.wdi-vff-ui-precision .vff-alt-panel-intro p {
    margin: 4px 0 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 13px!important;
    line-height: 1.6!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-foot {
    display: flex!important;
    align-items: center!important;
    gap: 10px!important;
    padding: 14px clamp(18px, 5vw, 58px)!important;
    border-top: 1px solid var(--vff-ui-line)!important;
    background: var(--vff-ui-surface-soft)!important;
    color: var(--vff-ui-muted)!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-foot > span {
    display: grid!important;
    place-items: center!important;
    flex: 0 0 auto!important;
    width: 21px!important;
    height: 21px!important;
    border-radius: 50%!important;
    background: var(--vff-ui-primary-soft)!important;
    color: var(--vff-ui-primary)!important;
    font-size: 11px!important;
    font-weight: 800!important;
}

body.wdi-vff-ui-precision .vff-alt-finder-foot p {
    margin: 0!important;
    font-size: 12px!important;
    line-height: 1.5!important;
}

/* --------------------------------------------------------------------------
   Registration / VIN lookup
   -------------------------------------------------------------------------- */
body.wdi-vff-ui-precision .vff-reg-lookup {
    width: 100%!important;
    margin: 0!important;
    padding: 0!important;
    border: 0!important;
    background: transparent!important;
    box-shadow: none!important;
}

body.wdi-vff-ui-precision .vff-reg-lookup-inner {
    display: grid!important;
    gap: 20px!important;
}

body.wdi-vff-ui-precision .vff-reg-copy h3 {
    margin: 0!important;
    color: var(--vff-ui-ink)!important;
    font-size: 24px!important;
    font-weight: 760!important;
    letter-spacing: -.025em!important;
}

body.wdi-vff-ui-precision .vff-reg-copy p {
    margin: 8px 0 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 13px!important;
    line-height: 1.6!important;
}

body.wdi-vff-ui-precision .vff-reg-form {
    display: grid!important;
    grid-template-columns: minmax(0, 1fr) auto!important;
    gap: 12px 14px!important;
    align-items: start!important;
}

body.wdi-vff-ui-precision .vff-identity-methods {
    grid-column: 1 / -1!important;
    display: inline-grid!important;
    grid-auto-flow: column!important;
    grid-auto-columns: minmax(135px, auto)!important;
    justify-content: start!important;
    gap: 6px!important;
    width: fit-content!important;
    padding: 4px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 12px!important;
    background: var(--vff-ui-surface-soft)!important;
}

body.wdi-vff-ui-precision .vff-identity-method {
    min-height: 38px!important;
    padding: 0 14px!important;
    border: 0!important;
    border-radius: 9px!important;
    background: transparent!important;
    color: var(--vff-ui-muted)!important;
    font-size: 12px!important;
    font-weight: 720!important;
    cursor: pointer!important;
}

body.wdi-vff-ui-precision .vff-identity-method.is-active {
    background: #fff!important;
    color: var(--vff-ui-primary)!important;
    box-shadow: 0 3px 10px rgba(16,24,40,.07)!important;
}

body.wdi-vff-ui-precision .vff-reg-plate-field {
    position: relative!important;
    display: grid!important;
    grid-template-columns: auto minmax(0, 1fr)!important;
    align-items: stretch!important;
    min-width: 0!important;
    height: 62px!important;
    overflow: hidden!important;
    border: 1px solid var(--vff-ui-line-strong)!important;
    border-radius: 15px!important;
    background: #fff!important;
    transition: border-color .18s ease, box-shadow .18s ease!important;
}

body.wdi-vff-ui-precision .vff-reg-plate-field:focus-within {
    border-color: var(--vff-ui-primary)!important;
    box-shadow: var(--vff-ui-focus)!important;
}

body.wdi-vff-ui-precision .vff-reg-plate-flag {
    display: grid!important;
    grid-template-columns: auto auto!important;
    gap: 6px!important;
    align-items: center!important;
    min-width: 78px!important;
    padding: 0 13px!important;
    border-right: 1px solid var(--vff-ui-line)!important;
    color: var(--vff-ui-ink-soft)!important;
}

body.wdi-vff-ui-precision .vff-reg-plate-flag span {
    font-size: 18px!important;
    line-height: 1!important;
}

body.wdi-vff-ui-precision .vff-reg-plate-flag strong {
    font-size: 10px!important;
    font-weight: 850!important;
    letter-spacing: .08em!important;
}

body.wdi-vff-ui-precision .vff-vin-field .vff-reg-plate-flag {
    background: #eef2f6!important;
}

body.wdi-vff-ui-precision .vff-reg-input {
    min-width: 0!important;
    width: 100%!important;
    height: 60px!important;
    margin: 0!important;
    padding: 0 18px!important;
    border: 0!important;
    outline: 0!important;
    background: transparent!important;
    color: var(--vff-ui-ink)!important;
    font-size: clamp(17px, 2vw, 22px)!important;
    font-weight: 760!important;
    letter-spacing: .045em!important;
    text-transform: uppercase!important;
    box-shadow: none!important;
}

body.wdi-vff-ui-precision .vff-reg-input::placeholder {
    color: #98a2b3!important;
    font-weight: 620!important;
    opacity: 1!important;
}

body.wdi-vff-ui-precision .vff-reg-actions {
    display: flex!important;
    align-items: center!important;
    gap: 9px!important;
}

body.wdi-vff-ui-precision .vff-reg-submit,
body.wdi-vff-ui-precision .vff-submit,
body.wdi-vff-ui-precision .vff-garage-primary,
body.wdi-vff-ui-precision .vff-protected-empty-button {
    display: inline-flex!important;
    align-items: center!important;
    justify-content: center!important;
    min-height: 50px!important;
    padding: 0 21px!important;
    border: 1px solid var(--vff-ui-primary)!important;
    border-radius: 12px!important;
    background: var(--vff-ui-primary)!important;
    color: #fff!important;
    font-size: 13px!important;
    font-weight: 780!important;
    line-height: 1!important;
    text-decoration: none!important;
    cursor: pointer!important;
    box-shadow: 0 10px 22px rgba(11,99,206,.18)!important;
    transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease!important;
}

body.wdi-vff-ui-precision .vff-reg-submit {
    min-height: 62px!important;
    padding-inline: 26px!important;
}

body.wdi-vff-ui-precision :where(.vff-reg-submit, .vff-submit, .vff-garage-primary, .vff-protected-empty-button):hover {
    border-color: var(--vff-ui-primary-dark)!important;
    background: var(--vff-ui-primary-dark)!important;
    color: #fff!important;
    transform: translateY(-1px)!important;
    box-shadow: 0 13px 28px rgba(11,99,206,.24)!important;
}

body.wdi-vff-ui-precision :where(.vff-reg-submit, .vff-submit):disabled {
    border-color: #cbd5df!important;
    background: #dce3ea!important;
    color: #7c8997!important;
    cursor: not-allowed!important;
    transform: none!important;
    box-shadow: none!important;
}

body.wdi-vff-ui-precision .vff-reg-hint {
    grid-column: 1 / 2!important;
    margin: -2px 0 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 11px!important;
    line-height: 1.55!important;
}

body.wdi-vff-ui-precision :where(.vff-reg-reset, .vff-reset, .vff-frontpage-check-another) {
    display: inline-flex!important;
    align-items: center!important;
    justify-content: center!important;
    min-height: 40px!important;
    padding: 0 12px!important;
    border: 0!important;
    border-radius: 9px!important;
    background: transparent!important;
    color: var(--vff-ui-primary)!important;
    font-size: 12px!important;
    font-weight: 760!important;
    text-decoration: none!important;
    cursor: pointer!important;
}

body.wdi-vff-ui-precision :where(.vff-reg-reset, .vff-reset, .vff-frontpage-check-another):hover {
    background: var(--vff-ui-primary-soft)!important;
    color: var(--vff-ui-primary-dark)!important;
    text-decoration: none!important;
}

body.wdi-vff-ui-precision .vff-reg-output {
    margin-top: 24px!important;
}

body.wdi-vff-ui-precision .vff-reg-loading,
body.wdi-vff-ui-precision .vff-reg-error {
    display: flex!important;
    align-items: center!important;
    min-height: 52px!important;
    padding: 13px 15px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 12px!important;
    background: var(--vff-ui-surface-soft)!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 13px!important;
}

body.wdi-vff-ui-precision .vff-reg-error {
    border-color: #ffd0cb!important;
    background: var(--vff-ui-danger-soft)!important;
    color: var(--vff-ui-danger)!important;
}

/* Lookup results */
body.wdi-vff-ui-precision .vff-reg-card {
    display: grid!important;
    gap: 18px!important;
}

body.wdi-vff-ui-precision .vff-reg-found {
    padding: clamp(18px, 3vw, 26px)!important;
    border: 1px solid #cfe9df!important;
    border-radius: 18px!important;
    background: linear-gradient(135deg, #f8fffc 0%, var(--vff-ui-accent-soft) 100%)!important;
}

body.wdi-vff-ui-precision .vff-reg-found-head {
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 12px!important;
    align-items: center!important;
}

body.wdi-vff-ui-precision .vff-reg-status-mark {
    display: grid!important;
    place-items: center!important;
    flex: 0 0 auto!important;
    width: 40px!important;
    height: 40px!important;
    border-radius: 12px!important;
    background: var(--vff-ui-accent)!important;
    color: #fff!important;
    font-size: 18px!important;
    font-weight: 900!important;
}

body.wdi-vff-ui-precision .vff-reg-found-head > div {
    min-width: 0!important;
    flex: 1 1 260px!important;
}

body.wdi-vff-ui-precision .vff-reg-found-head > div > span {
    display: block!important;
    margin-bottom: 2px!important;
    color: #4f6b62!important;
    font-size: 10px!important;
    font-weight: 850!important;
    letter-spacing: .09em!important;
    text-transform: uppercase!important;
}

body.wdi-vff-ui-precision .vff-reg-found-head strong {
    display: block!important;
    color: var(--vff-ui-ink)!important;
    font-size: clamp(18px, 2.5vw, 24px)!important;
    font-weight: 780!important;
    line-height: 1.25!important;
}

body.wdi-vff-ui-precision .vff-reg-engine-badge,
body.wdi-vff-ui-precision .vff-reg-match-count {
    display: inline-flex!important;
    align-items: center!important;
    min-height: 30px!important;
    padding: 5px 10px!important;
    border: 1px solid #cfe9df!important;
    border-radius: 999px!important;
    background: #fff!important;
    color: #18725a!important;
    font-size: 10px!important;
    font-weight: 800!important;
    white-space: nowrap!important;
}

body.wdi-vff-ui-precision .vff-reg-description {
    margin: 14px 0 0!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 13px!important;
    line-height: 1.55!important;
}

body.wdi-vff-ui-precision .vff-reg-facts {
    display: grid!important;
    grid-template-columns: repeat(6, minmax(0, 1fr))!important;
    gap: 8px!important;
    margin-top: 16px!important;
}

body.wdi-vff-ui-precision .vff-reg-facts > span {
    min-width: 0!important;
    padding: 10px 11px!important;
    border: 1px solid rgba(24,161,121,.14)!important;
    border-radius: 11px!important;
    background: rgba(255,255,255,.76)!important;
}

body.wdi-vff-ui-precision .vff-reg-facts small,
body.wdi-vff-ui-precision .vff-reg-facts strong {
    display: block!important;
    overflow-wrap: anywhere!important;
}

body.wdi-vff-ui-precision .vff-reg-facts small {
    color: var(--vff-ui-muted)!important;
    font-size: 9px!important;
    font-weight: 800!important;
    letter-spacing: .06em!important;
    text-transform: uppercase!important;
}

body.wdi-vff-ui-precision .vff-reg-facts strong {
    margin-top: 3px!important;
    color: var(--vff-ui-ink)!important;
    font-size: 12px!important;
    font-weight: 760!important;
}

body.wdi-vff-ui-precision .vff-reg-message,
body.wdi-vff-ui-precision .vff-reg-warning,
body.wdi-vff-ui-precision .vff-protected-empty,
body.wdi-vff-ui-precision .vff-result-notice {
    display: flex!important;
    gap: 10px!important;
    align-items: flex-start!important;
    margin: 0!important;
    padding: 13px 15px!important;
    border: 1px solid #d9e5f4!important;
    border-radius: 12px!important;
    background: #f5f9ff!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 12px!important;
    line-height: 1.55!important;
}

body.wdi-vff-ui-precision .vff-reg-message > span {
    display: grid!important;
    place-items: center!important;
    flex: 0 0 auto!important;
    width: 22px!important;
    height: 22px!important;
    border-radius: 50%!important;
    background: var(--vff-ui-primary-soft)!important;
    color: var(--vff-ui-primary)!important;
    font-size: 11px!important;
    font-weight: 900!important;
}

body.wdi-vff-ui-precision .vff-reg-message.is-success {
    border-color: #cfe9df!important;
    background: #f5fcf9!important;
}

body.wdi-vff-ui-precision .vff-reg-message.is-success > span {
    background: var(--vff-ui-accent-soft)!important;
    color: var(--vff-ui-accent)!important;
}

body.wdi-vff-ui-precision .vff-reg-message p,
body.wdi-vff-ui-precision .vff-reg-warning p {
    margin: 0!important;
}

body.wdi-vff-ui-precision .vff-reg-warning {
    display: block!important;
    border-color: #f3dda1!important;
    background: var(--vff-ui-warning-soft)!important;
}

body.wdi-vff-ui-precision .vff-reg-warning strong {
    display: block!important;
    margin-bottom: 4px!important;
    color: #7a5200!important;
}

body.wdi-vff-ui-precision .vff-reg-contact {
    display: inline-flex!important;
    margin-top: 10px!important;
    color: var(--vff-ui-primary)!important;
    font-weight: 760!important;
    text-decoration: none!important;
}

body.wdi-vff-ui-precision .vff-reg-matches {
    padding-top: 2px!important;
}

body.wdi-vff-ui-precision .vff-reg-matches-head {
    display: flex!important;
    justify-content: space-between!important;
    gap: 16px!important;
    align-items: end!important;
    margin-bottom: 12px!important;
}

body.wdi-vff-ui-precision .vff-reg-matches-head h4 {
    margin: 2px 0 0!important;
    color: var(--vff-ui-ink)!important;
    font-size: 18px!important;
    font-weight: 760!important;
    letter-spacing: -.02em!important;
}

body.wdi-vff-ui-precision .vff-reg-match-grid {
    display: grid!important;
    grid-template-columns: repeat(2, minmax(0, 1fr))!important;
    gap: 10px!important;
}

body.wdi-vff-ui-precision .vff-reg-match {
    display: grid!important;
    grid-template-columns: 42px minmax(0, 1fr) auto!important;
    gap: 12px!important;
    align-items: center!important;
    width: 100%!important;
    min-width: 0!important;
    min-height: 84px!important;
    padding: 13px 14px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 14px!important;
    background: #fff!important;
    color: var(--vff-ui-ink)!important;
    text-align: left!important;
    cursor: pointer!important;
    box-shadow: none!important;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease!important;
}

body.wdi-vff-ui-precision .vff-reg-match:hover {
    border-color: #b9d4f4!important;
    transform: translateY(-1px)!important;
    box-shadow: var(--vff-ui-shadow-sm)!important;
}

body.wdi-vff-ui-precision .vff-reg-match-icon {
    display: grid!important;
    place-items: center!important;
    width: 42px!important;
    height: 42px!important;
    border-radius: 12px!important;
    background: var(--vff-ui-primary-soft)!important;
    color: var(--vff-ui-primary)!important;
}

body.wdi-vff-ui-precision .vff-reg-match-icon svg {
    width: 24px!important;
    height: 24px!important;
    fill: currentColor!important;
}

body.wdi-vff-ui-precision .vff-reg-match-copy {
    min-width: 0!important;
}

body.wdi-vff-ui-precision .vff-reg-match-main,
body.wdi-vff-ui-precision .vff-reg-match-engine {
    display: block!important;
    overflow-wrap: anywhere!important;
}

body.wdi-vff-ui-precision .vff-reg-match-main {
    color: var(--vff-ui-ink)!important;
    font-size: 12px!important;
    font-weight: 760!important;
    line-height: 1.4!important;
}

body.wdi-vff-ui-precision .vff-reg-match-engine {
    margin-top: 3px!important;
    color: var(--vff-ui-muted)!important;
    font-size: 11px!important;
    line-height: 1.4!important;
}

body.wdi-vff-ui-precision .vff-reg-match-action {
    color: var(--vff-ui-primary)!important;
    font-size: 11px!important;
    font-weight: 800!important;
    white-space: nowrap!important;
}

body.wdi-vff-ui-precision .vff-reg-result-reset {
    display: flex!important;
    gap: 8px 12px!important;
    align-items: center!important;
    flex-wrap: wrap!important;
    padding-top: 2px!important;
}

body.wdi-vff-ui-precision .vff-reg-result-reset p {
    margin: 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 11px!important;
}

/* --------------------------------------------------------------------------
   Manual five-level vehicle selection
   -------------------------------------------------------------------------- */
body.wdi-vff-ui-precision .vff-filter-form-pro {
    display: grid!important;
    grid-template-columns: repeat(6, minmax(0, 1fr))!important;
    gap: 12px!important;
    align-items: end!important;
    width: 100%!important;
    margin: 0!important;
    padding: 0!important;
    border: 0!important;
    background: transparent!important;
    box-shadow: none!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field {
    position: relative!important;
    display: flex!important;
    flex: none!important;
    min-width: 0!important;
    margin: 0!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(1),
body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(2),
body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(3) {
    grid-column: span 2!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(4),
body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(5) {
    grid-column: span 3!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field label {
    display: flex!important;
    align-items: center!important;
    min-height: 22px!important;
    margin: 0 0 6px!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 10px!important;
    font-weight: 800!important;
    letter-spacing: .055em!important;
    text-transform: uppercase!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field label::before {
    display: grid!important;
    place-items: center!important;
    width: 18px!important;
    height: 18px!important;
    margin-right: 6px!important;
    border: 1px solid var(--vff-ui-line-strong)!important;
    border-radius: 6px!important;
    background: var(--vff-ui-surface-soft)!important;
    color: var(--vff-ui-muted)!important;
    font-size: 9px!important;
    font-weight: 850!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(1) label::before { content: "1"!important; }
body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(2) label::before { content: "2"!important; }
body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(3) label::before { content: "3"!important; }
body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(4) label::before { content: "4"!important; }
body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(5) label::before { content: "5"!important; }

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field.is-complete label::before {
    content: "✓"!important;
    border-color: #bde4d7!important;
    background: var(--vff-ui-accent-soft)!important;
    color: var(--vff-ui-accent)!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-select,
body.wdi-vff-ui-precision .vff-garage .vff-select {
    width: 100%!important;
    min-width: 0!important;
    min-height: 52px!important;
    margin: 0!important;
    padding: 0 42px 0 14px!important;
    border: 1px solid var(--vff-ui-line-strong)!important;
    border-radius: 12px!important;
    background-color: #fff!important;
    color: var(--vff-ui-ink)!important;
    font-size: 13px!important;
    font-weight: 650!important;
    box-shadow: none!important;
    cursor: pointer!important;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-select:focus,
body.wdi-vff-ui-precision .vff-garage .vff-select:focus {
    border-color: var(--vff-ui-primary)!important;
    outline: 0!important;
    box-shadow: var(--vff-ui-focus)!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field.is-complete .vff-select {
    border-color: #bfe0d4!important;
    background-color: #fbfffd!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field.is-disabled {
    opacity: .62!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-select:disabled,
body.wdi-vff-ui-precision .vff-garage .vff-select:disabled {
    background-color: #f1f4f7!important;
    color: #8b98a7!important;
    cursor: not-allowed!important;
}

body.wdi-vff-ui-precision .vff-filter-form-pro .vff-actions {
    grid-column: 1 / -1!important;
    display: flex!important;
    justify-content: flex-start!important;
    gap: 8px!important;
    align-items: center!important;
    margin-top: 3px!important;
}

/* --------------------------------------------------------------------------
   Active vehicle
   -------------------------------------------------------------------------- */
body.wdi-vff-ui-precision .vff-alt-selected {
    display: grid!important;
    grid-template-columns: 4fr 1fr auto !important;
    gap: 18px!important;
    align-items: center!important;
    padding: clamp(20px, 3vw, 28px)!important;
    border: 1px solid #1d334c!important;
    border-radius: 22px!important;
    background: linear-gradient(135deg, #111c29 0%, #162a40 100%)!important;
    color: #fff!important;
    box-shadow: var(--vff-ui-shadow)!important;
}

body.wdi-vff-ui-precision .vff-alt-selected-icon {
    display: grid!important;
    place-items: center!important;
    width: 48px!important;
    height: 48px!important;
    border-radius: 14px!important;
    background: rgba(67, 205, 160, .14)!important;
    color: #6fe1bb!important;
}

body.wdi-vff-ui-precision .vff-alt-selected-icon svg {
    width: 26px!important;
    height: 26px!important;
    fill: currentColor!important;
}

body.wdi-vff-ui-precision .vff-frontpage-selected-kicker {
    display: block!important;
    margin-bottom: 4px!important;
    color: #83a8ce!important;
    font-size: 10px!important;
    font-weight: 850!important;
    letter-spacing: .1em!important;
    text-transform: uppercase!important;
}

body.wdi-vff-ui-precision .vff-alt-selected h2 {
    margin: 0!important;
    color: #fff!important;
    font-size: clamp(18px, 2.5vw, 24px)!important;
    font-weight: 760!important;
    line-height: 1.25!important;
}

body.wdi-vff-ui-precision .vff-alt-selected-meta {
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 8px!important;
    margin-top: 10px!important;
}

body.wdi-vff-ui-precision .vff-alt-selected-meta > span {
    display: inline-flex!important;
    align-items: baseline!important;
    gap: 6px!important;
    padding: 6px 9px!important;
    border: 1px solid rgba(255,255,255,.1)!important;
    border-radius: 9px!important;
    background: rgba(255,255,255,.05)!important;
}

body.wdi-vff-ui-precision .vff-alt-selected-meta small {
    color: #93a9be!important;
    font-size: 9px!important;
    font-weight: 760!important;
    text-transform: uppercase!important;
}

body.wdi-vff-ui-precision .vff-alt-selected-meta strong {
    color: #fff!important;
    font-size: 11px!important;
}

body.wdi-vff-ui-precision .vff-frontpage-selected-action {
    text-align: right!important;
}

body.wdi-vff-ui-precision .vff-frontpage-selected-action .vff-frontpage-check-another {
    min-height: 42px!important;
    padding: 0 15px!important;
    border: 1px solid rgba(255,255,255,.17)!important;
    background: rgba(255,255,255,.08)!important;
    color: #fff!important;
}

body.wdi-vff-ui-precision .vff-frontpage-selected-action .vff-frontpage-check-another:hover {
    background: rgba(255,255,255,.14)!important;
    color: #fff!important;
}

body.wdi-vff-ui-precision .vff-frontpage-selected-action p {
    margin: 6px 0 0!important;
    color: #9ab0c6!important;
    font-size: 10px!important;
}

/* --------------------------------------------------------------------------
   Results, categories and products
   -------------------------------------------------------------------------- */
body.wdi-vff-ui-precision .vff-shop-page,
body.wdi-vff-ui-precision .vff-shop-results {
    width: 100%!important;
    margin-block: 24px!important;
}

body.wdi-vff-ui-precision .vff-shop-heading h2,
body.wdi-vff-ui-precision .vff-result-summary h2,
body.wdi-vff-ui-precision .vff-section-heading h3 {
    color: var(--vff-ui-ink)!important;
    letter-spacing: -.03em!important;
}

body.wdi-vff-ui-precision .vff-shop-heading h2 {
    margin: 0 0 16px!important;
    font-size: clamp(25px, 4vw, 40px)!important;
    font-weight: 780!important;
}

body.wdi-vff-ui-precision .vff-result-summary {
    margin: 0 0 20px!important;
    padding: 18px 20px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-left: 4px solid var(--vff-ui-accent)!important;
    border-radius: 14px!important;
    background: #fff!important;
    box-shadow: var(--vff-ui-shadow-sm)!important;
}

body.wdi-vff-ui-precision .vff-result-summary h2 {
    margin: 0 0 5px!important;
    font-size: 18px!important;
    font-weight: 760!important;
}

body.wdi-vff-ui-precision .vff-result-summary p {
    margin: 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 12px!important;
}

body.wdi-vff-ui-precision .vff-section {
    margin-top: 28px!important;
}

body.wdi-vff-ui-precision .vff-section-heading {
    display: flex!important;
    flex-wrap: wrap!important;
    justify-content: space-between!important;
    gap: 8px 24px!important;
    align-items: end!important;
    margin-bottom: 14px!important;
}

body.wdi-vff-ui-precision .vff-section-heading h3 {
    margin: 0!important;
    font-size: clamp(20px, 3vw, 28px)!important;
    font-weight: 770!important;
}

body.wdi-vff-ui-precision .vff-section-heading p {
    max-width: 680px!important;
    margin: 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 12px!important;
    line-height: 1.55!important;
}

body.wdi-vff-ui-precision .vff-category-trail {
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 7px!important;
    align-items: center!important;
    margin-bottom: 14px!important;
    color: var(--vff-ui-muted)!important;
    font-size: 11px!important;
}

body.wdi-vff-ui-precision .vff-category-trail a {
    color: var(--vff-ui-primary)!important;
    font-weight: 700!important;
    text-decoration: none!important;
}

body.wdi-vff-ui-precision .vff-trail-separator {
    color: #aab4bf!important;
}

body.wdi-vff-ui-precision .vff-shop-category-grid {
    display: grid!important;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr))!important;
    gap: 12px!important;
}

body.wdi-vff-ui-precision .vff-shop-category-card {
    display: grid!important;
    grid-template-rows: 225px !important;
    min-width: 0!important;
    overflow: hidden!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 16px!important;
    background: #fff!important;
    color: var(--vff-ui-ink)!important;
    text-decoration: none!important;
    box-shadow: 0 5px 18px rgba(16,24,40,.045)!important;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease!important;
}

body.wdi-vff-ui-precision .vff-shop-category-card:hover {
    border-color: #bdd4ee!important;
    color: var(--vff-ui-ink)!important;
    text-decoration: none!important;
    transform: translateY(-2px)!important;
    box-shadow: 0 14px 34px rgba(16,24,40,.09)!important;
}

body.wdi-vff-ui-precision .vff-shop-category-image {
    display: grid!important;
    place-items: center!important;
    min-width: 0!important;
    overflow: hidden!important;
    width: 100%;
    height: 100%;
}

body.wdi-vff-ui-precision .vff-shop-category-image img {
    width: 100%!important;
    height: 100%!important;
    object-fit: contain!important;
    padding: 14px!important;
    transition: transform .2s ease!important;
}

body.wdi-vff-ui-precision .vff-shop-category-card:hover .vff-shop-category-image img {
    transform: scale(1.025)!important;
}

body.wdi-vff-ui-precision .vff-category-placeholder {
    display: block!important;
    width: 52px!important;
    height: 52px!important;
    border: 1px dashed #cbd5df!important;
    border-radius: 15px!important;
    background: #fff!important;
}

body.wdi-vff-ui-precision .vff-shop-category-body {
    display: block!important;
    padding: 14px 15px 16px!important;
}

body.wdi-vff-ui-precision .vff-shop-category-title,
body.wdi-vff-ui-precision .vff-shop-category-count {
    display: block!important;
}

body.wdi-vff-ui-precision .vff-shop-category-title {
    color: var(--vff-ui-ink)!important;
    font-size: 14px!important;
    font-weight: 500!important;
    line-height: 1.35!important;
}

body.wdi-vff-ui-precision .vff-shop-category-count {
    margin-top: 5px!important;
    color: var(--vff-ui-muted)!important;
    font-size: 10px!important;
    line-height: 1.4!important;
}

body.wdi-vff-ui-precision .vff-shop-products ul.products {
    display: grid!important;
    grid-template-columns: repeat(5, minmax(0, 1fr))!important;
    gap: 16px!important;
}

body.wdi-vff-ui-precision .vff-shop-products ul.products::before,
body.wdi-vff-ui-precision .vff-shop-products ul.products::after {
    display: none!important;
}

body.wdi-vff-ui-precision .vff-shop-products ul.products li.product {
    width: auto!important;
    margin: 0!important;
}

body.wdi-vff-ui-precision .vff-fallback-product-grid {
    display: grid!important;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr))!important;
    gap: 14px!important;
}

body.wdi-vff-ui-precision .vff-fallback-product-card {
    display: grid!important;
    gap: 10px!important;
    padding: 12px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 15px!important;
    background: #fff!important;
    color: var(--vff-ui-ink)!important;
    font-size: 12px!important;
    font-weight: 700!important;
    text-decoration: none!important;
    box-shadow: var(--vff-ui-shadow-sm)!important;
}

body.wdi-vff-ui-precision .vff-fallback-product-card img {
    width: 100%!important;
    height: auto!important;
    border-radius: 10px!important;
}

body.wdi-vff-ui-precision .vff-products-pagination {
    display: flex!important;
    justify-content: space-between!important;
    gap: 12px!important;
    align-items: center!important;
    margin-top: 22px!important;
    padding: 12px 14px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 13px!important;
    background: #fff!important;
}

body.wdi-vff-ui-precision .vff-products-pagination-summary {
    color: var(--vff-ui-muted)!important;
    font-size: 11px!important;
}

body.wdi-vff-ui-precision .vff-products-pagination-links {
    display: flex!important;
    gap: 5px!important;
    flex-wrap: wrap!important;
}

body.wdi-vff-ui-precision .vff-products-pagination-links a,
body.wdi-vff-ui-precision .vff-products-pagination-links span {
    display: grid!important;
    place-items: center!important;
    min-width: 34px!important;
    height: 34px!important;
    padding-inline: 9px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 9px!important;
    background: #fff!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 11px!important;
    font-weight: 700!important;
    text-decoration: none!important;
}

body.wdi-vff-ui-precision .vff-products-pagination-links .current {
    border-color: var(--vff-ui-primary)!important;
    background: var(--vff-ui-primary)!important;
    color: #fff!important;
}

body.wdi-vff-ui-precision .vff-empty-state,
body.wdi-vff-ui-precision .vff-protected-empty {
    margin: 22px 0!important;
    padding: clamp(22px, 4vw, 34px)!important;
    border: 1px dashed #cbd5df!important;
    border-radius: 18px!important;
    background: var(--vff-ui-surface-soft)!important;
    text-align: center!important;
}

body.wdi-vff-ui-precision .vff-empty-state h3,
body.wdi-vff-ui-precision .vff-protected-empty strong {
    margin: 0!important;
    color: var(--vff-ui-ink)!important;
    font-size: 18px!important;
    font-weight: 760!important;
}

body.wdi-vff-ui-precision .vff-empty-state p,
body.wdi-vff-ui-precision .vff-protected-empty p {
    max-width: 680px!important;
    margin: 7px auto 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 12px!important;
    line-height: 1.6!important;
}

body.wdi-vff-ui-precision .vff-manual-choice {
    display: flex!important;
    align-items: center!important;
    gap: 12px!important;
    margin: 18px 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 11px!important;
    font-weight: 700!important;
}

body.wdi-vff-ui-precision .vff-manual-choice::before,
body.wdi-vff-ui-precision .vff-manual-choice::after {
    content: ""!important;
    height: 1px!important;
    flex: 1 1 auto!important;
    background: var(--vff-ui-line)!important;
}

/* --------------------------------------------------------------------------
   My Garage
   -------------------------------------------------------------------------- */
body.wdi-vff-ui-precision .vff-garage-pro {
    margin: 24px 0!important;
}

body.wdi-vff-ui-precision .vff-garage-header {
    display: flex!important;
    justify-content: space-between!important;
    gap: 16px!important;
    align-items: end!important;
    margin-bottom: 16px!important;
}

body.wdi-vff-ui-precision .vff-garage-header h2 {
    margin: 0!important;
    color: var(--vff-ui-ink)!important;
    font-size: clamp(24px, 3vw, 34px)!important;
    font-weight: 780!important;
    letter-spacing: -.035em!important;
}

body.wdi-vff-ui-precision .vff-garage-header p {
    margin: 5px 0 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 12px!important;
}

body.wdi-vff-ui-precision .vff-garage-add-toggle,
body.wdi-vff-ui-precision .vff-garage-secondary,
body.wdi-vff-ui-precision .vff-garage-danger {
    display: inline-flex!important;
    align-items: center!important;
    justify-content: center!important;
    min-height: 40px!important;
    padding: 0 13px!important;
    border: 1px solid var(--vff-ui-line-strong)!important;
    border-radius: 10px!important;
    background: #fff!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 11px!important;
    font-weight: 760!important;
    cursor: pointer!important;
}

body.wdi-vff-ui-precision .vff-garage-add-toggle:hover,
body.wdi-vff-ui-precision .vff-garage-secondary:hover {
    border-color: #b8d1ed!important;
    background: var(--vff-ui-primary-soft)!important;
    color: var(--vff-ui-primary)!important;
}

body.wdi-vff-ui-precision .vff-garage-danger {
    border-color: #f2c5c0!important;
    color: var(--vff-ui-danger)!important;
}

body.wdi-vff-ui-precision .vff-garage-danger:hover {
    background: var(--vff-ui-danger-soft)!important;
}

body.wdi-vff-ui-precision .vff-garage-add-form {
    display: block!important;
    margin: 0 0 18px!important;
    padding: 18px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 16px!important;
    background: var(--vff-ui-surface-soft)!important;
}

body.wdi-vff-ui-precision .vff-garage-form-grid {
    display: grid!important;
    grid-template-columns: repeat(3, minmax(0, 1fr))!important;
    gap: 12px!important;
}

body.wdi-vff-ui-precision .vff-garage-form-grid .vff-field {
    min-width: 0!important;
    margin: 0!important;
}

body.wdi-vff-ui-precision .vff-garage-form-grid label {
    margin-bottom: 5px!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 10px!important;
    font-weight: 800!important;
    text-transform: uppercase!important;
}

body.wdi-vff-ui-precision .vff-garage-grid {
    display: grid!important;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr))!important;
    gap: 12px!important;
}

body.wdi-vff-ui-precision .vff-garage-card {
    position: relative!important;
    padding: 18px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 16px!important;
    background: #fff!important;
    box-shadow: var(--vff-ui-shadow-sm)!important;
}

body.wdi-vff-ui-precision .vff-garage-card.is-active {
    border-color: #bde4d7!important;
    box-shadow: inset 0 0 0 1px #d7f0e8, var(--vff-ui-shadow-sm)!important;
}

body.wdi-vff-ui-precision .vff-garage-card-top {
    display: flex!important;
    justify-content: space-between!important;
    align-items: center!important;
    margin-bottom: 12px!important;
}

body.wdi-vff-ui-precision .vff-garage-icon {
    display: grid!important;
    place-items: center!important;
    width: 42px!important;
    height: 42px!important;
    border-radius: 12px!important;
    background: var(--vff-ui-primary-soft)!important;
    font-size: 20px!important;
}

body.wdi-vff-ui-precision .vff-garage-active-badge {
    display: inline-flex!important;
    padding: 5px 9px!important;
    border-radius: 999px!important;
    background: var(--vff-ui-accent-soft)!important;
    color: var(--vff-ui-accent)!important;
    font-size: 9px!important;
    font-weight: 850!important;
    letter-spacing: .06em!important;
    text-transform: uppercase!important;
}

body.wdi-vff-ui-precision .vff-garage-card h3 {
    margin: 0!important;
    color: var(--vff-ui-ink)!important;
    font-size: 17px!important;
    font-weight: 760!important;
}

body.wdi-vff-ui-precision .vff-garage-model,
body.wdi-vff-ui-precision .vff-garage-engine {
    margin: 5px 0 0!important;
    color: var(--vff-ui-muted)!important;
    font-size: 11px!important;
    line-height: 1.45!important;
}

body.wdi-vff-ui-precision .vff-garage-card-actions {
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 7px!important;
    margin-top: 16px!important;
}

body.wdi-vff-ui-precision .vff-garage-primary {
    min-height: 40px!important;
    padding-inline: 14px!important;
    font-size: 11px!important;
}

body.wdi-vff-ui-precision .vff-garage-inline-action {
    margin: 0!important;
}

body.wdi-vff-ui-precision .vff-garage-notice {
    margin-bottom: 14px!important;
    padding: 11px 13px!important;
    border: 1px solid #cfe9df!important;
    border-radius: 11px!important;
    background: var(--vff-ui-accent-soft)!important;
    color: #176b54!important;
    font-size: 11px!important;
    font-weight: 650!important;
}

/* --------------------------------------------------------------------------
   Product OE / fitment information
   -------------------------------------------------------------------------- */
body.wdi-vff-ui-precision .vff-product-info-tab {
    display: grid!important;
    gap: 16px!important;
    margin-block: 22px!important;
}

body.wdi-vff-ui-precision .vff-product-info-panel {
    overflow: hidden!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 16px!important;
    background: #fff!important;
}

body.wdi-vff-ui-precision .vff-product-info-heading {
    display: flex!important;
    gap: 10px!important;
    align-items: center!important;
    padding: 14px 16px!important;
    border-bottom: 1px solid var(--vff-ui-line)!important;
    background: var(--vff-ui-surface-soft)!important;
}

body.wdi-vff-ui-precision .vff-product-info-heading > span {
    display: grid!important;
    place-items: center!important;
    min-width: 34px!important;
    height: 28px!important;
    padding-inline: 7px!important;
    border-radius: 8px!important;
    background: var(--vff-ui-primary-soft)!important;
    color: var(--vff-ui-primary)!important;
    font-size: 9px!important;
    font-weight: 900!important;
    letter-spacing: .06em!important;
}

body.wdi-vff-ui-precision .vff-product-info-heading h3 {
    margin: 0!important;
    color: var(--vff-ui-ink)!important;
    font-size: 16px!important;
    font-weight: 760!important;
}

body.wdi-vff-ui-precision .vff-oe-number-grid {
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 7px!important;
    padding: 16px!important;
}

body.wdi-vff-ui-precision .vff-oe-number-pill {
    display: inline-flex!important;
    align-items: center!important;
    min-height: 32px!important;
    padding: 5px 10px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 9px!important;
    background: #fff!important;
    color: var(--vff-ui-ink-soft)!important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace!important;
    font-size: 11px!important;
    font-weight: 700!important;
}

body.wdi-vff-ui-precision .vff-muted {
    margin: 0!important;
    padding: 16px!important;
    color: var(--vff-ui-muted)!important;
    font-size: 12px!important;
}

body.wdi-vff-ui-precision .vff-fitment-accordion {
    padding: 16px!important;
}

body.wdi-vff-ui-precision .vff-fitment-summary {
    margin: 0 0 12px!important;
    color: var(--vff-ui-muted)!important;
    font-size: 11px!important;
    line-height: 1.55!important;
}

body.wdi-vff-ui-precision .vff-fitment-level {
    margin: 7px 0!important;
    overflow: hidden!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 11px!important;
    background: #fff!important;
}

body.wdi-vff-ui-precision .vff-fitment-level > summary {
    display: flex!important;
    justify-content: space-between!important;
    gap: 12px!important;
    align-items: center!important;
    min-height: 44px!important;
    padding: 10px 12px!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 11px!important;
    font-weight: 700!important;
    cursor: pointer!important;
    list-style: none!important;
}

body.wdi-vff-ui-precision .vff-fitment-level > summary::-webkit-details-marker {
    display: none!important;
}

body.wdi-vff-ui-precision .vff-fitment-level > summary::after {
    content: "+"!important;
    display: grid!important;
    place-items: center!important;
    width: 22px!important;
    height: 22px!important;
    margin-left: auto!important;
    border-radius: 7px!important;
    background: var(--vff-ui-surface-tint)!important;
    color: var(--vff-ui-primary)!important;
    font-size: 14px!important;
}

body.wdi-vff-ui-precision .vff-fitment-level[open] > summary::after {
    content: "−"!important;
}

body.wdi-vff-ui-precision .vff-fitment-level > summary em {
    order: 2!important;
    min-width: 28px!important;
    padding: 3px 7px!important;
    border-radius: 999px!important;
    background: var(--vff-ui-surface-tint)!important;
    color: var(--vff-ui-muted)!important;
    font-size: 9px!important;
    font-style: normal!important;
    text-align: center!important;
}

body.wdi-vff-ui-precision .vff-fitment-level > summary::after {
    order: 3!important;
}

body.wdi-vff-ui-precision .vff-fitment-level .vff-fitment-level,
body.wdi-vff-ui-precision .vff-fitment-engine-row {
    margin: 0 10px 9px!important;
}

body.wdi-vff-ui-precision .vff-fitment-engine-row {
    padding: 10px 12px!important;
    border-radius: 9px!important;
    background: var(--vff-ui-surface-soft)!important;
    color: var(--vff-ui-ink-soft)!important;
    font-size: 11px!important;
}

body.wdi-vff-ui-precision .vff-fitment-submodels {
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 5px!important;
    margin-top: 7px!important;
}

body.wdi-vff-ui-precision .vff-fitment-submodels span {
    display: inline-flex!important;
    padding: 4px 7px!important;
    border: 1px solid var(--vff-ui-line)!important;
    border-radius: 7px!important;
    background: #fff!important;
    color: var(--vff-ui-muted)!important;
    font-size: 9px!important;
}

/* --------------------------------------------------------------------------
   Responsive behaviour
   -------------------------------------------------------------------------- */
@media (max-width: 1040px) {
    body.wdi-vff-ui-precision .vff-alt-finder-hero {
        grid-template-columns: auto minmax(0, 1fr)!important;
    }

    body.wdi-vff-ui-precision .vff-alt-finder-assurance {
        grid-column: 1 / -1!important;
        justify-content: flex-start!important;
        max-width: none!important;
        padding-left: 86px!important;
    }

    body.wdi-vff-ui-precision .vff-reg-facts {
        grid-template-columns: repeat(3, minmax(0, 1fr))!important;
    }

    body.wdi-vff-ui-precision .vff-shop-products ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr))!important;
    }
}

@media (max-width: 820px) {
    body.wdi-vff-ui-precision .vff-alt-method-tabs,
    body.wdi-vff-ui-precision .vff-alt-method-tabs.has-2-methods {
        grid-template-columns: 1fr 1fr!important;
        gap: 5px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-method-tab {
        min-height: 58px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-method-tab small {
        white-space: normal!important;
    }

    body.wdi-vff-ui-precision .vff-filter-form-pro {
        grid-template-columns: repeat(2, minmax(0, 1fr))!important;
    }

    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(1),
    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(2),
    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(3),
    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(4),
    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(5) {
        grid-column: span 1!important;
    }

    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(5) {
        grid-column: 1 / -1!important;
    }

    body.wdi-vff-ui-precision .vff-reg-match-grid {
        grid-template-columns: 1fr!important;
    }

    body.wdi-vff-ui-precision .vff-alt-selected {
        grid-template-columns: auto minmax(0, 1fr)!important;
    }

    body.wdi-vff-ui-precision .vff-frontpage-selected-action {
        grid-column: 1 / -1!important;
        display: flex!important;
        align-items: center!important;
        gap: 10px!important;
        text-align: left!important;
    }

    body.wdi-vff-ui-precision .vff-frontpage-selected-action p {
        margin: 0!important;
    }

    body.wdi-vff-ui-precision .vff-garage-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))!important;
    }

    body.wdi-vff-ui-precision .vff-shop-products ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr))!important;
    }
}

@media (max-width: 640px) {
    body.wdi-vff-ui-precision .vff-alt-finder {
        margin: 14px auto!important;
        border-radius: 20px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-finder-hero {
        grid-template-columns: 1fr!important;
        gap: 14px!important;
        padding: 24px 18px 22px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-finder-symbol {
        width: 52px!important;
        height: 52px!important;
        border-radius: 14px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-finder-symbol svg {
        width: 28px!important;
        height: 28px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-finder-assurance {
        grid-column: auto!important;
        justify-content: flex-start!important;
        max-width: none!important;
        padding-left: 0!important;
    }

    body.wdi-vff-ui-precision .vff-alt-finder-assurance span {
        min-height: 30px!important;
        padding: 5px 8px!important;
        font-size: 10px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-finder-workspace {
        padding: 15px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-method-tabs {
        margin-bottom: 24px!important;
    }

    body.wdi-vff-ui-precision .vff-reg-form {
        grid-template-columns: 1fr!important;
    }

    body.wdi-vff-ui-precision .vff-reg-plate-field {
        height: 58px!important;
    }

    body.wdi-vff-ui-precision .vff-reg-input {
        height: 56px!important;
        padding-inline: 13px!important;
        font-size: 16px!important;
    }

    body.wdi-vff-ui-precision .vff-reg-plate-flag {
        min-width: 68px!important;
        padding-inline: 10px!important;
    }

    body.wdi-vff-ui-precision .vff-reg-actions {
        grid-row: 2!important;
        width: 100%!important;
    }

    body.wdi-vff-ui-precision .vff-reg-submit {
        width: 100%!important;
        min-height: 52px!important;
    }

    body.wdi-vff-ui-precision .vff-reg-hint {
        grid-column: 1!important;
        grid-row: 3!important;
    }

    body.wdi-vff-ui-precision .vff-filter-form-pro {
        grid-template-columns: 1fr!important;
    }

    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(1),
    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(2),
    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(3),
    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(4),
    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-field:nth-of-type(5) {
        grid-column: 1!important;
    }

    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-actions {
        display: grid!important;
        grid-template-columns: 1fr auto!important;
    }

    body.wdi-vff-ui-precision .vff-filter-form-pro .vff-submit {
        width: 100%!important;
    }

    body.wdi-vff-ui-precision .vff-reg-facts {
        grid-template-columns: repeat(2, minmax(0, 1fr))!important;
    }

    body.wdi-vff-ui-precision .vff-reg-matches-head {
        align-items: center!important;
    }

    body.wdi-vff-ui-precision .vff-reg-match {
        grid-template-columns: 1fr !important;
        min-height: 80px!important;
        padding: 10px !important;
    }

    body.wdi-vff-ui-precision .vff-reg-match-icon {
        width: 38px!important;
        height: 38px!important;
    }

    body.wdi-vff-ui-precision .vff-reg-match-action {
        grid-column: 2!important;
        justify-self: start!important;
        margin-top: -4px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-selected {
        grid-template-columns: 1fr!important;
        gap: 13px!important;
        padding: 18px!important;
        border-radius: 18px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-selected-icon {
        width: 42px!important;
        height: 42px!important;
    }

    body.wdi-vff-ui-precision .vff-frontpage-selected-action {
        grid-column: auto!important;
        display: block!important;
    }

    body.wdi-vff-ui-precision .vff-frontpage-selected-action .vff-frontpage-check-another {
        width: 100%!important;
    }

    body.wdi-vff-ui-precision .vff-frontpage-selected-action p {
        margin-top: 6px!important;
        text-align: center!important;
    }

    body.wdi-vff-ui-precision .vff-shop-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))!important;
        gap: 9px!important;
    }

    body.wdi-vff-ui-precision .vff-shop-category-card {
        grid-template-rows: 112px auto!important;
        border-radius: 13px!important;
    }

    body.wdi-vff-ui-precision .vff-shop-category-body {
        padding: 11px 12px 13px!important;
    }

    body.wdi-vff-ui-precision .vff-shop-category-title {
        font-size: 12px!important;
    }

    body.wdi-vff-ui-precision .vff-garage-header {
        display: grid!important;
        align-items: start!important;
    }

    body.wdi-vff-ui-precision .vff-garage-add-toggle {
        width: 100%!important;
    }

    body.wdi-vff-ui-precision .vff-garage-form-grid {
        grid-template-columns: 1fr!important;
    }

    body.wdi-vff-ui-precision .vff-products-pagination {
        display: grid!important;
        justify-items: stretch!important;
    }

    body.wdi-vff-ui-precision .vff-products-pagination-links {
        justify-content: flex-start!important;
    }
}

@media (max-width: 420px) {
    body.wdi-vff-ui-precision .vff-alt-finder-copy h2 {
        font-size: 26px!important;
    }

    body.wdi-vff-ui-precision .vff-alt-finder-assurance span:nth-child(3) {
        display: none!important;
    }

    body.wdi-vff-ui-precision .vff-reg-facts {
        grid-template-columns: 1fr 1fr!important;
    }

    body.wdi-vff-ui-precision .vff-shop-category-grid,
    body.wdi-vff-ui-precision .vff-shop-products ul.products {
        grid-template-columns: auto auto !important;
    }

    body.wdi-vff-ui-precision .vff-shop-category-card {
        grid-template-rows: 140px auto!important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.wdi-vff-ui-precision *,
    body.wdi-vff-ui-precision *::before,
    body.wdi-vff-ui-precision *::after {
        scroll-behavior: auto !important;
        transition-duration: .001ms !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* Precision UI isolation from legacy high-specificity frontend rules. */
body.wdi-vff-ui-precision .vff-alt-finder {
    padding: 0 !important;
}
body.wdi-vff-ui-precision .vff-alt-finder::before {
    mask-image: none !important;
    -webkit-mask-image: none !important;
    pointer-events: none !important;
}
body.wdi-vff-ui-precision .vff-reg-card {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
body.wdi-vff-ui-precision .vff-reg-input,
body.wdi-vff-ui-precision .vff-reg-plate-field .vff-reg-input {
    min-height: 0 !important;
    font-family: inherit !important;
    line-height: 1.2 !important;
    text-align: center !important;
}
body.wdi-vff-ui-precision .vff-reg-found .vff-reg-facts > span {
    display: block !important;
    margin: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}
body.wdi-vff-ui-precision .vff-alt-selected::after {
    display: none !important;
    content: none !important;
}
body.wdi-vff-ui-precision .vff-frontpage-selected-kicker {
    gap: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}
body.wdi-vff-ui-precision .vff-frontpage-selected-kicker::before {
    display: none !important;
    content: none !important;
}
body.wdi-vff-ui-precision .vff-frontpage-selected-action {
    display: block !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    backdrop-filter: none !important;
}
body.wdi-vff-ui-precision .vff-frontpage-selected-reg strong {
    min-height: 0 !important;
    margin-left: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-family: inherit !important;
    letter-spacing: normal !important;
}
body.wdi-vff-ui-precision .vff-garage-pro,
body.wdi-vff-ui-precision .vff-garage-logged-out {
    padding: clamp(20px, 3vw, 28px) !important;
    border: 1px solid var(--vff-ui-line) !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: var(--vff-ui-shadow-sm) !important;
}
body.wdi-vff-ui-precision .vff-garage-kicker {
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}
body.wdi-vff-ui-precision .vff-garage-card::before {
    display: none !important;
    content: none !important;
}
body.wdi-vff-ui-precision .vff-product-info-panel {
    padding: 0 !important;
}
body.wdi-vff-ui-precision .vff-product-info-heading {
    margin: 0 !important;
}
body.wdi-vff-ui-precision .vff-product-info-heading > span {
    flex: 0 0 auto !important;
    width: auto !important;
    box-shadow: none !important;
}