/*
  Estilos PRO (solo ERP Admin)
  Se carga únicamente desde app/Views/parte1.php, para NO afectar el portal de empleados.
*/

:root{
  --erp-bg: #f6f8fb;
  --erp-surface: #ffffff;
  --erp-border: #e5e7eb;
  --erp-muted: #475569;

  --erp-blue: #0b3dab;
  --erp-blue-2: #05347f;

  --erp-shadow-soft: 0 10px 30px rgba(15, 23, 42, 0.08);
  --erp-shadow-btn: 0 6px 14px rgba(11, 61, 171, 0.18);

  --erp-radius-lg: 14px;
  --erp-radius-md: 10px;
  --erp-radius-sm: 8px;
  --erp-focus: 0 0 0 3px rgba(11, 61, 171, 0.25);
}

/* Fondo y suavizado general */
body{
  background-color: var(--erp-bg) !important;
}

/* Tipografía global */
h2{
  font-size: 18px;
}

/* Sidebar más moderna + compacta */
.sidebar{
  background: linear-gradient(180deg, #275fa8 0%, #214a85 100%) !important;
}

.sidebar .logo-details i{
  font-size: 34px !important;
}

.sidebar .logo-details .logo_name{
  font-size: 20px !important;
  font-weight: 600 !important;
}

.sidebar .nav-links li i{
  font-size: 18px !important;
}

.sidebar .nav-links li a .link_name{
  font-size: 12px !important;
  font-weight: 400 !important;
}

/* Navbar más “clean” */
.home-section nav{
  border-bottom: 1px solid rgba(15, 23, 42, 0.06) !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06) !important;
}

/* Contenedores tipo card */
.container,
.container .profile-details,
.container .profile-details-simple,
.container .profile-card{
  border-radius: var(--erp-radius-lg);
}

