/* ══════════════════════════════════════════════════════════
   PARA USUARIOS DE FLETE
   ══════════════════════════════════════════════════════════ */
.para-usuarios { background:var(--bg); }
.usuarios-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.usuarios-features { display:flex; flex-direction:column; gap:24px; margin-top:32px; }
.uf-item { display:flex; gap:16px; align-items:flex-start; }
.uf-ico { width:48px; height:48px; border-radius:12px; background:var(--accent-light); display:flex; align-items:center; justify-content:center; font-size:22px; flex-shrink:0; }
.uf-item h4 { color:var(--navy); margin-bottom:4px; }
.uf-item p { font-size:14px; color:var(--gray); line-height:1.6; }
.usuarios-visual {
  background:var(--white); border:1px solid var(--line); border-radius:20px;
  overflow:hidden; box-shadow:0 20px 60px -20px rgba(13,43,78,0.12);
  position:relative;
}
.usuarios-visual > .tag-preview { position:absolute; top:12px; right:12px; z-index:1; }
.uv-header { background:var(--navy); padding:16px 20px; display:flex; align-items:center; justify-content:space-between; }
.uv-header .uvt { color:var(--white); font-size:13px; font-weight:700; }
.uv-status { display:flex; align-items:center; gap:6px; background:rgba(0,196,140,0.2); border:1px solid rgba(0,196,140,0.4); color:var(--accent); font-size:11px; font-weight:700; padding:4px 10px; border-radius:99px; }
.uv-ruta { padding:16px 20px; border-bottom:1px solid var(--line); }
.uv-ruta-label { font-size:11px; font-weight:700; color:var(--gray-light); text-transform:uppercase; letter-spacing:0.8px; margin-bottom:10px; }
.ruta-row { display:flex; align-items:center; gap:0; }
.rnode { display:flex; flex-direction:column; align-items:center; gap:4px; font-size:11px; font-weight:700; color:var(--navy); width:70px; text-align:center; }
.rdot { width:12px; height:12px; border-radius:50%; background:var(--accent); border:2px solid var(--white); box-shadow:0 0 0 2px var(--accent); }
.rdot-empty { width:12px; height:12px; border-radius:50%; border:2px solid var(--line); background:var(--white); }
.rbar { flex:1; height:3px; background:var(--line); border-radius:99px; position:relative; }
.rbar-fill { position:absolute; left:0; top:0; height:100%; background:var(--accent); border-radius:99px; }
.truck-icon { position:absolute; top:-9px; width:18px; height:14px; background:var(--navy); border-radius:4px; }
.truck-icon::after { content:""; position:absolute; right:-5px; top:3px; width:7px; height:8px; background:var(--accent); border-radius:0 3px 3px 0; }
.uvrow { display:flex; justify-content:space-between; align-items:center; padding:11px 20px; border-bottom:1px solid var(--line); font-size:13px; }
.uvrow:last-child { border:none; }
.uvrow .uk { color:var(--gray); font-weight:500; }
.uvrow .uv { font-weight:700; color:var(--navy); display:flex; align-items:center; gap:6px; }
.uvrow .uv-accent { color:var(--accent); font-size:16px; }

/* ─── RESPONSIVE FOR USUARIOS ──────────────────────────── */
@media (max-width:960px) {
  .usuarios-grid { grid-template-columns:1fr; }
}