/* Paleta de colores personalizados - Tonos pastel: Verdes suaves, azules claros y grises */

:root {
  --color-primary: #5A9A87;        /* Verde menta pastel más intenso */
  --color-primary-dark: #3D6B5C;   /* Verde menta oscuro intenso */
  --color-primary-light: #8FC4B5;  /* Verde menta claro intenso */
  
  --color-secondary: #6B9ABF;      /* Azul cielo pastel más intenso */
  --color-secondary-dark: #4A7296; /* Azul oscuro intenso */
  --color-secondary-light: #95B8D9; /* Azul claro intenso */
  
  --color-success: #76B590;        /* Verde salvia pastel más intenso */
  --color-info: #7AA8C9;           /* Azul lavanda pastel más intenso */
  --color-gray: #C5CCD3;           /* Gris perla suave */
  --color-gray-dark: #7B8591;      /* Gris azulado medio */
  --color-gray-darker: #4E5762;    /* Gris azulado oscuro */
  --color-bg-light: #EEF2F5;       /* Fondo blanco azulado */
  --color-bg-medium: #D8DFE5;      /* Fondo gris claro azulado */
}

/* ============================================================================
   ESTILOS ORIGINALES PARA ICONOS DE ACCIONES EN GRILLAS - NO MODIFICAR
   ============================================================================ */

/* Botones de acciones en grillas/tablas - Estilo original sin fondo */
.btn-link,
.btn-link-green,
.btn-link-danger,
td .btn-link,
td .btn-link-green,
td .btn-link-danger,
.ag-cell .btn-link,
.ag-cell .btn-link-green,
.ag-cell .btn-link-danger {
  background: transparent !important;
  border: none !important;
  padding: 4px 6px !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

.btn-link:hover,
.btn-link-green:hover,
.btn-link-danger:hover {
  background: transparent !important;
  text-decoration: none !important;
  opacity: 0.7 !important;
}

.btn-link:focus,
.btn-link:active,
.btn-link-green:focus,
.btn-link-green:active,
.btn-link-danger:focus,
.btn-link-danger:active {
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Colores originales de iconos en grillas */
.btn-link i,
.btn-link .fa,
.btn-link .fas,
.btn-link .far,
.btn-link .fab {
  color: #4a5568 !important; /* Gris oscuro para iconos generales */
}

.btn-link-green i,
.btn-link-green .fa,
.btn-link-green .fas,
.btn-link-green .far {
  color: #28a745 !important; /* Verde para iconos verdes */
}

.btn-link-danger i,
.btn-link-danger .fa,
.btn-link-danger .fas,
.btn-link-danger .far {
  color: #dc3545 !important; /* Rojo para iconos de eliminar */
}

/* Iconos específicos por clase de texto */
.text-navy,
i.text-navy,
.btn i.text-navy {
  color: #001f3f !important; /* Azul marino oscuro - enviar/avión */
}

.text-primary,
i.text-primary,
.btn i.text-primary {
  color: #007bff !important; /* Azul primario - ver */
}

.text-success,
i.text-success,
.btn i.text-success {
  color: #28a745 !important; /* Verde - éxito/check/ojo verde */
}

.text-secondary,
i.text-secondary,
.btn i.text-secondary {
  color: #6c757d !important; /* Gris - editar/correo */
}

.text-danger,
i.text-danger,
.btn i.text-danger {
  color: #dc3545 !important; /* Rojo - eliminar */
}

.text-info,
i.text-info,
.btn i.text-info {
  color: #17a2b8 !important; /* Cyan - información */
}

.text-warning,
i.text-warning,
.btn i.text-warning {
  color: #ffc107 !important; /* Amarillo - advertencia */
}

.text-purple,
i.text-purple,
.btn i.text-purple {
  color: #6f42c1 !important; /* Morado */
}

/* WhatsApp siempre verde marca */
.fa-whatsapp,
i.fa-whatsapp,
.fab.fa-whatsapp {
  color: #25D366 !important;
}

/* ============================================================================
   FIN DE ESTILOS ORIGINALES PARA ICONOS DE ACCIONES
   ============================================================================ */

/* Navbar - Colores principales */
.navbar.bg-gradient-primary,
.main-header.navbar.bg-gradient-primary {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%) !important;
  border-bottom: 1px solid var(--color-gray);
}

/* Botones en Navbar - Estilo de la imagen */
.navbar .btn,
.navbar-nav .btn,
.navbar .btn.bg-gradient-primary,
.navbar-nav .btn.bg-gradient-primary,
.navbar .btn.dropdown-toggle {
  background: rgba(255, 255, 255, 0.15) !important;
  border: 1px solid transparent !important;
  border-radius: 0.25rem !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 0.2rem 0.5rem !important;
  margin: 0 0.15rem !important;
  height: 28px !important;
  min-height: 28px !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.navbar .btn:hover,
.navbar-nav .btn:hover,
.navbar .btn.bg-gradient-primary:hover {
  background: rgba(255, 255, 255, 0.25) !important;
  border-color: rgba(255, 255, 255, 0.4) !important;
  color: #fff !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) !important;
  transform: translateY(-1px) !important;
}

.navbar .btn:active,
.navbar .btn:focus,
.navbar .btn.show,
.navbar .btn.active,
.navbar .btn.bg-gradient-primary:active,
.navbar .btn.bg-gradient-primary:focus {
  background: var(--color-primary-dark) !important;
  border-color: var(--color-primary-dark) !important;
  color: #fff !important;
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.3) !important;
}

.navbar .btn .dropdown-toggle::after {
  margin-left: 0.4rem !important;
}

/* Botones Primary */
.btn.bg-gradient-primary,
.btn-primary {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%) !important;
  border-color: var(--color-primary-dark) !important;
  color: #fff !important;
}