/* Inputs */
.container input[type="text"],
.container input[type="email"],
.container input[type="password"],
.container input[type="number"],
.container input[type="date"],
.container select,
.container textarea,
.home-section input[type="text"],
.home-section input[type="email"],
.home-section input[type="password"],
.home-section input[type="number"],
.home-section input[type="date"],
.home-section select,
.home-section textarea{
  border: 1px solid var(--erp-border) !important;
  border-radius: var(--erp-radius-md) !important;
  background: var(--erp-surface) !important;
  padding: 8px 10px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.container input[type="text"]:focus,
.container input[type="email"]:focus,
.container input[type="password"]:focus,
.container input[type="number"]:focus,
.container input[type="date"]:focus,
.container select:focus,
.container textarea:focus,
.home-section input[type="text"]:focus,
.home-section input[type="email"]:focus,
.home-section input[type="password"]:focus,
.home-section input[type="number"]:focus,
.home-section input[type="date"]:focus,
.home-section select:focus,
.home-section textarea:focus{
  border-color: #93c5fd !important;
  box-shadow: var(--erp-focus) !important;
  outline: none !important;
}

/* ===== Botones ===== */
.container button,
.container input[type="submit"],
.container input[type="button"],
.container .btn,
.container a.btn,
.home-section button,
.home-section input[type="submit"],
.home-section input[type="button"],
.home-section .btn,
.home-section a.btn{
  font-size: 0.85rem;
  font-weight: 400;
  border-radius: var(--erp-radius-sm);
  padding: 8px 12px;
  transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

/* Primarios */
.container button[type="submit"]:not(.btn-filtrar):not(.btn-cancelar):not(.btn-Limpiar):not(.btn-limpiar):not(.btn-buscar):not(.btn-search),
.container input[type="submit"],
.container .btn-primary,
.container .btn.primary,
.container button.btn-primary,
.home-section button[type="submit"]:not(.btn-filtrar):not(.btn-cancelar):not(.btn-Limpiar):not(.btn-limpiar):not(.btn-buscar):not(.btn-search),
.home-section input[type="submit"],
.home-section .btn-primary,
.home-section .btn.primary,
.home-section button.btn-primary{
  background: linear-gradient(135deg, var(--erp-blue) 0%, var(--erp-blue-2) 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(11, 61, 171, 0.6) !important;
  box-shadow: var(--erp-shadow-btn) !important;
}

.container button[type="submit"]:not(.btn-filtrar):not(.btn-cancelar):not(.btn-Limpiar):not(.btn-limpiar):not(.btn-buscar):not(.btn-search):hover,
.container input[type="submit"]:hover,
.container .btn-primary:hover,
.container .btn.primary:hover,
.container button.btn-primary:hover,
.home-section button[type="submit"]:not(.btn-filtrar):not(.btn-cancelar):not(.btn-Limpiar):not(.btn-limpiar):not(.btn-buscar):not(.btn-search):hover,
.home-section input[type="submit"]:hover,
.home-section .btn-primary:hover,
.home-section .btn.primary:hover,
.home-section button.btn-primary:hover{
  background: linear-gradient(135deg, var(--erp-blue-2) 0%, var(--erp-blue) 100%) !important;
  transform: translateY(-1px);
}

/* Outline azul (Filtrar/Cancelar/Limpiar + acciones no-icono) */
.container .btn,
.container a.btn,
.container button.btn,
.container .btn-agregar,
.container .btn-add,
.container .btn-nuevo,
.container .btn-crear,
.container .btn-conceptos,
.container .btn-buscar,
.container .btn-search,
.container .btn-filtrar,
.container .btn-filter,
.container .btn-cancelar,
.container .btn-Limpiar,
.container .btn-clear,
.container .btn-limpiar,
.container .btn-outline-blue,
.container button[type="button"]:not(.btn-accion):not(.btn-action):not(.btn-icon),
.home-section .btn,
.home-section a.btn,
.home-section button.btn,
.home-section .btn-agregar,
.home-section .btn-add,
.home-section .btn-nuevo,
.home-section .btn-crear,
.home-section .btn-conceptos,
.home-section .btn-buscar,
.home-section .btn-search,
.home-section .btn-filtrar,
.home-section .btn-filter,
.home-section .btn-cancelar,
.home-section .btn-Limpiar,
.home-section .btn-clear,
.home-section .btn-limpiar,
.home-section .btn-outline-blue,
.home-section button[type="button"]:not(.btn-accion):not(.btn-action):not(.btn-icon){
  border: 1px solid rgba(11, 61, 171, 0.55) !important;
  background: transparent !important;
  color: var(--erp-blue) !important;
  box-shadow: none !important;
}

.container .btn:hover,
.container a.btn:hover,
.container button.btn:hover,
.container .btn-agregar:hover,
.container .btn-add:hover,
.container .btn-nuevo:hover,
.container .btn-crear:hover,
.container .btn-conceptos:hover,
.container .btn-buscar:hover,
.container .btn-search:hover,
.container .btn-filtrar:hover,
.container .btn-filter:hover,
.container .btn-cancelar:hover,
.container .btn-Limpiar:hover,
.container .btn-clear:hover,
.container .btn-limpiar:hover,
.container .btn-outline-blue:hover,
.container button[type="button"]:not(.btn-accion):not(.btn-action):not(.btn-icon):hover,
.home-section .btn:hover,
.home-section a.btn:hover,
.home-section button.btn:hover,
.home-section .btn-agregar:hover,
.home-section .btn-add:hover,
.home-section .btn-nuevo:hover,
.home-section .btn-crear:hover,
.home-section .btn-conceptos:hover,
.home-section .btn-buscar:hover,
.home-section .btn-search:hover,
.home-section .btn-filtrar:hover,
.home-section .btn-filter:hover,
.home-section .btn-cancelar:hover,
.home-section .btn-Limpiar:hover,
.home-section .btn-clear:hover,
.home-section .btn-limpiar:hover,
.home-section .btn-outline-blue:hover,
.home-section button[type="button"]:not(.btn-accion):not(.btn-action):not(.btn-icon):hover{
  background: rgba(11, 61, 171, 0.08) !important;
  color: var(--erp-blue-2) !important;
  transform: translateY(-1px);
}

/* Botón de limpiar búsqueda (Aprobar solicitud) */
.container .btn-clear-search{
  padding: 8px 12px !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

/* Focus */
.container button:focus-visible,
.container input[type="submit"]:focus-visible,
.container input[type="button"]:focus-visible,
.container .btn:focus-visible,
.home-section button:focus-visible,
.home-section input[type="submit"]:focus-visible,
.home-section input[type="button"]:focus-visible,
.home-section .btn:focus-visible{
  outline: none !important;
  box-shadow: var(--erp-focus) !important;
}

/* Variantes tipo Bootstrap (muy usadas en modales) */
.container .btn-secondary,
.container a.btn-secondary,
.container button.btn-secondary,
.home-section .btn-secondary,
.home-section a.btn-secondary,
.home-section button.btn-secondary{
  border: 1px solid rgba(15, 23, 42, 0.18) !important;
  background: #ffffff !important;
  color: #334155 !important;
  box-shadow: none !important;
}

.container .btn-secondary:hover,
.container a.btn-secondary:hover,
.container button.btn-secondary:hover,
.home-section .btn-secondary:hover,
.home-section a.btn-secondary:hover,
.home-section button.btn-secondary:hover{
  background: rgba(15, 23, 42, 0.05) !important;
  transform: translateY(-1px);
}

.container .btn-danger,
.container button.btn-danger,
.container a.btn-danger,
.home-section .btn-danger,
.home-section button.btn-danger,
.home-section a.btn-danger{
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(220, 38, 38, 0.65) !important;
  box-shadow: 0 6px 14px rgba(239, 68, 68, 0.18) !important;
}

.container .btn-danger:hover,
.container button.btn-danger:hover,
.container a.btn-danger:hover,
.home-section .btn-danger:hover,
.home-section button.btn-danger:hover,
.home-section a.btn-danger:hover{
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
  transform: translateY(-1px);
}

.container .btn-success,
.container button.btn-success,
.container a.btn-success,
.home-section .btn-success,
.home-section button.btn-success,
.home-section a.btn-success{
  background: linear-gradient(135deg, #16a34a 0%, #22c55e 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(22, 163, 74, 0.65) !important;
  box-shadow: 0 6px 14px rgba(22, 163, 74, 0.18) !important;
}

.container .btn-success:hover,
.container button.btn-success:hover,
.container a.btn-success:hover,
.home-section .btn-success:hover,
.home-section button.btn-success:hover,
.home-section a.btn-success:hover{
  background: linear-gradient(135deg, #15803d 0%, #16a34a 100%) !important;
  transform: translateY(-1px);
}

.container .btn-warning,
.container button.btn-warning,
.container a.btn-warning,
.home-section .btn-warning,
.home-section button.btn-warning,
.home-section a.btn-warning{
  background: linear-gradient(135deg, #f59e0b 0%, #f97316 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(245, 158, 11, 0.65) !important;
  box-shadow: 0 6px 14px rgba(245, 158, 11, 0.18) !important;
}

.container .btn-warning:hover,
.container button.btn-warning:hover,
.container a.btn-warning:hover,
.home-section .btn-warning:hover,
.home-section button.btn-warning:hover,
.home-section a.btn-warning:hover{
  background: linear-gradient(135deg, #d97706 0%, #ea580c 100%) !important;
  transform: translateY(-1px);
}

/* Botones especiales por módulo (crear/procesar/etc.) */
.container .boton-especial,
.container button.boton-especial,
.container a.boton-especial,
.home-section .boton-especial,
.home-section button.boton-especial,
.home-section a.boton-especial{
  background: linear-gradient(135deg, #0b3dab 0%, #05347f 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(11, 61, 171, 0.6) !important;
  box-shadow: var(--erp-shadow-btn) !important;
}

.container .boton-especial:hover,
.container button.boton-especial:hover,
.container a.boton-especial:hover,
.home-section .boton-especial:hover,
.home-section button.boton-especial:hover,
.home-section a.boton-especial:hover{
  background: linear-gradient(135deg, #0b3dab 0%, #05347f 100%) !important;
  transform: translateY(-1px);
}

/* Botones tipo "Agregar" por ID (hay varios módulos con id add-*-btn sin clase) */
.container button[id^="add-"][id$="-btn"]:not(.btn-primary):not(.boton-especial):not(.btn-add),
.home-section button[id^="add-"][id$="-btn"]:not(.btn-primary):not(.boton-especial):not(.btn-add){
  background: linear-gradient(135deg, var(--erp-blue) 0%, var(--erp-blue-2) 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(11, 61, 171, 0.6) !important;
  box-shadow: var(--erp-shadow-btn) !important;
}

.container button[id^="add-"][id$="-btn"]:not(.btn-primary):not(.boton-especial):not(.btn-add):hover,
.home-section button[id^="add-"][id$="-btn"]:not(.btn-primary):not(.boton-especial):not(.btn-add):hover{
  background: linear-gradient(135deg, var(--erp-blue-2) 0%, var(--erp-blue) 100%) !important;
  transform: translateY(-1px);
}

/* Botones tipo "Crear" por ID (ej: #btnCrearUsuario, #btn-crear-cargo) */
.container #btnCrearUsuario,
.home-section #btnCrearUsuario,
.container button[id^="btnCrear"],
.home-section button[id^="btnCrear"],
.container button[id^="btn-crear-"],
.home-section button[id^="btn-crear-"],
.container button[id^="btn_crear"],
.home-section button[id^="btn_crear"]{
  background: linear-gradient(135deg, var(--erp-blue) 0%, var(--erp-blue-2) 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(11, 61, 171, 0.6) !important;
  box-shadow: var(--erp-shadow-btn) !important;
}

.container #btnCrearUsuario:hover,
.home-section #btnCrearUsuario:hover,
.container button[id^="btnCrear"]:hover,
.home-section button[id^="btnCrear"]:hover,
.container button[id^="btn-crear-"]:hover,
.home-section button[id^="btn-crear-"]:hover,
.container button[id^="btn_crear"]:hover,
.home-section button[id^="btn_crear"]:hover{
  background: linear-gradient(135deg, var(--erp-blue-2) 0%, var(--erp-blue) 100%) !important;
  transform: translateY(-1px);
}

/* Exportación (Excel/PDF/Imprimir/Reportes) */
.container .export-btn,
.container button.export-btn,
.container a.export-btn,
.home-section .export-btn,
.home-section button.export-btn,
.home-section a.export-btn{
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px;
  border-radius: 10px !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(15, 23, 42, 0.14) !important;
  background: #ffffff !important;
  color: #0f172a !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06) !important;
}

.container .export-btn:hover,
.container button.export-btn:hover,
.container a.export-btn:hover,
.home-section .export-btn:hover,
.home-section button.export-btn:hover,
.home-section a.export-btn:hover{
  transform: translateY(-1px);
}

/* Colores por tipo de export */
.container .export-btn#excel-btn,
.container .export-btn[id*="excel"],
.container .export-btn[id*="xlsx"],
.home-section .export-btn#excel-btn,
.home-section .export-btn[id*="excel"],
.home-section .export-btn[id*="xlsx"]{
  border-color: rgba(22, 163, 74, 0.35) !important;
  color: #15803d !important;
}

.container .export-btn#pdf-btn,
.container .export-btn[id*="pdf"],
.home-section .export-btn#pdf-btn,
.home-section .export-btn[id*="pdf"]{
  border-color: rgba(220, 38, 38, 0.35) !important;
  color: #dc2626 !important;
}

.container .export-btn#print-btn,
.container .export-btn[id*="print"],
.container .export-btn[id*="imprimir"],
.home-section .export-btn#print-btn,
.home-section .export-btn[id*="print"],
.home-section .export-btn[id*="imprimir"]{
  border-color: rgba(100, 116, 139, 0.35) !important;
  color: #475569 !important;
}

.container .export-btn#reportes-btn,
.container .export-btn[id*="reporte"],
.container .export-btn[id*="dashboard"],
.home-section .export-btn#reportes-btn,
.home-section .export-btn[id*="reporte"],
.home-section .export-btn[id*="dashboard"]{
  border-color: rgba(124, 58, 237, 0.35) !important;
  color: #7c3aed !important;
}

/* Paginación (varios módulos usan button > a) */
.container .pagination{
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.home-section .pagination{
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.container .pagination button,
.container .pagination .pagination-btn{
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border-radius: 10px !important;
  padding: 6px 10px !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06) !important;
}

.home-section .pagination button,
.home-section .pagination .pagination-btn{
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border-radius: 10px !important;
  padding: 6px 10px !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06) !important;
}

.container .pagination button[disabled],
.container .pagination .pagination-btn[disabled]{
  opacity: 0.55;
  cursor: not-allowed;
}

.home-section .pagination button[disabled],
.home-section .pagination .pagination-btn[disabled]{
  opacity: 0.55;
  cursor: not-allowed;
}

.container .pagination button a,
.container .pagination .pagination-btn a{
  color: inherit !important;
  text-decoration: none !important;
}

.home-section .pagination button a,
.home-section .pagination .pagination-btn a{
  color: inherit !important;
  text-decoration: none !important;
}

.container .pagination .page-number{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: #ffffff;
  color: #0f172a;
  text-decoration: none;
}

.home-section .pagination .page-number{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: #ffffff;
  color: #0f172a;
  text-decoration: none;
}

.container .pagination .page-number.active{
  background: rgba(11, 61, 171, 0.10);
  border-color: rgba(11, 61, 171, 0.30);
  color: var(--erp-blue-2);
}

.home-section .pagination .page-number.active{
  background: rgba(11, 61, 171, 0.10);
  border-color: rgba(11, 61, 171, 0.30);
  color: var(--erp-blue-2);
}

/* ===== Tablas (letra fina + sort icons blancos) ===== */
.container table,
.container .table,
.container .table-container table,
.home-section table,
.home-section .table,
.home-section .table-container table{
  font-size: 0.82rem !important;
  color: #334155 !important;
}

.container table th,
.container .table th,
.container .table-container table thead th,
.home-section table th,
.home-section .table th,
.home-section .table-container table thead th{
  font-weight: 500 !important;
  letter-spacing: 0.2px !important;
  color: #ffffff !important;
}

.container table td,
.container .table td,
.container .table-container table tbody td,
.home-section table td,
.home-section .table td,
.home-section .table-container table tbody td{
  font-weight: 400 !important;
  color: #475569 !important;
}

.container table thead th i,
.container .table thead th i,
.container .table-container table thead th i,
.container table thead th svg,
.container .table thead th svg,
.container .table-container table thead th svg,
.container table thead th .sort-icon,
.container .table thead th .sort-icon,
.container .table-container table thead th .sort-icon,
.container table thead th .sorting,
.container .table thead th .sorting,
.container .table-container table thead th .sorting,
.container table thead th .sorting_asc,
.container .table thead th .sorting_asc,
.container .table-container table thead th .sorting_asc,
.container table thead th .sorting_desc,
.container .table thead th .sorting_desc,
.container .table-container table thead th .sorting_desc{
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* ===== Action buttons: solo icono ===== */
.action-buttons .btn-icon,
.action-buttons .btn-action,
.action-buttons button.btn-accion,
.table-actions .btn-icon,
.table-actions .btn-action,
.table-actions button.btn-accion,
.acciones .btn-icon,
.acciones .btn-action,
.acciones button.btn-accion,
.btn-action,
.btn-icon,
button.btn-accion,
button.btn-action,
[class*="action-buttons"] .btn-icon,
[class*="action-buttons"] .btn-action,
[class*="action-buttons"] button.btn-accion{
  background: transparent !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  box-shadow: none !important;
  padding: 4px !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: inherit !important;
}

/* Action buttons sin wrapper (muy común en tablas): mantener icon-only sin afectar botones normales */
.container table td .btn-edit,
.container table td .btn-editar,
.container table td .btn-update,
.container table td .btn-actualizar,
.container table td .btn-delete,
.container table td .btn-activar,
.container table td .btn-inactivar,
.container table td .btn-eliminar,
.container table td .btn-borrar,
.container table td .btn-remove,
.container table td .btn-trash,
.container table td .btn-view,
.container table td .btn-ver,
.container table td .btn-show,
.container table td button.btn.btn-warning,
.container table td .btn-ver-gris,
.container table td .btn-visualizar,
.container table td .btn-copy,
.container table td .btn-duplicate,
.container table td a.btn.btn-warning,
.container table td .btn-clonar,
.container table td .btn-duplicar,
.container table td .btn-pagar,
.container table td .btn-pay,
.container table td .btn-edit_banco,
.container table td .btn-edit-pregunta,
.container table td .btn-delete-pregunta,
.container table td button.btn.btn-success,
.container table td button.btn.btn-danger,
.container table td button.btn.btn-secondary,
.container table td a.btn.btn-success,
.container table td a.btn.btn-danger,
.container table td a.btn.btn-secondary{
  background: transparent !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  box-shadow: none !important;
  padding: 4px !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.home-section table td .btn-edit,
.home-section table td .btn-editar,
.home-section table td .btn-update,
.home-section table td .btn-actualizar,
.home-section table td .btn-delete,
.home-section table td .btn-eliminar,
.home-section table td .btn-borrar,
.home-section table td .btn-remove,
.home-section table td .btn-trash,
.home-section table td .btn-view,
.home-section table td .btn-ver,
.home-section table td .btn-show,
.home-section table td .btn-ver-gris,
.home-section table td .btn-visualizar,
.home-section table td .btn-copy,
.home-section table td .btn-duplicate,
.home-section table td .btn-clonar,
.home-section table td .btn-duplicar,
.home-section table td .btn-pagar,
.home-section table td .btn-pay,
.home-section table td .btn-activar,
.home-section table td .btn-inactivar,
.home-section table td .btn-edit_banco,
.home-section table td .btn-edit-pregunta,
.home-section table td .btn-delete-pregunta,
.home-section table td button.btn.btn-success,
.home-section table td button.btn.btn-danger,
.home-section table td button.btn.btn-warning,
.home-section table td button.btn.btn-secondary,
.home-section table td a.btn.btn-success,
.home-section table td a.btn.btn-danger,
.home-section table td a.btn.btn-warning,
.home-section table td a.btn.btn-secondary{
  background: transparent !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  box-shadow: none !important;
  padding: 4px !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.container table td .btn-edit:hover,
.container table td .btn-editar:hover,
.container table td .btn-update:hover,
.container table td .btn-actualizar:hover,
.container table td .btn-delete:hover,
.container table td .btn-eliminar:hover,
.container table td .btn-borrar:hover,
.container table td .btn-remove:hover,
.container table td .btn-trash:hover,
.container table td .btn-view:hover,
.container table td .btn-ver:hover,
.container table td .btn-show:hover,
.container table td .btn-ver-gris:hover,
.container table td .btn-visualizar:hover,
.container table td .btn-copy:hover,
.container table td .btn-duplicate:hover,
.container table td .btn-clonar:hover,
.container table td .btn-duplicar:hover,
.container table td .btn-pagar:hover,
.container table td .btn-pay:hover,
.container table td .btn-edit_banco:hover,
.container table td .btn-edit-pregunta:hover,
.container table td .btn-delete-pregunta:hover,
.container table td button.btn.btn-success:hover,
.container table td button.btn.btn-danger:hover,
.container table td button.btn.btn-secondary:hover,
.container table td a.btn.btn-success:hover,
.container table td a.btn.btn-danger:hover,
.container table td a.btn.btn-secondary:hover{
  background: rgba(11, 61, 171, 0.08) !important;
  transform: translateY(-1px);
}

.home-section table td .btn-edit:hover,
.home-section table td .btn-editar:hover,
.home-section table td .btn-update:hover,
.home-section table td .btn-actualizar:hover,
.home-section table td .btn-delete:hover,
.home-section table td .btn-eliminar:hover,
.home-section table td .btn-borrar:hover,
.home-section table td .btn-remove:hover,
.home-section table td .btn-trash:hover,
.home-section table td .btn-view:hover,
.home-section table td .btn-ver:hover,
.home-section table td .btn-show:hover,
.home-section table td .btn-ver-gris:hover,
.home-section table td .btn-visualizar:hover,
.home-section table td .btn-copy:hover,
.home-section table td .btn-duplicate:hover,
.home-section table td .btn-clonar:hover,
.home-section table td .btn-duplicar:hover,
.home-section table td .btn-pagar:hover,
.home-section table td .btn-pay:hover,
.home-section table td .btn-edit_banco:hover,
.home-section table td .btn-edit-pregunta:hover,
.home-section table td .btn-delete-pregunta:hover,
.home-section table td button.btn.btn-success:hover,
.home-section table td button.btn.btn-danger:hover,
.home-section table td button.btn.btn-secondary:hover,
.home-section table td a.btn.btn-success:hover,
.home-section table td a.btn.btn-danger:hover,
.home-section table td a.btn.btn-secondary:hover{
  background: rgba(11, 61, 171, 0.08) !important;
  transform: translateY(-1px);
}

.action-buttons .btn-icon:hover,
.action-buttons .btn-action:hover,
.action-buttons button.btn-accion:hover,
.table-actions .btn-icon:hover,
.table-actions .btn-action:hover,
.table-actions button.btn-accion:hover,
.acciones .btn-icon:hover,
.acciones .btn-action:hover,
.acciones button.btn-accion:hover,
.btn-action:hover,
.btn-icon:hover,
button.btn-accion:hover,
button.btn-action:hover,
[class*="action-buttons"] .btn-icon:hover,
[class*="action-buttons"] .btn-action:hover,
[class*="action-buttons"] button.btn-accion:hover{
  background: rgba(11, 61, 171, 0.08) !important;
  transform: translateY(-1px);
}

.btn-icon i,
.btn-icon svg,
.btn-action i,
.btn-action svg,
button.btn-accion i,
button.btn-accion svg,
button.btn-action i,
button.btn-action svg,
[class*="action-buttons"] .btn-icon i,
[class*="action-buttons"] .btn-icon svg,
[class*="action-buttons"] .btn-action i,
[class*="action-buttons"] .btn-action svg{
  font-size: 14px !important;
  color: inherit !important;
  fill: currentColor !important;
}

/* Colores por acción */
.action-buttons .btn-delete,
.action-buttons .btn-eliminar,
.action-buttons .btn-borrar,
.action-buttons .btn-remove,
.action-buttons .btn-trash,
.action-buttons .btn-danger,
.action-buttons .delete,
.action-buttons .remove,
.action-buttons .trash{ color:#ef4444 !important; }

.container table td .btn-delete,
.container table td .btn-eliminar,
.container table td .btn-borrar,
.container table td .btn-remove,
.container table td .btn-trash,
.container table td .btn-danger,
.container table td .btn-delete-pregunta,
.container table td button.btn.btn-danger,
.container table td a.btn.btn-danger{ color:#ef4444 !important; }

.home-section table td .btn-delete,
.home-section table td .btn-eliminar,
.home-section table td .btn-borrar,
.home-section table td .btn-remove,
.home-section table td .btn-trash,
.home-section table td .btn-danger,
.home-section table td .btn-delete-pregunta,
.home-section table td button.btn.btn-danger,
.home-section table td a.btn.btn-danger{ color:#ef4444 !important; }

.action-buttons .btn-edit,
.action-buttons .btn-editar,
.action-buttons .btn-update,
.action-buttons .btn-actualizar,
.action-buttons .edit,
.action-buttons .update,
.action-buttons .actualizar,
.action-buttons .editar{ color:#2563eb !important; }

.container table td .btn-edit,
.container table td .btn-editar,
.container table td .btn-update,
.container table td .btn-actualizar,
.container table td .btn-edit_banco,
.container table td .btn-edit-pregunta{ color:#2563eb !important; }

.home-section table td .btn-edit,
.home-section table td .btn-editar,
.home-section table td .btn-update,
.home-section table td .btn-actualizar,
.home-section table td .btn-edit_banco,
.home-section table td .btn-edit-pregunta{ color:#2563eb !important; }

.action-buttons .btn-view,
.action-buttons .btn-ver,
.action-buttons .btn-show,
.action-buttons .btn-visualizar,
.action-buttons .view,
.action-buttons .show,
.action-buttons .ver,
.action-buttons .visualizar{ color:#6b7280 !important; }

.container table td .btn-view,
.container table td .btn-ver,
.container table td .btn-show,
.container table td .btn-visualizar,
.container table td .btn-ver-gris,
.container table td button.btn.btn-secondary,
.container table td a.btn.btn-secondary{ color:#6b7280 !important; }

.home-section table td .btn-view,
.home-section table td .btn-ver,
.home-section table td .btn-show,
.home-section table td .btn-visualizar,
.home-section table td .btn-ver-gris,
.home-section table td button.btn.btn-secondary,
.home-section table td a.btn.btn-secondary{ color:#6b7280 !important; }

.action-buttons .btn-duplicar,
.action-buttons .btn-duplicado,
.action-buttons .btn-duplicate,
.action-buttons .btn-copy,
.action-buttons .btn-clonar,
.action-buttons .duplicar,
.action-buttons .clonar,
.action-buttons .copy{ color:#7c3aed !important; }

.container table td .btn-duplicar,
.container table td .btn-duplicado,
.container table td .btn-duplicate,
.container table td .btn-copy,
.container table td .btn-clonar{ color:#7c3aed !important; }

.home-section table td .btn-duplicar,
.home-section table td .btn-duplicado,
.home-section table td .btn-duplicate,
.home-section table td .btn-copy,
.home-section table td .btn-clonar{ color:#7c3aed !important; }

.action-buttons .btn-pagar,
.action-buttons .btn-pay,
.action-buttons .btn-pago,
.action-buttons .btn-activar,
.action-buttons .activar,
.action-buttons .pagar,
.action-buttons .pago{ color:#16a34a !important; }

.container table td .btn-pagar,
.container table td .btn-pay,
.container table td .btn-pago,
.container table td .btn-activar,
.container table td button.btn.btn-success,
.container table td a.btn.btn-success{ color:#16a34a !important; }

.home-section table td .btn-pagar,
.home-section table td .btn-pay,
.home-section table td .btn-pago,
.home-section table td .btn-activar,
.home-section table td button.btn.btn-success,
.home-section table td a.btn.btn-success{ color:#16a34a !important; }

/* Inactivar / warning (ámbar) */
.action-buttons .btn-inactivar,
.action-buttons .btn-warning,
.action-buttons .inactivar{
  color:#d97706 !important;
}

.container table td .btn-inactivar,
.container table td button.btn.btn-warning,
.container table td a.btn.btn-warning{ color:#d97706 !important; }

.home-section table td .btn-inactivar,
.home-section table td button.btn.btn-warning,
.home-section table td a.btn.btn-warning{ color:#d97706 !important; }

/* SweetAlert2: mantener confirmación azul */
.swal2-styled.swal2-confirm,
.swal2-confirm.swal2-styled{
  background-color: #265da3 !important;
  border-color: #265da3 !important;
}
.swal2-styled.swal2-confirm:hover,
.swal2-confirm.swal2-styled:hover{
  background-color: #1d4a8c !important;
}
.swal2-styled.swal2-confirm:focus,
.swal2-confirm.swal2-styled:focus,
.swal2-styled.swal2-confirm:active,
.swal2-confirm.swal2-styled:active{
  box-shadow: 0 0 0 3px rgba(38, 93, 163, 0.35) !important;
}

/* ===== Perfil (sidebar bottom) + Perfil dropdown (navbar) ===== */
.sidebar .profile-details{
  box-sizing: border-box !important;
  left: 0;
  gap: 10px;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.18) 0%, rgba(15, 23, 42, 0.28) 100%) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
  padding: 10px 10px !important;
}

.sidebar .profile-details .name-job{
  min-width: 0;
  overflow: hidden;
}

.sidebar .profile-details .profile_name,
.sidebar .profile-details .job{
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidebar .profile-details img{
  height: 42px !important;
  width: 42px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

.sidebar .profile-details .profile_name{
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.2px;
}

.sidebar .profile-details .job{
  font-size: 12px !important;
  font-weight: 400 !important;
  opacity: 0.95;
}

.sidebar .profile-details #log_out{
  flex: 0 0 auto;
  margin-left: auto;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.14);
  transition: transform 0.2s ease, background 0.2s ease;
}

/* IMPORTANTE:
   En el CSS base existe `.sidebar.close .profile-details i{ display:none; }`,
   pero este override usa un selector con ID (`#log_out`) y puede ganar por especificidad.
   Por eso, forzamos explícitamente ocultar el botón cuando el sidebar está cerrado. */
.sidebar.close .profile-details #log_out{
  display: none !important;
}

.sidebar .profile-details #log_out:hover{
  background: rgba(255, 255, 255, 0.16);
  transform: translateY(-1px);
}

.home-section nav .icons i{
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(11, 61, 171, 0.25) !important;
  color: var(--erp-blue) !important;
  background: #ffffff;
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.home-section nav .icons i:hover{
  background: rgba(11, 61, 171, 0.08);
  border-color: rgba(11, 61, 171, 0.35) !important;
  transform: translateY(-1px);
}

.home-section nav .profile-details1{
  background: #ffffff !important;
  border: 1px solid var(--erp-border) !important;
  border-radius: 999px !important;
  padding: 6px 10px 6px 6px !important;
  height: 44px !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06) !important;
  color: #0f172a !important;
  font-size: 0.85rem;
  font-weight: 500;
  gap: 10px;
}

.home-section nav .profile-details1 img{
  height: 32px !important;
  width: 32px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(15, 23, 42, 0.10) !important;
}

.home-section nav .profile-details1 i{
  color: #64748b !important;
  font-size: 20px !important;
}

.profile-details1 .sub-menu{
  width: 210px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(15, 23, 42, 0.10) !important;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14) !important;
  padding: 8px !important;
  right: 14px !important;
  top: 62px !important;
}

.profile-details1 .sub-menu li a{
  border-radius: 10px !important;
  padding: 8px 10px !important;
  color: #0f172a !important;
  font-size: 0.85rem;
}

.profile-details1 .sub-menu li a:hover{
  background: rgba(11, 61, 171, 0.08) !important;
  color: var(--erp-blue-2) !important;
}

body.dark-mode .home-section nav .profile-details1{
  background: rgba(15, 23, 42, 0.6) !important;
  border-color: rgba(255, 255, 255, 0.10) !important;
  color: #e2e8f0 !important;
}

body.dark-mode .profile-details1 .sub-menu{
  background: rgba(15, 23, 42, 0.96) !important;
  border-color: rgba(255, 255, 255, 0.10) !important;
}

body.dark-mode .profile-details1 .sub-menu li a{
  color: #e2e8f0 !important;
}

body.dark-mode .profile-details1 .sub-menu li a:hover{
  background: rgba(11, 61, 171, 0.18) !important;
}

/* ===== Modo oscuro / noche (SOLO COLORES, sin layout) =====
   Activación: agrega la clase `dark-mode` al <body>
*/
body.dark-mode{
  --erp-bg: #05070d;
  --erp-surface: #0b1220;
  --erp-border: rgba(148, 163, 184, 0.20);
  --erp-muted: #94a3b8;

  --erp-blue: #60a5fa;
  --erp-blue-2: #93c5fd;

  --erp-shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.35);
  --erp-shadow-btn: 0 6px 14px rgba(96, 165, 250, 0.22);
  --erp-focus: 0 0 0 3px rgba(96, 165, 250, 0.30);

  color-scheme: dark;
}

body.dark-mode,
body.dark-mode .home-section{
  background-color: var(--erp-bg) !important;
  color: #e2e8f0 !important;
}

/* Títulos */
body.dark-mode h1,
body.dark-mode h2{
  color: var(--erp-blue-2) !important;
}

/* Sidebar + navbar */
body.dark-mode .sidebar{
  background: linear-gradient(180deg, #0b2447 0%, #081a33 100%) !important;
}

body.dark-mode .home-section nav{
  border-bottom-color: rgba(148, 163, 184, 0.18) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35) !important;
}

body.dark-mode .home-section nav .icons i{
  background: rgba(15, 23, 42, 0.65) !important;
  border-color: rgba(96, 165, 250, 0.35) !important;
  color: var(--erp-blue) !important;
}

body.dark-mode .home-section nav .icons i:hover{
  background: rgba(96, 165, 250, 0.14) !important;
  border-color: rgba(96, 165, 250, 0.45) !important;
}

/* Inputs */
body.dark-mode .container input[type="text"],
body.dark-mode .container input[type="email"],
body.dark-mode .container input[type="password"],
body.dark-mode .container input[type="number"],
body.dark-mode .container input[type="date"],
body.dark-mode .container select,
body.dark-mode .container textarea,
body.dark-mode .home-section input[type="text"],
body.dark-mode .home-section input[type="email"],
body.dark-mode .home-section input[type="password"],
body.dark-mode .home-section input[type="number"],
body.dark-mode .home-section input[type="date"],
body.dark-mode .home-section select,
body.dark-mode .home-section textarea{
  color: #e2e8f0 !important;
  border-color: var(--erp-border) !important;
}

body.dark-mode .container input::placeholder,
body.dark-mode .home-section input::placeholder,
body.dark-mode .container textarea::placeholder,
body.dark-mode .home-section textarea::placeholder{
  color: rgba(148, 163, 184, 0.85) !important;
}

/* Botones secundarios (blancos en modo día) */
body.dark-mode .container .btn-secondary,
body.dark-mode .container a.btn-secondary,
body.dark-mode .container button.btn-secondary,
body.dark-mode .home-section .btn-secondary,
body.dark-mode .home-section a.btn-secondary,
body.dark-mode .home-section button.btn-secondary{
  background: rgba(15, 23, 42, 0.65) !important;
  border-color: var(--erp-border) !important;
  color: #e2e8f0 !important;
}

/* Outline azul (filtrar/cancelar/limpiar, etc.): ajustar borde a la paleta dark */
body.dark-mode .container .btn,
body.dark-mode .container a.btn,
body.dark-mode .container button.btn,
body.dark-mode .container .btn-agregar,
body.dark-mode .container .btn-add,
body.dark-mode .container .btn-nuevo,
body.dark-mode .container .btn-crear,
body.dark-mode .container .btn-conceptos,
body.dark-mode .container .btn-buscar,
body.dark-mode .container .btn-search,
body.dark-mode .container .btn-filtrar,
body.dark-mode .container .btn-cancelar,
body.dark-mode .container .btn-Limpiar,
body.dark-mode .container .btn-outline-blue,
body.dark-mode .container button[type="button"]:not(.btn-accion):not(.btn-action):not(.btn-icon),
body.dark-mode .home-section .btn,
body.dark-mode .home-section a.btn,
body.dark-mode .home-section button.btn,
body.dark-mode .home-section .btn-agregar,
body.dark-mode .home-section .btn-add,
body.dark-mode .home-section .btn-nuevo,
body.dark-mode .home-section .btn-crear,
body.dark-mode .home-section .btn-conceptos,
body.dark-mode .home-section .btn-buscar,
body.dark-mode .home-section .btn-search,
body.dark-mode .home-section .btn-filtrar,
body.dark-mode .home-section .btn-cancelar,
body.dark-mode .home-section .btn-Limpiar,
body.dark-mode .home-section .btn-outline-blue,
body.dark-mode .home-section button[type="button"]:not(.btn-accion):not(.btn-action):not(.btn-icon){
  border-color: rgba(96, 165, 250, 0.45) !important;
  color: var(--erp-blue) !important;
}

body.dark-mode .container .btn:hover,
body.dark-mode .container a.btn:hover,
body.dark-mode .container button.btn:hover,
body.dark-mode .container .btn-agregar:hover,
body.dark-mode .container .btn-add:hover,
body.dark-mode .container .btn-nuevo:hover,
body.dark-mode .container .btn-crear:hover,
body.dark-mode .container .btn-conceptos:hover,
body.dark-mode .container .btn-buscar:hover,
body.dark-mode .container .btn-search:hover,
body.dark-mode .container .btn-filtrar:hover,
body.dark-mode .container .btn-cancelar:hover,
body.dark-mode .container .btn-Limpiar:hover,
body.dark-mode .container .btn-outline-blue:hover,
body.dark-mode .container button[type="button"]:not(.btn-accion):not(.btn-action):not(.btn-icon):hover,
body.dark-mode .home-section .btn:hover,
body.dark-mode .home-section a.btn:hover,
body.dark-mode .home-section button.btn:hover,
body.dark-mode .home-section .btn-agregar:hover,
body.dark-mode .home-section .btn-add:hover,
body.dark-mode .home-section .btn-nuevo:hover,
body.dark-mode .home-section .btn-crear:hover,
body.dark-mode .home-section .btn-conceptos:hover,
body.dark-mode .home-section .btn-buscar:hover,
body.dark-mode .home-section .btn-search:hover,
body.dark-mode .home-section .btn-filtrar:hover,
body.dark-mode .home-section .btn-cancelar:hover,
body.dark-mode .home-section .btn-Limpiar:hover,
body.dark-mode .home-section .btn-outline-blue:hover,
body.dark-mode .home-section button[type="button"]:not(.btn-accion):not(.btn-action):not(.btn-icon):hover{
  background: rgba(96, 165, 250, 0.14) !important;
  color: var(--erp-blue-2) !important;
}

/* Export + paginación */
body.dark-mode .container .export-btn,
body.dark-mode .container button.export-btn,
body.dark-mode .container a.export-btn,
body.dark-mode .home-section .export-btn,
body.dark-mode .home-section button.export-btn,
body.dark-mode .home-section a.export-btn{
  background: rgba(15, 23, 42, 0.65) !important;
  border-color: var(--erp-border) !important;
  color: #e2e8f0 !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35) !important;
}

body.dark-mode .container .pagination button,
body.dark-mode .container .pagination .pagination-btn,
body.dark-mode .home-section .pagination button,
body.dark-mode .home-section .pagination .pagination-btn,
body.dark-mode .container .pagination .page-number,
body.dark-mode .home-section .pagination .page-number{
  background: rgba(15, 23, 42, 0.65) !important;
  border-color: var(--erp-border) !important;
  color: #e2e8f0 !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35) !important;
}

/* Tablas */
body.dark-mode .container table,
body.dark-mode .container .table,
body.dark-mode .container .table-container table,
body.dark-mode .home-section table,
body.dark-mode .home-section .table,
body.dark-mode .home-section .table-container table{
  color: #e2e8f0 !important;
  background-color: #000000 !important;
}

body.dark-mode .container table thead,
body.dark-mode .container table tbody,
body.dark-mode .container .table thead,
body.dark-mode .container .table tbody,
body.dark-mode .container .table-container table thead,
body.dark-mode .container .table-container table tbody,
body.dark-mode .home-section table thead,
body.dark-mode .home-section table tbody,
body.dark-mode .home-section .table thead,
body.dark-mode .home-section .table tbody,
body.dark-mode .home-section .table-container table thead,
body.dark-mode .home-section .table-container table tbody{
  background-color: #000000 !important;
}

body.dark-mode .container table tr,
body.dark-mode .container .table tr,
body.dark-mode .container .table-container table tr,
body.dark-mode .home-section table tr,
body.dark-mode .home-section .table tr,
body.dark-mode .home-section .table-container table tr{
  background-color: #000000 !important;
}

body.dark-mode .container table th,
body.dark-mode .container .table th,
body.dark-mode .container .table-container table thead th,
body.dark-mode .home-section table th,
body.dark-mode .home-section .table th,
body.dark-mode .home-section .table-container table thead th{
  color: #ffffff !important;
}

body.dark-mode .container table thead th i,
body.dark-mode .container .table thead th i,
body.dark-mode .container .table-container table thead th i,
body.dark-mode .container table thead th svg,
body.dark-mode .container .table thead th svg,
body.dark-mode .container .table-container table thead th svg,
body.dark-mode .container table thead th .sort-icon,
body.dark-mode .container .table thead th .sort-icon,
body.dark-mode .container .table-container table thead th .sort-icon,
body.dark-mode .home-section table thead th i,
body.dark-mode .home-section .table thead th i,
body.dark-mode .home-section .table-container table thead th i,
body.dark-mode .home-section table thead th svg,
body.dark-mode .home-section .table thead th svg,
body.dark-mode .home-section .table-container table thead th svg,
body.dark-mode .home-section table thead th .sort-icon,
body.dark-mode .home-section .table thead th .sort-icon,
body.dark-mode .home-section .table-container table thead th .sort-icon{
  color: #ffffff !important;
  fill: #ffffff !important;
}

body.dark-mode .container table td,
body.dark-mode .container .table td,
body.dark-mode .container .table-container table tbody td,
body.dark-mode .home-section table td,
body.dark-mode .home-section .table td,
body.dark-mode .home-section .table-container table tbody td{
  color: #ffffff !important;
  background-color: #000000 !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
}

/* Hover/striped suave en dark (mantiene negro como base) */
body.dark-mode .container table tbody tr:hover,
body.dark-mode .container .table tbody tr:hover,
body.dark-mode .container .table-container table tbody tr:hover,
body.dark-mode .home-section table tbody tr:hover,
body.dark-mode .home-section .table tbody tr:hover,
body.dark-mode .home-section .table-container table tbody tr:hover{
  background-color: rgba(96, 165, 250, 0.10) !important;
}

/* Iconos dentro de botones: azules */
body.dark-mode .container button i,
body.dark-mode .container a.btn i,
body.dark-mode .container .btn i,
body.dark-mode .home-section button i,
body.dark-mode .home-section a.btn i,
body.dark-mode .home-section .btn i,
body.dark-mode .container button svg,
body.dark-mode .container a.btn svg,
body.dark-mode .container .btn svg,
body.dark-mode .home-section button svg,
body.dark-mode .home-section a.btn svg,
body.dark-mode .home-section .btn svg{
  color: var(--erp-blue) !important;
  fill: currentColor !important;
}

body.dark-mode .action-buttons .btn-delete,
body.dark-mode .action-buttons .btn-eliminar,
body.dark-mode .action-buttons .btn-borrar,
body.dark-mode .action-buttons .btn-remove,
body.dark-mode .action-buttons .btn-trash,
body.dark-mode .action-buttons .btn-danger,
body.dark-mode .action-buttons .delete,
body.dark-mode .action-buttons .remove,
body.dark-mode .action-buttons .trash,
body.dark-mode .action-buttons .btn-edit,
body.dark-mode .action-buttons .btn-editar,
body.dark-mode .action-buttons .btn-update,
body.dark-mode .action-buttons .btn-actualizar,
body.dark-mode .action-buttons .edit,
body.dark-mode .action-buttons .update,
body.dark-mode .action-buttons .actualizar,
body.dark-mode .action-buttons .editar,
body.dark-mode .action-buttons .btn-view,
body.dark-mode .action-buttons .btn-ver,
body.dark-mode .action-buttons .btn-show,
body.dark-mode .action-buttons .btn-visualizar,
body.dark-mode .action-buttons .view,
body.dark-mode .action-buttons .show,
body.dark-mode .action-buttons .ver,
body.dark-mode .action-buttons .visualizar,
body.dark-mode .action-buttons .btn-duplicar,
body.dark-mode .action-buttons .btn-duplicado,
body.dark-mode .action-buttons .btn-duplicate,
body.dark-mode .action-buttons .btn-copy,
body.dark-mode .action-buttons .btn-clonar,
body.dark-mode .action-buttons .duplicar,
body.dark-mode .action-buttons .clonar,
body.dark-mode .action-buttons .copy,
body.dark-mode .action-buttons .btn-pagar,
body.dark-mode .action-buttons .btn-pay,
body.dark-mode .action-buttons .btn-pago,
body.dark-mode .action-buttons .btn-activar,
body.dark-mode .action-buttons .activar,
body.dark-mode .action-buttons .pagar,
body.dark-mode .action-buttons .pago,
body.dark-mode .action-buttons .btn-inactivar,
body.dark-mode .action-buttons .btn-warning,
body.dark-mode .action-buttons .inactivar{
  color: var(--erp-blue) !important;
}

/* Action buttons (icon-only) */
body.dark-mode .action-buttons .btn-icon,
body.dark-mode .action-buttons .btn-action,
body.dark-mode .action-buttons button.btn-accion,
body.dark-mode .table-actions .btn-icon,
body.dark-mode .table-actions .btn-action,
body.dark-mode .table-actions button.btn-accion,
body.dark-mode .acciones .btn-icon,
body.dark-mode .acciones .btn-action,
body.dark-mode .acciones button.btn-accion,
body.dark-mode .btn-action,
body.dark-mode .btn-icon,
body.dark-mode button.btn-accion,
body.dark-mode button.btn-action,
body.dark-mode [class*="action-buttons"] .btn-icon,
body.dark-mode [class*="action-buttons"] .btn-action,
body.dark-mode [class*="action-buttons"] button.btn-accion,
body.dark-mode .container table td .btn-edit,
body.dark-mode .container table td .btn-editar,
body.dark-mode .container table td .btn-update,
body.dark-mode .container table td .btn-actualizar,
body.dark-mode .container table td .btn-delete,
body.dark-mode .container table td .btn-eliminar,
body.dark-mode .container table td .btn-borrar,
body.dark-mode .container table td .btn-remove,
body.dark-mode .container table td .btn-trash,
body.dark-mode .container table td .btn-view,
body.dark-mode .container table td .btn-ver,
body.dark-mode .container table td .btn-show,
body.dark-mode .container table td .btn-visualizar,
body.dark-mode .container table td button.btn.btn-warning,
body.dark-mode .container table td button.btn.btn-success,
body.dark-mode .container table td button.btn.btn-danger,
body.dark-mode .container table td button.btn.btn-secondary,
body.dark-mode .container table td a.btn.btn-warning,
body.dark-mode .container table td a.btn.btn-success,
body.dark-mode .container table td a.btn.btn-danger,
body.dark-mode .container table td a.btn.btn-secondary,
body.dark-mode .home-section table td .btn-edit,
body.dark-mode .home-section table td .btn-editar,
body.dark-mode .home-section table td .btn-update,
body.dark-mode .home-section table td .btn-actualizar,
body.dark-mode .home-section table td .btn-delete,
body.dark-mode .home-section table td .btn-eliminar,
body.dark-mode .home-section table td .btn-borrar,
body.dark-mode .home-section table td .btn-remove,
body.dark-mode .home-section table td .btn-trash,
body.dark-mode .home-section table td .btn-view,
body.dark-mode .home-section table td .btn-ver,
body.dark-mode .home-section table td .btn-show,
body.dark-mode .home-section table td .btn-visualizar,
body.dark-mode .home-section table td button.btn.btn-success,
body.dark-mode .home-section table td button.btn.btn-danger,
body.dark-mode .home-section table td button.btn.btn-warning,
body.dark-mode .home-section table td button.btn.btn-secondary,
body.dark-mode .home-section table td a.btn.btn-success,
body.dark-mode .home-section table td a.btn.btn-danger,
body.dark-mode .home-section table td a.btn.btn-warning,
body.dark-mode .home-section table td a.btn.btn-secondary{
  border-color: rgba(148, 163, 184, 0.22) !important;
}

body.dark-mode .action-buttons .btn-icon:hover,
body.dark-mode .action-buttons .btn-action:hover,
body.dark-mode .action-buttons button.btn-accion:hover,
body.dark-mode .table-actions .btn-icon:hover,
body.dark-mode .table-actions .btn-action:hover,
body.dark-mode .table-actions button.btn-accion:hover,
body.dark-mode .acciones .btn-icon:hover,
body.dark-mode .acciones .btn-action:hover,
body.dark-mode .acciones button.btn-accion:hover,
body.dark-mode .btn-action:hover,
body.dark-mode .btn-icon:hover,
body.dark-mode button.btn-accion:hover,
body.dark-mode button.btn-action:hover,
body.dark-mode [class*="action-buttons"] .btn-icon:hover,
body.dark-mode [class*="action-buttons"] .btn-action:hover,
body.dark-mode [class*="action-buttons"] button.btn-accion:hover{
  background: rgba(96, 165, 250, 0.14) !important;
}

/* ===== Novedades: botones principales (SOLO estos 3) ===== */
#add-novedades-btn,
#cargar-archivo-btn,
#agregar-turnos-btn{
  background: linear-gradient(135deg, var(--erp-blue) 0%, var(--erp-blue-2) 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(11, 61, 171, 0.60) !important;
  box-shadow: var(--erp-shadow-btn) !important;
}

#add-novedades-btn:hover,
#cargar-archivo-btn:hover,
#agregar-turnos-btn:hover{
  background: linear-gradient(135deg, var(--erp-blue-2) 0%, var(--erp-blue) 100%) !important;
}

#add-novedades-btn i,
#cargar-archivo-btn i,
#agregar-turnos-btn i,
#add-novedades-btn svg,
#cargar-archivo-btn svg,
#agregar-turnos-btn svg{
  color: #ffffff !important;
  fill: #ffffff !important;
}
