body{
    background: #f7f7f7;
}

.sidebar-nav .sidebar-link {
    height: auto !important;
    align-items: flex-start !important;
}

.sidebar-nav .sidebar-link .hide-menu {
    white-space: normal !important;     /* permite salto de línea */
    word-break: break-word;             /* rompe palabras largas */
    line-height: 1.2;
}

.sidebar-nav .sidebar-item {
    margin-bottom: 5px;
}


.sidebar-nav .sidebar-link span:first-child {
    margin-top: 3px;
}

/* ============================================================
   Sidebar Override - Modernize Bootstrap 5
   Estilo más compacto, elegante y sin fondo sólido en activo
   ============================================================ */

:root {
  --sidebar-active-color: var(--bs-primary);
  --sidebar-hover-bg: rgba(93, 135, 255, 0.08);
  --sidebar-active-bg: rgba(93, 135, 255, 0.10);
  --sidebar-text-color: var(--bs-body-color);
  --sidebar-muted-color: var(--bs-secondary-color);
}

/* Sidebar un poco más compacto */
.left-sidebar {

  border-right: 1px solid rgba(0, 0, 0, 0.06);
}

/* Ajuste del área scroll */
.left-sidebar .scroll-sidebar {
  padding: 0 14px;
  height: calc(100vh - 150px);
}

/* Logo más compacto */
.brand-logo {
  min-height: 64px;
  padding: 0 18px;
}

/* Separadores / títulos */
.nav-small-cap {
  margin-top: 16px;
  padding: 6px 10px 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 18px;
  color: var(--sidebar-muted-color);
  opacity: .75;
}

/* Link base */
.sidebar-nav ul .sidebar-item .sidebar-link {
  margin: 1px 0;
  padding: 8px 10px;
  min-height: 38px;
  border-radius: 10px;
  gap: 11px;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 20px;
  color: var(--sidebar-text-color);
  background: transparent;
  transition: color .18s ease, background-color .18s ease, transform .18s ease;
}

/* Íconos */
.sidebar-nav ul .sidebar-item .sidebar-link .ti {
  font-size: 19px;
  color: var(--sidebar-muted-color);
  transition: color .18s ease, transform .18s ease;
}

/* Hover elegante */
.sidebar-nav ul .sidebar-item .sidebar-link:hover {
  background: var(--sidebar-hover-bg);
  color: var(--sidebar-active-color);
  transform: translateX(2px);
}

.sidebar-nav ul .sidebar-item .sidebar-link:hover .ti {
  color: var(--sidebar-active-color);
}

/* Activo: sin fondo azul sólido */
.sidebar-nav ul .sidebar-item.selected > .sidebar-link.active,
.sidebar-nav ul .sidebar-item.selected > .sidebar-link,
.sidebar-nav ul .sidebar-item > .sidebar-link.active {
  background: transparent !important;
  color: var(--sidebar-active-color) !important;
  font-weight: 700;
  box-shadow: none !important;
}

/* Ícono activo */
.sidebar-nav ul .sidebar-item.selected > .sidebar-link.active .ti,
.sidebar-nav ul .sidebar-item.selected > .sidebar-link .ti,
.sidebar-nav ul .sidebar-item > .sidebar-link.active .ti {
  color: var(--sidebar-active-color) !important;
}

/* Línea lateral indicadora del activo */
.sidebar-nav ul .sidebar-item > .sidebar-link.active::before,
.sidebar-nav ul .sidebar-item.selected > .sidebar-link::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(
    180deg,
    var(--bs-primary),
    var(--bs-info)
  );
}

/* Activo con fondo muy suave opcional */
.sidebar-nav ul .sidebar-item > .sidebar-link.active {
  background: var(--sidebar-active-bg) !important;
}

/* Flecha de submenú */
.sidebar-nav .has-arrow::after {
  right: 12px;
  width: 6px;
  height: 6px;
  border-color: var(--sidebar-muted-color);
}

/* Flecha cuando está activo o abierto */
.sidebar-nav ul .sidebar-item.selected .sidebar-link.has-arrow::after,
.sidebar-nav li.active > .has-arrow::after,
.sidebar-nav li > .has-arrow.active::after,
.sidebar-nav .has-arrow[aria-expanded="true"]::after {
  border-color: var(--sidebar-active-color) !important;
}

/* Submenús más compactos */
.sidebar-nav ul .sidebar-item .first-level .sidebar-item > .sidebar-link {
  padding: 7px 10px 7px 34px;
  min-height: 34px;
  font-size: 13px;
  gap: 8px;
  border-radius: 8px;
  color: var(--sidebar-muted-color);
}

