:root{
  --vt-primary:#2563eb;
  --vt-primary-dark:#1d4ed8;
  --vt-primary-light:#3b82f6;
  --vt-soft:#eef5ff;
  --vt-soft-2:#eff6ff;
  --vt-border:#dbeafe;
  --vt-border-strong:#bfdbfe;
  --vt-border-light:#eaf2ff;
  --vt-accent-light:#93c5fd;
  --vt-primary-rgb:37,99,235;
  --vt-primary-dark-rgb:29,78,216;
  --vt-primary-light-rgb:59,130,246;
}

/* =========================================================
   VOTACIÓN TRANSPARENTE · CAPA VISUAL SEGURA
   Esta capa se carga nuevamente al final del documento.
   SOLO cambia color. No altera tamaños, posiciones, display,
   eventos, tablas, DataTables, gráficos, AJAX ni modales.
   ========================================================= */
html body .nav-link.active,
html body .nav-link.current,
html body .nav-link[aria-current="page"],
html body .pc-link.active,
html body .pc-link.active-submenu,
html body .pc-item.active > .pc-link {
  color: var(--vt-primary-dark) !important;
  border-color: var(--vt-border-strong) !important;
  background-color: var(--vt-soft) !important;
}

html body .nav-link.active::after,
html body .pc-link.active-submenu::after {
  background-color: var(--vt-primary) !important;
}

html body .nav-link:hover,
html body .pc-link:hover {
  color: var(--vt-primary-dark) !important;
  border-color: var(--vt-border) !important;
  background-color: var(--vt-soft-2) !important;
}

/* =========================================================
   MENÚ LATERAL · ICONOS SIEMPRE SINCRONIZADOS CON EL TEMA
   - Inactivos: color del tema + fondo suave.
   - Activo: fondo sólido del tema + dibujo blanco.
   - Hover: fondo sólido del tema + dibujo blanco.
   Selectores deliberadamente específicos para ganar a los
   estilos internos de cada página, incluso con !important.
   ========================================================= */
