/* NoGrip parts: vehicle selector and fitment UI. Uses the theme tokens from header.php with fallbacks. */
.ngp-selector {
  background: var(--ng-bg-soft, #0e1320);
  border: 1px solid var(--ng-border, #1f2635);
  border-radius: .6rem;
  padding: 1.25rem;
  margin: 0 0 1.5rem;
  color: var(--ng-fg, #f5f5f5);
}
.ngp-selector__head { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: baseline; margin-bottom: .75rem; }
.ngp-selector__title { font-size: 1.15rem; }
.ngp-selector__current { opacity: .85; }
.ngp-selector__form, .ngp-number { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: .75rem; align-items: end; }
.ngp-number { grid-template-columns: minmax(0, 1fr) auto; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--ng-border, #1f2635); }
.ngp-field { display: flex; flex-direction: column; gap: .3rem; font-size: .85rem; min-width: 0; }
.ngp-field span { opacity: .8; }
.ngp-field select, .ngp-field input {
  width: 100%;
  min-height: 44px;
  padding: .5rem .6rem;
  border-radius: .4rem;
  border: 1px solid var(--ng-border, #1f2635);
  background: #05070d;
  color: inherit;
  font-size: 1rem;
}
.ngp-field select:disabled { opacity: .5; }
.ngp-btn {
  min-height: 44px;
  padding: .5rem 1.25rem;
  border: 0;
  border-radius: .4rem;
  background: var(--ng-primary, #e6342f);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}
.ngp-btn:disabled { opacity: .45; cursor: not-allowed; }
.ngp-btn--ghost { background: transparent; border: 2px solid var(--ng-primary, #e6342f); color: inherit; }
.ngp-selector--empty p { margin: 0 0 .75rem; line-height: 1.6; }
/* Beat the theme's "body.ng-wp-page a" link colour on button-styled links. */
.ngp-selector a.ngp-btn { color: #fff; }
.ngp-selector a.ngp-btn--ghost { color: var(--ng-fg, #f5f5f5); }
.ngp-selector--empty .ngp-btn { display: inline-flex; align-items: center; text-decoration: none; margin: 0 .5rem .5rem 0; }
.ngp-selector__status { min-height: 1.2em; margin: .5rem 0 0; font-size: .85rem; opacity: .8; }
.ngp-bar { margin: 0 0 1.25rem; padding: .75rem 1rem; border: 1px solid var(--ng-border, #1f2635); border-radius: .5rem; line-height: 1.8; }
.ngp-bar .ngp-selector { margin: 0; border: 0; padding: 0; background: transparent; }
.ngp-bar__note { opacity: .75; }
.ngp-fit { padding: .6rem .8rem; border-radius: .4rem; font-weight: 600; }
.ngp-fit--yes { background: rgba(34, 197, 94, .15); color: #4ade80; }
.ngp-fit--no { background: rgba(230, 52, 47, .15); color: #f87171; }
.ngp-fit--unknown { background: rgba(255, 255, 255, .06); font-weight: 400; }
.ngp-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.ngp-table th, .ngp-table td { text-align: left; padding: .45rem .5rem; border-bottom: 1px solid var(--ng-border, #1f2635); }
@media (max-width: 720px) {
  .ngp-selector__form { grid-template-columns: 1fr; }
  .ngp-number { grid-template-columns: 1fr; }
  .ngp-table { display: block; overflow-x: auto; }
}