.btn.bg-gradient-primary:hover,
.btn-primary:hover {
  background: linear-gradient(135deg, var(--color-primary-dark) 0%, #4a5d52 100%) !important;
  border-color: #4a5d52 !important;
}

.btn.bg-gradient-primary:active,
.btn.bg-gradient-primary:focus,
.btn.bg-gradient-primary.active,
.btn-primary:active,
.btn-primary:focus,
.btn-primary.active,
.btn-primary.focus,
.show > .btn-primary.dropdown-toggle {
  background: linear-gradient(135deg, #4a5d52 0%, var(--color-primary-dark) 100%) !important;
  border-color: #4a5d52 !important;
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.5) !important;
  color: #fff !important;
}

.btn.bg-gradient-primary:not(:disabled):not(.disabled):active,
.btn.bg-gradient-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
  background: linear-gradient(135deg, #4a5d52 0%, var(--color-primary-dark) 100%) !important;
  border-color: #4a5d52 !important;
}

/* Botones Success */
.btn.bg-gradient-success,
.btn-success {
  background: linear-gradient(135deg, var(--color-success) 0%, #85a088 100%) !important;
  border-color: #85a088 !important;
  color: #fff !important;
}

.btn.bg-gradient-success:hover,
.btn-success:hover {
  background: linear-gradient(135deg, #85a088 0%, #6d8871 100%) !important;
  border-color: #6d8871 !important;
}

.btn.bg-gradient-success:active,
.btn.bg-gradient-success:focus,
.btn.bg-gradient-success.active,
.btn-success:active,
.btn-success:focus,
.btn-success.active,
.btn-success.focus,
.show > .btn-success.dropdown-toggle {
  background: linear-gradient(135deg, #6d8871 0%, #85a088 100%) !important;
  border-color: #6d8871 !important;
  box-shadow: 0 0 0 0.2rem rgba(157, 182, 160, 0.5) !important;
  color: #fff !important;
}

.btn.bg-gradient-success:not(:disabled):not(.disabled):active,
.btn.bg-gradient-success:not(:disabled):not(.disabled).active,
.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active {
  background: linear-gradient(135deg, #6d8871 0%, #85a088 100%) !important;
  border-color: #6d8871 !important;
}

/* Botones Secondary/Info */
.btn-secondary,
.btn-info {
  background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-secondary-dark) 100%) !important;
  border-color: var(--color-secondary-dark) !important;
  color: #fff !important;
}

.btn-secondary:hover,
.btn-info:hover {
  background: linear-gradient(135deg, var(--color-secondary-dark) 0%, #5a6f84 100%) !important;
  border-color: #5a6f84 !important;
}

.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary.active,
.btn-info:active,
.btn-info:focus,
.btn-info.active {
  background: linear-gradient(135deg, #5a6f84 0%, var(--color-secondary-dark) 100%) !important;
  border-color: #5a6f84 !important;
  box-shadow: 0 0 0 0.2rem rgba(143, 163, 184, 0.5) !important;
  color: #fff !important;
}

/* Botones generales - remover outline azul por defecto */
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
  outline: 0 !important;
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.5) !important;
}

/* Dropdown toggle */
.dropdown-toggle:focus,
.dropdown-toggle:active {
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.5) !important;
}

/* Botones Warning */
.btn-warning {
  background: linear-gradient(135deg, #d4a76a 0%, #b8935a 100%) !important;
  border-color: #b8935a !important;
  color: #fff !important;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
  background: linear-gradient(135deg, #b8935a 0%, #9d7d4a 100%) !important;
  border-color: #9d7d4a !important;
  color: #fff !important;
  box-shadow: 0 0 0 0.2rem rgba(212, 167, 106, 0.5) !important;
}

/* Botones Danger */
.btn-danger {
  background: linear-gradient(135deg, #c87872 0%, #b06560 100%) !important;
  border-color: #b06560 !important;
  color: #fff !important;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
  background: linear-gradient(135deg, #b06560 0%, #995550 100%) !important;
  border-color: #995550 !important;
  color: #fff !important;
  box-shadow: 0 0 0 0.2rem rgba(200, 120, 114, 0.5) !important;
}

/* Botones Light */
.btn-light {
  background: linear-gradient(135deg, var(--color-bg-light) 0%, var(--color-bg-medium) 100%) !important;
  border-color: var(--color-gray) !important;
  color: #2d3238 !important;
}

.btn-light:hover,
.btn-light:focus,
.btn-light:active {
  background: linear-gradient(135deg, var(--color-bg-medium) 0%, var(--color-gray) 100%) !important;
  border-color: var(--color-gray-dark) !important;
  color: #2d3238 !important;
}

/* Botones Dark */
.btn-dark {
  background: linear-gradient(135deg, var(--color-gray-dark) 0%, var(--color-gray-darker) 100%) !important;
  border-color: var(--color-gray-darker) !important;
  color: #fff !important;
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active {
  background: linear-gradient(135deg, var(--color-gray-darker) 0%, #4a4d53 100%) !important;
  border-color: #4a4d53 !important;
  color: #fff !important;
}

/* Sobrescribir TODOS los botones con bg-* */
.btn[class*="bg-"] {
  color: #fff !important;
}

/* ALTURA UNIVERSAL para TODOS los botones */
.btn,
.btn-primary,
.btn-secondary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger,
.btn-light,
.btn-dark,
.btn-default,
.btn[class*="bg-"],
.btn[class*="btn-"],
button.btn,
a.btn,
input[type="submit"].btn,
input[type="button"].btn {
  padding: 0.25rem 0.5rem !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  height: 38px !important;
  min-height: 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Botones outline */
.btn-outline-primary {
  color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

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

.btn-outline-success {
  color: var(--color-success) !important;
  border-color: var(--color-success) !important;
}

.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active {
  background-color: var(--color-success) !important;
  border-color: var(--color-success) !important;
  color: #fff !important;
}

.btn-outline-info {
  color: var(--color-secondary) !important;
  border-color: var(--color-secondary) !important;
}

.btn-outline-info:hover,
.btn-outline-info:focus,
.btn-outline-info:active {
  background-color: var(--color-secondary) !important;
  border-color: var(--color-secondary) !important;
  color: #fff !important;
}

/* Asegurar que ningún botón tenga el azul por defecto */
button[type="submit"],
button[type="button"],
input[type="submit"],
input[type="button"] {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%) !important;
  border-color: var(--color-primary-dark) !important;
  color: #fff !important;
}

button[type="submit"]:hover,
button[type="submit"]:focus,
button[type="submit"]:active,
button[type="button"]:hover,
button[type="button"]:focus,
button[type="button"]:active,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="submit"]:active,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="button"]:active {
  background: linear-gradient(135deg, var(--color-primary-dark) 0%, #4a5d52 100%) !important;
  border-color: #4a5d52 !important;
  color: #fff !important;
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.5) !important;
}

/* Sobrescribir TODOS los estilos btn de Bootstrap EXCEPTO botones de acciones en grillas */
.btn {
  transition: all 0.15s ease-in-out !important;
}

.btn:not(.btn-secondary):not(.btn-light):not(.btn-warning):not(.btn-danger):not(.btn-dark):not(.btn-link):not(.btn-link-green):not(.btn-link-danger) {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%) !important;
  border-color: var(--color-primary-dark) !important;
  color: #fff !important;
}

.btn:not(.btn-secondary):not(.btn-light):not(.btn-warning):not(.btn-danger):not(.btn-dark):not(.btn-link):not(.btn-link-green):not(.btn-link-danger):hover,
.btn:not(.btn-secondary):not(.btn-light):not(.btn-warning):not(.btn-danger):not(.btn-dark):not(.btn-link):not(.btn-link-green):not(.btn-link-danger):focus,
.btn:not(.btn-secondary):not(.btn-light):not(.btn-warning):not(.btn-danger):not(.btn-dark):not(.btn-link):not(.btn-link-green):not(.btn-link-danger):active {
  background: linear-gradient(135deg, var(--color-primary-dark) 0%, #4a5d52 100%) !important;
  border-color: #4a5d52 !important;
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.5) !important;
}

/* Asegurar que botones de acciones en grillas NO tengan fondo */
.btn-link,
.btn-link-green,
.btn-link-danger {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
}

.btn-link:hover,
.btn-link:focus,
.btn-link:active,
.btn-link-green:hover,
.btn-link-green:focus,
.btn-link-green:active,
.btn-link-danger:hover,
.btn-link-danger:focus,
.btn-link-danger:active {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Sobrescribir clases de color de Bootstrap que usan azul */
.bg-blue,
.btn-blue {
  background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-secondary-dark) 100%) !important;
  color: #fff !important;
  border-color: var(--color-secondary-dark) !important;
}

.bg-blue:hover,
.bg-blue:focus,
.bg-blue:active,
.btn-blue:hover,
.btn-blue:focus,
.btn-blue:active {
  background: linear-gradient(135deg, var(--color-secondary-dark) 0%, #5a6f84 100()) !important;
  border-color: #5a6f84 !important;
}

/* Botones con clase específica de AdminLTE */
.btn-app,
.btn-social,
.btn-box-tool {
  color: #fff !important;
}

.btn-app:hover,
.btn-app:focus,
.btn-app:active {
  background-color: var(--color-primary-dark) !important;
}

/* Links que parecen botones */
a.btn,
a.button {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%) !important;
  border-color: var(--color-primary-dark) !important;
  color: #fff !important;
}

a.btn:hover,
a.btn:focus,
a.btn:active,
a.button:hover,
a.button:focus,
a.button:active {
  background: linear-gradient(135deg, var(--color-primary-dark) 0%, #4a5d52 100%) !important;
  border-color: #4a5d52 !important;
  text-decoration: none !important;
}

/* Estados activos globales */
.active > .btn,
.btn.active,
.show > .btn {
  background: linear-gradient(135deg, var(--color-primary-dark) 0%, #4a5d52 100%) !important;
  border-color: #4a5d52 !important;
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.5) !important;
}

/* Remover cualquier azul residual de focus */
*:focus {
  outline-color: var(--color-primary) !important;
}

a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.25) !important;
}

/* Botones pequeños */
.btn-sm {
  font-size: 12px !important;
}

/* Botones grandes */
.btn-lg {
  font-size: 1.1rem !important;
}

/* Botones en card-header con mismo estilo que dropdown-toggle primary */
.card-header .btn,
.card-header .btn-tool {
  padding: 0.25rem 0.5rem !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  height: 38px !important;
  min-height: 38px !important;
}

.card-header .btn-primary,
.card-header .btn.bg-gradient-primary {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%) !important;
  border-color: var(--color-primary-dark) !important;
  color: #fff !important;
}

.card-header .btn-primary:hover,
.card-header .btn.bg-gradient-primary:hover {
  background: linear-gradient(135deg, var(--color-primary-dark) 0%, #4a5d52 100%) !important;
  border-color: #4a5d52 !important;
}

.card-header .btn-success,
.card-header .btn.bg-gradient-success {
  background: linear-gradient(135deg, var(--color-success) 0%, #85a088 100%) !important;
  border-color: #85a088 !important;
  color: #fff !important;
}

.card-header .btn-success:hover,
.card-header .btn.bg-gradient-success:hover {
  background: linear-gradient(135deg, #85a088 0%, #6d8871 100%) !important;
  border-color: #6d8871 !important;
}

/* Small Box con gradientes - Fondo oscuro para contraste */
.small-box.bg-gradient-success {
  background: linear-gradient(135deg, var(--color-success) 0%, var(--color-primary) 100%) !important;
  color: #fff !important;
}

.small-box.bg-gradient-success .inner {
  background-color: transparent !important;
}

.small-box.bg-gradient-success a {
  color: #fff !important;
}

.small-box.bg-gradient-primary {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%) !important;
  color: #fff !important;
}

/* Small-box con gradiente info - Cambiar de morado a azul pastel */
.small-box.bg-gradient-info,
.bg-gradient-info {
  background: linear-gradient(135deg, var(--color-info) 0%, var(--color-secondary) 100%) !important;
  color: #fff !important;
}

.small-box.bg-gradient-info .inner {
  background-color: transparent !important;
}

.small-box.bg-gradient-info a {
  color: #fff !important;
}

.small-box.bg-gradient-info .small-box-footer {
  background-color: rgba(0, 0, 0, 0.15) !important;
  color: #fff !important;
}

/* Sobrescribir bg-purple y bg-gradient-purple con paleta azul pastel */
.bg-purple,
.bg-gradient-purple,
.small-box.bg-purple,
.small-box.bg-gradient-purple {
  background: linear-gradient(135deg, var(--color-info) 0%, var(--color-secondary) 100%) !important;
  color: #fff !important;
}

/* Small-box footer con fondo más oscuro */
.small-box .small-box-footer {
  background-color: rgba(0, 0, 0, 0.15) !important;
  color: #fff !important;
}

/* Card headers con fondo oscuro para texto blanco */
.card-header.bg-gradient-primary {
  background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-primary) 100%) !important;
  color: #fff !important;
  border-bottom: 1px solid var(--color-gray);
}

.card-header.bg-gradient-success {
  background: linear-gradient(135deg, var(--color-success) 0%, var(--color-primary) 100()) !important;
  color: #fff !important;
  border-bottom: 1px solid var(--color-gray);
}

/* Cards con fondos suaves */
.card {
  background-color: #f8f9fa !important;
  border: 1px solid var(--color-gray) !important;
}

.card-success {
  border-top: 3px solid var(--color-success) !important;
}

.card-primary {
  border-top: 3px solid var(--color-primary) !important;
}

/* Card body con fondo claro para mejor contraste */
.card-body {
  background-color: #fff !important;
}

/* Enlaces y texto */
a {
  color: var(--color-primary-dark) !important;
}

a:hover {
  color: var(--color-secondary-dark) !important;
}

/* Badges */
.badge-primary {
  background-color: var(--color-primary) !important;
  color: #fff !important;
}

.badge-success {
  background-color: var(--color-success) !important;
  color: #fff !important;
}

/* Dropdown menus con fondo gris claro */
.dropdown-menu {
  border: 1px solid var(--color-gray) !important;
  background-color: #fff !important;
}

.dropdown-item {
  color: #333 !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: var(--color-primary-light) !important;
  color: #fff !important;
}

/* Tables */
.table-primary,
.table-primary > th,
.table-primary > td {
  background-color: var(--color-primary-light) !important;
  color: #333 !important;
}

/* Sidebar (si existe) */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active {
  background-color: var(--color-primary) !important;
  color: #fff !important;
}

/* Preloader con fondo blanco */
.preloader {
  background-color: #ffffff !important;
}

/* Content wrapper background suave */
.content-wrapper {
  background-color: var(--color-bg-light) !important;
  color: #2d3238 !important;
}

/* Todo el contenido con texto oscuro para contraste */
.content-wrapper h1,
.content-wrapper h2,
.content-wrapper h3,
.content-wrapper h4,
.content-wrapper h5,
.content-wrapper h6,
.content-wrapper p,
.content-wrapper span,
.content-wrapper label,
.content-wrapper td,
.content-wrapper th,
.content-wrapper li,
.content-wrapper .text-muted {
  color: #2d3238 !important;
}

/* Content header con texto oscuro para contraste */
.content-header {
  background-color: transparent !important;
  color: #2d3238 !important;
}

.content-header h1,
.content-header h2,
.content-header h3,
.content-header h4,
.content-header h5,
.content-header h6,
.content-header p,
.content-header .breadcrumb {
  color: #2d3238 !important;
}

.content-header a {
  color: var(--color-primary-dark) !important;
}

.content-header i {
  color: var(--color-primary) !important;
}

/* Sección content con texto oscuro */
.content {
  color: #2d3238 !important;
}

.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6,
.content p,
.content span:not(.badge),
.content label {
  color: #2d3238 !important;
}

/* Formularios y inputs con texto oscuro */
.form-control,
.form-control::placeholder,
input,
textarea,
select {
  color: #2d3238 !important;
}

/* Tablas con texto oscuro */
table,
.table,
.dataTables_wrapper {
  color: #2d3238 !important;
}

table td,
table th,
.table td,
.table th {
  color: #2d3238 !important;
}

/* Modales con texto oscuro */
.modal-content {
  background-color: #e8ebee !important;
  border: 1px solid var(--color-gray) !important;
}

.modal-body {
  background-color: #e8ebee !important;
  color: #2d3238 !important;
}

.modal-body h1,
.modal-body h2,
.modal-body h3,
.modal-body h4,
.modal-body h5,
.modal-body h6,
.modal-body p,
.modal-body label {
  color: #2d3238 !important;
}

/* Inputs y selects dentro de modales con fondo blanco para contraste */
.modal-body .form-control,
.modal-body input,
.modal-body textarea,
.modal-body select,
.modal-body .input-group-text {
  background-color: #fff !important;
  border-color: var(--color-gray) !important;
  color: #2d3238 !important;
}

.modal-body .form-control:focus,
.modal-body input:focus,
.modal-body textarea:focus,
.modal-body select:focus {
  background-color: #fff !important;
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.25) !important;
}

/* Labels con mejor contraste */
.modal-body .input-group-text {
  background-color: #d4d8db !important;
  color: #2d3238 !important;
  border-color: var(--color-gray) !important;
  font-weight: 500 !important;
}

/* Modal header con paleta personalizada y altura reducida */
.modal-header {
  background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-primary) 100%) !important;
  color: #fff !important;
  border-bottom: 1px solid var(--color-gray) !important;
  padding: 0.4rem 0.75rem !important;
  min-height: 45px !important;
  height: 45px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.modal-header .modal-title,
.modal-header h1,
.modal-header h2,
.modal-header h3,
.modal-header h4,
.modal-header h5 {
  color: #fff !important;
  font-size: 1.1rem !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.modal-header .close,
.modal-header .btn-close {
  color: #fff !important;
  opacity: 0.8 !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 1.5rem !important;
  line-height: 1 !important;
  width: 30px !important;
  height: 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0.25rem !important;
}

.modal-header .close:hover,
.modal-header .btn-close:hover {
  opacity: 1 !important;
  background-color: rgba(255, 255, 255, 0.1) !important;
}

/* Modal footer */
.modal-footer {
  background-color: #d4d8db !important;
  border-top: 1px solid var(--color-gray) !important;
  color: #2d3238 !important;
}

/* Todos los elementos de formulario dentro de modales */
.modal .form-group label,
.modal .col-form-label,
.modal .form-label {
  color: #2d3238 !important;
  font-weight: 500 !important;
}

/* Select2 dentro de modales */
.modal .select2-container--default .select2-selection--single,
.modal .select2-container--default .select2-selection--multiple {
  background-color: #fff !important;
  border-color: var(--color-gray) !important;
}

/* Campos de fecha/hora dentro de modales */
.modal input[type="date"],
.modal input[type="time"],
.modal input[type="datetime-local"] {
  background-color: #fff !important;
  border-color: var(--color-gray) !important;
  color: #2d3238 !important;
}

/* Checkboxes y radios dentro de modales */
.modal .custom-control-label,
.modal .form-check-label {
  color: #2d3238 !important;
}

/* Tablas dentro de modales */
.modal table,
.modal .table {
  background-color: #fff !important;
}

.modal table thead,
.modal .table thead {
  background-color: #d4d8db !important;
}

/* Cards dentro de modales */
.modal .card {
  background-color: #fff !important;
  border-color: var(--color-gray) !important;
}

.modal .card-header {
  background-color: #d4d8db !important;
  color: #2d3238 !important;
}

.modal .card-body {
  background-color: #fff !important;
}

/* Badges dentro de modales */
.modal .badge {
  color: #fff !important;
}

/* Alertas dentro de modales */
.modal .alert {
  background-color: #fff !important;
  border-color: var(--color-gray) !important;
}

/* Botones de archivo dentro de modales */
.modal .custom-file-label {
  background-color: #fff !important;
  border-color: var(--color-gray) !important;
  color: #2d3238 !important;
}

/* Textarea con mejor contraste */
.modal textarea.form-control {
  background-color: #fff !important;
  min-height: 80px !important;
}

/* Placeholder en modales */
.modal input::placeholder,
.modal textarea::placeholder,
.modal select::placeholder {
  color: #6c757d !important;
  opacity: 0.7 !important;
}

/* Disabled inputs en modales */
.modal input:disabled,
.modal textarea:disabled,
.modal select:disabled {
  background-color: #e8ebee !important;
  color: #6c757d !important;
}

/* Links dentro de modales */
.modal a:not(.btn) {
  color: var(--color-primary-dark) !important;
}

.modal a:not(.btn):hover {
  color: var(--color-secondary-dark) !important;
}

/* Hr dentro de modales */
.modal hr {
  border-top-color: var(--color-gray) !important;
}

/* Botones en modales */
.modal-footer .btn-primary,
.modal .btn-primary {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%) !important;
  border-color: var(--color-primary-dark) !important;
  color: #fff !important;
}

.modal-footer .btn-secondary,
.modal .btn-secondary {
  background: linear-gradient(135deg, var(--color-gray) 0%, var(--color-gray-dark) 100%) !important;
  border-color: var(--color-gray-dark) !important;
  color: #fff !important;
}

/* Sobrescribir todos los bg-primary del sistema */
.bg-primary,
.badge-primary,
.alert-primary,
.list-group-item-primary {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%) !important;
  color: #fff !important;
  border-color: var(--color-primary-dark) !important;
}

