:root {
  --primary: #005ab3;
  --primary-gradient: linear-gradient(135deg, #005ab3, #0073e0);
  --primary-light: #d6e3ff;
  --bg: #f7f9fb;
  --surface: #ffffff;
  --text: #191c1e;
  --text-muted: #717786;
  --text-icon: #414754;
  --border: #c0c6d6;
  --shadow: rgba(25,28,30,0.024) 0px 1px 6px;
  --radius-card: 16px;
  --radius-btn: 999px;
}
* { box-sizing: border-box; }
body {
  background: var(--bg);
  font-family: 'Inter', sans-serif;
  color: var(--text);
  margin: 0;
}
.app-navbar {
  background: var(--primary-gradient);
  position: sticky;
  top: 0;
  z-index: 50;
}
.app-navbar .nav-link {
  color: rgba(255,255,255,.85);
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 12px;
  border-radius: var(--radius-btn);
  transition: background .15s;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.app-navbar .nav-link:hover,
.app-navbar .nav-link.active {
  background: rgba(255,255,255,.12);
  color: #fff;
}
.brand-text {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 17px;
  letter-spacing: -0.3px;
  color: #fff;
  text-decoration: none;
}
.card-kpi {
  border: none;
  border-radius: var(--radius-card);
  box-shadow: var(--shadow);
  background: var(--surface);
}
.card-kpi .valor {
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--primary);
}
.card-kpi .etiqueta {
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-muted);
  font-weight: 600;
}
.btn-verde {
  background: var(--primary-gradient);
  border: none;
  border-radius: var(--radius-btn);
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 13px;
  padding: 8px 16px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: opacity .15s;
}
.btn-verde:hover { opacity: .85; color: #fff; }
.btn-azul {
  background: var(--primary-gradient);
  border: none;
  border-radius: var(--radius-btn);
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 13px;
  padding: 8px 16px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: opacity .15s;
}
.btn-azul:hover { opacity: .85; color: #fff; }
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--bg); }
.login-card { max-width: 380px; width: 100%; border-radius: var(--radius-card); box-shadow: var(--shadow); background: var(--surface); }
table.table thead { background: var(--primary-light); color: var(--primary); font-weight: 600; font-size: .85rem; }
table.table thead th { border: none; }
table.table { border-radius: 12px; overflow: hidden; }
.badge-nueva { background: #16a34a; border-radius: 999px; font-size: 11px; }
.badge-reventa { background: #f59e0b; border-radius: 999px; font-size: 11px; }
::-webkit-scrollbar { width: 6px; } ::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }