/* ==========================================================================
   VUMO overrides — loaded AFTER fixbroken-os.css
   --------------------------------------------------------------------------
   VUMO is a tenant of fixbroken.ai. It inherits the full design system and
   applies minor overrides to feel slightly more approachable for the
   dealer / operator / customer audience the walkaround product serves.

   Rules enforced here:
   - Scope everything to .vumo-scope so the global system stays untouched.
   - Only override tokens + existing .fb-* components.
   - Any NEW component uses the .vumo-* prefix.
   ========================================================================== */

.vumo-scope {
  /* Softer base — still dark, but a hint warmer than fixbroken's cold black.
     Shifts the mood from "operator console" to "service bay dashboard". */
  --fb-black:   #06090f;
  --fb-ink:     #0b1018;
  --fb-panel:   #10161f;
  --fb-surface: #141c27;
  --fb-rail:    #1b2433;

  /* Primary signal stays cyan, but dimmed half a step for a less laser feel */
  --fb-signal:        #4fc3f7;
  --fb-signal-bright: #8ad8ff;
  --fb-signal-glow:   rgba(79, 195, 247, 0.32);
  --fb-signal-wash:   rgba(79, 195, 247, 0.06);

  /* VUMO's own accent — warmer green for "inspected / good condition" */
  --fb-matrix: #6be3a7;
  --fb-matrix-glow: rgba(107, 227, 167, 0.30);
}

/* Keep VUMO CTAs slightly more human — allow sentence case.
   Still short, still command-flavored, but no SHOUTING. */
.vumo-scope .fb-cta {
  text-transform: none;
  letter-spacing: var(--fb-tracking-normal);
  font-weight: 500;
}

/* Kickers stay uppercase (they're still system-level) but slightly looser */
.vumo-scope .fb-kicker {
  letter-spacing: var(--fb-tracking-wide);
}

/* ==========================================================================
   .vumo-walkaround-step — NEW project-specific component
   A numbered step block for walkaround flow explanations.
   ========================================================================== */
.vumo-walkaround-step {
  display: flex;
  gap: var(--fb-s-4);
  padding: var(--fb-s-5);
  background: var(--fb-panel);
  border: 1px solid var(--fb-hairline);
  border-radius: var(--fb-r-3);
}

.vumo-walkaround-step__num {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--fb-signal-wash);
  border: 1px solid color-mix(in srgb, var(--fb-signal) 40%, var(--fb-hairline));
  color: var(--fb-signal);
  font-family: var(--fb-font-mono);
  font-size: var(--fb-fs-14);
  font-weight: 600;
}

.vumo-walkaround-step__body { flex: 1; }
.vumo-walkaround-step__title {
  font-size: var(--fb-fs-18);
  font-weight: 600;
  color: var(--fb-text-loud);
  margin-bottom: var(--fb-s-2);
}
.vumo-walkaround-step__desc {
  color: var(--fb-text-dim);
  font-size: var(--fb-fs-14);
}