/* Submenú activo */
.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link.active {
  background: transparent !important;
  color: var(--sidebar-active-color) !important;
  font-weight: 700;
}

/* Submenú hover */
.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link:hover {
  background: transparent !important;
  color: var(--sidebar-active-color) !important;
  transform: translateX(2px);
}

/* Reduce espacio inferior de grupos */
.sidebar-nav ul .sidebar-item .first-level .sidebar-item:last-child {
  margin-bottom: 8px;
}

/* Segundo y tercer nivel */
.sidebar-nav ul .sidebar-item .two-level .sidebar-item .sidebar-link {
  padding: 7px 10px 7px 42px;
}

.sidebar-nav ul .sidebar-item .three-level .sidebar-item .sidebar-link {
  padding: 7px 10px 7px 54px;
}

/* Modo mini sidebar desktop */
@media (min-width: 1300px) {
  [data-layout="vertical"][data-sidebartype="mini-sidebar"] .left-sidebar {
    width: 78px;
  }

  [data-layout="vertical"][data-sidebartype="mini-sidebar"] .left-sidebar:hover {
    width: 250px;
  }

  [data-layout="vertical"][data-sidebartype="mini-sidebar"] .left-sidebar .scroll-sidebar {
    padding: 0 10px;
  }
}

/* Mobile */
@media (max-width: 1299.98px) {
  .left-sidebar {
    width: 250px;
    left: -250px;
  }

  #main-wrapper.show-sidebar .left-sidebar {
    left: 0;
  }
}

/* ============================================================
   Theme Override Corporativo - Modernize Bootstrap 5
   Paleta seria, institucional y empresarial
   ============================================================ */

:root,
[data-bs-theme="light"] {
  /* Colores base */
  --bs-primary: #1f4e79;
  --bs-primary-rgb: 31, 78, 121;

  --bs-secondary: #60738a;
  --bs-secondary-rgb: 96, 115, 138;

  --bs-info: #2f80a7;
  --bs-info-rgb: 47, 128, 167;

  --bs-success: #2e7d5b;
  --bs-success-rgb: 46, 125, 91;

  --bs-warning: #b7791f;
  --bs-warning-rgb: 183, 121, 31;

  --bs-danger: #b42318;
  --bs-danger-rgb: 180, 35, 24;

  --bs-dark: #1f2937;
  --bs-dark-rgb: 31, 41, 55;

  --bs-muted: #667085;
  --bs-muted-rgb: 102, 112, 133;

  --bs-light: #f8fafc;
  --bs-light-rgb: 248, 250, 252;

  /* Fondos y texto */
  --bs-body-bg: #f5f7fa;
  --bs-body-bg-rgb: 245, 247, 250;

  --bs-body-color: #475467;
  --bs-body-color-rgb: 71, 84, 103;

  --bs-heading-color: #1f2937;

  --bs-secondary-color: rgba(71, 84, 103, .76);
  --bs-tertiary-color: rgba(71, 84, 103, .56);

  --bs-secondary-bg: #eef2f6;
  --bs-secondary-bg-rgb: 238, 242, 246;

  --bs-tertiary-bg: #f8fafc;
  --bs-tertiary-bg-rgb: 248, 250, 252;

  --bs-border-color: #d9e2ec;
  --bs-border-color-translucent: rgba(31, 41, 55, .10);

  /* Variantes suaves */
  --bs-primary-bg-subtle: #e8f0f7;
  --bs-secondary-bg-subtle: #edf1f5;
  --bs-success-bg-subtle: #e8f3ee;
  --bs-info-bg-subtle: #e7f1f6;
  --bs-warning-bg-subtle: #f7efe1;
  --bs-danger-bg-subtle: #f9e8e6;

  --bs-primary-border-subtle: #b8cadb;
  --bs-secondary-border-subtle: #cbd5df;
  --bs-success-border-subtle: #b9d8c9;
  --bs-info-border-subtle: #b9d7e5;
  --bs-warning-border-subtle: #e2c88e;
  --bs-danger-border-subtle: #e4aaa5;

  --bs-primary-text-emphasis: #163957;
  --bs-secondary-text-emphasis: #415064;
  --bs-success-text-emphasis: #225f45;
  --bs-info-text-emphasis: #23617f;
  --bs-warning-text-emphasis: #7a5014;
  --bs-danger-text-emphasis: #7f1d1d;

  /* Variables propias para componentes */
  --corporate-card-bg: #ffffff;
  --corporate-card-border: #e3e8ef;
  --corporate-sidebar-bg: #ffffff;
  --corporate-topbar-bg: rgba(255, 255, 255, .92);
  --corporate-shadow: 0 8px 24px rgba(31, 41, 55, .06);
}

