/* Free vehicle tools (/tools/*). Loaded only on tool pages, after tailwind.css.
   Brand: navy #091f38, deep blue #0d2b4e, yellow #ffd600, green #00703c, link blue #2563eb. */

.vt-card { background:#fff; border:1px solid #e2e8f0; border-radius:1.25rem; box-shadow:0 1px 2px rgba(15,23,42,.05), 0 8px 24px -12px rgba(15,23,42,.12); overflow:hidden; overflow:clip; }
.vt-grid { display:grid; grid-template-columns:minmax(0,1fr); }
@media (min-width:1024px) { .vt-grid { grid-template-columns:minmax(0,7fr) minmax(0,5fr); } }
.vt-inputs { padding:1.25rem; }
@media (min-width:640px) { .vt-inputs { padding:1.75rem; } }
.vt-result { background:#091f38; color:#fff; padding:1.25rem; position:relative; }
@media (min-width:640px) { .vt-result { padding:1.75rem; } }
.vt-result-inner { position:sticky; top:6rem; }
@supports not (overflow:clip) { .vt-result-inner { position:static; } }

.vt-label { display:block; font-size:.875rem; font-weight:600; color:#0f172a; margin-bottom:.375rem; }
.vt-label small { font-weight:500; color:#64748b; }
.vt-hint { font-size:.75rem; line-height:1.4; color:#64748b; margin-top:.35rem; }
.vt-field { position:relative; }
.vt-input, .vt-select {
  width:100%; border:1px solid #cbd5e1; border-radius:.65rem; padding:.7rem .85rem; font-size:1rem; line-height:1.4;
  color:#0f172a; background:#fff; transition:border-color .15s, box-shadow .15s; min-height:2.9rem;
}
.vt-input:focus, .vt-select:focus { outline:none; border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.18); }
.vt-input[aria-invalid="true"] { border-color:#dc2626; box-shadow:0 0 0 3px rgba(220,38,38,.12); }
.vt-input.has-prefix { padding-left:1.85rem; }
.vt-input.has-suffix { padding-right:4.2rem; }
.vt-input::-webkit-outer-spin-button, .vt-input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.vt-input[type=number] { -moz-appearance:textfield; appearance:textfield; }
.vt-prefix, .vt-suffix { position:absolute; top:50%; transform:translateY(-50%); color:#64748b; pointer-events:none; }
.vt-prefix { left:.85rem; font-size:1rem; }
.vt-suffix { right:.85rem; font-size:.8rem; font-weight:600; }
.vt-select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .75rem center; padding-right:2.4rem; }

.vt-seg { display:inline-flex; flex-wrap:wrap; gap:.25rem; background:#f1f5f9; border-radius:.75rem; padding:.25rem; }
.vt-seg button { padding:.5rem .9rem; border-radius:.55rem; font-size:.875rem; font-weight:600; color:#475569; transition:background .15s, color .15s; }
.vt-seg button:hover { color:#0f172a; }
.vt-seg button[aria-pressed="true"] { background:#fff; color:#091f38; box-shadow:0 1px 2px rgba(15,23,42,.14); }
.vt-seg.vt-seg-full { display:flex; width:100%; }
.vt-seg.vt-seg-full button { flex:1 1 0; }

.vt-tabs { display:flex; gap:.25rem; border-bottom:1px solid #e2e8f0; padding:0 1.25rem; background:#f8fafc; overflow-x:auto; }
@media (min-width:640px) { .vt-tabs { padding:0 1.75rem; } }
.vt-tabs button { padding:.85rem .5rem; margin-right:1rem; font-weight:600; font-size:.9rem; color:#64748b; border-bottom:3px solid transparent; white-space:nowrap; }
.vt-tabs button[aria-selected="true"] { color:#091f38; border-color:#ffd600; }

.vt-kicker { font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.6); }
.vt-big { font-size:2.6rem; font-weight:800; color:#ffd600; line-height:1.05; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
@media (min-width:640px) { .vt-big { font-size:3rem; } }
.vt-sub { color:rgba(255,255,255,.75); font-size:.9rem; margin-top:.25rem; }
.vt-rows { margin-top:1.25rem; }
.vt-row { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding:.6rem 0; border-bottom:1px solid rgba(255,255,255,.1); font-size:.92rem; }
.vt-row:last-child { border-bottom:0; }
.vt-row dt { color:rgba(255,255,255,.72); }
.vt-row dd { font-weight:700; text-align:right; font-variant-numeric:tabular-nums; }
.vt-note { margin-top:1rem; font-size:.75rem; line-height:1.45; color:rgba(255,255,255,.6); }
.vt-pill { display:inline-flex; align-items:center; gap:.3rem; border-radius:999px; padding:.15rem .55rem; font-size:.72rem; font-weight:700; }
.vt-pill-good { background:rgba(16,185,129,.18); color:#6ee7b7; }
.vt-pill-bad { background:rgba(239,68,68,.18); color:#fca5a5; }
.vt-pill-warn { background:rgba(255,214,0,.16); color:#ffd600; }

.vt-btn { display:inline-flex; align-items:center; justify-content:center; gap:.45rem; border-radius:.65rem; padding:.65rem 1rem; font-weight:600; font-size:.9rem; transition:background .15s, color .15s, border-color .15s; }
.vt-btn-primary { background:#00703c; color:#fff; }
.vt-btn-primary:hover { background:#005a30; }
.vt-btn-ghost { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.25); }
.vt-btn-ghost:hover { background:rgba(255,255,255,.08); }
.vt-btn-light { background:#fff; color:#0f172a; border:1px solid #cbd5e1; }
.vt-btn-light:hover { border-color:#94a3b8; background:#f8fafc; }
.vt-btn:disabled { opacity:.5; cursor:not-allowed; }
.vt-link-btn { font-size:.8rem; font-weight:600; color:#2563eb; }
.vt-link-btn:hover { text-decoration:underline; }

.vt-range { width:100%; accent-color:#2563eb; height:1.75rem; }
.vt-check { width:1.1rem; height:1.1rem; accent-color:#00703c; }

.vt-table { width:100%; border-collapse:collapse; font-size:.875rem; font-variant-numeric:tabular-nums; }
.vt-table th { text-align:left; font-weight:600; color:#475569; background:#f8fafc; padding:.55rem .7rem; border-bottom:1px solid #e2e8f0; white-space:nowrap; }
.vt-table td { padding:.55rem .7rem; border-bottom:1px solid #f1f5f9; color:#0f172a; }
.vt-table .num { text-align:right; }
.vt-table tr.is-best td { background:#f0fdf4; }
.vt-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; }

.vt-bar-track { height:.5rem; border-radius:999px; background:rgba(255,255,255,.12); overflow:hidden; }
.vt-bar-fill { height:100%; border-radius:999px; background:#ffd600; transition:width .25s; }
.vt-chart { width:100%; height:auto; display:block; }
.vt-chart text { font-family:inherit; }

.vt-faq a, .vt-inline a { color:#2563eb; }
.vt-faq a:hover, .vt-inline a:hover { text-decoration:underline; }

/* Pre-MOT checklist */
.vt-cl-item { display:grid; grid-template-columns:minmax(0,1fr); gap:.6rem; padding:.9rem 0; border-bottom:1px solid #f1f5f9; }
@media (min-width:640px) { .vt-cl-item { grid-template-columns:minmax(0,1fr) auto; align-items:center; } }
.vt-cl-state { display:inline-flex; gap:.25rem; background:#f1f5f9; border-radius:.6rem; padding:.2rem; }
.vt-cl-state button { padding:.4rem .7rem; border-radius:.45rem; font-size:.8rem; font-weight:600; color:#475569; white-space:nowrap; }
.vt-cl-state button[aria-pressed="true"][data-v="ok"] { background:#00703c; color:#fff; }
.vt-cl-state button[aria-pressed="true"][data-v="fix"] { background:#dc2626; color:#fff; }
.vt-cl-state button[aria-pressed="true"][data-v="na"] { background:#64748b; color:#fff; }

/* Phone result bar (see vt-common.js) */
.vt-mbar { position:fixed; left:.75rem; right:5.25rem; bottom:.85rem; z-index:45; display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  background:#091f38; color:#fff; border:2px solid #ffd600; border-radius:.9rem; padding:.6rem .9rem; box-shadow:0 10px 30px rgba(9,31,56,.35); text-align:left; }
.vt-mbar[hidden] { display:none; }
.vt-mbar-k { font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:rgba(255,255,255,.7); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.vt-mbar-v { font-size:1.25rem; font-weight:800; color:#ffd600; white-space:nowrap; font-variant-numeric:tabular-nums; }
@media (min-width:1024px) { .vt-mbar { display:none !important; } }
@media print { .vt-mbar { display:none !important; } }

/* Toast */
.vt-toast { position:fixed; left:50%; bottom:1.5rem; transform:translateX(-50%); z-index:60; background:#0f172a; color:#fff; padding:.65rem 1rem; border-radius:.65rem; font-size:.875rem; box-shadow:0 10px 30px rgba(0,0,0,.25); }

@media (prefers-reduced-motion: reduce) { .vt-bar-fill { transition:none; } }

@media print {
  body > *:not(main), .vt-noprint, .vt-tabs, .vt-actions { display:none !important; }
  body { background:#fff !important; }
  main { min-height:0 !important; }
  .vt-card { box-shadow:none; border-color:#cbd5e1; }
  .vt-result { background:#fff !important; color:#000 !important; border-top:1px solid #cbd5e1; }
  .vt-big { color:#000 !important; }
  .vt-row dt, .vt-sub, .vt-note, .vt-kicker { color:#334155 !important; }
  .vt-cl-group { break-inside:avoid; }
  a[href^="http"]::after { content:""; }
}