/* Estilo común de Stock de Usados. Las pantallas nuevas lo comparten; así un cambio
   de color o de letra se hace en un solo lugar. */
:root{
  --bg:#f3f4f6; --surface:#fff; --surface-2:#f8f9fb; --line:#e2e5ea; --line-2:#eef0f3;
  --ink:#141a22; --ink-2:#4d5866; --ink-3:#8993a0;
  --accent:#1f5c8b; --accent-2:#174a72; --accent-soft:#e7eff7;
  --ok:#1d7a4c; --ok-soft:#e3f3ea; --warn:#8a6200; --warn-soft:#fdf3d2;
  --bad:#c23b3b; --bad-soft:#fbe9e9;
  /* Estados: pastilla y tinte de fila */
  --e-stock-bg:#e6f3eb; --e-stock-fg:#1d6b3b; --e-stock-row:#ffffff;
  --e-ingreso-bg:#fbefc5; --e-ingreso-fg:#7a5600; --e-ingreso-row:#fdf7df;
  --e-reservado-bg:#d9e7fb; --e-reservado-fg:#1c4f93; --e-reservado-row:#edf3fd;
  --e-vendido-bg:#d7dce2; --e-vendido-fg:#333e4a; --e-vendido-row:#e9ecf0;
  --e-consigna-bg:#e9e1ff; --e-consigna-fg:#553aa0; --e-consigna-row:#f4f0ff;
  --e-entregado-bg:#dcefe4; --e-entregado-fg:#1d6b3b; --e-entregado-row:#ffffff;
  --radius:10px; --shadow:0 1px 2px rgba(16,24,40,.05);
  --font:"Manrope",system-ui,"Segoe UI",Arial,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font:14px/1.45 var(--font);-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---- Barra superior con navegación ---- */
.nav{position:sticky;top:0;z-index:40;background:#111820;color:#fff;display:flex;align-items:center;gap:6px;
     padding:0 16px;height:52px}
.nav .marca{font-weight:800;letter-spacing:.02em;margin-right:14px;white-space:nowrap}
.nav .marca span{color:#8fb4d6;font-weight:600}
.nav a.tab{color:#b9c4cf;text-decoration:none;font-weight:600;font-size:13.5px;padding:8px 11px;border-radius:7px;white-space:nowrap}
.nav a.tab:hover{background:#ffffff14;color:#fff}
.nav a.tab.on{background:#ffffff1f;color:#fff}
.nav a.tab em{font-style:normal;background:#ffffff26;border-radius:999px;padding:1px 7px;margin-left:5px;font-size:11.5px}
.nav .sp{flex:1}
.nav .quien{font-size:12.5px;color:#9fb0c0;white-space:nowrap}
.nav .salir{background:none;border:1px solid #ffffff30;color:#d7e1ea;border-radius:7px;padding:6px 10px;font-size:12.5px}
@media(max-width:760px){.nav{overflow-x:auto}.nav .quien{display:none}}

/* ---- Contenido ---- */
.page{padding:16px;max-width:1600px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}

/* ---- Pastillas de estado ---- */
.pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;letter-spacing:.02em}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8}
.pill.e-stock{background:var(--e-stock-bg);color:var(--e-stock-fg)}
.pill.e-p-ingreso{background:var(--e-ingreso-bg);color:var(--e-ingreso-fg)}
.pill.e-reservado{background:var(--e-reservado-bg);color:var(--e-reservado-fg)}
.pill.e-vendido{background:var(--e-vendido-bg);color:var(--e-vendido-fg)}
.pill.e-consigna{background:var(--e-consigna-bg);color:var(--e-consigna-fg)}
.pill.e-entregado{background:var(--e-entregado-bg);color:var(--e-entregado-fg)}

.patente{font-family:ui-monospace,"Cascadia Mono",Consolas,monospace;font-weight:700;font-size:12.5px;letter-spacing:.04em;
         background:var(--surface-2);border:1px solid var(--line);border-radius:5px;padding:1px 6px;white-space:nowrap}
.muted{color:var(--ink-3)}
.num{font-variant-numeric:tabular-nums}

/* ---- Botones ---- */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);color:var(--ink);
     border-radius:8px;padding:8px 12px;font-weight:600;font-size:13px;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:#c9d0d9;background:var(--surface-2)}
.btn.pri{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.pri:hover{background:var(--accent-2)}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn:disabled{opacity:.55;cursor:default}
.btn.chico{padding:5px 9px;font-size:12px}

/* ---- Campos ---- */
.campo{display:flex;flex-direction:column;gap:4px}
.campo label{font-size:11px;font-weight:700;color:var(--ink-2);text-transform:uppercase;letter-spacing:.05em}
.input,select.input{border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--surface);outline:none;min-width:0}
.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}

/* ---- Aviso flotante ---- */
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(20px);background:#111820;color:#fff;
       padding:10px 16px;border-radius:9px;font-size:13.5px;opacity:0;transition:.2s;z-index:90;pointer-events:none;max-width:90vw}
.toast.on{opacity:1;transform:translateX(-50%)}
.toast.error{background:var(--bad)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}