/* backgroun color acceso */
.bg-slate-950 {
  background-color: #526855 !important;
}
/* background input acceso */
.bg-slate-900 {
  background-color: rgb(242 242 242 / var(--tw-bg-opacity, 1)) !important;
}
.border-slate-800 {
  border-color: rgb(242 242 242 / var(--tw-border-opacity, 1)) !important;
}
/* por favor color acceso */
.porfavor {
  color: #e0e0e0 !important;
}
/* ajuste página de estadisticas-eu apartado datos del usuario */
.p-5 {
  margin-left: 77px !important;
  margin-right: 77px !important;
}
/* color boton ingresar */
.bg-blue-600 {
  background-color: #000 !important;
}
/* menu lateral color*/
nav {
  background-color: rgb(52 68 53 / var(--tw-bg-opacity, 1)) !important;
}
/* cabecera menu agora */
.bg-slate-950 {
  background-color: #526855;
}
/* borde menu */
.border-slate-800 {
  border-color: #344435 !important;
}
/* active menu */
.bg-brand-600 {
  background-color: rgb(202 158 82 / var(--tw-bg-opacity, 1)) !important;
}
/* bac color administrador */
.bg-slate-950\/50 {
  background-color: #e0e0e0 !important;
}
/* border color circle transparent */
.border-brand-500 {
  border-color: rgb(202 158 82 / var(--tw-border-opacity, 1)) !important;
}
/* salir hover text */
.hover\:text-red-400:hover {
  color: #fff !important;
}
/* salir icon text */
.hover\:text-red-400 {
  color: #2c5234 !important;
}
/* background inputs datatables */
.dark\:bg-gray-800 {
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1)) !important;
}
/* cabecera datatables */
thead {
  background-color: #000 !important;
  color: #fff !important;
}
/* espacio abajo boton excel */
.dt-buttons {
  padding-bottom: 5px !important;
}

/* background verde alerta notificar */
.bg-brand-500 {
  background-color: #344435 !important;
}
 /* color descripción notificación */
.text-slate-300 {
  color: #344435 !important;
}
/* titulo alerta notificación */
.font-bold {
  color: #CA9E52 !important;
}
/* second datatable */
.dark\:even\:bg-gray-900\/50:nth-child(2n) {
    background-color: transparent !important;
}
/*pie de paginación*/
.dark\:text-gray-300 {
    color: transparent !important;
}
.tiltu {
  color: #ffffff !important;
}

/* 1. BOTONES BASE (Inactivos - Páginas normales) 
   Cambiamos el fondo blanco de Tailwind por tu Gris Claro (#F2F2F2) y el texto a Verde Musgo (#526855) */
.dt-paging .relative.bg-white,
div.dt-container .dt-paging button.relative:not(.bg-gray-100) {
    background-color: #F2F2F2 !important;
    background: #F2F2F2 !important;
    color: #526855 !important;
    border-color: #E5E7EB !important;
}

/* 2. PÁGINA ACTUAL (Activa)
   Detectamos el 'bg-gray-100' que mete Tailwind y le encajamos tu Verde Musgo (#526855) con texto Gris Claro (#F2F2F2) */
.dt-paging .relative.bg-gray-100,
.dt-paging .relative.font-semibold,
div.dt-container .dt-paging button.font-semibold {
    background-color: #526855 !important;
    background: #526855 !important;
    color: #F2F2F2 !important;
    border-color: #526855 !important;
}

/* 3. EFECTO HOVER (Al pasar el mouse)
   Para cualquier botón que no sea la página activa (.bg-gray-100), le metemos el Dorado (#CA9E52) */
.dt-paging .relative:hover:not(.bg-gray-100):not(.text-gray-300),
div.dt-container .dt-paging button.relative:hover:not(.font-semibold) {
    background-color: #CA9E52 !important;
    background: #CA9E52 !important;
    color: #FFFFFF !important;
    border-color: #CA9E52 !important;
}

/* 4. BOTONES DESHABILITADOS O APAGADOS (Ej: Anterior/Siguiente si no hay más páginas)
   Detectamos el 'text-gray-300' de Tailwind para mantenerlos visualmente desactivados */
.dt-paging .relative.text-gray-300,
.dt-paging .relative.dark\:text-gray-600 {
    background-color: #F9FAFB !important;
    background: #F9FAFB !important;
    color: #9CA3AF !important;
    cursor: not-allowed !important;
    opacity: 0.6 !important;
}