/* Sobrescribir todos los bg-info del sistema */
.bg-info,
.badge-info,
.alert-info,
.list-group-item-info {
  background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-secondary-dark) 100%) !important;
  color: #fff !important;
  border-color: var(--color-secondary-dark) !important;
}

/* Sobrescribir bg-success */
.bg-success,
.badge-success,
.alert-success,
.list-group-item-success {
  background: linear-gradient(135deg, var(--color-success) 0%, #85a088 100%) !important;
  color: #fff !important;
  border-color: #85a088 !important;
}

/* Clases de Bootstrap que usan azul por defecto */
.text-primary {
  color: var(--color-primary-dark) !important;
}

.text-info {
  color: var(--color-secondary-dark) !important;
}

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

.border-info {
  border-color: var(--color-secondary) !important;
}

/* Alertas */
.alert-primary {
  background-color: var(--color-primary-light) !important;
  border-color: var(--color-primary) !important;
  color: #2d3238 !important;
}

.alert-info {
  background-color: var(--color-secondary-light) !important;
  border-color: var(--color-secondary) !important;
  color: #2d3238 !important;
}

/* Ajuste para dark mode - Fondos más oscuros */
.dark-mode .content-wrapper {
  background-color: #343a40 !important;
}

.dark-mode .card {
  background-color: #3a3f44 !important;
  border-color: var(--color-gray-dark) !important;
}

.dark-mode .card-body {
  background-color: #2d3238 !important;
}

.dark-mode .navbar.bg-gradient-primary,
.dark-mode .main-header.navbar.bg-gradient-primary {
  background: linear-gradient(135deg, #5f7866 0%, #6d8499 100%) !important;
}

.dark-mode .card-header.bg-gradient-primary {
  background: linear-gradient(135deg, #6d8499 0%, #5f7866 100%) !important;
}

.dark-mode .small-box.bg-gradient-success {
  background: linear-gradient(135deg, #85a088 0%, #7C9885 100%) !important;
}

.dark-mode .dropdown-menu {
  background-color: #3a3f44 !important;
  border-color: var(--color-gray-dark) !important;
}

.dark-mode .dropdown-item {
  color: #c2c7d0 !important;
}

/* Botones de herramientas */
.btn-tool {
  color: rgba(255, 255, 255, 0.8) !important;
}

.btn-tool:hover {
  color: #fff !important;
}

/* Forms inputs focus */
.form-control:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 0.2rem rgba(124, 152, 133, 0.25) !important;
}

/* Reducir altura de todos los inputs y campos de texto */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
select.form-control,
select {
  padding: 0.3rem 0.6rem !important;
  height: 34px !important;
  min-height: 34px !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* Textareas con altura reducida */
textarea.form-control,
textarea {
  padding: 0.3rem 0.6rem !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  min-height: 65px !important;
  height: auto !important;
}

/* Input groups con altura reducida */
.input-group-text {
  padding: 0.3rem 0.6rem !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  height: 34px !important;
  min-height: 34px !important;
}

.input-group > .form-control,
.input-group > .custom-select {
  height: 34px !important;
  min-height: 34px !important;
}

/* Select2 con altura reducida */
.select2-container--default .select2-selection--single {
  height: 34px !important;
  min-height: 34px !important;
  padding: 0.3rem 0.6rem !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 28px !important;
  padding-left: 0.6rem !important;
  font-size: 13px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 34px !important;
}

.select2-container--default .select2-selection--multiple {
  min-height: 34px !important;
  padding: 0.2rem 0.6rem !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  padding: 0.1rem 0.4rem !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
}

/* Custom file input reducido */
.custom-file-input,
.custom-file-label {
  height: 34px !important;
  padding: 0.3rem 0.6rem !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* Input group prepend/append */
.input-group-prepend,
.input-group-append {
  font-size: 13px !important;
}

.input-group-prepend .btn,
.input-group-append .btn {
  padding: 0.3rem 0.6rem !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  height: 34px !important;
}

/* Labels con MISMA altura que inputs (34px) */
label,
.form-label,
.col-form-label,
.form-group label,
.form-group > label,
label.col-form-label,
.control-label,
.col-sm-2 label,
.col-sm-3 label,
.col-sm-4 label,
.modal-body label,
.card-body label,
form label {
  font-size: 13px !important;
  margin-bottom: 0 !important;
  line-height: 34px !important;
  padding: 0 0.5rem !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  font-weight: 400 !important;
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
}

/* Input group text (labels de entrada) MÁS compactos */
.input-group-text {
  padding: 0.2rem 0.5rem !important;
  font-size: 13px !important;
  line-height: 1.1 !important;
  min-width: auto !important;
  height: 22px !important;
  min-height: 22px !important;
  display: flex !important;
  align-items: center !important;
}

/* Iconos dentro de labels - Mayor separación */
label i,
label .fa,
label .fas,
label .far,
label .fab,
label .glyphicon,
.form-label i,
.form-label .fa,
.form-label .fas,
.form-label .far,
.form-label .fab,
.col-form-label i,
.col-form-label .fa,
.col-form-label .fas,
.col-form-label .far,
.col-form-label .fab {
  font-size: 13px !important;
  margin-right: 0.5rem !important;
}

/* Iconos dentro de input-group-text - Mayor separación */
.input-group-text i,
.input-group-text .fa,
.input-group-text .fas,
.input-group-text .far,
.input-group-text .fab {
  font-size: 13px !important;
  line-height: 1 !important;
  margin-right: 0.4rem !important;
}

.input-group-text i:last-child,
.input-group-text .fa:last-child,
.input-group-text .fas:last-child,
.input-group-text .far:last-child,
.input-group-text .fab:last-child {
  margin-right: 0 !important;
}

/* Iconos dentro de botones - Separación del texto */
.btn i,
.btn .fa,
.btn .fas,
.btn .far,
.btn .fab,
.btn .glyphicon {
  margin-right: 0.4rem !important;
}

.btn i:last-child,
.btn .fa:last-child,
.btn .fas:last-child,
.btn .far:last-child,
.btn .fab:last-child,
.btn .glyphicon:last-child {
  margin-right: 0 !important;
  margin-left: 0.4rem !important;
}

.btn i:only-child,
.btn .fa:only-child,
.btn .fas:only-child,
.btn .far:only-child,
.btn .fab:only-child,
.btn .glyphicon:only-child {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Form groups con MENOS espaciado */
.form-group {
  margin-bottom: 0.6rem !important;
}

.form-group label {
  margin-bottom: 0.3rem !important;
}

/* Row con form groups más compactas */
.row.form-group,
.form-row {
  margin-bottom: 0.6rem !important;
}

/* Inputs en input-groups */
.input-group > .form-control,
.input-group > .custom-select,
.input-group > .custom-file {
  height: 34px !important;
  min-height: 34px !important;
}

/* Custom file input */
.custom-file-input,
.custom-file-label {
  height: 28px !important;
  padding: 0.2rem 0.4rem !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
}

/* Texto en elementos con fondo oscuro */
.bg-gradient-primary,
.bg-gradient-success,
.bg-gradient-info,
.small-box {
  color: #fff !important;
}

.bg-gradient-primary h1,
.bg-gradient-primary h2,
.bg-gradient-primary h3,
.bg-gradient-primary h4,
.bg-gradient-primary h5,
.bg-gradient-primary h6,
.bg-gradient-success h1,
.bg-gradient-success h2,
.bg-gradient-success h3,
.bg-gradient-success h4,
.bg-gradient-success h5,
.bg-gradient-success h6 {
  color: #fff !important;
}

/* Asegurar contraste en small-box */
.small-box h4,
.small-box h6,
.small-box p,
.small-box .inner {
  color: #fff !important;
}

/* Icons en small-box */
.small-box .icon {
  color: rgba(255, 255, 255, 0.3) !important;
}

/* Scrollbar personalizado */
::-webkit-scrollbar-thumb {
  background-color: var(--color-gray) !important;
}

::-webkit-scrollbar-thumb:hover {
  background-color: var(--color-gray-dark) !important;
}

/* Ajustes adicionales para mejor contraste */
.text-white {
  color: #fff !important;
}

/* Fondos de secciones con contraste */
section.content {
  background-color: transparent !important;
}

/* Ajuste para tablas y grids con fondo claro en modo claro */
.ag-theme-alpine-dark,
.dataTables_wrapper {
  background-color: #fff !important;
}

.dark-mode .ag-theme-alpine-dark,
.dark-mode .dataTables_wrapper {
  background-color: #2d3238 !important;
}