/* ============================================================
   VAQUIRUTAS · Capa de refinamiento visual v3.2
   Se carga DESPUÉS del tema base; solo pule detalles.
   No cambia la paleta ni la estructura: conserva la esencia
   verde de La Vaquita y el "Interfaz Moderna 2026" existente.
   ============================================================ */

/* ---- Logo oficial en el emblema de la barra lateral ---- */
aside .brand .em{
  background:transparent !important;
  border:none !important;
  overflow:hidden;
  box-shadow:0 0 20px rgba(128,232,75,.16), 0 6px 16px rgba(0,0,0,.35);
}
aside .brand .em img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}

/* Nitidez tipográfica general */
body{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
h1,h2,h3,.page-title h2{ text-wrap:balance; }

/* Números alineados donde importa (KPIs, tablas, montos) */
.kpi .n,.sales-kpi b,.route-mini b,.route-code,.cotiz b,
td,.count-pill,.quick-chip b{ font-variant-numeric:tabular-nums; }

/* ---- Micro-interacción elegante en tarjetas KPI ---- */
.kpi{ transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.kpi:hover{
  transform:translateY(-2px);
  border-color:rgba(128,232,75,.42);
  box-shadow:0 16px 40px rgba(0,0,0,.26), 0 0 22px rgba(128,232,75,.08);
}
.kpi:hover:after{ color:var(--verde); }

/* Panel con un realce muy sutil al pasar el cursor */
.panelbox{ transition:border-color .18s ease, box-shadow .18s ease; }
.panelbox:hover{ border-color:rgba(99,153,190,.42); }

/* ---- Foco accesible y consistente con la marca ---- */
a:focus-visible,button:focus-visible,.btn:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,
.quick-chip:focus-visible,nav a:focus-visible{
  outline:2px solid var(--verde);
  outline-offset:2px;
  border-radius:10px;
}

/* ---- Login más respirado y con sello de marca ---- */
.card-login{ padding:36px 32px; }
.card-login .emblema{
  width:96px;height:96px;
  box-shadow:0 0 30px rgba(128,232,75,.20), 0 14px 34px rgba(0,0,0,.45);
}
.card-login h1{ letter-spacing:.6px; }
.card-login .sub{ text-transform:uppercase; letter-spacing:.14em; }

/* ---- Botones: brillo suave de marca en el primario ---- */
.btn:active{ transform:translateY(0); }
.btn:focus-visible{ outline-offset:3px; }

/* ---- Barra de desplazamiento premium (oscura, acento verde) ---- */
*{ scrollbar-width:thin; scrollbar-color:#2c4760 transparent; }
*::-webkit-scrollbar{ width:11px;height:11px; }
*::-webkit-scrollbar-track{ background:transparent; }
*::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#2f4d68,#223b52);
  border:2px solid transparent; background-clip:padding-box; border-radius:999px;
}
*::-webkit-scrollbar-thumb:hover{ background:linear-gradient(180deg,#3c6286,#2b4a67); background-clip:padding-box; }

/* ---- Chips de estado: un poco más definidos ---- */
.badge{ letter-spacing:.2px; }

/* ---- Selección de texto en verde de marca ---- */
::selection{ background:rgba(128,232,75,.28); color:#fff; }

/* ---- Respeta reducción de movimiento ---- */
@media (prefers-reduced-motion:reduce){
  .kpi,.panelbox,.btn,.route-card{ transition:none !important; }
  .kpi:hover{ transform:none; }
}