/* ============================================================
   Botones Bootstrap
   ============================================================ */

.btn-primary {
  --bs-btn-bg: #1f4e79;
  --bs-btn-border-color: #1f4e79;
  --bs-btn-hover-bg: #183f63;
  --bs-btn-hover-border-color: #183f63;
  --bs-btn-active-bg: #143653;
  --bs-btn-active-border-color: #143653;
  --bs-btn-disabled-bg: #1f4e79;
  --bs-btn-disabled-border-color: #1f4e79;
}

.btn-secondary {
  --bs-btn-bg: #60738a;
  --bs-btn-border-color: #60738a;
  --bs-btn-hover-bg: #516277;
  --bs-btn-hover-border-color: #516277;
  --bs-btn-active-bg: #465568;
  --bs-btn-active-border-color: #465568;
}

.btn-success {
  --bs-btn-bg: #2e7d5b;
  --bs-btn-border-color: #2e7d5b;
  --bs-btn-hover-bg: #25694c;
  --bs-btn-hover-border-color: #25694c;
}

.btn-info {
  --bs-btn-bg: #2f80a7;
  --bs-btn-border-color: #2f80a7;
  --bs-btn-hover-bg: #286e8f;
  --bs-btn-hover-border-color: #286e8f;
  color: #fff;
}

.btn-warning {
  --bs-btn-bg: #b7791f;
  --bs-btn-border-color: #b7791f;
  --bs-btn-hover-bg: #966317;
  --bs-btn-hover-border-color: #966317;
  color: #fff;
}

.btn-danger {
  --bs-btn-bg: #b42318;
  --bs-btn-border-color: #b42318;
  --bs-btn-hover-bg: #941b13;
  --bs-btn-hover-border-color: #941b13;
}

/* Botones outline */
.btn-outline-primary {
  --bs-btn-color: #1f4e79;
  --bs-btn-border-color: #1f4e79;
  --bs-btn-hover-bg: #1f4e79;
  --bs-btn-hover-border-color: #1f4e79;
}

.btn-outline-secondary {
  --bs-btn-color: #60738a;
  --bs-btn-border-color: #60738a;
  --bs-btn-hover-bg: #60738a;
  --bs-btn-hover-border-color: #60738a;
}

/* ============================================================
   Links y textos
   ============================================================ */

a {
  color: #1f4e79;
}

a:hover {
  color: #163957;
}

.text-primary {
  color: #1f4e79 !important;
}

.text-secondary {
  color: #60738a !important;
}

.text-success {
  color: #2e7d5b !important;
}

.text-info {
  color: #2f80a7 !important;
}

.text-warning {
  color: #b7791f !important;
}

.text-danger {
  color: #b42318 !important;
}

.bg-primary {
  background-color: #1f4e79 !important;
}

.bg-secondary {
  background-color: #60738a !important;
}

.bg-success {
  background-color: #2e7d5b !important;
}

.bg-info {
  background-color: #2f80a7 !important;
}

.bg-warning {
  background-color: #b7791f !important;
}

.bg-danger {
  background-color: #b42318 !important;
}

/* Fondos suaves */
.bg-light-primary,
.bg-primary-subtle {
  background-color: #e8f0f7 !important;
  color: #163957 !important;
}

.bg-light-secondary,
.bg-secondary-subtle {
  background-color: #edf1f5 !important;
  color: #415064 !important;
}

.bg-light-success,
.bg-success-subtle {
  background-color: #e8f3ee !important;
  color: #225f45 !important;
}

.bg-light-info,
.bg-info-subtle {
  background-color: #e7f1f6 !important;
  color: #23617f !important;
}

.bg-light-warning,
.bg-warning-subtle {
  background-color: #f7efe1 !important;
  color: #7a5014 !important;
}

.bg-light-danger,
.bg-danger-subtle {
  background-color: #f9e8e6 !important;
  color: #7f1d1d !important;
}

/* ============================================================
   Cards, tablas y contenedores
   ============================================================ */

.card {
  background-color: var(--corporate-card-bg);
  border: 1px solid var(--corporate-card-border);
  box-shadow: var(--corporate-shadow);
}

.card-title,
h1, h2, h3, h4, h5, h6 {
  color: #1f2937;
}

.table {
  --bs-table-color: #475467;
  --bs-table-border-color: #e3e8ef;
}

.table thead th {
  color: #1f2937;
  background-color: #f8fafc;
  border-bottom-color: #d9e2ec;
  font-weight: 700;
}

