/* ==========================================
   CENTINELA - SIDEBAR UNIFICADO
   ========================================== */

:root{
  --cent-sidebar-bg:#062b49;      /* azul unificado */
  --cent-sidebar-width:344px;     /* mismo ancho */
  --cent-sidebar-border:rgba(255,255,255,.10);
  --cent-sidebar-text:#ffffff;
  --cent-sidebar-muted:#b8d0e8;
}

/* -------- Sidebar general -------- */
#centSidebar,
.sidebar,
.left-sidebar,
.side-panel,
.main-sidebar,
aside.sidebar{
  background:var(--cent-sidebar-bg) !important;
  width:var(--cent-sidebar-width) !important;
  min-width:var(--cent-sidebar-width) !important;
  max-width:var(--cent-sidebar-width) !important;
  color:var(--cent-sidebar-text) !important;
  box-sizing:border-box !important;
}

/* cuando esté fijo */
#centSidebar{
  background:var(--cent-sidebar-bg) !important;
}

/* -------- Encabezado/logo -------- */
#centSidebar .cent-brand-force,
#centSidebar .brand,
#centSidebar .sidebar-brand,
.sidebar .brand,
.sidebar .sidebar-brand{
  background:transparent !important;
  min-height:98px !important;
  padding:22px 22px 18px 22px !important;
  border-bottom:1px solid var(--cent-sidebar-border) !important;
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  box-sizing:border-box !important;
}

#centSidebar .cent-brand-force-title,
#centSidebar .brand-title,
#centSidebar .sidebar-brand-title,
.sidebar .brand-title{
  color:#ffffff !important;
}

#centSidebar .cent-brand-force-subtitle,
#centSidebar .brand-subtitle,
#centSidebar .sidebar-brand-subtitle,
.sidebar .brand-subtitle{
  color:#d7e8f7 !important;
}

/* -------- Navegación -------- */
#centSidebar a,
#centSidebar .nav-link,
.sidebar a,
.sidebar .nav-link{
  color:#ffffff !important;
}

#centSidebar .nav-link.active,
#centSidebar a.active,
.sidebar .nav-link.active,
.sidebar a.active{
  background:#1f7de2 !important;
  color:#ffffff !important;
  border-radius:12px !important;
}

/* -------- Líneas internas -------- */
#centSidebar hr,
#centSidebar .divider,
.sidebar hr,
.sidebar .divider{
  border:none !important;
  border-top:1px solid var(--cent-sidebar-border) !important;
}

/* -------- Bloques de títulos -------- */
#centSidebar .section-title,
#centSidebar .panel-title,
.sidebar .section-title,
.sidebar .panel-title{
  color:#ffffff !important;
}

/* -------- Buscador -------- */
#centSidebar input[type="text"],
#centSidebar input[type="search"],
.sidebar input[type="text"],
.sidebar input[type="search"]{
  background:#0d416d !important;
  color:#ffffff !important;
  border:1px solid rgba(164,205,241,.45) !important;
  border-radius:12px !important;
}

#centSidebar input::placeholder,
.sidebar input::placeholder{
  color:#d0e4f5 !important;
}

/* -------- Tarjetas de usuarios -------- */
#centSidebar .cent-user-card,
#centSidebar .user-card,
.sidebar .cent-user-card,
.sidebar .user-card{
  border-radius:16px !important;
  overflow:hidden !important;
}

/* -------- Footer del panel -------- */
#centSidebar .cent-sidebar-bottom,
#centSidebar .sidebar-footer,
.sidebar .sidebar-footer{
  background:var(--cent-sidebar-bg) !important;
  border-top:1px solid var(--cent-sidebar-border) !important;
  color:#d7e8f7 !important;
}

/* -------- Ajuste escritorio -------- */
@media (min-width:1101px){
  #centSidebar,
  .sidebar,
  .left-sidebar,
  .side-panel,
  .main-sidebar,
  aside.sidebar{
    width:var(--cent-sidebar-width) !important;
    min-width:var(--cent-sidebar-width) !important;
    max-width:var(--cent-sidebar-width) !important;
  }
}

/* -------- Tablet -------- */
@media (min-width:769px) and (max-width:1100px){
  #centSidebar,
  .sidebar,
  .left-sidebar,
  .side-panel,
  .main-sidebar,
  aside.sidebar{
    width:320px !important;
    min-width:320px !important;
    max-width:320px !important;
  }
}

/* -------- Móvil -------- */
@media (max-width:768px){
  #centSidebar,
  .sidebar,
  .left-sidebar,
  .side-panel,
  .main-sidebar,
  aside.sidebar{
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
  }
}