/*
 * CarVital ID — UI refinements v3
 * Scope: dynamic score gauge and bottom-tab pictograms only.
 * Page structure, content and navigation order are intentionally untouched.
 */

svg.cv-gauge-v3 {
  display: block;
  width: 100%;
  height: auto;
  margin-inline: auto;
  padding: 0 !important;
  overflow: visible;
  background: #000 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  isolation: isolate;
}

svg.cv-gauge-v3 .cv-score-arc-v3 {
  stroke-width: 13px !important;
  stroke-linecap: butt !important;
  shape-rendering: geometricPrecision;
  filter: none;
}

svg.cv-gauge-v3 line {
  shape-rendering: geometricPrecision;
}

svg.cv-gauge-v3 text {
  font-family: "SFMono-Regular", "Roboto Mono", "DejaVu Sans Mono", Consolas, monospace !important;
  font-variant-numeric: tabular-nums;
  text-rendering: geometricPrecision;
}

svg.cv-gauge-v3 text:not(#gval) {
  fill: #f4f7f4 !important;
}

svg.cv-gauge-v3 .cv-lcd-segment-v3 {
  fill: #f7faf7;
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.22));
}

svg.cv-gauge-v3 .cv-score-percent-v3 {
  fill: #f7faf7 !important;
  font-size: 22px !important;
  font-weight: 750 !important;
  letter-spacing: -0.08em;
}

svg.cv-gauge-v3 #ndl {
  fill: url("#cv-needle-gradient-v3") !important;
  filter: drop-shadow(0 0 2px rgba(168, 255, 0, 0.32));
  shape-rendering: geometricPrecision;
}

#nav .cv-tab-icon-v3 {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
  shape-rendering: geometricPrecision;
}

#nav .cv-tab-icon-v3 .cv-icon-surface {
  fill: currentColor;
  fill-opacity: 0.07;
  stroke: currentColor;
  stroke-opacity: 0.95;
}

#nav .cv-tab-icon-v3 .cv-icon-accent {
  stroke: currentColor;
  stroke-width: 2;
}

#nav .navbtn.on .cv-tab-icon-v3 {
  color: #a8ff00;
  filter: drop-shadow(0 0 3px rgba(168, 255, 0, 0.28));
}

#nav .navbtn:not(.on) .cv-tab-icon-v3 {
  color: #9aa39c;
  filter: none;
}

#nav .navbtn.nav-accident .cv-tab-icon-v3 {
  color: #ff7a66;
}

@media (prefers-reduced-motion: reduce) {
  svg.cv-gauge-v3 *,
  #nav .cv-tab-icon-v3 {
    transition: none !important;
  }
}