html body aside.app-sidebar nav .nav-list .nav-link .nav-icon,
html body .pc-sidebar .pc-navbar .pc-link .pc-micon {
  color: var(--vt-primary) !important;
  -webkit-text-fill-color: var(--vt-primary) !important;
  background-color: rgba(var(--vt-primary-rgb), .08) !important;
  background-image: none !important;
  border-color: transparent !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body aside.app-sidebar nav .nav-list .nav-link .nav-icon svg,
html body aside.app-sidebar nav .nav-list .nav-link .nav-icon .app-icon,
html body .pc-sidebar .pc-navbar .pc-link .pc-micon svg,
html body .pc-sidebar .pc-navbar .pc-link .pc-micon i {
  color: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body aside.app-sidebar nav .nav-list .nav-link .nav-icon svg *,
html body .pc-sidebar .pc-navbar .pc-link .pc-micon svg * {
  stroke: currentColor !important;
}

/* Activo: nunca pintar el dibujo con el mismo color del fondo. */
html body aside.app-sidebar nav .nav-list .nav-link.active .nav-icon,
html body aside.app-sidebar nav .nav-list .nav-link.current .nav-icon,
html body aside.app-sidebar nav .nav-list .nav-link[aria-current="page"] .nav-icon,
html body .pc-sidebar .pc-navbar .pc-link.active .pc-micon,
html body .pc-sidebar .pc-navbar .pc-link.active-submenu .pc-micon,
html body .pc-sidebar .pc-navbar .pc-item.active > .pc-link .pc-micon {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background-color: var(--vt-primary) !important;
  background-image: none !important;
  border-color: var(--vt-primary) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body aside.app-sidebar nav .nav-list .nav-link.active .nav-icon svg,
html body aside.app-sidebar nav .nav-list .nav-link.current .nav-icon svg,
html body aside.app-sidebar nav .nav-list .nav-link[aria-current="page"] .nav-icon svg,
html body .pc-sidebar .pc-navbar .pc-link.active .pc-micon svg,
html body .pc-sidebar .pc-navbar .pc-link.active-submenu .pc-micon svg {
  color: #ffffff !important;
  stroke: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body aside.app-sidebar nav .nav-list .nav-link.active .nav-icon svg *,
html body aside.app-sidebar nav .nav-list .nav-link.current .nav-icon svg *,
html body aside.app-sidebar nav .nav-list .nav-link[aria-current="page"] .nav-icon svg *,
html body .pc-sidebar .pc-navbar .pc-link.active .pc-micon svg *,
html body .pc-sidebar .pc-navbar .pc-link.active-submenu .pc-micon svg * {
  stroke: #ffffff !important;
}

/* Hover igual al comportamiento de los reportes. */
html body aside.app-sidebar nav .nav-list .nav-link:hover .nav-icon,
html body aside.app-sidebar nav .nav-list .nav-link:focus-visible .nav-icon,
html body .pc-sidebar .pc-navbar .pc-link:hover .pc-micon,
html body .pc-sidebar .pc-navbar .pc-link:focus-visible .pc-micon {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background-color: var(--vt-primary) !important;
  background-image: none !important;
}

html body aside.app-sidebar nav .nav-list .nav-link:hover .nav-icon svg *,
html body aside.app-sidebar nav .nav-list .nav-link:focus-visible .nav-icon svg *,
html body .pc-sidebar .pc-navbar .pc-link:hover .pc-micon svg *,
html body .pc-sidebar .pc-navbar .pc-link:focus-visible .pc-micon svg * {
  stroke: #ffffff !important;
}

/* Otros iconos de cabecera que sí siguen el color principal. */
html body .header-date i,
html body .header-date svg,
html body .header-date .app-icon,
html body .menu-button:hover,
html body .menu-button:focus-visible {
  color: var(--vt-primary) !important;
}

html body .module-hero-icon,
html body .dashboard-hero-icon,
html body .audit-hero-icon,
html body .provincial-hero-icon,
html body .general-hero-icon,
html body .section-icon,
html body .hero-icon {
  color: var(--vt-primary) !important;
  border-color: var(--vt-border-strong) !important;
  background-color: var(--vt-soft) !important;
}

html body .btn-primary,
html body button.btn-primary,
html body a.btn-primary {
  color: #fff !important;
  border-color: var(--vt-primary) !important;
  background-color: var(--vt-primary) !important;
  background-image: none !important;
}

html body .btn-primary:hover,
html body .btn-primary:focus,
html body .btn-primary:active {
  color: #fff !important;
  border-color: var(--vt-primary-dark) !important;
  background-color: var(--vt-primary-dark) !important;
}

html body .btn-outline-primary {
  color: var(--vt-primary) !important;
  border-color: var(--vt-border-strong) !important;
  background-color: #fff !important;
}

html body .text-primary,
html body a.link-primary {
  color: var(--vt-primary) !important;
}

html body .bg-primary {
  background-color: var(--vt-primary) !important;
}

html body .border-primary {
  border-color: var(--vt-primary) !important;
}

html body .form-control:focus,
html body .form-select:focus,
html body input:focus,
html body select:focus,
html body textarea:focus {
  border-color: var(--vt-accent-light) !important;
  box-shadow: 0 0 0 3px rgba(var(--vt-primary-rgb), .08) !important;
}

/* Reportes y auditoría: únicamente identidad cromática. */
html body .audit-control-state.ok,
html body .audit-control-summary-badge.total,
html body .report-chip.primary,
html body .report-badge.primary,
html body .dashboard-badge.primary,
html body .page-chip.primary {
  color: var(--vt-primary-dark) !important;
  border-color: var(--vt-border-strong) !important;
  background-color: var(--vt-soft) !important;
}

html body table thead.table-primary,
html body .table-primary > th,
html body .table-primary > td {
  border-color: var(--vt-border-strong) !important;
  background-color: var(--vt-soft) !important;
}