.table-hover > tbody > tr:hover > * {
  background-color: #f8fafc;
}

/* ============================================================
   Formularios
   ============================================================ */

.form-control,
.form-select {
  color: #344054;
  border-color: #d9e2ec;
  background-color: #fff;
}

.form-control:focus,
.form-select:focus {
  border-color: #1f4e79;
  box-shadow: 0 0 0 .2rem rgba(31, 78, 121, .14);
}

.input-group-text {
  color: #60738a;
  background-color: #f8fafc;
  border-color: #d9e2ec;
}

/* ============================================================
   Header / topbar
   ============================================================ */

.app-header {
  background-color: var(--corporate-topbar-bg);
  border-bottom: 1px solid rgba(31, 41, 55, .08);
  backdrop-filter: blur(10px);
}

.navbar .nav-link,
.app-header .nav-link {
  color: #475467;
}

.navbar .nav-link:hover,
.app-header .nav-link:hover {
  color: #1f4e79;
}

/* ============================================================
   Sidebar integrado con el override anterior
   ============================================================ */

.left-sidebar {
  background-color: var(--corporate-sidebar-bg);
  border-right: 1px solid rgba(31, 41, 55, .08);
}

.sidebar-nav ul .sidebar-item .sidebar-link {
  color: #475467;
}

.sidebar-nav ul .sidebar-item .sidebar-link .ti {
  color: #667085;
}

.sidebar-nav ul .sidebar-item .sidebar-link:hover {
  background-color: rgba(31, 78, 121, .08);
  color: #1f4e79;
}

.sidebar-nav ul .sidebar-item .sidebar-link:hover .ti {
  color: #1f4e79;
}

.sidebar-nav ul .sidebar-item.selected > .sidebar-link.active,
.sidebar-nav ul .sidebar-item.selected > .sidebar-link,
.sidebar-nav ul .sidebar-item > .sidebar-link.active {
  color: #1f4e79 !important;
  background-color: rgba(31, 78, 121, .08) !important;
}

.sidebar-nav ul .sidebar-item.selected > .sidebar-link.active .ti,
.sidebar-nav ul .sidebar-item.selected > .sidebar-link .ti,
.sidebar-nav ul .sidebar-item > .sidebar-link.active .ti {
  color: #1f4e79 !important;
}

.sidebar-nav ul .sidebar-item > .sidebar-link.active::before,
.sidebar-nav ul .sidebar-item.selected > .sidebar-link::before {
  background: linear-gradient(180deg, #1f4e79, #2f80a7);
}

/* ============================================================
   Badges
   ============================================================ */

.badge.bg-primary {
  background-color: #1f4e79 !important;
}

.badge.bg-secondary {
  background-color: #60738a !important;
}

.badge.bg-success {
  background-color: #2e7d5b !important;
}

.badge.bg-info {
  background-color: #2f80a7 !important;
}

.badge.bg-warning {
  background-color: #b7791f !important;
}

.badge.bg-danger {
  background-color: #b42318 !important;
}

/* ============================================================
   Paginación y DataTables
   ============================================================ */

.page-link {
  color: #1f4e79;
  border-color: #d9e2ec;
}

.page-link:hover {
  color: #163957;
  background-color: #e8f0f7;
  border-color: #b8cadb;
}

.page-item.active .page-link {
  background-color: #1f4e79;
  border-color: #1f4e79;
}

/* ============================================================
   Dropdowns
   ============================================================ */

.dropdown-menu {
  border-color: #e3e8ef;
  box-shadow: 0 12px 32px rgba(31, 41, 55, .10);
}

.dropdown-item {
  color: #475467;
}

.dropdown-item:hover,
.dropdown-item:focus {
  color: #1f4e79;
  background-color: #e8f0f7;
}

.dropdown-item.active,
.dropdown-item:active {
  color: #fff;
  background-color: #1f4e79;
}

/* ============================================================
   Alerts sobrias
   ============================================================ */

.alert-primary {
  color: #163957;
  background-color: #e8f0f7;
  border-color: #b8cadb;
}

.alert-success {
  color: #225f45;
  background-color: #e8f3ee;
  border-color: #b9d8c9;
}

.alert-info {
  color: #23617f;
  background-color: #e7f1f6;
  border-color: #b9d7e5;
}

.alert-warning {
  color: #7a5014;
  background-color: #f7efe1;
  border-color: #e2c88e;
}

.alert-danger {
  color: #7f1d1d;
  background-color: #f9e8e6;
  border-color: #e4aaa5;
}