/* ===== menu.css (definitivo y unificado) ===== */

/* --- Reset: SOLO el documento scrollea --- */
html, body { height:100%; overflow-x:hidden; }

/* ---------- Layout base ---------- */
#layoutSidenav{
  display:flex;
  width:100%;
  min-height:100vh;
}

/* Sidebar: 225px; en móvil se va off-canvas */
#layoutSidenav #layoutSidenav_nav{
  width:225px;
  flex:0 0 225px;
  z-index:1038;
  transition:transform .15s ease-in-out;
  transform:translateX(-225px); /* oculto por defecto en móviles */
}

/* Contenido */
#layoutSidenav #layoutSidenav_content{
  position:relative;
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-width:0;
  min-height:calc(100vh - 56px);
  margin-left:-225px;              /* compensa nav oculto en móvil */
  overflow-y:visible !important;   /* evita segunda barra de scroll */
}

/* En móvil: al togglear mostramos el nav */
.sb-sidenav-toggled #layoutSidenav #layoutSidenav_nav{ transform:translateX(0); }

/* ---------- Escritorio: nav visible; toggle lo oculta ---------- */
@media (min-width:992px){
  #layoutSidenav #layoutSidenav_nav{ transform:none; }
  #layoutSidenav #layoutSidenav_content{ margin-left:0; transition:margin .15s ease-in-out; }
  .sb-sidenav-toggled #layoutSidenav #layoutSidenav_nav{ transform:translateX(-225px); }
  .sb-sidenav-toggled #layoutSidenav #layoutSidenav_content{ margin-left:-225px; } /* contenido ocupa todo */
}

/* ---------- Topbar fijo y compensaciones ---------- */
.sb-topnav{ height:56px; padding-left:0; z-index:1039; }
.sb-nav-fixed .sb-topnav{ position:fixed; top:0; left:0; right:0; }
.sb-nav-fixed #layoutSidenav #layoutSidenav_nav{ height:100vh; }
.sb-nav-fixed #layoutSidenav #layoutSidenav_nav .sb-sidenav{ padding-top:56px; }
.sb-nav-fixed #layoutSidenav #layoutSidenav_content{ padding-top:56px; } /* mejor que top:56 */

/* (Opcional) Sidebar realmente FIXED ocupando espacio */
.sb-sidenav-fixed #layoutSidenav #layoutSidenav_nav{ position:fixed; left:0; top:0; height:100vh; }
.sb-sidenav-fixed #layoutSidenav #layoutSidenav_content{ padding-left:225px; }

/* ---------- Estilos de topbar ---------- */
.sb-topnav .navbar-brand{ width:auto!important; padding:0 .75rem; margin:0; }
.sb-topnav .navbar-nav .dropdown-menu{ top:56px; }
.sb-topnav.navbar-dark #sidebarToggle{ color:rgba(255,255,255,.5); }
.sb-topnav.navbar-light #sidebarToggle{ color:#212529; }

/* ---------- Sidenav estructura ---------- */
.sb-sidenav{ display:flex; flex-direction:column; height:100%; }
.sb-sidenav .sb-sidenav-menu{ flex:1 1 auto; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.sb-sidenav .sb-sidenav-menu .nav{ flex-direction:column; }

.sb-sidenav .sb-sidenav-menu .nav .sb-sidenav-menu-heading{
  padding:1rem 1rem .35rem;
  font-size:.72rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.02em;
}

.sb-sidenav .sb-sidenav-menu .nav .nav-link{
  display:flex; align-items:center; position:relative;
  padding:.60rem 1rem; font-size:.92rem;
}
.nav .nav-link .sb-nav-link-icon, .sb-sidenav-menu .nav-link .sb-nav-link-icon{ margin-right:.5rem; }
.sb-sidenav .sb-sidenav-menu .nav .nav-link .sb-nav-link-icon{ font-size:.9rem; }
.sb-sidenav .sb-sidenav-menu .nav .nav-link .sb-sidenav-collapse-arrow{ margin-left:auto; transition:transform .15s ease; }
.sb-sidenav .sb-sidenav-menu .nav .nav-link.collapsed .sb-sidenav-collapse-arrow{ transform:rotate(-90deg); }
.sb-sidenav .sb-sidenav-menu .nav .sb-sidenav-menu-nested{ margin-left:1.5rem; flex-direction:column; }
.sb-sidenav .sb-sidenav-footer{ padding:.75rem; flex-shrink:0; }

/* ---------- Temas ---------- */
.sb-sidenav-dark{ background:#212529; color:rgba(255,255,255,.55); }
.sb-sidenav-dark .sb-sidenav-menu .sb-sidenav-menu-heading{ color:rgba(255,255,255,.25); }
.sb-sidenav-dark .sb-sidenav-menu .nav-link{ color:rgba(255,255,255,.55); }
.sb-sidenav-dark .sb-sidenav-menu .nav-link .sb-nav-link-icon,
.sb-sidenav-dark .sb-sidenav-menu .nav-link .sb-sidenav-collapse-arrow{ color:rgba(255,255,255,.35); }
.sb-sidenav-dark .sb-sidenav-menu .nav-link:hover,
.sb-sidenav-dark .sb-sidenav-menu .nav-link.active{ color:#fff; }
.sb-sidenav-dark .sb-sidenav-menu .nav-link.active .sb-nav-link-icon{ color:#fff; }
.sb-sidenav-dark .sb-sidenav-footer{ background:#343a40; }

.sb-sidenav-light{ background:#f8f9fa; color:#212529; }
.sb-sidenav-light .sb-sidenav-menu .sb-sidenav-menu-heading{ color:#adb5bd; }
.sb-sidenav-light .sb-sidenav-menu .nav-link{ color:#212529; }
.sb-sidenav-light .sb-sidenav-menu .nav-link .sb-nav-link-icon,
.sb-sidenav-light .sb-sidenav-menu .nav-link .sb-sidenav-collapse-arrow{ color:#adb5bd; }
.sb-sidenav-light .sb-sidenav-menu .nav-link:hover,
.sb-sidenav-light .sb-sidenav-menu .nav-link.active{ color:#007bff; }
.sb-sidenav-light .sb-sidenav-menu .nav-link.active .sb-nav-link-icon{ color:#007bff; }
.sb-sidenav-light .sb-sidenav-footer{ background:#e9ecef; }

/* ---------- Overlay (lo maneja js/scripts.js) ---------- */
.sb-sidenav-overlay{
  position:fixed;
  left:0; right:0; bottom:0; top:56px;      /* js ajusta top según altura real del topbar */
  background:rgba(0,0,0,.5);
  z-index:1037;
  display:none;
  pointer-events:auto;
}
.sb-sidenav-overlay.show{ display:block; }

/* ---------- Respiración del contenido ---------- */
#layoutSidenav_content > main .container,
#layoutSidenav_content > main .container-fluid{ padding-left:12px; padding-right:12px; }
#layoutSidenav_content > main.container-fluid{ padding-top:1rem; }
@media (max-width:576px){
  #layoutSidenav_content > main{ padding-left:8px; padding-right:8px; }
}

/* ---------- Ajustes varios ---------- */
.input-group .input-group-text.ip-libre{ background:#f8f9fa; font-weight:600; cursor:pointer; }

/* Buscador topbar: evita parpadeo al cargar */
#sbsearch-modal:not(.show){ display:none !important; }